@bikdotai/bik-component-library 0.0.737-beta.0 → 0.0.737-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.737-beta.0",
+	"version": "0.0.737-beta.2",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",
@@ -55,9 +55,10 @@
 		"@types/react-slick": "^0.23.13",
 		"bootstrap": "^5.1.3",
 		"browser-image-compression": "^2.0.2",
+		"caniuse-lite": "^1.0.30001646",
 		"chart.js": "^3.9.1",
 		"chartjs-plugin-datalabels": "^2.2.0",
-		"emoji-picker-react": "^4.16.1",
+		"emoji-picker-react": "^4.4.9",
 		"idb-keyval": "^6.2.2",
 		"lodash": "^4.17.21",
 		"phone": "^3.1.37",
@@ -67,6 +68,8 @@
 		"react-chartjs-2": "^4.3.1",
 		"react-easy-crop": "^4.7.4",
 		"react-image-crop": "^10.0.9",
+		"react-joyride": "^2.9.3",
+		"react-lottie": "^1.2.3",
 		"react-popper": "^2.3.0",
 		"react-slick": "^0.30.2",
 		"react-toastify": "^9.1.2",
@@ -118,7 +121,6 @@
 		"@typescript-eslint/parser": "^5.48.1",
 		"@zerollup/ts-transform-paths": "^1.7.18",
 		"babel-loader": "^9.1.2",
-		"caniuse-lite": "^1.0.30001646",
 		"date-fns": "^2.29.3",
 		"eslint": "8.31.0",
 		"eslint-config-prettier": "^8.6.0",
@@ -158,10 +160,10 @@
 		"@emotion/react": "^11.0.0",
 		"@emotion/styled": "^11.0.0",
 		"date-fns": "^2.29.3",
-		"react": "^16.8.0 || ^17 || ^18 || ^19",
+		"react": "^16.8.0 || ^17 || ^18",
 		"react-calendar": "^3.7.0",
 		"react-chips": "^0.8.0",
-		"react-dom": "^16.8.0 || ^17 || ^18 || ^19",
+		"react-dom": "^16.8.0 || ^17 || ^18",
 		"react-redux": "^7.2.6",
 		"redux": "^4.1.2",
 		"styled-components": "^5.3.3"

package/dist/cjs/components/QueryBuilder/types/QueryBuilderEnum.type.d.ts

@@ -1,21 +0,0 @@
-export declare enum QueryBuilderConnectorType {
-    'string' = "string",
-    'string_restricted' = "string_restricted",
-    'string_restricted_2' = "string_restricted_2",
-    'string_restricted_3' = "string_restricted_3",
-    'integer' = "integer",
-    'boolean' = "boolean",
-    'date' = "date",
-    'frequency' = "frequency",
-    'anyIg' = "anyIg",
-    'anyAd' = "anyAd",
-    'specificPost' = "specificPost",
-    'specificReel' = "specificReel",
-    'specificStory' = "specificStory",
-    'reaction' = "reaction",
-    'activityString' = "activityString",
-    'specificAd' = "specificAd",
-    'iceBreaker' = "iceBreaker",
-    'mailSubject' = "mailSubject",
-    'exactly' = "exactly"
-}

package/dist/cjs/components/QueryBuilder/types/QueryBuilderEnum.type.js

@@ -1 +0,0 @@
-"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.QueryBuilderConnectorType=void 0,(e=exports.QueryBuilderConnectorType||(exports.QueryBuilderConnectorType={})).string="string",e.string_restricted="string_restricted",e.string_restricted_2="string_restricted_2",e.string_restricted_3="string_restricted_3",e.integer="integer",e.boolean="boolean",e.date="date",e.frequency="frequency",e.anyIg="anyIg",e.anyAd="anyAd",e.specificPost="specificPost",e.specificReel="specificReel",e.specificStory="specificStory",e.reaction="reaction",e.activityString="activityString",e.specificAd="specificAd",e.iceBreaker="iceBreaker",e.mailSubject="mailSubject",e.exactly="exactly";

package/dist/cjs/components/accordion/Accordion.model.d.ts

@@ -1,35 +0,0 @@
-import type { ReactNode } from 'react';
-export type HeaderButton = {
-    icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    title: string;
-    onClick: () => void;
-    style?: React.CSSProperties;
-};
-export interface AccordionProps {
-    header: JSX.Element | string;
-    subHeader?: JSX.Element | string;
-    caption?: string;
-    children: ReactNode;
-    width?: string;
-    rightActionComponent?: JSX.Element;
-    contentMargin?: string;
-    skipHoverHeader?: boolean;
-    headerPadding?: string;
-    showBorders?: boolean;
-    backgroundColor?: string;
-    refresh?: number | boolean;
-    autoOpen?: boolean;
-    childrenMaxHeight?: number;
-    openDirection?: 'DOWN' | 'UP';
-    containerStyle?: React.CSSProperties;
-    headerStyles?: React.CSSProperties;
-    onToggleAccordion?: (state: boolean) => void;
-    arrowColor?: string;
-    isOpen?: boolean;
-    buttonLinkText?: string;
-    onButtonLinkClick?: () => void;
-    captionStyle?: React.CSSProperties;
-    borderColor?: string;
-    borderRadius?: string;
-    headerButtons?: HeaderButton[];
-}

package/dist/cjs/components/analytics-card/AnalyticsCard.model.d.ts

@@ -1 +0,0 @@
-export type ModeType = 'light' | 'dark';

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsChip.model.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-export interface AnalyticsChipInterface {
-    title: string;
-    primaryValue: string;
-    backgroundColor?: string;
-    captionColor?: string;
-    titleColor?: string;
-    width?: number | string;
-    extraJSX?: JSX.Element;
-    tooltipContent?: string;
-    style?: React.CSSProperties;
-    channelConfig?: {
-        whatsapp?: string;
-        instagram?: string;
-        email?: string;
-        sms?: string;
-    };
-}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LazyCharts.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const LazyVerticalGraph: React.LazyExoticComponent<React.FC<import("./VerticalBarGraph/VerticalGraph").VerticalGraphI>>;

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LazyCharts.js

@@ -1 +0,0 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});const r=e(require("react")).default.lazy((()=>Promise.resolve().then((function(){return require("./VerticalBarGraph/VerticalGraph.js")})).then((e=>({default:e.VerticalGraph})))));exports.LazyVerticalGraph=r;

package/dist/cjs/components/bik-layout/Sidebar.model.d.ts

@@ -1,27 +0,0 @@
-export interface Menu {
-    key: string | number;
-    displayName: string;
-    description?: string;
-    path?: string;
-    page?: string;
-    isNew?: string;
-}
-export type SidebarTheme = 'brand' | 'white';
-export interface SimpleSidebarProps {
-    menuList: Menu[];
-    activeMenu: Menu;
-    theme: SidebarTheme;
-    showAccessUpgradePanel?: boolean;
-    header?: string;
-    width?: number;
-    zIndex?: number;
-    left?: number;
-    postion?: 'fixed' | 'sticky';
-    top?: number;
-    router: any;
-    onMouseLeaveOnMenu?: () => void;
-    onMouseEnterOnMenu?: () => void;
-    onMenuClick: (menuSelected: Menu, reDirect?: boolean) => void;
-    onUpgrade?: () => void;
-    isNewSidebar?: boolean;
-}

package/dist/cjs/components/image-cropper/BikImageCropper.model.d.ts

@@ -1,6 +0,0 @@
-export interface BikImageCropperProps {
-    aspectRatio?: number;
-    src: string;
-    onCropComplete: (base64String: string, didChange: boolean) => void | Promise<void>;
-    onCancel: () => void;
-}

package/dist/cjs/components/input/Input.model.d.ts

@@ -1,72 +0,0 @@
-/// <reference types="react" />
-import { ButtonProps } from '../button/model';
-export type InputVariant = 'default' | 'small' | 'x-small';
-export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'disabled-invalid' | 'none';
-export type InputTypeI = 'number' | 'email' | 'text' | 'multiline' | 'url' | 'zip' | 'phonenumber' | 'password';
-export interface InputProps {
-    'data-test'?: string;
-    noErrorHint?: boolean;
-    placeholder?: string;
-    variant?: InputVariant;
-    width?: string;
-    height?: string;
-    leftIcon?: {
-        icon: React.FC;
-        callback?: () => void;
-    };
-    rightIcon?: {
-        icon: React.FC;
-        callback?: () => void;
-    };
-    labelElement?: React.ReactNode;
-    labelText?: string;
-    maxCharLimit?: number;
-    isRequired?: boolean;
-    errorMessage?: string;
-    hintText?: string;
-    state?: InputStateI;
-    type?: InputTypeI;
-    /**
-        validate:  function takes the input and returns boolean + string (error message in case of invalid input)
-     **/
-    validate?: (input?: string | number) => [boolean, string];
-    onChangeText: (input: string, event?: Event) => void;
-    button?: {
-        text: string;
-        onClick?: () => void;
-        buttonProps?: ButtonProps;
-    };
-    suffixText?: string;
-    prefixText?: string;
-    value?: string;
-    reset?: boolean;
-    onBlur?: (e: any) => void;
-    onFocus?: (e: any) => void;
-    onClick?: (e: any) => void;
-    isActive?: boolean;
-    id?: string;
-    onReferenceInit?: (element: HTMLInputElement | HTMLTextAreaElement) => void;
-    rangeValidation?: {
-        min: number;
-        max: number;
-    };
-    noKeyDownChange?: boolean;
-    skipFocus?: boolean;
-    version?: '1.0' | '2.0';
-    textControl?: boolean;
-    noMaxCharCheck?: boolean;
-    tooltipText?: string;
-    autoGrow?: boolean;
-    minHeight?: string;
-    maxHeight?: string;
-    labelTextBold?: boolean;
-    truncateText?: boolean;
-    maxCharLimitPosition?: 'TOP' | 'BOTTOM';
-    hightlightInputColor?: string;
-    onKeyDownEvent?: (e: Event) => void;
-    hideInputHeader?: boolean;
-    hideBorder?: boolean;
-    inputWrapperStyles?: React.CSSProperties;
-    minCharsToTrigger?: number;
-    isDisabled?: boolean;
-}

package/dist/cjs/components/list-item/List.model.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-export type Variant = 'default' | 'selected' | 'inactive' | 'error' | 'readonly' | 'placeholder' | 'separator';
-export interface ListItemElement {
-    label: string;
-    value: string;
-}
-export interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
-    variant?: Variant;
-    subText?: string;
-    listItem: ListItemElement;
-    onSelect?: (ListItemElement: any) => void;
-    leadingIcon?: JSX.Element;
-    trailingIcon?: JSX.Element;
-    borderBottom?: string;
-    customComponent?: JSX.Element;
-    customListItemLabel?: JSX.Element;
-    version?: '1.0' | '2.0';
-}

package/dist/cjs/components/sample-button/SampleButton.model.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-export type Color = 'primary' | 'secondary' | 'success' | 'error' | 'warn';
-export type Variant = 'solid' | 'outline' | 'text';
-export interface SampleButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    /**
-     * The color of the Button.
-     *
-     * @default 'primary'
-     */
-    color?: Color;
-    /**
-     * The visual style of the Button.
-     *
-     * @default 'solid'
-     */
-    variant?: Variant;
-}

package/dist/cjs/components/stepper/Stepper.model.d.ts

@@ -1,17 +0,0 @@
-export type StepperStates = 'default' | 'completed' | 'error' | 'active' | 'inactive';
-export interface EachStep {
-    stepKey: string;
-    stepName: string;
-    isCompleted: boolean;
-    isError: boolean;
-    isInActive: boolean;
-}
-export interface SingleStepperProps {
-    index: number;
-    isLastElement: boolean;
-    eachStep: EachStep;
-    isActive: boolean;
-    onClickingStep: (step: EachStep) => void;
-    stepsCount: number;
-    hideHoverState?: boolean;
-}

package/dist/cjs/components/template-context-mapper/modalElements/modal.d.ts

@@ -1,13 +0,0 @@
-import { WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
-export interface CarouselProduct {
-    name: string;
-    image: string;
-    quantity: number;
-    variantId: string;
-    productId: string;
-    displayOrder: number;
-    collectionId: string;
-    productName: string;
-    productImage: string;
-}
-export type ComponentType = WhatsAppTemplate['components'][0];

package/dist/esm/components/QueryBuilder/types/QueryBuilderEnum.type.d.ts

@@ -1,21 +0,0 @@
-export declare enum QueryBuilderConnectorType {
-    'string' = "string",
-    'string_restricted' = "string_restricted",
-    'string_restricted_2' = "string_restricted_2",
-    'string_restricted_3' = "string_restricted_3",
-    'integer' = "integer",
-    'boolean' = "boolean",
-    'date' = "date",
-    'frequency' = "frequency",
-    'anyIg' = "anyIg",
-    'anyAd' = "anyAd",
-    'specificPost' = "specificPost",
-    'specificReel' = "specificReel",
-    'specificStory' = "specificStory",
-    'reaction' = "reaction",
-    'activityString' = "activityString",
-    'specificAd' = "specificAd",
-    'iceBreaker' = "iceBreaker",
-    'mailSubject' = "mailSubject",
-    'exactly' = "exactly"
-}

package/dist/esm/components/QueryBuilder/types/QueryBuilderEnum.type.js

@@ -1 +0,0 @@
-var e;!function(e){e.string="string",e.string_restricted="string_restricted",e.string_restricted_2="string_restricted_2",e.string_restricted_3="string_restricted_3",e.integer="integer",e.boolean="boolean",e.date="date",e.frequency="frequency",e.anyIg="anyIg",e.anyAd="anyAd",e.specificPost="specificPost",e.specificReel="specificReel",e.specificStory="specificStory",e.reaction="reaction",e.activityString="activityString",e.specificAd="specificAd",e.iceBreaker="iceBreaker",e.mailSubject="mailSubject",e.exactly="exactly"}(e||(e={}));export{e as QueryBuilderConnectorType};

package/dist/esm/components/accordion/Accordion.model.d.ts

@@ -1,35 +0,0 @@
-import type { ReactNode } from 'react';
-export type HeaderButton = {
-    icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    title: string;
-    onClick: () => void;
-    style?: React.CSSProperties;
-};
-export interface AccordionProps {
-    header: JSX.Element | string;
-    subHeader?: JSX.Element | string;
-    caption?: string;
-    children: ReactNode;
-    width?: string;
-    rightActionComponent?: JSX.Element;
-    contentMargin?: string;
-    skipHoverHeader?: boolean;
-    headerPadding?: string;
-    showBorders?: boolean;
-    backgroundColor?: string;
-    refresh?: number | boolean;
-    autoOpen?: boolean;
-    childrenMaxHeight?: number;
-    openDirection?: 'DOWN' | 'UP';
-    containerStyle?: React.CSSProperties;
-    headerStyles?: React.CSSProperties;
-    onToggleAccordion?: (state: boolean) => void;
-    arrowColor?: string;
-    isOpen?: boolean;
-    buttonLinkText?: string;
-    onButtonLinkClick?: () => void;
-    captionStyle?: React.CSSProperties;
-    borderColor?: string;
-    borderRadius?: string;
-    headerButtons?: HeaderButton[];
-}

package/dist/esm/components/analytics-card/AnalyticsCard.model.d.ts

@@ -1 +0,0 @@
-export type ModeType = 'light' | 'dark';

package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsChip.model.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-export interface AnalyticsChipInterface {
-    title: string;
-    primaryValue: string;
-    backgroundColor?: string;
-    captionColor?: string;
-    titleColor?: string;
-    width?: number | string;
-    extraJSX?: JSX.Element;
-    tooltipContent?: string;
-    style?: React.CSSProperties;
-    channelConfig?: {
-        whatsapp?: string;
-        instagram?: string;
-        email?: string;
-        sms?: string;
-    };
-}

package/dist/esm/components/analytics-chips-and-dropdowns/chart/LazyCharts.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const LazyVerticalGraph: React.LazyExoticComponent<React.FC<import("./VerticalBarGraph/VerticalGraph").VerticalGraphI>>;

package/dist/esm/components/analytics-chips-and-dropdowns/chart/LazyCharts.js

@@ -1 +0,0 @@
-import r from"react";const a=r.lazy((()=>import("./VerticalBarGraph/VerticalGraph.js").then((r=>({default:r.VerticalGraph})))));export{a as LazyVerticalGraph};

package/dist/esm/components/bik-layout/Sidebar.model.d.ts

@@ -1,27 +0,0 @@
-export interface Menu {
-    key: string | number;
-    displayName: string;
-    description?: string;
-    path?: string;
-    page?: string;
-    isNew?: string;
-}
-export type SidebarTheme = 'brand' | 'white';
-export interface SimpleSidebarProps {
-    menuList: Menu[];
-    activeMenu: Menu;
-    theme: SidebarTheme;
-    showAccessUpgradePanel?: boolean;
-    header?: string;
-    width?: number;
-    zIndex?: number;
-    left?: number;
-    postion?: 'fixed' | 'sticky';
-    top?: number;
-    router: any;
-    onMouseLeaveOnMenu?: () => void;
-    onMouseEnterOnMenu?: () => void;
-    onMenuClick: (menuSelected: Menu, reDirect?: boolean) => void;
-    onUpgrade?: () => void;
-    isNewSidebar?: boolean;
-}

package/dist/esm/components/image-cropper/BikImageCropper.model.d.ts

@@ -1,6 +0,0 @@
-export interface BikImageCropperProps {
-    aspectRatio?: number;
-    src: string;
-    onCropComplete: (base64String: string, didChange: boolean) => void | Promise<void>;
-    onCancel: () => void;
-}

package/dist/esm/components/input/Input.model.d.ts

@@ -1,72 +0,0 @@
-/// <reference types="react" />
-import { ButtonProps } from '../button/model';
-export type InputVariant = 'default' | 'small' | 'x-small';
-export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'disabled-invalid' | 'none';
-export type InputTypeI = 'number' | 'email' | 'text' | 'multiline' | 'url' | 'zip' | 'phonenumber' | 'password';
-export interface InputProps {
-    'data-test'?: string;
-    noErrorHint?: boolean;
-    placeholder?: string;
-    variant?: InputVariant;
-    width?: string;
-    height?: string;
-    leftIcon?: {
-        icon: React.FC;
-        callback?: () => void;
-    };
-    rightIcon?: {
-        icon: React.FC;
-        callback?: () => void;
-    };
-    labelElement?: React.ReactNode;
-    labelText?: string;
-    maxCharLimit?: number;
-    isRequired?: boolean;
-    errorMessage?: string;
-    hintText?: string;
-    state?: InputStateI;
-    type?: InputTypeI;
-    /**
-        validate:  function takes the input and returns boolean + string (error message in case of invalid input)
-     **/
-    validate?: (input?: string | number) => [boolean, string];
-    onChangeText: (input: string, event?: Event) => void;
-    button?: {
-        text: string;
-        onClick?: () => void;
-        buttonProps?: ButtonProps;
-    };
-    suffixText?: string;
-    prefixText?: string;
-    value?: string;
-    reset?: boolean;
-    onBlur?: (e: any) => void;
-    onFocus?: (e: any) => void;
-    onClick?: (e: any) => void;
-    isActive?: boolean;
-    id?: string;
-    onReferenceInit?: (element: HTMLInputElement | HTMLTextAreaElement) => void;
-    rangeValidation?: {
-        min: number;
-        max: number;
-    };
-    noKeyDownChange?: boolean;
-    skipFocus?: boolean;
-    version?: '1.0' | '2.0';
-    textControl?: boolean;
-    noMaxCharCheck?: boolean;
-    tooltipText?: string;
-    autoGrow?: boolean;
-    minHeight?: string;
-    maxHeight?: string;
-    labelTextBold?: boolean;
-    truncateText?: boolean;
-    maxCharLimitPosition?: 'TOP' | 'BOTTOM';
-    hightlightInputColor?: string;
-    onKeyDownEvent?: (e: Event) => void;
-    hideInputHeader?: boolean;
-    hideBorder?: boolean;
-    inputWrapperStyles?: React.CSSProperties;
-    minCharsToTrigger?: number;
-    isDisabled?: boolean;
-}

package/dist/esm/components/list-item/List.model.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-export type Variant = 'default' | 'selected' | 'inactive' | 'error' | 'readonly' | 'placeholder' | 'separator';
-export interface ListItemElement {
-    label: string;
-    value: string;
-}
-export interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
-    variant?: Variant;
-    subText?: string;
-    listItem: ListItemElement;
-    onSelect?: (ListItemElement: any) => void;
-    leadingIcon?: JSX.Element;
-    trailingIcon?: JSX.Element;
-    borderBottom?: string;
-    customComponent?: JSX.Element;
-    customListItemLabel?: JSX.Element;
-    version?: '1.0' | '2.0';
-}

package/dist/esm/components/sample-button/SampleButton.model.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-export type Color = 'primary' | 'secondary' | 'success' | 'error' | 'warn';
-export type Variant = 'solid' | 'outline' | 'text';
-export interface SampleButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    /**
-     * The color of the Button.
-     *
-     * @default 'primary'
-     */
-    color?: Color;
-    /**
-     * The visual style of the Button.
-     *
-     * @default 'solid'
-     */
-    variant?: Variant;
-}

package/dist/esm/components/stepper/Stepper.model.d.ts

@@ -1,17 +0,0 @@
-export type StepperStates = 'default' | 'completed' | 'error' | 'active' | 'inactive';
-export interface EachStep {
-    stepKey: string;
-    stepName: string;
-    isCompleted: boolean;
-    isError: boolean;
-    isInActive: boolean;
-}
-export interface SingleStepperProps {
-    index: number;
-    isLastElement: boolean;
-    eachStep: EachStep;
-    isActive: boolean;
-    onClickingStep: (step: EachStep) => void;
-    stepsCount: number;
-    hideHoverState?: boolean;
-}

package/dist/esm/components/template-context-mapper/modalElements/modal.d.ts

@@ -1,13 +0,0 @@
-import { WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
-export interface CarouselProduct {
-    name: string;
-    image: string;
-    quantity: number;
-    variantId: string;
-    productId: string;
-    displayOrder: number;
-    collectionId: string;
-    productName: string;
-    productImage: string;
-}
-export type ComponentType = WhatsAppTemplate['components'][0];