@bikdotai/bik-component-library 0.0.734-beta.3 → 0.0.735-beta.1

package/dist/cjs/components/bik-chatbot/utils/guardrails.d.ts

@@ -1,6 +1,6 @@
-export declare function sanitizeUserInput(text: string): string;
-export declare function injectSafetyPrompt(prompt: string): string;
-export declare function validateOutput(msg: unknown): boolean;
-export declare function validateFunctionCall(fnCall: unknown, allowedFunctions?: Array<{
-    name: string;
-}>): boolean;
+export declare function sanitizeUserInput(text: string): string;
+export declare function injectSafetyPrompt(prompt: string): string;
+export declare function validateOutput(msg: unknown): boolean;
+export declare function validateFunctionCall(fnCall: unknown, allowedFunctions?: Array<{
+    name: string;
+}>): boolean;

package/dist/cjs/components/bik-chatbot/utils/markdown.d.ts

@@ -1 +1 @@
-export declare function renderMarkdownLite(text: string): string;
+export declare function renderMarkdownLite(text: string): string;

package/dist/cjs/components/bik-chatbot-examples/AnalyticsAdvisor.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
-export interface AnalyticsAdvisorProps {
-    storeId?: string;
-    height?: string;
-    fullHeight?: boolean;
-}
-export declare const AnalyticsAdvisor: React.FC<AnalyticsAdvisorProps>;
-export default AnalyticsAdvisor;
+import React from 'react';
+export interface AnalyticsAdvisorProps {
+    storeId?: string;
+    height?: string;
+    fullHeight?: boolean;
+}
+export declare const AnalyticsAdvisor: React.FC<AnalyticsAdvisorProps>;
+export default AnalyticsAdvisor;

package/dist/cjs/components/bik-chatbot-examples/ContentIdeasDemo.d.ts

@@ -1,12 +1,12 @@
-/**
- * Content Ideas Demo - Multi-step tool flow
- * getTrends() -> generate 5 ideas -> updateIdeas({ ideas }) -> final JSON reply
- */
-import React from 'react';
-export interface ContentIdeasDemoProps {
-    height?: string;
-    className?: string;
-    conversationId?: string;
-}
-export declare const ContentIdeasDemo: React.FC<ContentIdeasDemoProps>;
-export default ContentIdeasDemo;
+/**
+ * Content Ideas Demo - Multi-step tool flow
+ * getTrends() -> generate 5 ideas -> updateIdeas({ ideas }) -> final JSON reply
+ */
+import React from 'react';
+export interface ContentIdeasDemoProps {
+    height?: string;
+    className?: string;
+    conversationId?: string;
+}
+export declare const ContentIdeasDemo: React.FC<ContentIdeasDemoProps>;
+export default ContentIdeasDemo;

package/dist/cjs/components/bik-chatbot-examples/SilentModeDemo.d.ts

@@ -1,17 +1,17 @@
-/**
- * Silent Function Calls Demo - Testing that custom function calls don't show in chat
- *
- * This demonstrates:
- * - Function calls execute silently (no chat bubbles for function execution)
- * - Only final JSON data is displayed (not in chat)
- * - Follows workflow: User Input → Function Call (SILENT) → Handler → Display Data
- * - Perfect for testing the silent function call behavior
- */
-import React from 'react';
-export interface SilentModeDemoProps {
-    height?: string;
-    className?: string;
-    conversationId?: string;
-}
-export declare const SilentModeDemo: React.FC<SilentModeDemoProps>;
-export default SilentModeDemo;
+/**
+ * Silent Function Calls Demo - Testing that custom function calls don't show in chat
+ *
+ * This demonstrates:
+ * - Function calls execute silently (no chat bubbles for function execution)
+ * - Only final JSON data is displayed (not in chat)
+ * - Follows workflow: User Input → Function Call (SILENT) → Handler → Display Data
+ * - Perfect for testing the silent function call behavior
+ */
+import React from 'react';
+export interface SilentModeDemoProps {
+    height?: string;
+    className?: string;
+    conversationId?: string;
+}
+export declare const SilentModeDemo: React.FC<SilentModeDemoProps>;
+export default SilentModeDemo;

package/dist/cjs/components/bik-chatbot-examples/SimpleChatbotDemo.d.ts

@@ -1,17 +1,17 @@
-/**
- * Simple Chatbot Demo - Basic text conversation without functions
- *
- * This demonstrates:
- * - Plain text chatbot
- * - No functions or structured data
- * - Basic AI interaction
- * - Web search capability (via Responses API)
- */
-import React from 'react';
-export interface SimpleChatbotDemoProps {
-    height?: string;
-    className?: string;
-    conversationId?: string;
-}
-export declare const SimpleChatbotDemo: React.FC<SimpleChatbotDemoProps>;
-export default SimpleChatbotDemo;
+/**
+ * Simple Chatbot Demo - Basic text conversation without functions
+ *
+ * This demonstrates:
+ * - Plain text chatbot
+ * - No functions or structured data
+ * - Basic AI interaction
+ * - Web search capability (via Responses API)
+ */
+import React from 'react';
+export interface SimpleChatbotDemoProps {
+    height?: string;
+    className?: string;
+    conversationId?: string;
+}
+export declare const SimpleChatbotDemo: React.FC<SimpleChatbotDemoProps>;
+export default SimpleChatbotDemo;

package/dist/cjs/components/bik-chatbot-examples/SimpleJsonChatDemo.d.ts

@@ -1,16 +1,16 @@
-/**
- * Simple JSON Chatbot Demo - Assistant returns JSON in text
- *
- * This demonstrates:
- * - responseFormat='json' behavior
- * - Chat bubble shows parsed.response
- * - onMessageReceived receives full parsed JSON
- */
-import React from 'react';
-export interface SimpleJsonChatbotDemoProps {
-    height?: string;
-    className?: string;
-    conversationId?: string;
-}
-export declare const SimpleJsonChatbotDemo: React.FC<SimpleJsonChatbotDemoProps>;
-export default SimpleJsonChatbotDemo;
+/**
+ * Simple JSON Chatbot Demo - Assistant returns JSON in text
+ *
+ * This demonstrates:
+ * - responseFormat='json' behavior
+ * - Chat bubble shows parsed.response
+ * - onMessageReceived receives full parsed JSON
+ */
+import React from 'react';
+export interface SimpleJsonChatbotDemoProps {
+    height?: string;
+    className?: string;
+    conversationId?: string;
+}
+export declare const SimpleJsonChatbotDemo: React.FC<SimpleJsonChatbotDemoProps>;
+export default SimpleJsonChatbotDemo;

package/dist/cjs/components/bik-chatbot-examples/services/MockRequestExecutor.d.ts

@@ -1,17 +1,17 @@
-export interface MockSendDataOptions {
-    apiPath: string;
-    apiMethod?: 'POST' | 'GET' | 'PUT' | 'PATCH' | 'DELETE';
-    requestBody?: unknown;
-    requestHeader?: Record<string, string>;
-    skipStoreId?: boolean;
-    abortController?: AbortController;
-}
-type MockExecutorResult<T> = {
-    status: number;
-    data?: T;
-    error?: unknown;
-};
-export declare const MockRequestExecutor: {
-    sendData<T>({ apiPath, apiMethod, requestBody, requestHeader, abortController, }: MockSendDataOptions): Promise<MockExecutorResult<T>>;
-};
-export default MockRequestExecutor;
+export interface MockSendDataOptions {
+    apiPath: string;
+    apiMethod?: 'POST' | 'GET' | 'PUT' | 'PATCH' | 'DELETE';
+    requestBody?: unknown;
+    requestHeader?: Record<string, string>;
+    skipStoreId?: boolean;
+    abortController?: AbortController;
+}
+type MockExecutorResult<T> = {
+    status: number;
+    data?: T;
+    error?: unknown;
+};
+export declare const MockRequestExecutor: {
+    sendData<T>({ apiPath, apiMethod, requestBody, requestHeader, abortController, }: MockSendDataOptions): Promise<MockExecutorResult<T>>;
+};
+export default MockRequestExecutor;

package/dist/cjs/components/bik-chatbot-examples/types.ts/examples.d.ts

@@ -1,61 +1,61 @@
-/**
- * Example Types
- *
- * Type definitions for example components and their data structures.
- */
-export interface Campaign {
-    id: string;
-    name: string;
-    description: string;
-    category: string;
-    tags?: string[];
-    timeline?: string;
-    eventName?: string;
-    trendingMoment?: string;
-    relevanceScore?: string;
-    goal?: string;
-}
-export interface TemplateRecommendation {
-    templateType: string;
-    templateName: string;
-    templateCategory: string;
-    templateDescription: string;
-    suggestedElements: {
-        headerText?: string;
-        bodyText: string;
-        footerText?: string;
-        buttonTexts: string[];
-        mediaType: string;
-    };
-}
-export interface AnalyticsData {
-    deliveryRate: number;
-    engagementRate: number;
-    bounceRate: number;
-    openRate: number;
-    clickRate?: number;
-    unsubscribeRate?: number;
-}
-export interface AnalyticsAnalysis {
-    response: string;
-    suggestions: string[];
-    insights: string[];
-    metrics: AnalyticsData;
-}
-export interface CampaignAIProps {
-    storeId: string;
-    onCampaignsGenerated: (campaigns: Campaign[]) => void;
-    height?: string;
-    className?: string;
-}
-export interface TemplateAIProps {
-    campaign: Campaign;
-    onTemplatesGenerated: (templates: TemplateRecommendation[]) => void;
-    height?: string;
-    className?: string;
-}
-export interface AnalyticsAdvisorProps {
-    onAnalysisReceived: (analysis: AnalyticsAnalysis) => void;
-    height?: string;
-    className?: string;
-}
+/**
+ * Example Types
+ *
+ * Type definitions for example components and their data structures.
+ */
+export interface Campaign {
+    id: string;
+    name: string;
+    description: string;
+    category: string;
+    tags?: string[];
+    timeline?: string;
+    eventName?: string;
+    trendingMoment?: string;
+    relevanceScore?: string;
+    goal?: string;
+}
+export interface TemplateRecommendation {
+    templateType: string;
+    templateName: string;
+    templateCategory: string;
+    templateDescription: string;
+    suggestedElements: {
+        headerText?: string;
+        bodyText: string;
+        footerText?: string;
+        buttonTexts: string[];
+        mediaType: string;
+    };
+}
+export interface AnalyticsData {
+    deliveryRate: number;
+    engagementRate: number;
+    bounceRate: number;
+    openRate: number;
+    clickRate?: number;
+    unsubscribeRate?: number;
+}
+export interface AnalyticsAnalysis {
+    response: string;
+    suggestions: string[];
+    insights: string[];
+    metrics: AnalyticsData;
+}
+export interface CampaignAIProps {
+    storeId: string;
+    onCampaignsGenerated: (campaigns: Campaign[]) => void;
+    height?: string;
+    className?: string;
+}
+export interface TemplateAIProps {
+    campaign: Campaign;
+    onTemplatesGenerated: (templates: TemplateRecommendation[]) => void;
+    height?: string;
+    className?: string;
+}
+export interface AnalyticsAdvisorProps {
+    onAnalysisReceived: (analysis: AnalyticsAnalysis) => void;
+    height?: string;
+    className?: string;
+}

package/dist/cjs/components/bik-layout/BikHeader.d.ts

@@ -1,16 +1,16 @@
-import React from 'react';
-import { CurtainProps } from "../curtain";
-export interface HeaderProps {
-    header: string;
-    subHeader?: string;
-    hideBackButton?: boolean;
-    rightActionButton?: JSX.Element;
-    leftLayout?: JSX.Element;
-    onClickingBackButton?: () => void;
-    secondaryHeader?: JSX.Element;
-    curtainProps?: CurtainProps;
-    curtainZIndex?: number;
-    headerStyles?: React.CSSProperties;
-    dataTest?: string;
-}
-export declare const BikHeader: React.FC<HeaderProps>;
+import React from 'react';
+import { CurtainProps } from '@src/components/curtain';
+export interface HeaderProps {
+    header: string;
+    subHeader?: string;
+    hideBackButton?: boolean;
+    rightActionButton?: JSX.Element;
+    leftLayout?: JSX.Element;
+    onClickingBackButton?: () => void;
+    secondaryHeader?: JSX.Element;
+    curtainProps?: CurtainProps;
+    curtainZIndex?: number;
+    headerStyles?: React.CSSProperties;
+    dataTest?: string;
+}
+export declare const BikHeader: React.FC<HeaderProps>;

package/dist/cjs/components/bik-layout/BikHeader.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/arrow_left.svg.js"),t=require("react"),r=require("../curtain/Curtain.js"),i=require("../TypographyStyle.js"),a=require("./CommonStyles.js");exports.BikHeader=n=>{const{header:c,subHeader:l,hideBackButton:d=!0,rightActionButton:o,onClickingBackButton:u,secondaryHeader:j,curtainProps:h,curtainZIndex:x,headerStyles:g,leftLayout:y,dataTest:m}=n,[p,b]=t.useState(!!h);return e.jsxs(a.BikHeaderWrapper,Object.assign({style:Object.assign({},g),"data-test":m},{children:[e.jsxs(a.BikHeaderContainer,{children:[y?e.jsxs(e.Fragment,{children:[!d&&e.jsx(s.default,{className:"cursor",height:24,width:24,onClick:u}),y]}):e.jsxs("div",Object.assign({className:"row--flex left-container"},{children:[!d&&e.jsx(s.default,{className:"cursor",height:24,width:24,onClick:u}),e.jsxs("div",{children:[l?e.jsx(i.BodyCaption,Object.assign({className:"brand"},{children:c})):e.jsx(i.TitleMedium,{children:c}),e.jsx(i.TitleRegular,{children:l})]})]})),e.jsx("div",Object.assign({className:"row--flex right-container"},{children:o}))]}),p&&h&&e.jsxs(e.Fragment,{children:[e.jsx("div",Object.assign({style:{position:"sticky",top:0,width:"auto",zIndex:x||6}},{children:e.jsx(r.Curtain,Object.assign({},h,{onCloseHandler:()=>{b(!1)}}))})),e.jsx("div",{style:{height:20}})]}),null!=j?j:e.jsx(e.Fragment,{})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../assets/icons/arrow_left.svg.js"),s=require("react"),t=require("../curtain/Curtain.js"),i=require("../TypographyStyle.js"),a=require("./CommonStyles.js");exports.BikHeader=n=>{const{header:l,subHeader:d,hideBackButton:c=!0,rightActionButton:o,onClickingBackButton:u,secondaryHeader:h,curtainProps:j,curtainZIndex:x,headerStyles:g,leftLayout:y,dataTest:m}=n,[p,k]=s.useState(!!j);return e.jsxs(a.BikHeaderWrapper,{style:Object.assign({},g),"data-test":m,children:[e.jsxs(a.BikHeaderContainer,{children:[y?e.jsxs(e.Fragment,{children:[!c&&e.jsx(r.default,{className:"cursor",height:24,width:24,onClick:u}),y]}):e.jsxs("div",{className:"row--flex left-container",children:[!c&&e.jsx(r.default,{className:"cursor",height:24,width:24,onClick:u}),e.jsxs("div",{children:[d?e.jsx(i.BodyCaption,{className:"brand",children:l}):e.jsx(i.TitleMedium,{children:l}),e.jsx(i.TitleRegular,{children:d})]})]}),e.jsx("div",{className:"row--flex right-container",children:o})]}),p&&j&&e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{position:"sticky",top:0,width:"auto",zIndex:x||6},children:e.jsx(t.Curtain,Object.assign({},j,{onCloseHandler:()=>{k(!1)}}))}),e.jsx("div",{style:{height:20}})]}),null!=h?h:e.jsx(e.Fragment,{})]})};

package/dist/cjs/components/bik-layout/BikLayout.d.ts

@@ -1,25 +1,24 @@
-/// <reference types="react" />
-export interface BikLayoutProps {
-    isLoading: boolean;
-    isFeatureModalEnabled?: boolean;
-    isDisabled?: boolean;
-    hidePadding?: boolean;
-    loadingAnimation?: JSX.Element;
-    height?: string;
-    children?: React.ReactNode;
-    containerStyles?: React.CSSProperties;
-    onClickingCrossOnFeatureModal?: () => void;
-    onUpgrade?: () => void;
-    extraContentForModal?: JSX.Element;
-    type?: 'overflow-within' | 'overflow-body';
-    featureModalProps?: {
-        title?: string;
-        subTitle?: string;
-        showBookADemo?: boolean;
-        demoLink?: string;
-        featureImage?: string;
-    };
-    useFeautureModalV2?: boolean;
-    backgroundColor?: string;
-}
-export declare const BikLayout: React.FC<BikLayoutProps>;
+export interface BikLayoutProps {
+    isLoading: boolean;
+    isFeatureModalEnabled?: boolean;
+    isDisabled?: boolean;
+    hidePadding?: boolean;
+    loadingAnimation?: JSX.Element;
+    height?: string;
+    children?: React.ReactNode;
+    containerStyles?: React.CSSProperties;
+    onClickingCrossOnFeatureModal?: () => void;
+    onUpgrade?: () => void;
+    extraContentForModal?: JSX.Element;
+    type?: 'overflow-within' | 'overflow-body';
+    featureModalProps?: {
+        title?: string;
+        subTitle?: string;
+        showBookADemo?: boolean;
+        demoLink?: string;
+        featureImage?: string;
+    };
+    useFeautureModalV2?: boolean;
+    backgroundColor?: string;
+}
+export declare const BikLayout: React.FC<BikLayoutProps>;

package/dist/cjs/components/bik-layout/BikLayout.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("./CommonStyles.js"),a=require("./FeatureModal.js"),o=require("./FeatureModalV2.js"),n=require("./PageLoader.js");exports.BikLayout=s=>{const{isLoading:t,isFeatureModalEnabled:i=!1,isDisabled:d=!1,loadingAnimation:l,hidePadding:u=!1,height:c,children:g,containerStyles:j,onClickingCrossOnFeatureModal:p,onUpgrade:h,extraContentForModal:b,featureModalProps:x,type:C,useFeautureModalV2:F,backgroundColor:M}=s;return t?e.jsx(r.BikLayoutContainer,Object.assign({backgroundColor:M},{children:l||e.jsx(n.PageLoader,{})})):e.jsx(e.Fragment,{children:e.jsxs(r.BikLayoutContainer,Object.assign({type:C,backgroundColor:M},{children:[e.jsx("div",{className:""+(d?"disabled--wrapper":"")}),e.jsx("div",Object.assign({className:""+(u?"inner-wrapper":"inner-wrapper pd-24"),style:Object.assign({height:`${c||""}`},null!=j?j:{})},{children:g})),i&&e.jsx(e.Fragment,{children:F?e.jsx(o.FeatureModalV2,Object.assign({onUpgrade:h},x,{otherContent:b})):e.jsx(a.FeatureModal,Object.assign({showBookADemo:!0,onClickingCross:()=>p?p():"",onUpgrade:h},x,{otherContent:b}))})]}))})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("./CommonStyles.js"),a=require("./FeatureModal.js"),o=require("./FeatureModalV2.js"),n=require("./PageLoader.js");exports.BikLayout=s=>{const{isLoading:t,isFeatureModalEnabled:i=!1,isDisabled:d=!1,loadingAnimation:l,hidePadding:u=!1,height:c,children:g,containerStyles:j,onClickingCrossOnFeatureModal:p,onUpgrade:h,extraContentForModal:x,featureModalProps:C,type:b,useFeautureModalV2:F,backgroundColor:M}=s;return t?e.jsx(r.BikLayoutContainer,{backgroundColor:M,children:l||e.jsx(n.PageLoader,{})}):e.jsx(e.Fragment,{children:e.jsxs(r.BikLayoutContainer,{type:b,backgroundColor:M,children:[e.jsx("div",{className:""+(d?"disabled--wrapper":"")}),e.jsx("div",{className:""+(u?"inner-wrapper":"inner-wrapper pd-24"),style:Object.assign({height:`${c||""}`},null!=j?j:{}),children:g}),i&&e.jsx(e.Fragment,{children:F?e.jsx(o.FeatureModalV2,Object.assign({onUpgrade:h},C,{otherContent:x})):e.jsx(a.FeatureModal,Object.assign({showBookADemo:!0,onClickingCross:()=>p?p():"",onUpgrade:h},C,{otherContent:x}))})]})})};

package/dist/cjs/components/bik-layout/BikProfile.d.ts

@@ -1,12 +1,11 @@
-/// <reference types="react" />
-export interface BikProfileProps {
-    userName: string;
-    hideLogout?: boolean;
-    photoUrl?: string;
-    isActiveAwayStatus?: boolean;
-    isAvailable?: boolean;
-    onProfileClicked?: () => void;
-    onLogout?: () => void;
-    extraJSX?: JSX.Element;
-}
-export declare const BikProfile: React.FC<BikProfileProps>;
+export interface BikProfileProps {
+    userName: string;
+    hideLogout?: boolean;
+    photoUrl?: string;
+    isActiveAwayStatus?: boolean;
+    isAvailable?: boolean;
+    onProfileClicked?: () => void;
+    onLogout?: () => void;
+    extraJSX?: JSX.Element;
+}
+export declare const BikProfile: React.FC<BikProfileProps>;

package/dist/cjs/components/bik-layout/BikProfile.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../assets/icons/log_out.svg.js"),s=require("react"),n=require("react-bootstrap"),r=require("../../constants/Theme.js");require("../tooltips/Tooltip.js");var t=require("../TypographyStyle.js"),o=require("../floating-action-button/FloatingActionButton.styles.js"),a=require("./CommonStyles.js");const l=i=>{const{isDropdownOpen:s,imageUrl:n,initialsAsIcon:r}=i;return e.jsx(a.ProfileDropdownToggleContainer,Object.assign({id:"dropdown-basic"},{children:e.jsx(a.ProfileDropdownInnerContainer,Object.assign({isDropdownOpen:s},{children:e.jsx(c,{imageUrl:n,initialsAsIcon:r})}))}))},c=i=>{const{imageUrl:s,initialsAsIcon:n}=i;return e.jsx(e.Fragment,{children:(n||s)&&e.jsx(a.UserAvatarContainer,{children:s?e.jsx("img",{src:s,alt:"general-icon"}):e.jsx("div",Object.assign({className:"avatar--container"},{children:e.jsx(t.BodySecondary,Object.assign({style:{color:r.COLORS.surface.standard}},{children:n}))}))})})};exports.BikProfile=d=>{const[j,g]=s.useState(!1),{userName:x,hideLogout:u=!1,photoUrl:h,isActiveAwayStatus:p=!0,isAvailable:y=!1,extraJSX:b,onProfileClicked:m,onLogout:v}=d,O=e=>{const i=(e||"").split("."),s=i[1]||i[0];if(!s)return"";return s.split(" ").map((e=>e.charAt(0).toUpperCase())).slice(0,2).join("")},A=e.jsx(a.StyledTooltip,Object.assign({id:"tooltip"},{children:e.jsx(t.BodyCaption,{children:x})}));return e.jsxs(o.StyledDropdown,Object.assign({onToggle:e=>{g(e)}},{children:[e.jsx(l,{isDropdownOpen:j,imageUrl:h,initialsAsIcon:h?"":O(x)}),e.jsx(n.Dropdown.Menu,{children:e.jsxs(a.MenuInnerContainer,{children:[e.jsxs(a.UserInfoContainer,Object.assign({onClick:m},{children:[e.jsx(c,{imageUrl:h,initialsAsIcon:h?"":O(x)}),e.jsxs(a.UserStatusContainer,{children:[e.jsx(n.OverlayTrigger,Object.assign({delay:{show:100,hide:400},placement:"top",overlay:A},{children:e.jsx(a.UserNameTitleSmall,{children:e.jsx(t.TitleSmall,{children:x})})})),p&&e.jsxs(a.StatusContainer,Object.assign({isAvailable:y},{children:[e.jsx("div",{className:"availability--container"}),!y&&e.jsx(a.StyledBodyCaption,Object.assign({isAvailable:y},{children:"Away"})),y&&e.jsx(a.StyledBodyCaption,Object.assign({isAvailable:y},{children:"Active"}))]}))]})]})),b&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"divider"}),b]}),!u&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"divider"}),e.jsxs("div",Object.assign({className:"logout--container",onClick:v,onKeyDown:v,role:"button",tabIndex:0},{children:[e.jsx(i.default,{color:r.COLORS.content.negative,height:17,width:17}),e.jsx(t.BodySecondary,Object.assign({style:{color:r.DEFAULT_THEME.colorsV2.content.negative}},{children:"Logout"}))]}))]})]})})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../assets/icons/log_out.svg.js"),r=require("react"),n=require("react-bootstrap"),s=require("../../constants/Theme.js");require("../tooltips/Tooltip.js");var o=require("../TypographyStyle.js"),t=require("../floating-action-button/FloatingActionButton.styles.js"),l=require("./CommonStyles.js");const a=i=>{const{isDropdownOpen:r,imageUrl:n,initialsAsIcon:s}=i;return e.jsx(l.ProfileDropdownToggleContainer,{id:"dropdown-basic",children:e.jsx(l.ProfileDropdownInnerContainer,{isDropdownOpen:r,children:e.jsx(c,{imageUrl:n,initialsAsIcon:s})})})},c=i=>{const{imageUrl:r,initialsAsIcon:n}=i;return e.jsx(e.Fragment,{children:(n||r)&&e.jsx(l.UserAvatarContainer,{children:r?e.jsx("img",{src:r,alt:"general-icon"}):e.jsx("div",{className:"avatar--container",children:e.jsx(o.BodySecondary,{style:{color:s.COLORS.surface.standard},children:n})})})})};exports.BikProfile=d=>{const[j,x]=r.useState(!1),{userName:u,hideLogout:h=!1,photoUrl:p,isActiveAwayStatus:g=!0,isAvailable:y=!1,extraJSX:m,onProfileClicked:v,onLogout:A}=d,C=e=>{const i=(e||"").split("."),r=i[1]||i[0];if(!r)return"";return r.split(" ").map((e=>e.charAt(0).toUpperCase())).slice(0,2).join("")},S=e.jsx(l.StyledTooltip,{id:"tooltip",children:e.jsx(o.BodyCaption,{children:u})});return e.jsxs(t.StyledDropdown,{onToggle:e=>{x(e)},children:[e.jsx(a,{isDropdownOpen:j,imageUrl:p,initialsAsIcon:p?"":C(u)}),e.jsx(n.Dropdown.Menu,{children:e.jsxs(l.MenuInnerContainer,{children:[e.jsxs(l.UserInfoContainer,{onClick:v,children:[e.jsx(c,{imageUrl:p,initialsAsIcon:p?"":C(u)}),e.jsxs(l.UserStatusContainer,{children:[e.jsx(n.OverlayTrigger,{delay:{show:100,hide:400},placement:"top",overlay:S,children:e.jsx(l.UserNameTitleSmall,{children:e.jsx(o.TitleSmall,{children:u})})}),g&&e.jsxs(l.StatusContainer,{isAvailable:y,children:[e.jsx("div",{className:"availability--container"}),!y&&e.jsx(l.StyledBodyCaption,{isAvailable:y,children:"Away"}),y&&e.jsx(l.StyledBodyCaption,{isAvailable:y,children:"Active"})]})]})]}),m&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"divider"}),m]}),!h&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"divider"}),e.jsxs("div",{className:"logout--container",onClick:A,onKeyDown:A,role:"button",tabIndex:0,children:[e.jsx(i.default,{color:s.COLORS.content.negative,height:17,width:17}),e.jsx(o.BodySecondary,{style:{color:s.DEFAULT_THEME.colorsV2.content.negative},children:"Logout"})]})]})]})})]})};

package/dist/cjs/components/bik-layout/BikSidebar.d.ts

@@ -1,33 +1,33 @@
-import React from 'react';
-import { Menu } from './Sidebar.model';
-export interface MenuItem {
-    key: string | number;
-    displayName: string;
-    icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    activeIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    hoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    isLastSticky?: boolean;
-    is2ndLastSticky?: boolean;
-    children?: Menu[];
-    showAccessUpgradePanel?: boolean;
-    path?: string;
-    layout?: 'fullScreen' | 'popup' | string | undefined;
-    isNew?: boolean;
-    isLocked?: boolean;
-}
-export interface BikSidebarProps {
-    logoSvg?: JSX.Element;
-    allMenuList: MenuItem[];
-    activeMainMenu: MenuItem;
-    activeSubMenu: Menu;
-    router: any;
-    onClickingMainMenu: (menu: MenuItem) => void;
-    onClickingSubMenu: (subMenu: Menu) => void;
-    onClickingAccessUpgradePanel?: () => void;
-    onClickingPopupMenuItem?: (menu: Menu) => void;
-    popupMinHeight?: number;
-    isNewSidebar?: boolean;
-    onboardingPercentage?: number;
-    menuStyle?: React.CSSProperties;
-}
-export declare const BikSidebar: React.FC<BikSidebarProps>;
+import React from 'react';
+import { Menu } from './SimpleSidebar';
+export interface MenuItem {
+    key: string | number;
+    displayName: string;
+    icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    activeIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    hoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    isLastSticky?: boolean;
+    is2ndLastSticky?: boolean;
+    children?: Menu[];
+    showAccessUpgradePanel?: boolean;
+    path?: string;
+    layout?: 'fullScreen' | 'popup' | string | undefined;
+    isNew?: boolean;
+    isLocked?: boolean;
+}
+export interface BikSidebarProps {
+    logoSvg?: JSX.Element;
+    allMenuList: MenuItem[];
+    activeMainMenu: MenuItem;
+    activeSubMenu: Menu;
+    router: any;
+    onClickingMainMenu: (menu: MenuItem) => void;
+    onClickingSubMenu: (subMenu: Menu) => void;
+    onClickingAccessUpgradePanel?: () => void;
+    onClickingPopupMenuItem?: (menu: Menu) => void;
+    popupMinHeight?: number;
+    isNewSidebar?: boolean;
+    onboardingPercentage?: number;
+    menuStyle?: React.CSSProperties;
+}
+export declare const BikSidebar: React.FC<BikSidebarProps>;

package/dist/cjs/components/bik-layout/BikSidebar.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../assets/icons/Bik_logo.svg.js"),n=require("../../assets/icons/locked.svg.js"),t=require("react"),o=require("../progress-bar/CircularProgressBar.js"),s=require("../../constants/Theme.js"),l=require("../navigation-hyperlink/NavigationHyperlink.js"),a=require("./SidebarPopup.js"),d=require("./SidebarStyles.js"),r=require("./SimpleSidebar.js");const u=i=>{const{icon:n,isActive:t,activeStateIcon:o,hoverStateIcon:l,isHovered:a}=i,d=n,r=o,u=l;return e.jsx(e.Fragment,{children:t?e.jsx(r,{width:20,height:20}):a?e.jsx(u,{width:20,height:20,color:s.COLORS.surface.standard}):e.jsx(d,{width:20,height:20,color:s.COLORS.surface.standard})})},c=i=>{let{option:t,index:o,onClickMainMenuLogic:s,setHandleHoverForFullLayout:l,isDisabled:a,setHoveredComp:r,setPopupMenu:c,mainActiveMenu:v,hoveredComp:p,popupMenu:m}=i;var g,h,y,k,j,b;return e.jsx(d.SibeBarMenuItem,{children:e.jsxs("div",Object.assign({id:(null===(h=null===(g=t.displayName)||void 0===g?void 0:g.split(" "))||void 0===h?void 0:h.join(""))||t.key.toString(),className:"main--sidebar",onClick:()=>s(t),onMouseEnter:()=>{!a&&l(t)},onMouseOver:()=>{!a&&l(t)},onMouseLeave:()=>{var e;(null===(e=null==t?void 0:t.children)||void 0===e?void 0:e.length)||(r(void 0),c(void 0))},onFocus:()=>{},"aria-hidden":"true"},{children:[t.isNew&&e.jsx("div",Object.assign({className:"new-tag "+(t.isLastSticky?"tag-sticky":"")},{children:"NEW"})),t.isLocked&&e.jsx("div",Object.assign({className:`locked--channel ${t.isLastSticky?"tag-sticky":""}  ${t.is2ndLastSticky?"tag-sticky-2":""}`},{children:e.jsx(n.default,{height:16,width:16})})),e.jsxs("div",Object.assign({id:(null===(k=null===(y=t.displayName)||void 0===y?void 0:y.split(" "))||void 0===k?void 0:k.join(""))+"_sub"||t.key.toString()+"_sub",className:`sidebar-menu-item \n\t\t\t\t\t${(null==v?void 0:v.key)===t.key?"main-menu-active-class":""} \n\t\t\t\t\t${t.isLastSticky?"sticky-menu-int":""} \n\t\t\t\t\t${t.is2ndLastSticky?"sticky-menu":""} \n\t\t\t\t\t${t.key===(null==p?void 0:p.key)?"sidebar-menu-item-hover":""} \n\t\t\t\t\t${t.isNew?"new-menu-item":""}`},{children:[e.jsx(u,{icon:t.icon,isActive:t.key==(null==v?void 0:v.key),activeStateIcon:null!==(j=t.activeIcon)&&void 0!==j?j:{},hoverStateIcon:null!==(b=t.hoverIcon)&&void 0!==b?b:{},isHovered:t.key==(null==p?void 0:p.key)||t.key==(null==m?void 0:m.key)}),e.jsx("div",Object.assign({className:"menu-item-container"},{children:e.jsx("p",Object.assign({className:"menu-item-text "+((null==t?void 0:t.key)===(null==v?void 0:v.key)?"active-menu-item-text":"")},{children:t.displayName}))}))]}),o)]}),o)})};exports.BikSidebar=n=>{const{logoSvg:s,allMenuList:u,activeMainMenu:v,activeSubMenu:p,router:m,onClickingMainMenu:g,onClickingSubMenu:h,onClickingAccessUpgradePanel:y,onClickingPopupMenuItem:k,popupMinHeight:j,isNewSidebar:b,menuStyle:S}=n,[M,x]=t.useState(v),[w,C]=t.useState(),[f,L]=t.useState(p),[N,O]=t.useState(!1),[H,P]=t.useState(),[B,E]=t.useState(),[I,q]=t.useState(),[F,_]=t.useState(null),A=t.useMemo((()=>u.filter((e=>e.is2ndLastSticky||e.isLastSticky)).length),[u]);t.useEffect((()=>{x(v)}),[v]),t.useEffect((()=>{L(p)}),[p]);const $=t.useCallback((e=>{var i;"popup"!==(null==e?void 0:e.layout)&&(P(void 0),C(void 0),O(!0),x(e),e.path||g(e),(null===(i=null==e?void 0:e.children)||void 0===i?void 0:i.length)?L(null==e?void 0:e.children[0]):L({}),C(void 0),setTimeout((()=>{O(!1)}),1e3))}),[g]),R=t.useCallback((e=>{var i,n;if(W(),C(void 0),P(void 0),"popup"==(null==e?void 0:e.layout)){const i=U();i&&E(i),P(e)}else{const t=document.getElementById((null===(n=null===(i=e.displayName)||void 0===i?void 0:i.split(" "))||void 0===n?void 0:n.join(""))||e.key.toString());if(t){const e=D(t);q(e)}C(e),z()}}),[]),D=e=>{const i=e.getBoundingClientRect();let n=i.top;const t=e.querySelectorAll("div");let o=null;if(window.innerHeight<=768)return n;if(t.forEach((e=>{e.className.includes("sticky")&&(o=e)})),o){const e=window.innerHeight-i.bottom;n=i.top+e-200}return n};t.useEffect((()=>{const e=()=>{const e=U();e&&E(e),T()};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),[]);const T=()=>{const e=document.getElementById("_sub-menu"),i=null==e?void 0:e.getBoundingClientRect().height;i&&q(window.innerHeight-i)},U=()=>{var e,i;if(H){const n=(null===(i=null===(e=H.displayName)||void 0===e?void 0:e.split(" "))||void 0===i?void 0:i.join(""))+"_sub"||H.key.toString()+"_sub",t=document.getElementById(n);if(t){const e=t.getBoundingClientRect();let i=e.top;const n=null!=j?j:320;return e.bottom+n>window.innerHeight&&(i-=e.bottom+n-window.innerHeight),i}return null}},z=()=>{W();const e=setTimeout((()=>C(void 0)),1e4);_(e)},W=()=>{clearTimeout(F)};return e.jsxs(d.SideBarContainer,{children:[e.jsx("div",Object.assign({className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true"},{children:s||e.jsx(i.default,{})})),e.jsxs(d.MainSideBarMenuWrapper,Object.assign({style:S},{children:[null==u?void 0:u.map(((i,n)=>{var o,s;return e.jsxs(t.Fragment,{children:[i.path?e.jsx(l.NavigationHyperlink,Object.assign({href:i.path,router:m},{children:e.jsx(c,{option:i,index:n,onClickMainMenuLogic:$,setHandleHoverForFullLayout:R,isDisabled:N,setHoveredComp:C,setPopupMenu:P,mainActiveMenu:M,hoveredComp:w,popupMenu:H})})):e.jsx(c,{option:i,index:n,onClickMainMenuLogic:$,setHandleHoverForFullLayout:R,isDisabled:N,setHoveredComp:C,setPopupMenu:P,mainActiveMenu:M,hoveredComp:w,popupMenu:H}),e.jsxs(e.Fragment,{children:["popup"===i.layout&&(null===(o=null==H?void 0:H.children)||void 0===o?void 0:o.length)&&e.jsx(a.SidebarPopup,{top:null!=B?B:void 0,menuList:null==H?void 0:H.children,onClickingPopupMenu:e=>{k&&k(e),P(void 0)},onMouseLeaveOnMenu:()=>P(void 0)}),(null===(s=null==w?void 0:w.children)||void 0===s?void 0:s.length)&&e.jsx(r.SimpleSidebar,{menuList:null==w?void 0:w.children,activeMenu:f,onMouseEnterOnMenu:()=>W(),onMouseLeaveOnMenu:()=>{W(),C(void 0)},left:b?92:88,postion:"fixed",header:w.displayName,theme:"brand",router:m,showAccessUpgradePanel:w.showAccessUpgradePanel,onMenuClick:(e,i)=>{L(e),x(w),C(void 0),P(void 0),i&&h(e)},onUpgrade:y,top:b&&I||0,isNewSidebar:b})]})]},n)})),"number"==typeof n.onboardingPercentage&&e.jsx(d.SibeBarMenuItem,{children:e.jsx("div",Object.assign({className:"main--sidebar"},{children:e.jsx("div",Object.assign({id:"bik-onboarding__checklist",className:"sidebar-menu-item "+(0===A?"sticky-menu":1===A?"sticky-menu-int":"sticky-menu-three")},{children:e.jsx(o.default,{percentage:n.onboardingPercentage,width:48})}))}))})]}))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../assets/icons/Bik_logo.svg.js"),n=require("../../assets/icons/locked.svg.js"),t=require("react"),o=require("../progress-bar/CircularProgressBar.js"),s=require("../../constants/Theme.js"),l=require("../navigation-hyperlink/NavigationHyperlink.js"),d=require("./SidebarPopup.js"),r=require("./SidebarStyles.js"),a=require("./SimpleSidebar.js");const u=i=>{const{icon:n,isActive:t,activeStateIcon:o,hoverStateIcon:l,isHovered:d}=i,r=n,a=o,u=l;return e.jsx(e.Fragment,{children:t?e.jsx(a,{width:20,height:20}):d?e.jsx(u,{width:20,height:20,color:s.COLORS.surface.standard}):e.jsx(r,{width:20,height:20,color:s.COLORS.surface.standard})})},c=i=>{let{option:t,index:o,onClickMainMenuLogic:s,setHandleHoverForFullLayout:l,isDisabled:d,setHoveredComp:a,setPopupMenu:c,mainActiveMenu:v,hoveredComp:p,popupMenu:m}=i;var h,g,y,k,S,j;return e.jsx(r.SibeBarMenuItem,{children:e.jsxs("div",{id:(null===(g=null===(h=t.displayName)||void 0===h?void 0:h.split(" "))||void 0===g?void 0:g.join(""))||t.key.toString(),className:"main--sidebar",onClick:()=>s(t),onMouseEnter:()=>{!d&&l(t)},onMouseOver:()=>{!d&&l(t)},onMouseLeave:()=>{var e;(null===(e=null==t?void 0:t.children)||void 0===e?void 0:e.length)||(a(void 0),c(void 0))},onFocus:()=>{},"aria-hidden":"true",children:[t.isNew&&e.jsx("div",{className:"new-tag "+(t.isLastSticky?"tag-sticky":""),children:"NEW"}),t.isLocked&&e.jsx("div",{className:`locked--channel ${t.isLastSticky?"tag-sticky":""}  ${t.is2ndLastSticky?"tag-sticky-2":""}`,children:e.jsx(n.default,{height:16,width:16})}),e.jsxs("div",{id:(null===(k=null===(y=t.displayName)||void 0===y?void 0:y.split(" "))||void 0===k?void 0:k.join(""))+"_sub"||t.key.toString()+"_sub",className:`sidebar-menu-item \n\t\t\t\t\t${(null==v?void 0:v.key)===t.key?"main-menu-active-class":""} \n\t\t\t\t\t${t.isLastSticky?"sticky-menu-int":""} \n\t\t\t\t\t${t.is2ndLastSticky?"sticky-menu":""} \n\t\t\t\t\t${t.key===(null==p?void 0:p.key)?"sidebar-menu-item-hover":""} \n\t\t\t\t\t${t.isNew?"new-menu-item":""}`,children:[e.jsx(u,{icon:t.icon,isActive:t.key==(null==v?void 0:v.key),activeStateIcon:null!==(S=t.activeIcon)&&void 0!==S?S:{},hoverStateIcon:null!==(j=t.hoverIcon)&&void 0!==j?j:{},isHovered:t.key==(null==p?void 0:p.key)||t.key==(null==m?void 0:m.key)}),e.jsx("div",{className:"menu-item-container",children:e.jsx("p",{className:"menu-item-text "+((null==t?void 0:t.key)===(null==v?void 0:v.key)?"active-menu-item-text":""),children:t.displayName})})]},o)]},o)})};exports.BikSidebar=n=>{const{logoSvg:s,allMenuList:u,activeMainMenu:v,activeSubMenu:p,router:m,onClickingMainMenu:h,onClickingSubMenu:g,onClickingAccessUpgradePanel:y,onClickingPopupMenuItem:k,popupMinHeight:S,isNewSidebar:j,menuStyle:M}=n,[b,x]=t.useState(v),[w,C]=t.useState(),[f,L]=t.useState(p),[N,H]=t.useState(!1),[P,B]=t.useState(),[E,I]=t.useState(),[q,F]=t.useState(),[_,A]=t.useState(null),O=t.useMemo((()=>u.filter((e=>e.is2ndLastSticky||e.isLastSticky)).length),[u]);t.useEffect((()=>{x(v)}),[v]),t.useEffect((()=>{L(p)}),[p]);const $=t.useCallback((e=>{var i;"popup"!==(null==e?void 0:e.layout)&&(B(void 0),C(void 0),H(!0),x(e),e.path||h(e),(null===(i=null==e?void 0:e.children)||void 0===i?void 0:i.length)?L(null==e?void 0:e.children[0]):L({}),C(void 0),setTimeout((()=>{H(!1)}),1e3))}),[h]),R=t.useCallback((e=>{var i,n;if(W(),C(void 0),B(void 0),"popup"==(null==e?void 0:e.layout)){const i=U();i&&I(i),B(e)}else{const t=document.getElementById((null===(n=null===(i=e.displayName)||void 0===i?void 0:i.split(" "))||void 0===n?void 0:n.join(""))||e.key.toString());if(t){const e=D(t);F(e)}C(e),z()}}),[]),D=e=>{const i=e.getBoundingClientRect();let n=i.top;const t=e.querySelectorAll("div");let o=null;if(window.innerHeight<=768)return n;if(t.forEach((e=>{e.className.includes("sticky")&&(o=e)})),o){const e=window.innerHeight-i.bottom;n=i.top+e-200}return n};t.useEffect((()=>{const e=()=>{const e=U();e&&I(e),T()};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),[]);const T=()=>{const e=document.getElementById("_sub-menu"),i=null==e?void 0:e.getBoundingClientRect().height;i&&F(window.innerHeight-i)},U=()=>{var e,i;if(P){const n=(null===(i=null===(e=P.displayName)||void 0===e?void 0:e.split(" "))||void 0===i?void 0:i.join(""))+"_sub"||P.key.toString()+"_sub",t=document.getElementById(n);if(t){const e=t.getBoundingClientRect();let i=e.top;const n=null!=S?S:320;return e.bottom+n>window.innerHeight&&(i-=e.bottom+n-window.innerHeight),i}return null}},z=()=>{W();const e=setTimeout((()=>C(void 0)),1e4);A(e)},W=()=>{clearTimeout(_)};return e.jsxs(r.SideBarContainer,{children:[e.jsx("div",{className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true",children:s||e.jsx(i.default,{})}),e.jsxs(r.MainSideBarMenuWrapper,{style:M,children:[null==u?void 0:u.map(((i,n)=>{var o,s;return e.jsxs(t.Fragment,{children:[i.path?e.jsx(l.NavigationHyperlink,{href:i.path,router:m,children:e.jsx(c,{option:i,index:n,onClickMainMenuLogic:$,setHandleHoverForFullLayout:R,isDisabled:N,setHoveredComp:C,setPopupMenu:B,mainActiveMenu:b,hoveredComp:w,popupMenu:P})}):e.jsx(c,{option:i,index:n,onClickMainMenuLogic:$,setHandleHoverForFullLayout:R,isDisabled:N,setHoveredComp:C,setPopupMenu:B,mainActiveMenu:b,hoveredComp:w,popupMenu:P}),e.jsxs(e.Fragment,{children:["popup"===i.layout&&(null===(o=null==P?void 0:P.children)||void 0===o?void 0:o.length)&&e.jsx(d.SidebarPopup,{top:null!=E?E:void 0,menuList:null==P?void 0:P.children,onClickingPopupMenu:e=>{k&&k(e),B(void 0)},onMouseLeaveOnMenu:()=>B(void 0)}),(null===(s=null==w?void 0:w.children)||void 0===s?void 0:s.length)&&e.jsx(a.SimpleSidebar,{menuList:null==w?void 0:w.children,activeMenu:f,onMouseEnterOnMenu:()=>W(),onMouseLeaveOnMenu:()=>{W(),C(void 0)},left:j?92:88,postion:"fixed",header:w.displayName,theme:"brand",router:m,showAccessUpgradePanel:w.showAccessUpgradePanel,onMenuClick:(e,i)=>{L(e),x(w),C(void 0),B(void 0),i&&g(e)},onUpgrade:y,top:j&&q||0,isNewSidebar:j})]})]},n)})),"number"==typeof n.onboardingPercentage&&e.jsx(r.SibeBarMenuItem,{children:e.jsx("div",{className:"main--sidebar",children:e.jsx("div",{id:"bik-onboarding__checklist",className:"sidebar-menu-item "+(0===O?"sticky-menu":1===O?"sticky-menu-int":"sticky-menu-three"),children:e.jsx(o.default,{percentage:n.onboardingPercentage,width:48})})})})]})]})};