@bikdotai/bik-component-library 0.0.736-beta.7 → 0.0.736-beta.9

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

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/whatsNew.svg.js"),i=require("../../constants/Theme.js"),s=require("../tooltips/Tooltip.js"),n=require("./WhatsNew.styles.js");exports.WhatsNewButton=({onClick:o,newContentCount:r=0,isOpen:a=!1,isLoading:c=!1,tooltip:d="What's new",testId:l="whats-new-button",iconWidth:h=32,iconHeight:x=32,customIcon:u})=>c?t.jsxs("div",{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,{count:r,children:t.jsxs("div",{className:"main-icon-class "+(a?"icon-active":""),style:{color:a?i.COLORS.content.brand:i.COLORS.content.primary},onClick:o,"data-testid":l,children:[t.jsx(s.Tooltip,{body:d,children:t.jsx("div",{children:u?t.jsx(u,{width:h,height:x,color:a?i.COLORS.content.brand:i.COLORS.content.primary}):t.jsx(e.default,{width:h,height:x})})}),r>0&&t.jsx("div",{className:"notification--count",children:t.jsx("div",{className:"count--text",children:r})})]})});
+"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

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

@@ -1 +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=({children:t,fetchWhatsNewContent:n,markContentAsViewed:o,module:u})=>{const a=r.useWhatsNew({fetchWhatsNewContent:n,markContentAsViewed:o,module:u});return e.jsx(s.Provider,{value:a,children:t})},exports.useWhatsNewContext=()=>{const e=t.useContext(s);if(!e)throw new Error("useWhatsNewContext must be used within a WhatsNewProvider");return e};
+"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

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

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