@bikdotai/bik-component-library 0.0.69 → 0.0.73-9.beta-0

package/dist/cjs/components/variable-picker-v3/model.d.ts

@@ -0,0 +1,62 @@
+export declare enum PickerType {
+    FLOATER = "floater",
+    EMBEDDED = "embedded"
+}
+export interface VariablePickerV3Props {
+    type: PickerType;
+    data: VariableListInterfaceV3[];
+    onSelect: (variable: VariableV3) => void;
+    width?: string;
+    onClose?: () => void;
+    showHeader?: boolean;
+    showBackButton?: boolean;
+    onBackButtonClick?: () => void;
+    onSearchBlur?: (e: any) => void;
+    isEvaluationList?: boolean;
+    hideHeaderCross?: boolean;
+    disabled?: boolean;
+    autoOpenFirst?: boolean;
+    headerText?: string;
+    contentHeight?: string;
+    onDefaultVariableSelect?: (variable: VariableV3) => void;
+    skipDefaultVariableContent?: boolean;
+}
+export interface VariableListInterfaceV3 {
+    isSubHeader?: boolean;
+    displayName: string;
+    description: string;
+    orderId?: number;
+    isAvailable?: boolean;
+    contextQ?: string[];
+    variables?: {
+        [key: string]: SubHeader | VariableV3;
+    };
+}
+export interface SubHeader {
+    isSubHeader: boolean;
+    isAvailable: boolean;
+    displayName: string;
+    description: string;
+    contextQ?: string[];
+    variables?: {
+        [key: string]: SubHeader | VariableV3;
+    };
+}
+export interface VariableV3 {
+    contextQ?: string[];
+    selected?: boolean;
+    description?: string;
+    defaultValue?: string;
+    displayName: string;
+    actualValue: string;
+    variableType: string;
+    isAvailable: boolean;
+    actualValueEval?: string;
+    isSubHeader?: boolean;
+    variables?: {
+        [key: string]: VariableV3;
+    };
+    needsFetching?: boolean;
+    isDefaultValueSupported?: boolean;
+    enableDefaultValueForGlobalUsage?: boolean;
+}

package/dist/cjs/components/variable-picker-v3/model.js

@@ -0,0 +1 @@
+"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.PickerType=void 0,(e=exports.PickerType||(exports.PickerType={})).FLOATER="floater",e.EMBEDDED="embedded";

package/dist/cjs/components/variable-picker-v3/recommendVaribles.d.ts

@@ -0,0 +1 @@
+export declare const showOnlyRecommendedVariables: (data: any, stack: any[]) => any;

package/dist/cjs/components/variable-picker-v3/recommendVaribles.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const e=e=>Object.keys(e).reduce(((s,a)=>(e[a]&&e[a].isAvailable&&(s[a]=e[a]),s)),{});exports.showOnlyRecommendedVariables=(s,a)=>s.map((s=>{if(s.isAvailable&&void 0===s.variables)return s;if(void 0===s.isAvailable&&void 0!==s.variables){const a=e(s.variables);return 0===Object.keys(a).length?{}:Object.assign(Object.assign({},s),{variables:a})}if(void 0===s.variables){return e(s)}{const i=e(s.variables);return a.length?i:0===Object.keys(i).length?{}:Object.assign(Object.assign({},s),{variables:i})}})).filter((e=>Object.keys(e).length>0));

package/dist/cjs/components/variable-picker-v3/searchVariables.d.ts

@@ -0,0 +1,2 @@
+import { VariableListInterfaceV3 } from './model';
+export declare const searchVariables: (text: string, data: VariableListInterfaceV3[], subHeaderStack: any[]) => any[];

package/dist/cjs/components/variable-picker-v3/searchVariables.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const e=function(a,s,t){let i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[];Object.keys(s).forEach((l=>{s[l].displayName.toLowerCase().includes(a.toLowerCase())&&(void 0!==s[l].variables&&0===Object.keys(s[l].variables).length&&delete s[l].variables,t.push(s[l].isSubHeader?{[l]:Object.assign(Object.assign({},s[l]),{contextQ:i})}:Object.assign(Object.assign({},s[l]),{contextQ:i}))),s[l].variables&&Object.keys(s[l].variables).length&&e(a,s[l].variables,t,[...i,s[l].displayName])}))};exports.searchVariables=(a,s,t)=>{if(!a)return t.length>0?[t[t.length-1].variables]:s;const i=[];return s.forEach((s=>{if(t.length>0)if(s.displayName&&void 0!==s.variables)e(a,s.variables,i,[...s.contextQ||[],s.displayName]);else{if(s.displayName.toLowerCase().includes(a.toLowerCase())&&i.push(s),!s.variables||!Object.keys(s.variables).length)return;e(a,s.variables,i,[...s.contextQ||[],s.displayName])}else{if(s.displayName.toLowerCase().includes(a.toLowerCase())&&i.push(s),!s.variables||!Object.keys(s.variables).length)return;e(a,s.variables,i,[s.displayName])}})),i};

package/dist/cjs/components/variable-picker-v3/styles.d.ts

@@ -0,0 +1,8 @@
+export declare const HeaderWrapper: import("styled-components").StyledComponent<"div", any, {
+    openDefault?: boolean | undefined;
+}, never>;
+export declare const RecommendWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const BackHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Container: import("styled-components").StyledComponent<"div", any, {
+    height: string;
+}, never>;

package/dist/cjs/components/variable-picker-v3/styles.js

@@ -0,0 +1,42 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const i=o.default.div`
+	display: flex;
+	align-items: center;
+	padding: ${e=>e.openDefault?"12px 16px":"12px 16px 0px 16px"};
+	background-color: ${t.COLORS.surface.subdued};
+	justify-content: space-between;
+	border-top-right-radius: 8px;
+	border-top-left-radius: 8px;
+`,a=o.default.div`
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 12px 16px;
+	background-color: ${t.COLORS.surface.subdued};
+	border-bottom: 1px solid ${t.COLORS.stroke.primary};
+`,p=o.default.div`
+	position: relative;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	height: 32px;
+	background-color: ${t.COLORS.background.base};
+`,d=o.default.div`
+	margin: 8px;
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+	height: ${e=>e.height};
+	overflow: scroll;
+	&::-webkit-scrollbar-thumb {
+		background-color: #e0e0e0 !important;
+		border-radius: 8px;
+	}
+	&::-webkit-scrollbar {
+		height: 5px;
+		display: block;
+		width: 8px;
+	}
+	&::-webkit-scrollbar-thumb:horizontal {
+		width: 8px;
+	}
+`;exports.BackHeader=p,exports.Container=d,exports.HeaderWrapper=i,exports.RecommendWrapper=a;

package/dist/cjs/components/whats-new/WhatsNew.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { WhatsNewContent } from './WhatsNew.types';
+interface WhatsNewProps {
+    title?: string;
+    tooltip?: string;
+    searchPlaceholder?: string;
+    emptyStateTitle?: string;
+    emptyStateDescription?: string;
+    noResultsText?: string;
+    width?: string;
+    onContentClick?: (content: WhatsNewContent) => void;
+    renderCustomContent?: (content: WhatsNewContent) => React.ReactNode;
+    buttonTestId?: string;
+    iconWidth?: number;
+    iconHeight?: number;
+    customIcon?: React.ComponentType<{
+        width?: number;
+        height?: number;
+        color?: string;
+    }>;
+}
+export declare const WhatsNew: React.FC<WhatsNewProps>;
+export {};

package/dist/cjs/components/whats-new/WhatsNew.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("./WhatsNewButton.js"),o=require("./WhatsNewPanel.js"),s=require("./WhatsNewProvider.js");exports.WhatsNew=r=>{let{title:i="What's new",tooltip:a="What's new",searchPlaceholder:u="Search posts",emptyStateTitle:c="Nothing new!",emptyStateDescription:h="There are no new updates or features at the moment. Check back soon!",noResultsText:l="Sorry, no results found.",width:d="480px",onContentClick:w,renderCustomContent:C,buttonTestId:p="whats-new-button",iconWidth:m=32,iconHeight:W=32,customIcon:x}=r;const[N,j]=t.useState(!1),{whatsNewContent:g,isLoading:S,newContentCount:y}=s.useWhatsNewContext();return e.jsxs(e.Fragment,{children:[e.jsx(n.WhatsNewButton,{onClick:()=>j(!0),newContentCount:y,isOpen:N,isLoading:S,tooltip:a,testId:p,iconWidth:m,iconHeight:W,customIcon:x}),e.jsx(o.WhatsNewPanel,{isOpen:N,onClose:()=>j(!1),content:g,isLoading:S,title:i,searchPlaceholder:u,emptyStateTitle:c,emptyStateDescription:h,noResultsText:l,width:d,onContentClick:e=>{w&&w(e)},renderCustomContent:C})]})};

package/dist/cjs/components/whats-new/WhatsNew.styles.d.ts

@@ -0,0 +1,11 @@
+export declare const WhatsNewIconContainer: import("styled-components").StyledComponent<"div", any, {
+    count?: number | undefined;
+}, never>;
+export declare const WhatsNewWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const MainContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const MainCardContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const BackgroundImageContainer: import("styled-components").StyledComponent<"div", any, {
+    imageUrl: string;
+    height?: string | undefined;
+    width?: string | undefined;
+}, never>;

package/dist/cjs/components/whats-new/WhatsNew.styles.js

@@ -0,0 +1,185 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e);const r=n.default.div`
+	cursor: pointer;
+	position: relative;
+
+	.main-icon-class {
+		padding: 6px;
+		border-radius: 32px;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		transition: background-color 0.2s ease;
+	}
+
+	.icon-active {
+		background: ${t.COLORS.background.brandLight};
+	}
+
+	.main-icon-class:hover {
+		background: ${t.COLORS.background.base};
+	}
+
+	.notification--count {
+		box-sizing: border-box;
+		position: absolute;
+		right: 6px;
+		top: 4px;
+		border-radius: 50%;
+		width: 14px;
+		height: 14px;
+		background: ${t.COLORS.background.negative.vibrant};
+		border: 1.25px solid ${t.COLORS.surface.standard};
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.count--text {
+		font-size: 8px;
+		line-height: 7.2px;
+		font-weight: 400;
+		color: ${t.COLORS.surface.standard};
+	}
+`,a=n.default.div`
+	overflow-y: auto;
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	max-height: calc(100vh - 60px);
+
+	&::-webkit-scrollbar {
+		display: block;
+		width: 6px;
+	}
+
+	::-webkit-scrollbar-thumb {
+		background: ${t.COLORS.content.inactive};
+		border-radius: 3px;
+		min-height: 30px;
+	}
+
+	.icon--wrapper {
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		width: 64px;
+		height: 64px;
+		border-radius: 50%;
+		background: ${t.COLORS.background.base};
+		margin-bottom: 16px;
+	}
+
+	.no--data--found {
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		height: 300px;
+		text-align: center;
+		padding: 24px;
+	}
+
+	.text--align {
+		text-align: center;
+	}
+
+	.scroller {
+		display: flex;
+		flex-direction: column;
+		gap: 16px;
+		padding: 16px 0;
+	}
+
+	.full--width {
+		width: 100%;
+	}
+
+	.flex {
+		display: flex;
+	}
+
+	.flex--row {
+		flex-direction: row;
+	}
+
+	.flex--column {
+		flex-direction: column;
+	}
+
+	.mt-8 {
+		margin-top: 8px;
+	}
+
+	.mt-20 {
+		margin-top: 20px;
+	}
+
+	.mt--8 {
+		margin-top: 8px;
+	}
+
+	.mt--12 {
+		margin-top: 12px;
+	}
+
+	.mb-mt-8 {
+		margin-bottom: 8px;
+		margin-top: 8px;
+	}
+
+	.padding--16 {
+		padding: 16px;
+	}
+
+	.card--desc {
+		max-height: 200px;
+		overflow-y: auto;
+		font-size: 12px;
+		color: ${t.COLORS.content.secondary};
+
+		p {
+			margin-bottom: 0px;
+		}
+	}
+
+	.created--at {
+		align-items: center;
+		gap: 4px;
+	}
+
+	.new--content--tag {
+		padding: 2px 6px;
+		gap: 4px;
+		border-radius: 14px;
+		background: ${t.COLORS.background.warning.vibrant};
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		margin-right: 8px;
+	}
+`,o=n.default.div`
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+`,d=n.default.div`
+	background: ${t.COLORS.surface.standard};
+	border-radius: 8px;
+	border: 1px solid ${t.COLORS.stroke.primary};
+	padding: 16px;
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+	transition: all 0.2s ease;
+
+	&:hover {
+		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+	}
+`,p=n.default.div`
+	background-image: url(${e=>e.imageUrl});
+	background-size: cover;
+	background-position: center;
+	background-repeat: no-repeat;
+	height: ${e=>e.height||"200px"};
+	width: ${e=>e.width||"100%"};
+	border-radius: 4px;
+`;exports.BackgroundImageContainer=p,exports.MainCardContainer=d,exports.MainContainer=o,exports.WhatsNewIconContainer=r,exports.WhatsNewWrapper=a;

package/dist/cjs/components/whats-new/WhatsNew.types.d.ts

@@ -0,0 +1,58 @@
+/// <reference types="react" />
+export interface WhatsNewContent {
+    id: string;
+    title: string;
+    body: string;
+    content: string;
+    image: string;
+    buttonText: string;
+    redirectUrl: string;
+    productVideo?: string;
+    docId?: string;
+    createdAt: any;
+    module: string[];
+    visibility: boolean;
+}
+export interface WhatsNewProviderProps {
+    children: React.ReactNode;
+    fetchWhatsNewContent: () => Promise<[Error | null, WhatsNewContent[] | null]>;
+    markContentAsViewed?: (contentId: string) => Promise<void>;
+    module?: string;
+    isLoading?: boolean;
+}
+export interface WhatsNewButtonProps {
+    onClick?: () => void;
+    newContentCount?: number;
+    isOpen?: boolean;
+    isLoading?: boolean;
+    tooltip?: string;
+    testId?: string;
+    iconWidth?: number;
+    iconHeight?: number;
+    customIcon?: React.ComponentType<{
+        width?: number;
+        height?: number;
+        color?: string;
+    }>;
+}
+export interface WhatsNewPanelProps {
+    isOpen: boolean;
+    onClose: () => void;
+    content: WhatsNewContent[];
+    isLoading?: boolean;
+    title?: string;
+    searchPlaceholder?: string;
+    emptyStateTitle?: string;
+    emptyStateDescription?: string;
+    noResultsText?: string;
+    width?: string;
+    onContentClick?: (content: WhatsNewContent) => void;
+    renderCustomContent?: (content: WhatsNewContent) => React.ReactNode;
+}
+export interface WhatsNewHookReturn {
+    whatsNewContent: WhatsNewContent[];
+    isLoading: boolean;
+    newContentCount: number;
+    markAsViewed: (contentId: string) => Promise<void>;
+    refreshContent: () => Promise<void>;
+}

package/dist/cjs/components/whats-new/WhatsNewButton.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { WhatsNewButtonProps } from './WhatsNew.types';
+export declare const WhatsNewButton: React.FC<WhatsNewButtonProps>;

package/dist/cjs/components/whats-new/WhatsNewButton.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/whatsNew.svg.js"),s=require("../../constants/Theme.js"),i=require("../tooltips/Tooltip.js"),n=require("./WhatsNew.styles.js");exports.WhatsNewButton=o=>{let{onClick:r,newContentCount:a=0,isOpen:c=!1,isLoading:d=!1,tooltip:l="What's new",testId:h="whats-new-button",iconWidth:j=32,iconHeight:u=32,customIcon:x}=o;return d?t.jsxs("div",Object.assign({style:{margin:"0px 8px"}},{children:[t.jsx("div",{style:{width:16,height:16,border:"2px solid #f3f3f3",borderTop:"2px solid #731DCF",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t.jsx("style",{children:"\n\t\t\t\t\t\t@keyframes spin {\n\t\t\t\t\t\t\t0% { transform: rotate(0deg); }\n\t\t\t\t\t\t\t100% { transform: rotate(360deg); }\n\t\t\t\t\t\t}\n\t\t\t\t\t"})]})):t.jsx(n.WhatsNewIconContainer,Object.assign({count:a},{children:t.jsxs("div",Object.assign({className:"main-icon-class "+(c?"icon-active":""),style:{color:c?s.COLORS.content.brand:s.COLORS.content.primary},onClick:r,"data-testid":h},{children:[t.jsx(i.Tooltip,Object.assign({body:l},{children:t.jsx("div",{children:x?t.jsx(x,{width:j,height:u,color:c?s.COLORS.content.brand:s.COLORS.content.primary}):t.jsx(e.default,{width:j,height:u})})})),a>0&&t.jsx("div",Object.assign({className:"notification--count"},{children:t.jsx("div",Object.assign({className:"count--text"},{children:a}))}))]}))}))};

package/dist/cjs/components/whats-new/WhatsNewPanel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { WhatsNewPanelProps } from './WhatsNew.types';
+export declare const WhatsNewPanel: React.FC<WhatsNewPanelProps>;

package/dist/cjs/components/whats-new/WhatsNewPanel.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("date-fns"),s=require("react"),a=require("../../assets/icons/searchIcon.svg.js"),r=require("../../assets/icons/whatsNew.svg.js"),n=require("../../constants/Theme.js"),i=require("../button/Button.js"),o=require("../feature-announcements/VideoModal.js"),c=require("../searchBar/searchBar.js"),d=require("../side-modal/SideModal.js"),l=require("../TypographyStyle.js"),h=require("./WhatsNew.styles.js");exports.WhatsNewPanel=u=>{let{isOpen:j,onClose:m,content:x,isLoading:g=!1,title:w="What's new on BIK",searchPlaceholder:b="Search posts",emptyStateTitle:p="Nothing new!",emptyStateDescription:C="There are no new updates or features at the moment. Check back soon!",noResultsText:O="Sorry, no results found.",width:y="480px",onContentClick:f,renderCustomContent:N}=u;const[S,v]=s.useState(""),[M,q]=s.useState(!1),[L,T]=s.useState(""),k=e=>{if(!e.createdAt)return!1;const s=e.createdAt.toDate?e.createdAt.toDate():new Date(e.createdAt);return t.differenceInBusinessDays(new Date,s)<7},B=s.useMemo((()=>{if(!S.trim())return x;const e=S.toLowerCase();return x.filter((t=>t.title.toLowerCase().includes(e)||t.body.toLowerCase().includes(e)||t.content&&t.content.toLowerCase().includes(e)))}),[x,S]),D=0===x.length,A=0===B.length;return j?e.jsxs(d.SideModal,Object.assign({width:y,onClose:m,header:"",headerCustomComponent:e.jsx(l.TitleMedium,Object.assign({color:n.COLORS.background.inverse},{children:w})),headerStyle:{background:n.COLORS.background.brandLight},hideFooter:!0},{children:[e.jsxs(h.MainContainer,{children:[e.jsx("div",Object.assign({className:"mt-8"},{children:e.jsx(c.SearchBar,{width:"100%",isEnabled:!D,onChange:e=>{v(e)},onEnter:e=>{v(e)},placeholder:b,variant:"default",searchValue:S,onClickCross:()=>{v("")}})})),e.jsx(h.WhatsNewWrapper,{children:D||A?e.jsxs("div",Object.assign({className:"no--data--found"},{children:[e.jsx("div",Object.assign({className:"icon--wrapper"},{children:D?e.jsx(r.default,{width:32,height:32}):e.jsx(a.default,{width:32,height:32})})),D?e.jsxs(e.Fragment,{children:[e.jsx(l.TitleRegular,{children:p}),e.jsx(l.BodyPrimary,Object.assign({color:n.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:C}))]}):A?e.jsx(l.BodyPrimary,Object.assign({color:n.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:O})):null]})):e.jsx("div",Object.assign({className:"scroller"},{children:B.map(((s,a)=>N?N(s):e.jsxs(h.MainCardContainer,Object.assign({className:"padding--16 mb-mt-8"},{children:[e.jsx(h.BackgroundImageContainer,{imageUrl:s.image,height:"209px",width:"100%",style:{borderRadius:"4px"}}),e.jsx("div",Object.assign({className:"mt-20 full--width"},{children:e.jsxs("div",Object.assign({className:"created--at flex flex--row"},{children:[k(s)?e.jsx("div",Object.assign({className:"new--content--tag"},{children:e.jsx(l.Caption,{children:"New"})})):e.jsx(e.Fragment,{}),e.jsx(l.Caption,Object.assign({style:{color:n.COLORS.content.placeholder}},{children:s.createdAt?t.format(s.createdAt.toDate?s.createdAt.toDate():new Date(s.createdAt),"dd MMMM yyyy"):""}))]}))})),e.jsx("div",Object.assign({className:"mt--8"},{children:e.jsx(l.TitleSmall,{children:s.title})})),e.jsx("div",{dangerouslySetInnerHTML:{__html:s.body},className:"card--desc mt--12"}),e.jsx("div",Object.assign({className:"flex flex--row mt-20 full--width"},{children:e.jsx(i.Button,{buttonText:s.buttonText||"Explore the feature",onClick:()=>(e=>{e.productVideo?(T(e.productVideo),q(!0)):e.redirectUrl&&window.open(e.redirectUrl,"_blank"),f&&f(e)})(s),matchParentWidth:!0,size:"medium"})}))]}),`whats-new-${a}`)))}))})]}),e.jsx(o.VideoModal,{isOpen:M,videoUrl:L,onClose:()=>{q(!1)}})]})):e.jsx(e.Fragment,{})};

package/dist/cjs/components/whats-new/WhatsNewProvider.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { WhatsNewProviderProps } from './WhatsNew.types';
+export declare const WhatsNewProvider: React.FC<WhatsNewProviderProps>;
+export declare const useWhatsNewContext: () => import("./WhatsNew.types").WhatsNewHookReturn;

package/dist/cjs/components/whats-new/WhatsNewProvider.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("./useWhatsNew.js");const s=t.createContext(null);exports.WhatsNewProvider=t=>{let{children:n,fetchWhatsNewContent:o,markContentAsViewed:u,module:a}=t;const i=r.useWhatsNew({fetchWhatsNewContent:o,markContentAsViewed:u,module:a});return e.jsx(s.Provider,Object.assign({value:i},{children:n}))},exports.useWhatsNewContext=()=>{const e=t.useContext(s);if(!e)throw new Error("useWhatsNewContext must be used within a WhatsNewProvider");return e};

package/dist/cjs/components/whats-new/index.d.ts

@@ -0,0 +1,7 @@
+export * from './WhatsNew.types';
+export * from './WhatsNew.styles';
+export * from './WhatsNewButton';
+export * from './WhatsNewPanel';
+export * from './WhatsNewProvider';
+export * from './WhatsNew';
+export * from './useWhatsNew';

package/dist/cjs/components/whats-new/useWhatsNew.d.ts

@@ -0,0 +1,9 @@
+import { WhatsNewContent, WhatsNewHookReturn } from './WhatsNew.types';
+interface UseWhatsNewProps {
+    fetchWhatsNewContent: () => Promise<[Error | null, WhatsNewContent[] | null]>;
+    markContentAsViewed?: (contentId: string) => Promise<void>;
+    module?: string;
+    newContentThresholdDays?: number;
+}
+export declare const useWhatsNew: ({ fetchWhatsNewContent, markContentAsViewed, module, newContentThresholdDays, }: UseWhatsNewProps) => WhatsNewHookReturn;
+export {};

package/dist/cjs/components/whats-new/useWhatsNew.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("date-fns"),r=require("react");exports.useWhatsNew=a=>{let{fetchWhatsNewContent:n,markContentAsViewed:o,module:c,newContentThresholdDays:s=7}=a;const[i,d]=r.useState([]),[u,l]=r.useState(!0),f=r.useRef(n),w=r.useRef(o);r.useEffect((()=>{f.current=n}),[n]),r.useEffect((()=>{w.current=o}),[o]);const v=r.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){l(!0);try{const[e,t]=yield f.current();if(e)console.error("Failed to fetch what's new content:",e),d([]);else if(t){let e=t;c&&(e=t.filter((e=>Array.isArray(e.module)?e.module.includes(c):e.module===c))),e.sort(((e,t)=>{var r,a;const n=(null===(r=e.createdAt)||void 0===r?void 0:r.toDate)?e.createdAt.toDate():new Date(e.createdAt);return((null===(a=t.createdAt)||void 0===a?void 0:a.toDate)?t.createdAt.toDate():new Date(t.createdAt)).getTime()-n.getTime()})),d(e)}else d([])}catch(e){console.error("Failed to fetch what's new content:",e),d([])}finally{l(!1)}}))),[c]);r.useEffect((()=>{v()}),[v]);const A=r.useCallback((e=>{if(!e.createdAt)return!1;const r=e.createdAt.toDate?e.createdAt.toDate():new Date(e.createdAt);return t.differenceInBusinessDays(new Date,r)<s}),[s]),h=i.reduce(((e,t)=>A(t)?e+1:e),0);return{whatsNewContent:i,isLoading:u,newContentCount:h,markAsViewed:r.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){if(w.current)try{yield w.current(t)}catch(e){console.warn("Failed to mark content as viewed:",e)}}))),[]),refreshContent:r.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){yield v()}))),[v])}};

package/dist/cjs/components/zeroState/ZeroState.d.ts

@@ -1,7 +1,13 @@
 import React from 'react';
+import { ButtonProps } from '../button/model';
 export declare const ZeroState: React.FC<{
+    isLoading?: boolean;
     title: string;
     subTitle?: string;
     IconHolderStyle?: React.CSSProperties;
     style?: React.CSSProperties /** now this component is extendable through styled-component */;
+    actionButton?: ButtonProps;
+    buttonWidth?: number;
+    Icon?: React.ReactNode;
+    containerWidth?: string;
 }>;

package/dist/cjs/components/zeroState/ZeroState.js

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),r=require("../TypographyStyle.js"),n=require("../../constants/Theme.js"),s=require("../../assets/icons/alert.svg.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=l(t);const o=i.default.div`
-	background: ${n.COLORS.surface.standard};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("styled-components"),i=require("../spinner/Spinner.js"),r=require("../TypographyStyle.js"),s=require("../../constants/Theme.js"),l=require("../../assets/icons/alert.svg.js"),o=require("../button/Button.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(n);const d=c.default.div`
+	background: ${s.COLORS.surface.standard};
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
 	flex: 1;
-`,c=i.default.div`
-	background: ${n.COLORS.background.base};
+`,u=c.default.div`
+	background: ${s.COLORS.background.base};
 	width: 48px;
 	height: 48px;
 	display: flex;
@@ -14,4 +14,4 @@
 	align-items: center;
 	justify-content: center;
 	border-radius: 24px;
-`;exports.ZeroState=t=>{let{subTitle:l,title:i,IconHolderStyle:a,style:u}=t;return e.jsxs(o,Object.assign({style:null!=u?u:{}},{children:[e.jsx(c,Object.assign({style:null!=a?a:{}},{children:e.jsx(s.default,{color:n.COLORS.content.placeholder,height:24,width:24})})),e.jsx(r.TitleRegular,Object.assign({style:{marginTop:8,color:n.COLORS.content.primary}},{children:null!=i?i:"No results found"})),!!l&&e.jsx(r.BodyCaption,Object.assign({style:{marginTop:4,color:n.COLORS.content.secondary}},{children:l}))]}))};
+`;exports.ZeroState=n=>{var{subTitle:a,title:c,IconHolderStyle:j,style:g,isLoading:y,containerWidth:p}=n,x=e.__rest(n,["subTitle","title","IconHolderStyle","style","isLoading","containerWidth"]);let b=r.TitleRegular;const h=p?parseFloat(p):0;return h&&!isNaN(h)&&h<=150&&(b=r.TitleSmall),t.jsxs(d,Object.assign({style:null!=g?g:{}},{children:[y?t.jsx(i.Spinner,{size:"large",color:s.COLORS.stroke.brand}):t.jsx(u,Object.assign({style:null!=j?j:{}},{children:(null==x?void 0:x.Icon)||t.jsx(l.default,{color:s.COLORS.content.placeholder,height:24,width:24})})),t.jsx(b,Object.assign({style:{marginTop:8,color:s.COLORS.content.primary}},{children:y?"Loading...":c||"No results found"})),!!a&&!y&&t.jsx(r.BodyCaption,Object.assign({style:{marginTop:4,color:s.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:a})),!!(null==x?void 0:x.actionButton)&&t.jsx("div",Object.assign({style:(null==x?void 0:x.buttonWidth)?{width:null==x?void 0:x.buttonWidth,display:"flex"}:{}},{children:t.jsx(o.Button,Object.assign({},null==x?void 0:x.actionButton))}))]}))};

package/dist/cjs/constants/Theme.d.ts

@@ -4,6 +4,7 @@ export declare const BASE_COLORS: {
         800: string;
         500: string;
         50: string;
+        10: string;
     };
     grayscale: {
         900: string;
@@ -12,6 +13,7 @@ export declare const BASE_COLORS: {
         400: string;
         200: string;
         100: string;
+        70: string;
         50: string;
         white: string;
         alpha: string;
@@ -34,6 +36,11 @@ export declare const BASE_COLORS: {
         100: string;
         50: string;
     };
+    bikAi: {
+        500: string;
+        100: string;
+        50: string;
+    };
 };
 export declare const COLORS: {
     background: {
@@ -43,6 +50,7 @@ export declare const COLORS: {
         inverseLight: string;
         brand: string;
         brandLight: string;
+        brandVeryLight: string;
         negative: {
             vibrant: string;
             light: string;
@@ -69,6 +77,9 @@ export declare const COLORS: {
         standard: string;
         subdued: string;
         hovered: string;
+        grey: string;
+        ai: string;
+        aiLight: string;
     };
     content: {
         primary: string;
@@ -82,6 +93,7 @@ export declare const COLORS: {
         warning: string;
         positive: string;
         blue: string;
+        ai: string;
     };
     stroke: {
         primary: string;
@@ -92,14 +104,20 @@ export declare const COLORS: {
         };
         warning: {
             lightAlt: string;
+            vibrant: string;
         };
         positive: {
             lightAlt: string;
+            vibrant: string;
         };
         brandLightAlt: string;
         blue: {
             lightAlt: string;
         };
+        ai: {
+            lightAlt: string;
+            vibrant: string;
+        };
     };
     special: {
         whatsapp: {
@@ -321,6 +339,7 @@ export declare const DEFAULT_THEME: {
             inverseLight: string;
             brand: string;
             brandLight: string;
+            brandVeryLight: string;
             negative: {
                 vibrant: string;
                 light: string;
@@ -347,6 +366,9 @@ export declare const DEFAULT_THEME: {
             standard: string;
             subdued: string;
             hovered: string;
+            grey: string;
+            ai: string;
+            aiLight: string;
         };
         content: {
             primary: string;
@@ -360,6 +382,7 @@ export declare const DEFAULT_THEME: {
             warning: string;
             positive: string;
             blue: string;
+            ai: string;
         };
         stroke: {
             primary: string;
@@ -370,14 +393,20 @@ export declare const DEFAULT_THEME: {
             };
             warning: {
                 lightAlt: string;
+                vibrant: string;
             };
             positive: {
                 lightAlt: string;
+                vibrant: string;
             };
             brandLightAlt: string;
             blue: {
                 lightAlt: string;
             };
+            ai: {
+                lightAlt: string;
+                vibrant: string;
+            };
         };
         special: {
             whatsapp: {