@odx/product-fruits

Install 🚀

npm install @odx/product-fruits

Usage

Setup product fruits by adding the initializing it's enviroment providers with provideProductFruits inside the applications providers array:

import { provideProductFruits } from '@odx/product-fruits';

bootstrapApplication(AppComponent, {
  providers: [
    // ...
    provideProductFruits(/* ...options */),
  ],
});

Newsfeed

In order to setup the newsfeed UI add the ProductFruitsNewsFeedDirective to your imports and use it in the HeaderComponent:

<odx-header>
  <odx-action-group>
    <button odxButton odxProductFruitsNewsfeed></button>
  </odx-action-group>
</odx-header>

The newsfeed button will be disabled if product fruits failed to initialize.

LifeRing

In order to setup the lifering HelpCenter UI add the ProductFruitsLifeRingDirective to your imports and use it in the HeaderComponent:

<odx-header>
  <odx-action-group>
    <button odxButton odxProductFruitsLifeRing></button>
  </odx-action-group>
</odx-header>

The life-ring button will be disabled if product fruits failed to initialize.

Change language

In order to change the language during runtime use the updateLanguage method of ProductFruitsService.

Live demo ⭐

Please refer to our Storybook, to see the components in action and to get further information.