@teko-builder/on-site-react

On Site Activation Client Integration

Eager to get started? This quick start guide will help you integrate builder data in client.

yarn add @teko-builder/on-site-react

# or

npm install @teko-builder/on-site-react

Note

Currently

• Only support component popup banner
• Only show banner at home page
• Only show first banner
• Revalidate every 1 minute
• Save shown state on sessionStorage

Usage

import { lazy, Suspense } from 'react';
import SmartComponent from "@teko-builder/on-site-react";
import "@teko-builder/on-site-react/dist/base.css";

// lazy import
// const SmartComponent = lazy(() => import('@teko-builder/on-site-react));

function App() {
  const showSmartComponent = platformId && trackingAppId && iamId;

  return (
    <Suspense fallback={<>Loading</>}>
      {showSmartComponent && (
        <SmartComponent env="dev" configs={{ platformId, trackingAppId, iamId }} />
      )}
      <AnotherComponent>
    </Suspense>
  );
}

export default App;

API

Picker

Property	Type	Default	Description
env	dev | stag | production	-	environment to apply library
configs	SmartComponentConfigs	-	Configs of smart component

SmartComponentConfigs

Property	Type	Default	Description
iamId	string	-	id of user on IAM system
platformId	number	-	id of platform
trackingAppId	string	-	id of tracking app