open-index/open-npm huggingface dataset:
npm package: @nyris/nyris-api
Description: ## Install
Latest version: 0.3.90

# nyris-api

## Install

```shell script
npm install @nyris/nyris-api
```

## Example usage

```javascript
import NyrisAPI, { urlOrBlobToCanvas } from "@nyris/nyris-api";

const settings = {
    xOptions: 'default', // optional, see "General request options" https://docs.nyris.io/#general-request-options for available options
    apiKey: '<YOUR_API_KEY>',
    jpegQuality: 0.9, // 
    maxWidth: 500, // Maximal image size sent to server
    maxHeight: 500,
    responseFormat: 'application/offers.complete+json' // optional, see "Response type" https://docs.nyris.io/#response-type

};
const api = new NyrisAPI(settings);

const image = await urlOrBlobToCanvas("http://...");
const results = await api.findByImage(image, {});
console.log(results);
```

## api methods


### Search for an image
```typescript
find(options: ImageSearchOptions, canvas: HTMLCanvasElement | HTMLImageElement | HTMLVideoElement, filters?: Filter[], xOptions?: any) : Promise<SearchResult>
```

The image has to be an image-like HTML object.
Example options:
```javascript
const options = {
    geoLocation: { lat: 52.5, lon: 13.4, dist: 50 },
    cropRect: {x1: 0.3, x2: 0.7, y1: 0.3, y2: 0.7}
}
```

### Search for an SKU (itemID)

```javascript
findBySku(sku: string, mid: string): Promise<SearchResult>
```

### Search for significant sections in the image.
```javascript
findRegions(canvas: HTMLCanvasElement | HTMLVideoElement | HTMLImageElement): Promise<Region[]>
```

### Send feedback event.

```javascript
sendFeedback(sessionId: string, requestId: string, payload: FeedbackEventPayload)
```

See [Click and conversion analytics](https://docs.nyris.io/#click-and-conversion-analytics).

Example feedback events:
```javascript

// Signal a successful or failed search
const success = {
    request_id: "<REQUEST_ID>",
    timestamp: new Date(),
    session_id: "<SESSION_ID>",
    event: 'feedback',
    data: { success: true }
};

// Signal a selected region
const region = {
    request_id: "<REQUEST_ID>",
    timestamp: new Date(),
    session_id: "<SESSION_ID>",
    event: 'region',
    data: { rect: { x: 0.1, y: 0.1, w: 0.2, h: 0.2 } }
};

// Signal a clicked result
const click = {
    request_id: "<REQUEST_ID>",
    timestamp: new Date(),
    session_id: "<SESSION_ID>",
    event: 'click',
    data: { positions: [4]} // position of the result in the results list
};
```
npm package: @nyris/nyris-react-components
Description: This package contains reusable react components.
Latest version: 0.3.90

# nyris-react-components

This package contains reusable react components.

## Install

```shell script
npm install @nyris/nyris-react-components
```

## Components

* [Capture](./src/components/Capture/README.md) - Capture a frame from the camera of the device.
* [Preview](./src/components/Preview/README.md) - Show image with crop selection overlay and dots for preselected regions.

## Build

```
npm run build
```

## View and develop components

Run `npm start`.
This will start a server on [port 6060](http://localhost:6060) to preview the components using [react-styleguidist](https://react-styleguidist.js.org/).
npm package: @nyris/nyris-webapp
Latest version: 0.3.90

### To run the project locally add ```setting.js``` file in packages\nyris-webapp\public\js


## Available Scripts

In the project directory, you can run:

### `yarn start`

Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.

### `yarn run build`

Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
npm package: @nyris/nyris-widget
Description: Embed the widget to use nyris search on your website.
Latest version: 0.3.90

# nyris-widget

Embed the widget to use nyris search on your website.

## Usage

Inside your HTML (best just before the closing ```</body>``` tag), add the following code to embed the Nyris widget script and configure widget settings:

```html
<script>
    window.nyrisSettings = {
        apiKey: '', // nyris API key
        initiatorElementId: ['id-1','id-2'], // IDs of HTML elements that trigger the widget; array with a single ID or multiple IDs
        primaryColor: '#3E36DC', // Color for the logo and buttons (other than camera  and browse gallery buttons)
        cameraIconColour: '#2B2C46', // Color for camera button
        browseGalleryButtonColor: '#E4E3FF', // Color of 'Browse Gallery' button in mobile view
        customerLogo: '', // URL to display customer logo
        logoWidth: 256, // Width for customer logo in pixels, works only with customerLogo
        ctaButtonText: 'View more', // Button text on result card linking to product details web page
        language: 'en', // Widget display language
        navigatePreference: '_blank' // Routing behaviour of the CTA button, open in current/new tab
        cadenasAPIKey: '', // API key provided by cadenas
        cadenasCatalog: '', // Catalog ID provided by Cadenas
        feedback: false , // Enables feedback; Always a boolean value   
        searchCriteriaLabel: 'Select a machine', // Define the text for search criteria pop-up
        searchCriteriaKey: '', // Define the attribute where filter values are stored
        filter: [] // Define attributes and labels for search Refinements e.g. [{label: 'Brand', field: 'brand' }]
        emailTemplateId: '', // emailjs template id for sending inquiry support email
        productLinkBaseURL: '', // Base URL for constructing product links. Must include {SKU} placeholder(s) which will be replaced with the actual SKU.
        // Examples: 'https://example.com/products/{SKU}' or 'https://example.com/search?sku={SKU}&id={SKU}'
        // Multiple {SKU} occurrences are supported and will all be replaced with the same SKU value.
    };
    var s = document.createElement("script");
    s.src = "https://assets.nyris.io/nyris-widget/v1/widget.js";
    document.getElementsByTagName('head')[0].appendChild(s);
</script>

```

## Building a custom version

Follow the steps on [main README](../../README.md) initialize all packages.
Then in this directory, run `npm start` for a local development server or  `npm run build` to build a minified `widget.js`.
npm package: @nys-cui/cui-chart
Description: A middleware middleware component making it easier to create robust charts using D3.js
Author: New York State Department of Tax and Finance
Latest version: 0.0.17

# CUI-CHART

cui-chart is a base level web component that is extended to create specific type of charts.

- cui-chart-pie
    - Creates Pie and Doughnut charts
- cui-chart-bar
    - Creates Vertical and Horizontal bar charts
- cui-chart-line
    - Create line charts
npm package: @nys-cui/cui-field-checkbox
Description: An extension of the base cui-field component to support standard checkbox fields.
Author: New York State Department of Tax and Finance
Latest version: 0.2.21

Prototype project being pushed to node and npm for testing

# Changelog

## 0.2.19
 - Fixed setState so that it can set the checked state to false if the value is false

## 0.2.16
 - Fixed initial state not being set on connectedCallback & before value set checked state
 - Checked attribute and value attribute now given equal weight for checkbox state instead of value taking precedence

## 0.2.15
 - Adding 'controls' slot to the label container for cui-help in RPSO