open-index/open-npm huggingface dataset:
npm package: @shoprocket/react-embed
Description: ## Installation
Latest version: 1.1.10

# Shoprocket react embed

## Installation

`npm i @shoprocket/react-embed`

## Usage

### Initialization

You'll need to grab your store_id and publishable_key from Shoprocket dashboard > Sales channels > Existing website > Embed > Advanced / React JS > Initializing Shoprocket

https://shoprocket.io/dashboard/sales-channels/existing-website/embed?type=multiple_products

Then wrap your entire app in the `ShoprocketProvider` (note if you're using Gatsby, you'll need to render the `ShoprocketProvider` in wrapRootElement in both `gatsby-ssr` and `gatsby-browser`: https://www.gatsbyjs.com/docs/reference/config-files/gatsby-browser/)

```
import {ShoprocketProvider} from '@shoprocket/react-embed';
<ShoprocketProvider
    value={{
      store_id: 1,
      publishable_key: "1",
    }}
>
    {/* rest of your app here */}
</ShoprocketProvider>
```

### Embedding products

You'll need to grab your the embed config from Shoprocket dashboard > Sales channels > Existing website > Embed > Advanced / React JS > Embed product

https://shoprocket.io/dashboard/sales-channels/existing-website/embed?type=multiple_products

and paste it as the config prop to the `ShoprocketEmbed` component:

```
import {ShoprocketEmbed} from '@shoprocket/react-embed';
<ShoprocketEmbed
    config={{
        options: {
            product_to_display: "29390",
            image_dimension_value: "crop",
            image_width: "1126",
            image_height: "1400",
            button_style: "standard",
        },
        includes: {
            show_product_name: "1",
            show_product_price: "1",
            show_product_image: "1",
            show_product_summary: "1",
            open_modal_on_image_click: "1",
            show_view_product_button: "1",
            show_add_to_cart_button: "1",
            show_min_max_order_quantity: "1",
            show_sale: "1",
            show_free_shipping: "1",
            show_new_product: "1",
            show_digital_download: "1",
            image_swap: "1",
        },
        product_popup: {
            show_product_name: "1",
            show_product_price: "1",
            show_product_summary: "1",
            show_product_description: "1",
            show_product_image: "1",
            show_select_quantity: "1",
            show_image_thumbnails: "1",
            show_product_reviews: "1",
            show_product_sku: "1",
            show_product_categories: "1",
            show_social_sharing_icons: "1",
            show_related_products: "1",
            thumbnail_layout: "horizontal_below",
            image_dimension_value: "crop",
            image_width: "1126",
            image_height: "1400",
            variation_styling: "dropdown",
            show_min_max_order_quantity: "1",
            show_sale: "1",
            show_free_shipping: "1",
            show_new_product: "1",
            show_digital_download: "1",
            show_product_tabs: "1",
            image_zoom: "1",
        },
    }}
/>
```
npm package: @shopstoa/common-common
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.
Latest version: 0.1.10017

# LibCommon

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.1.

## Code scaffolding

Run `ng generate component component-name --project lib-common` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project lib-common`.
> Note: Don't forget to add `--project lib-common` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build lib-common` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build lib-common`, go to the dist folder `cd dist/lib-common` and run `npm publish`.

## Running unit tests

Run `ng test lib-common` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
npm package: @shopstoa/common-consumer
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.0-rc.8.
Latest version: 0.1.10017

# LibConsumer

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.0-rc.8.

## Code scaffolding

Run `ng generate component component-name --project lib-consumer` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project lib-consumer`.
> Note: Don't forget to add `--project lib-consumer` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build lib-consumer` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build lib-consumer`, go to the dist folder `cd dist/lib-consumer` and run `npm publish`.

## Running unit tests

Run `ng test lib-consumer` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
npm package: @shopstoa/common-data
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.0-rc.5.
Author: Harry Y
Latest version: 0.1.10017

# LibData

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.0-rc.5.

## Code scaffolding

Run `ng generate component component-name --project lib-data` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project lib-data`.
> Note: Don't forget to add `--project lib-data` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build lib-data` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build lib-data`, go to the dist folder `cd dist/lib-data` and run `npm publish`.

## Running unit tests

Run `ng test lib-data` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).