npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

react-native-search-api

v1.2.0

Published

A React Native module that allows to perform the Spotlight integration on iOS

Downloads

13

Readme

React Native Search Api module

The SearchApi module gives you a general React Native interface to interact with the iOS Search API, Core Spotlight.

For more information about iOS Search APIs, see https://developer.apple.com/ios/search/.

Installation

Automatic part

  1. npm install react-native-search-api --save
  2. react-native link

Manual part

To the top of your AppDelegate.m add the following line:

#import "RCTSearchApiManager.h"

In your AppDelegate implementation add the following:

- (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray * _Nullable))restorationHandler {
    return [RCTSearchApiManager application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
}

Usage

Subscribe to the search item open events in your components like this:

componentDidMount() {
    <...>
    SearchApi.addOnSpotlightItemOpenEventListener(this.handleOnSpotlightItemOpenEventListener);
    SearchApi.addOnAppHistoryItemOpenEventListener(this.handleOnAppHistoryItemOpenEventListener);
}

To prevent memory leaks don't forget to unsubscribe:

componentWillUnmount() {
    <...>
    SearchApi.removeOnSpotlightItemOpenEventListener(this.handleOnSpotlightItemOpenEventListener);
    SearchApi.removeOnAppHistoryItemOpenEventListener(this.handleOnAppHistoryItemOpenEventListener)
}

Generally you should be interested whether the app was started using the search, therefore consider using the following two methods:

// For the spotlight item:
SearchApi.getInitialSpotlightItem().then(result => {
    if (result) {
        console.log('Started with a spotlight item!')
    }
})
// For the app history item:
SearchApi.getInitialAppHistoryItem().then(result => {
    if (result) {
        console.log('Started with an app history item!')
    }
})

In order to create a new spotlight item, use indexSpotlightItem or indexSpotlightItems:

SearchApi.indexSpotlightItem(item).then(result => {
    console.log('Success');
}).catch(err => {
    console.log('Error: ' + err);
});

To add new items to the app history, use createUserActivity:

SearchApi.indexAppHistoryItem(item).then(result => {
    console.log('Success');
    that.setState({labelText: 'Success'});
}).catch(err => {
    console.log('Error: ' + err);
    that.setState({labelText: ('Error: ' + err)});
});

The parameters, that items may specify are listed below:

Search item keys

Dictionaries, passed to create spotlight and app history items have some common and some specific keys, here is the list of all possible keys.

Common keys

title: string

Title of the item. Required for both item types.

contentDescription: string

Description of the item. Optional.

keywords: Array

An array of keywords, assigned to the search item. Optional.

thumbnail: string|int|object

Thumbnail to be presented in the search results. The same format as source in the Image component. Optional.

Examples:

var localItem = {
  <...>,
  thumbnail: require('/react-native/img/favicon.png')
};
var remoteItem = {
  <...>,
  thumbnail: {uri: 'https://facebook.github.io/react-native/docs/assets/favicon.png'}
};

Please refer to documentation for more details.

Spotlight-specific keys

uniqueIdentifier: string

The unique identifier of the spotlight item, passed later on during the item opening event. Required.

domain: string

The domain for the spotlight item. Optional.

App history-specific keys

userInfo: Object

A dictionary, passed later on during the item opening event. Required.

eligibleForPublicIndexing: boolean

A flag, that when set to true allows to add the item to the public index. Optional.

expirationDate: Date

Expiration date of the user activity item. Optional.

webpageURL: string

URL of the page, representing the same content on the app's website.

Credits

© 2017 PresenceKit by Ombori AB