@bikdotai/bik-component-library 0.0.833 → 0.0.834

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

@@ -21,24 +21,26 @@ const o = i.div`
 		background: ${e.background.base};
 	}
 
+	/* diameter is set inline per digit-count so it is always a perfect circle */
 	.notification--count {
 		box-sizing: border-box;
 		position: absolute;
-		right: 6px;
-		top: 4px;
+		top: -2px;
+		right: -2px;
+		/* display-only: let clicks fall through to the IconButton underneath */
+		pointer-events: none;
 		border-radius: 50%;
-		width: 14px;
-		height: 14px;
 		background: ${e.background.negative.vibrant};
-		border: 1.25px solid ${e.surface.standard};
+		border: 1px solid ${e.surface.standard};
 		display: flex;
 		justify-content: center;
 		align-items: center;
 	}
 
 	.count--text {
+		font-family: 'Inter';
 		font-size: 8px;
-		line-height: 7.2px;
+		line-height: 8px;
 		font-weight: 400;
 		color: ${e.surface.standard};
 	}

package/dist/esm/components/whats-new/WhatsNew.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"WhatsNew.styles.js","sources":["../../../../src/components/whats-new/WhatsNew.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../../constants/Theme';\n\nexport const WhatsNewIconContainer = styled.div<{ count?: number }>`\n\tcursor: pointer;\n\tposition: relative;\n\n\t.main-icon-class {\n\t\tpadding: 6px;\n\t\tborder-radius: 32px;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\ttransition: background-color 0.2s ease;\n\t}\n\n\t.icon-active {\n\t\tbackground: ${COLORS.background.brandLight};\n\t}\n\n\t.main-icon-class:hover {\n\t\tbackground: ${COLORS.background.base};\n\t}\n\n\t.notification--count {\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\tright: 6px;\n\t\ttop: 4px;\n\t\tborder-radius: 50%;\n\t\twidth: 14px;\n\t\theight: 14px;\n\t\tbackground: ${COLORS.background.negative.vibrant};\n\t\tborder: 1.25px solid ${COLORS.surface.standard};\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.count--text {\n\t\tfont-size: 8px;\n\t\tline-height: 7.2px;\n\t\tfont-weight: 400;\n\t\tcolor: ${COLORS.surface.standard};\n\t}\n`;\n\nexport const WhatsNewWrapper = styled.div`\n\toverflow-y: auto;\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\tmax-height: calc(100vh - 60px);\n\n\t&::-webkit-scrollbar {\n\t\tdisplay: block;\n\t\twidth: 6px;\n\t}\n\n\t::-webkit-scrollbar-thumb {\n\t\tbackground: ${COLORS.content.inactive};\n\t\tborder-radius: 3px;\n\t\tmin-height: 30px;\n\t}\n\n\t.icon--wrapper {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tborder-radius: 50%;\n\t\tbackground: ${COLORS.background.base};\n\t\tmargin-bottom: 16px;\n\t}\n\n\t.no--data--found {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\theight: 300px;\n\t\ttext-align: center;\n\t\tpadding: 24px;\n\t}\n\n\t.text--align {\n\t\ttext-align: center;\n\t}\n\n\t.scroller {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 16px;\n\t\tpadding: 16px 0;\n\t}\n\n\t.full--width {\n\t\twidth: 100%;\n\t}\n\n\t.flex {\n\t\tdisplay: flex;\n\t}\n\n\t.flex--row {\n\t\tflex-direction: row;\n\t}\n\n\t.flex--column {\n\t\tflex-direction: column;\n\t}\n\n\t.mt-8 {\n\t\tmargin-top: 8px;\n\t}\n\n\t.mt-20 {\n\t\tmargin-top: 20px;\n\t}\n\n\t.mt--8 {\n\t\tmargin-top: 8px;\n\t}\n\n\t.mt--12 {\n\t\tmargin-top: 12px;\n\t}\n\n\t.mb-mt-8 {\n\t\tmargin-bottom: 8px;\n\t\tmargin-top: 8px;\n\t}\n\n\t.padding--16 {\n\t\tpadding: 16px;\n\t}\n\n\t.card--desc {\n\t\tmax-height: 200px;\n\t\toverflow-y: auto;\n\t\tfont-size: 12px;\n\t\tcolor: ${COLORS.content.secondary};\n\n\t\tp {\n\t\t\tmargin-bottom: 0px;\n\t\t}\n\t}\n\n\t.created--at {\n\t\talign-items: center;\n\t\tgap: 4px;\n\t}\n\n\t.new--content--tag {\n\t\tpadding: 2px 6px;\n\t\tgap: 4px;\n\t\tborder-radius: 14px;\n\t\tbackground: ${COLORS.background.warning.vibrant};\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tmargin-right: 8px;\n\t}\n`;\n\nexport const MainContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n`;\n\nexport const MainCardContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder-radius: 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\ttransition: all 0.2s ease;\n\n\t&:hover {\n\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n\t}\n`;\n\nexport const BackgroundImageContainer = styled.div<{\n\timageUrl: string;\n\theight?: string;\n\twidth?: string;\n}>`\n\tbackground-image: url(${(props) => props.imageUrl});\n\tbackground-size: cover;\n\tbackground-position: center;\n\tbackground-repeat: no-repeat;\n\theight: ${(props) => props.height || '200px'};\n\twidth: ${(props) => props.width || '100%'};\n\tborder-radius: 4px;\n`;\n"],"names":["WhatsNewIconContainer","styled","COLORS","WhatsNewWrapper","MainContainer","MainCardContainer","BackgroundImageContainer","props"],"mappings":";;AAGO,MAAMA,IAAwBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAc5BC,EAAO,WAAW,UAAU;AAAA;AAAA;AAAA;AAAA,gBAI5BA,EAAO,WAAW,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAWtBA,EAAO,WAAW,SAAS,OAAO;AAAA,yBACzBA,EAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAUrCA,EAAO,QAAQ,QAAQ;AAAA;AAAA,GAIrBC,IAAkBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAatBC,EAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAYvBA,EAAO,WAAW,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAsE3BA,EAAO,QAAQ,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAgBnBA,EAAO,WAAW,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQpCE,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA,GAMvBI,IAAoBJ,EAAO;AAAA,eACzBC,EAAO,QAAQ,QAAQ;AAAA;AAAA,qBAEjBA,EAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAY7BI,IAA2BL,EAAO;AAAA,yBAKtB,CAACM,MAAUA,EAAM,QAAQ;AAAA;AAAA;AAAA;AAAA,WAIvC,CAACA,MAAUA,EAAM,UAAU,OAAO;AAAA,UACnC,CAACA,MAAUA,EAAM,SAAS,MAAM;AAAA;AAAA;"}
+{"version":3,"file":"WhatsNew.styles.js","sources":["../../../../src/components/whats-new/WhatsNew.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../../constants/Theme';\n\nexport const WhatsNewIconContainer = styled.div<{ count?: number }>`\n\tcursor: pointer;\n\tposition: relative;\n\n\t.main-icon-class {\n\t\tpadding: 6px;\n\t\tborder-radius: 32px;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\ttransition: background-color 0.2s ease;\n\t}\n\n\t.icon-active {\n\t\tbackground: ${COLORS.background.brandLight};\n\t}\n\n\t.main-icon-class:hover {\n\t\tbackground: ${COLORS.background.base};\n\t}\n\n\t/* diameter is set inline per digit-count so it is always a perfect circle */\n\t.notification--count {\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\ttop: -2px;\n\t\tright: -2px;\n\t\t/* display-only: let clicks fall through to the IconButton underneath */\n\t\tpointer-events: none;\n\t\tborder-radius: 50%;\n\t\tbackground: ${COLORS.background.negative.vibrant};\n\t\tborder: 1px solid ${COLORS.surface.standard};\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t.count--text {\n\t\tfont-family: 'Inter';\n\t\tfont-size: 8px;\n\t\tline-height: 8px;\n\t\tfont-weight: 400;\n\t\tcolor: ${COLORS.surface.standard};\n\t}\n`;\n\nexport const WhatsNewWrapper = styled.div`\n\toverflow-y: auto;\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\tmax-height: calc(100vh - 60px);\n\n\t&::-webkit-scrollbar {\n\t\tdisplay: block;\n\t\twidth: 6px;\n\t}\n\n\t::-webkit-scrollbar-thumb {\n\t\tbackground: ${COLORS.content.inactive};\n\t\tborder-radius: 3px;\n\t\tmin-height: 30px;\n\t}\n\n\t.icon--wrapper {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tborder-radius: 50%;\n\t\tbackground: ${COLORS.background.base};\n\t\tmargin-bottom: 16px;\n\t}\n\n\t.no--data--found {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\theight: 300px;\n\t\ttext-align: center;\n\t\tpadding: 24px;\n\t}\n\n\t.text--align {\n\t\ttext-align: center;\n\t}\n\n\t.scroller {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 16px;\n\t\tpadding: 16px 0;\n\t}\n\n\t.full--width {\n\t\twidth: 100%;\n\t}\n\n\t.flex {\n\t\tdisplay: flex;\n\t}\n\n\t.flex--row {\n\t\tflex-direction: row;\n\t}\n\n\t.flex--column {\n\t\tflex-direction: column;\n\t}\n\n\t.mt-8 {\n\t\tmargin-top: 8px;\n\t}\n\n\t.mt-20 {\n\t\tmargin-top: 20px;\n\t}\n\n\t.mt--8 {\n\t\tmargin-top: 8px;\n\t}\n\n\t.mt--12 {\n\t\tmargin-top: 12px;\n\t}\n\n\t.mb-mt-8 {\n\t\tmargin-bottom: 8px;\n\t\tmargin-top: 8px;\n\t}\n\n\t.padding--16 {\n\t\tpadding: 16px;\n\t}\n\n\t.card--desc {\n\t\tmax-height: 200px;\n\t\toverflow-y: auto;\n\t\tfont-size: 12px;\n\t\tcolor: ${COLORS.content.secondary};\n\n\t\tp {\n\t\t\tmargin-bottom: 0px;\n\t\t}\n\t}\n\n\t.created--at {\n\t\talign-items: center;\n\t\tgap: 4px;\n\t}\n\n\t.new--content--tag {\n\t\tpadding: 2px 6px;\n\t\tgap: 4px;\n\t\tborder-radius: 14px;\n\t\tbackground: ${COLORS.background.warning.vibrant};\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tmargin-right: 8px;\n\t}\n`;\n\nexport const MainContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n`;\n\nexport const MainCardContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder-radius: 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\ttransition: all 0.2s ease;\n\n\t&:hover {\n\t\tbox-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n\t}\n`;\n\nexport const BackgroundImageContainer = styled.div<{\n\timageUrl: string;\n\theight?: string;\n\twidth?: string;\n}>`\n\tbackground-image: url(${(props) => props.imageUrl});\n\tbackground-size: cover;\n\tbackground-position: center;\n\tbackground-repeat: no-repeat;\n\theight: ${(props) => props.height || '200px'};\n\twidth: ${(props) => props.width || '100%'};\n\tborder-radius: 4px;\n`;\n"],"names":["WhatsNewIconContainer","styled","COLORS","WhatsNewWrapper","MainContainer","MainCardContainer","BackgroundImageContainer","props"],"mappings":";;AAGO,MAAMA,IAAwBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAc5BC,EAAO,WAAW,UAAU;AAAA;AAAA;AAAA;AAAA,gBAI5BA,EAAO,WAAW,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAYtBA,EAAO,WAAW,SAAS,OAAO;AAAA,sBAC5BA,EAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAWlCA,EAAO,QAAQ,QAAQ;AAAA;AAAA,GAIrBC,IAAkBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAatBC,EAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAYvBA,EAAO,WAAW,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAsE3BA,EAAO,QAAQ,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAgBnBA,EAAO,WAAW,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQpCE,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA,GAMvBI,IAAoBJ,EAAO;AAAA,eACzBC,EAAO,QAAQ,QAAQ;AAAA;AAAA,qBAEjBA,EAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAY7BI,IAA2BL,EAAO;AAAA,yBAKtB,CAACM,MAAUA,EAAM,QAAQ;AAAA;AAAA;AAAA;AAAA,WAIvC,CAACA,MAAUA,EAAM,UAAU,OAAO;AAAA,UACnC,CAACA,MAAUA,EAAM,SAAS,MAAM;AAAA;AAAA;"}

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

@@ -34,6 +34,8 @@ export interface WhatsNewButtonProps {
     testId?: string;
     iconWidth?: number;
     iconHeight?: number;
+    iconColor?: string;
+    iconPadding?: number;
     customIcon?: React.ComponentType<{
         width?: number;
         height?: number;

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

@@ -1,61 +1,71 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import h from "../../assets/icons/whatsNew.svg.js";
-import { COLORS as r } from "../../constants/Theme.js";
-import { WhatsNewIconContainer as f } from "./WhatsNew.styles.js";
-import { Tooltip as p } from "../tooltips/Tooltip.js";
-const g = ({
-  onClick: d,
+import { jsxs as n, jsx as t } from "react/jsx-runtime";
+import { COLORS as s } from "../../constants/Theme.js";
+import { WhatsNewIconContainer as b } from "./WhatsNew.styles.js";
+import { Tooltip as x } from "../tooltips/Tooltip.js";
+import { IconButton as y } from "../icon-button/IconButton.js";
+import u from "../../icons/Legacy - Bikayi specific/Services/Marketing.js";
+const W = ({
+  onClick: a,
   newContentCount: i = 0,
-  isOpen: e = !1,
-  isLoading: c = !1,
-  tooltip: l = "What's new",
-  testId: m = "whats-new-button",
-  iconWidth: o = 32,
-  iconHeight: a = 32,
-  customIcon: n
-}) => c ? /* @__PURE__ */ s("div", { style: { margin: "0px 8px" }, children: [
-  /* @__PURE__ */ t(
-    "div",
-    {
-      style: {
-        width: 16,
-        height: 16,
-        border: "2px solid #f3f3f3",
-        borderTop: "2px solid #731DCF",
-        borderRadius: "50%",
-        animation: "spin 1s linear infinite"
-      }
-    }
-  ),
-  /* @__PURE__ */ t("style", { children: `
+  isOpen: o = !1,
+  isLoading: d = !1,
+  tooltip: c = "What's new",
+  testId: h = "whats-new-button",
+  iconWidth: l = 24,
+  iconHeight: m = 24,
+  iconColor: f,
+  iconPadding: p,
+  customIcon: g
+}) => {
+  if (d)
+    return /* @__PURE__ */ n("div", { style: { margin: "0px 8px" }, children: [
+      /* @__PURE__ */ t(
+        "div",
+        {
+          style: {
+            width: 16,
+            height: 16,
+            border: "2px solid #f3f3f3",
+            borderTop: "2px solid #731DCF",
+            borderRadius: "50%",
+            animation: "spin 1s linear infinite"
+          }
+        }
+      ),
+      /* @__PURE__ */ t("style", { children: `
 						@keyframes spin {
 							0% { transform: rotate(0deg); }
 							100% { transform: rotate(360deg); }
 						}
 					` })
-] }) : /* @__PURE__ */ t(f, { count: i, children: /* @__PURE__ */ s(
-  "div",
-  {
-    className: `main-icon-class ${e ? "icon-active" : ""}`,
-    style: {
-      color: e ? r.content.brand : r.content.primary
-    },
-    onClick: d,
-    "data-testid": m,
-    children: [
-      /* @__PURE__ */ t(p, { body: l, placement: "bottom", children: /* @__PURE__ */ t("div", { children: n ? /* @__PURE__ */ t(
-        n,
-        {
-          width: o,
-          height: a,
-          color: e ? r.content.brand : r.content.primary
-        }
-      ) : /* @__PURE__ */ t(h, { width: o, height: a }) }) }),
-      i > 0 && /* @__PURE__ */ t("div", { className: "notification--count", children: /* @__PURE__ */ t("div", { className: "count--text", children: i }) })
-    ]
-  }
-) });
+    ] });
+  const e = i > 99 ? "99+" : String(i), r = e.length >= 3 ? 20 : e.length === 2 ? 16 : 12;
+  return /* @__PURE__ */ n(b, { count: i, children: [
+    /* @__PURE__ */ t(x, { body: c, placement: "bottom", children: /* @__PURE__ */ t(
+      y,
+      {
+        Icon: g ?? u,
+        width: l,
+        height: m,
+        iconPadding: p,
+        isSelected: o,
+        iconColor: f ?? (o ? s.content.brand : s.content.primary),
+        onClick: a,
+        "data-testid": h,
+        style: { width: 24, height: 24, boxSizing: "border-box" }
+      }
+    ) }),
+    i > 0 && /* @__PURE__ */ t(
+      "div",
+      {
+        className: "notification--count",
+        style: { width: r, height: r },
+        children: /* @__PURE__ */ t("div", { className: "count--text", children: e })
+      }
+    )
+  ] });
+};
 export {
-  g as WhatsNewButton
+  W as WhatsNewButton
 };
 //# sourceMappingURL=WhatsNewButton.js.map

package/dist/esm/components/whats-new/WhatsNewButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"WhatsNewButton.js","sources":["../../../../src/components/whats-new/WhatsNewButton.tsx"],"sourcesContent":["import React from 'react';\nimport WhatsNewIcon from '../../assets/icons/whatsNew.svg';\nimport { COLORS } from '../../constants/Theme';\nimport { Tooltip } from '../tooltips';\nimport { WhatsNewIconContainer } from './WhatsNew.styles';\nimport { WhatsNewButtonProps } from './WhatsNew.types';\n\nexport const WhatsNewButton: React.FC<WhatsNewButtonProps> = ({\n\tonClick,\n\tnewContentCount = 0,\n\tisOpen = false,\n\tisLoading = false,\n\ttooltip = \"What's new\",\n\ttestId = 'whats-new-button',\n\ticonWidth = 32,\n\ticonHeight = 32,\n\tcustomIcon: CustomIcon,\n}) => {\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ margin: '0px 8px' }}>\n\t\t\t\t{/* Simple loading spinner */}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: 16,\n\t\t\t\t\t\theight: 16,\n\t\t\t\t\t\tborder: '2px solid #f3f3f3',\n\t\t\t\t\t\tborderTop: '2px solid #731DCF',\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tanimation: 'spin 1s linear infinite',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<style>\n\t\t\t\t\t{`\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`}\n\t\t\t\t</style>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<WhatsNewIconContainer count={newContentCount}>\n\t\t\t<div\n\t\t\t\tclassName={`main-icon-class ${isOpen ? 'icon-active' : ''}`}\n\t\t\t\tstyle={{\n\t\t\t\t\tcolor: isOpen ? COLORS.content.brand : COLORS.content.primary,\n\t\t\t\t}}\n\t\t\t\tonClick={onClick}\n\t\t\t\tdata-testid={testId}\n\t\t\t>\n\t\t\t\t<Tooltip body={tooltip} placement={'bottom'}>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t{CustomIcon ? (\n\t\t\t\t\t\t\t<CustomIcon\n\t\t\t\t\t\t\t\twidth={iconWidth}\n\t\t\t\t\t\t\t\theight={iconHeight}\n\t\t\t\t\t\t\t\tcolor={isOpen ? COLORS.content.brand : COLORS.content.primary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<WhatsNewIcon width={iconWidth} height={iconHeight} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</Tooltip>\n\t\t\t\t{newContentCount > 0 && (\n\t\t\t\t\t<div className=\"notification--count\">\n\t\t\t\t\t\t<div className=\"count--text\">{newContentCount}</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</WhatsNewIconContainer>\n\t);\n};\n"],"names":["WhatsNewButton","onClick","newContentCount","isOpen","isLoading","tooltip","testId","iconWidth","iconHeight","CustomIcon","jsx","WhatsNewIconContainer","jsxs","COLORS","Tooltip","WhatsNewIcon"],"mappings":";;;;;AAOO,MAAMA,IAAgD,CAAC;AAAA,EAC7D,SAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,YAAAC,IAAa;AAAA,EACb,YAAYC;AACb,MACKL,sBAED,OAAA,EAAI,OAAO,EAAE,QAAQ,aAErB,UAAA;AAAA,EAAA,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,OAAO;AAAA,QACN,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,cAAc;AAAA,QACd,WAAW;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA;AAAA,oBAEA,SAAA,EACC,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAA,CAMF;AAAA,GACD,IAKD,gBAAAA,EAACC,GAAA,EAAsB,OAAOT,GAC7B,UAAA,gBAAAU;AAAA,EAAC;AAAA,EAAA;AAAA,IACA,WAAW,mBAAmBT,IAAS,gBAAgB,EAAE;AAAA,IACzD,OAAO;AAAA,MACN,OAAOA,IAASU,EAAO,QAAQ,QAAQA,EAAO,QAAQ;AAAA,IAAA;AAAA,IAEvD,SAAAZ;AAAA,IACA,eAAaK;AAAA,IAEb,UAAA;AAAA,MAAA,gBAAAI,EAACI,KAAQ,MAAMT,GAAS,WAAW,UAClC,UAAA,gBAAAK,EAAC,SACC,UAAAD,IACA,gBAAAC;AAAA,QAACD;AAAA,QAAA;AAAA,UACA,OAAOF;AAAA,UACP,QAAQC;AAAA,UACR,OAAOL,IAASU,EAAO,QAAQ,QAAQA,EAAO,QAAQ;AAAA,QAAA;AAAA,MAAA,sBAGtDE,GAAA,EAAa,OAAOR,GAAW,QAAQC,EAAA,CAAY,GAEtD,GACD;AAAA,MACCN,IAAkB,KAClB,gBAAAQ,EAAC,OAAA,EAAI,WAAU,uBACd,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,eAAe,UAAAR,EAAA,CAAgB,EAAA,CAC/C;AAAA,IAAA;AAAA,EAAA;AAAA,GAGH;"}
+{"version":3,"file":"WhatsNewButton.js","sources":["../../../../src/components/whats-new/WhatsNewButton.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '../../constants/Theme';\nimport { Marketing } from '../../icons';\nimport { IconButton } from '../icon-button';\nimport { Tooltip } from '../tooltips';\nimport { WhatsNewIconContainer } from './WhatsNew.styles';\nimport { WhatsNewButtonProps } from './WhatsNew.types';\n\nexport const WhatsNewButton: React.FC<WhatsNewButtonProps> = ({\n\tonClick,\n\tnewContentCount = 0,\n\tisOpen = false,\n\tisLoading = false,\n\ttooltip = \"What's new\",\n\ttestId = 'whats-new-button',\n\ticonWidth = 24,\n\ticonHeight = 24,\n\ticonColor,\n\ticonPadding,\n\tcustomIcon: CustomIcon,\n}) => {\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ margin: '0px 8px' }}>\n\t\t\t\t{/* Simple loading spinner */}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: 16,\n\t\t\t\t\t\theight: 16,\n\t\t\t\t\t\tborder: '2px solid #f3f3f3',\n\t\t\t\t\t\tborderTop: '2px solid #731DCF',\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tanimation: 'spin 1s linear infinite',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<style>\n\t\t\t\t\t{`\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`}\n\t\t\t\t</style>\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst badgeText = newContentCount > 99 ? '99+' : String(newContentCount);\n\t// diameter grows with digit count so the badge stays a perfect circle\n\tconst badgeSize =\n\t\tbadgeText.length >= 3 ? 20 : badgeText.length === 2 ? 16 : 12;\n\n\treturn (\n\t\t<WhatsNewIconContainer count={newContentCount}>\n\t\t\t<Tooltip body={tooltip} placement={'bottom'}>\n\t\t\t\t<IconButton\n\t\t\t\t\tIcon={\n\t\t\t\t\t\t(CustomIcon ?? Marketing) as React.FC<\n\t\t\t\t\t\t\tReact.SVGAttributes<SVGElement>\n\t\t\t\t\t\t>\n\t\t\t\t\t}\n\t\t\t\t\twidth={iconWidth}\n\t\t\t\t\theight={iconHeight}\n\t\t\t\t\ticonPadding={iconPadding}\n\t\t\t\t\tisSelected={isOpen}\n\t\t\t\t\ticonColor={\n\t\t\t\t\t\ticonColor ??\n\t\t\t\t\t\t(isOpen ? COLORS.content.brand : COLORS.content.primary)\n\t\t\t\t\t}\n\t\t\t\t\tonClick={onClick}\n\t\t\t\t\tdata-testid={testId}\n\t\t\t\t\tstyle={{ width: 24, height: 24, boxSizing: 'border-box' }}\n\t\t\t\t/>\n\t\t\t</Tooltip>\n\t\t\t{newContentCount > 0 && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"notification--count\"\n\t\t\t\t\tstyle={{ width: badgeSize, height: badgeSize }}\n\t\t\t\t>\n\t\t\t\t\t<div className=\"count--text\">{badgeText}</div>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</WhatsNewIconContainer>\n\t);\n};\n"],"names":["WhatsNewButton","onClick","newContentCount","isOpen","isLoading","tooltip","testId","iconWidth","iconHeight","iconColor","iconPadding","CustomIcon","jsx","badgeText","badgeSize","jsxs","WhatsNewIconContainer","Tooltip","IconButton","Marketing","COLORS"],"mappings":";;;;;;AAQO,MAAMA,IAAgD,CAAC;AAAA,EAC7D,SAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,YAAAC,IAAa;AAAA,EACb,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAYC;AACb,MAAM;AACL,MAAIP;AACH,6BACE,OAAA,EAAI,OAAO,EAAE,QAAQ,aAErB,UAAA;AAAA,MAAA,gBAAAQ;AAAA,QAAC;AAAA,QAAA;AAAA,UACA,OAAO;AAAA,YACN,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,QAAQ;AAAA,YACR,WAAW;AAAA,YACX,cAAc;AAAA,YACd,WAAW;AAAA,UAAA;AAAA,QACZ;AAAA,MAAA;AAAA,wBAEA,SAAA,EACC,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAAA,CAMF;AAAA,IAAA,GACD;AAIF,QAAMC,IAAYX,IAAkB,KAAK,QAAQ,OAAOA,CAAe,GAEjEY,IACLD,EAAU,UAAU,IAAI,KAAKA,EAAU,WAAW,IAAI,KAAK;AAE5D,SACC,gBAAAE,EAACC,GAAA,EAAsB,OAAOd,GAC7B,UAAA;AAAA,IAAA,gBAAAU,EAACK,GAAA,EAAQ,MAAMZ,GAAS,WAAW,UAClC,UAAA,gBAAAO;AAAA,MAACM;AAAA,MAAA;AAAA,QACA,MACEP,KAAcQ;AAAAA,QAIhB,OAAOZ;AAAA,QACP,QAAQC;AAAA,QACR,aAAAE;AAAA,QACA,YAAYP;AAAA,QACZ,WACCM,MACCN,IAASiB,EAAO,QAAQ,QAAQA,EAAO,QAAQ;AAAA,QAEjD,SAAAnB;AAAA,QACA,eAAaK;AAAA,QACb,OAAO,EAAE,OAAO,IAAI,QAAQ,IAAI,WAAW,aAAA;AAAA,MAAa;AAAA,IAAA,GAE1D;AAAA,IACCJ,IAAkB,KAClB,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAO,EAAE,OAAOE,GAAW,QAAQA,EAAA;AAAA,QAEnC,UAAA,gBAAAF,EAAC,OAAA,EAAI,WAAU,eAAe,UAAAC,EAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACzC,GAEF;AAEF;"}

package/dist/esm/components/whats-new/WhatsNewPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"WhatsNewPanel.js","sources":["../../../../src/components/whats-new/WhatsNewPanel.tsx"],"sourcesContent":["import { differenceInBusinessDays, format } from 'date-fns';\nimport React, { useMemo, useState } from 'react';\nimport SearchIconSvg from '../../assets/icons/searchIcon.svg';\nimport WhatsNewIcon from '../../assets/icons/whatsNew.svg';\nimport { COLORS } from '../../constants/Theme';\nimport { Button } from '../button';\nimport { VideoModal } from '../feature-announcements/VideoModal';\nimport { SearchBar } from '../searchBar';\nimport { SideModal } from '../side-modal';\nimport {\n\tBodyPrimary,\n\tCaption,\n\tTitleMedium,\n\tTitleRegular,\n\tTitleSmall,\n} from '../TypographyStyle';\nimport {\n\tBackgroundImageContainer,\n\tMainCardContainer,\n\tMainContainer,\n\tWhatsNewWrapper,\n} from './WhatsNew.styles';\nimport { WhatsNewContent, WhatsNewPanelProps } from './WhatsNew.types';\n\nexport const WhatsNewPanel: React.FC<WhatsNewPanelProps> = ({\n\tisOpen,\n\tonClose,\n\tcontent,\n\tisLoading = false,\n\ttitle = \"What's new on BIK\",\n\tsearchPlaceholder = 'Search posts',\n\temptyStateTitle = 'Nothing new!',\n\temptyStateDescription = 'There are no new updates or features at the moment. Check back soon!',\n\tnoResultsText = 'Sorry, no results found.',\n\twidth = '480px',\n\tonContentClick,\n\trenderCustomContent,\n}) => {\n\tconst [searchText, setSearchText] = useState('');\n\tconst [isVideoModalOpen, setIsVideoModalOpen] = useState(false);\n\tconst [videoUrl, setVideoUrl] = useState('');\n\n\tconst ifNewContent = (contentItem: WhatsNewContent): boolean => {\n\t\tif (!contentItem.createdAt) return false;\n\t\tconst createdAt = contentItem.createdAt.toDate\n\t\t\t? contentItem.createdAt.toDate()\n\t\t\t: new Date(contentItem.createdAt);\n\t\treturn differenceInBusinessDays(new Date(), createdAt) < 7;\n\t};\n\n\tconst modifiedWhatsNewContent = useMemo(() => {\n\t\tif (!searchText.trim()) return content;\n\n\t\tconst searchLower = searchText.toLowerCase();\n\t\treturn content.filter(\n\t\t\t(item) =>\n\t\t\t\titem.title.toLowerCase().includes(searchLower) ||\n\t\t\t\titem.body.toLowerCase().includes(searchLower) ||\n\t\t\t\t(item.content && item.content.toLowerCase().includes(searchLower)),\n\t\t);\n\t}, [content, searchText]);\n\n\tconst handleContentClick = (contentItem: WhatsNewContent) => {\n\t\tconst action = contentItem.primaryButton?.action;\n\t\tif (action === 'Play Video' || (!action && contentItem.productVideo)) {\n\t\t\tif (contentItem.productVideo) {\n\t\t\t\tsetVideoUrl(contentItem.productVideo);\n\t\t\t\tsetIsVideoModalOpen(true);\n\t\t\t}\n\t\t} else {\n\t\t\tconst redirectionUrl =\n\t\t\t\tcontentItem.primaryButton?.redirectionUrl || contentItem.redirectUrl;\n\t\t\tif (redirectionUrl) {\n\t\t\t\tconst isExternal = redirectionUrl.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(redirectionUrl, '_blank', 'noopener,noreferrer');\n\t\t\t\t} else {\n\t\t\t\t\twindow.location.href = redirectionUrl;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (onContentClick) {\n\t\t\tonContentClick(contentItem);\n\t\t}\n\t};\n\n\tconst isWhatsNewContentEmpty = content.length === 0;\n\tconst isModifiedWhatsNewContentEmpty = modifiedWhatsNewContent.length === 0;\n\n\tif (!isOpen) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<SideModal\n\t\t\twidth={width}\n\t\t\tonClose={onClose}\n\t\t\theader=\"\"\n\t\t\theaderCustomComponent={\n\t\t\t\t<TitleMedium color={COLORS.background.inverse}>{title}</TitleMedium>\n\t\t\t}\n\t\t\theaderStyle={{ background: COLORS.background.brandLight }}\n\t\t\thideFooter={true}\n\t\t>\n\t\t\t<MainContainer>\n\t\t\t\t<div className=\"mt-8\">\n\t\t\t\t\t<SearchBar\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tisEnabled={!isWhatsNewContentEmpty}\n\t\t\t\t\t\tonChange={(inputText: string) => {\n\t\t\t\t\t\t\tsetSearchText(inputText);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonEnter={(inputText: string) => {\n\t\t\t\t\t\t\tsetSearchText(inputText);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tplaceholder={searchPlaceholder}\n\t\t\t\t\t\tvariant=\"default\"\n\t\t\t\t\t\tsearchValue={searchText}\n\t\t\t\t\t\tonClickCross={() => {\n\t\t\t\t\t\t\tsetSearchText('');\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<WhatsNewWrapper>\n\t\t\t\t\t{isWhatsNewContentEmpty || isModifiedWhatsNewContentEmpty ? (\n\t\t\t\t\t\t<div className=\"no--data--found\">\n\t\t\t\t\t\t\t<div className=\"icon--wrapper\">\n\t\t\t\t\t\t\t\t{isWhatsNewContentEmpty ? (\n\t\t\t\t\t\t\t\t\t<WhatsNewIcon width={32} height={32} />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<SearchIconSvg width={32} height={32} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{isWhatsNewContentEmpty ? (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<TitleRegular>{emptyStateTitle}</TitleRegular>\n\t\t\t\t\t\t\t\t\t<BodyPrimary\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\tclassName=\"text--align\"\n\t\t\t\t\t\t\t\t\t\tstyle={{ maxWidth: 300 }}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{emptyStateDescription}\n\t\t\t\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) : isModifiedWhatsNewContentEmpty ? (\n\t\t\t\t\t\t\t\t<BodyPrimary\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\tclassName=\"text--align\"\n\t\t\t\t\t\t\t\t\tstyle={{ maxWidth: 300 }}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{noResultsText}\n\t\t\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<div className=\"scroller\">\n\t\t\t\t\t\t\t{modifiedWhatsNewContent.map((contentItem, index) => {\n\t\t\t\t\t\t\t\tif (renderCustomContent) {\n\t\t\t\t\t\t\t\t\treturn renderCustomContent(contentItem);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<MainCardContainer\n\t\t\t\t\t\t\t\t\t\tclassName=\"padding--16 mb-mt-8\"\n\t\t\t\t\t\t\t\t\t\tkey={`whats-new-${index}`}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<BackgroundImageContainer\n\t\t\t\t\t\t\t\t\t\t\timageUrl={contentItem.image}\n\t\t\t\t\t\t\t\t\t\t\theight=\"209px\"\n\t\t\t\t\t\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ borderRadius: '4px' }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<div className=\"mt-20 full--width\">\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"created--at flex flex--row\">\n\t\t\t\t\t\t\t\t\t\t\t\t{ifNewContent(contentItem) ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"new--content--tag\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Caption>New</Caption>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t<Caption style={{ color: COLORS.content.placeholder }}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{contentItem.createdAt\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? format(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontentItem.createdAt.toDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? contentItem.createdAt.toDate()\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: new Date(contentItem.createdAt),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'dd MMMM yyyy',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: ''}\n\t\t\t\t\t\t\t\t\t\t\t\t</Caption>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"mt--8\">\n\t\t\t\t\t\t\t\t\t\t\t<TitleSmall>{contentItem.title}</TitleSmall>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tdangerouslySetInnerHTML={{ __html: contentItem.body }}\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"card--desc mt--12\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex--row mt-20 full--width\">\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\tbuttonText={\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontentItem.primaryButton?.text ||\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontentItem.buttonText ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t'Explore the feature'\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => handleContentClick(contentItem)}\n\t\t\t\t\t\t\t\t\t\t\t\tmatchParentWidth={true}\n\t\t\t\t\t\t\t\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</MainCardContainer>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</WhatsNewWrapper>\n\t\t\t</MainContainer>\n\t\t\t<VideoModal\n\t\t\t\tisOpen={isVideoModalOpen}\n\t\t\t\tvideoUrl={videoUrl}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tsetIsVideoModalOpen(false);\n\t\t\t\t}}\n\t\t\t/>\n\t\t</SideModal>\n\t);\n};\n"],"names":["WhatsNewPanel","isOpen","onClose","content","isLoading","title","searchPlaceholder","emptyStateTitle","emptyStateDescription","noResultsText","width","onContentClick","renderCustomContent","searchText","setSearchText","useState","isVideoModalOpen","setIsVideoModalOpen","videoUrl","setVideoUrl","ifNewContent","contentItem","createdAt","differenceInBusinessDays","modifiedWhatsNewContent","useMemo","searchLower","item","handleContentClick","action","redirectionUrl","isWhatsNewContentEmpty","isModifiedWhatsNewContentEmpty","jsxs","SideModal","jsx","TitleMedium","COLORS","MainContainer","SearchBar","inputText","WhatsNewWrapper","WhatsNewIcon","SearchIconSvg","Fragment","TitleRegular","BodyPrimary","index","MainCardContainer","BackgroundImageContainer","Caption","format","TitleSmall","Button","VideoModal"],"mappings":"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"}
+{"version":3,"file":"WhatsNewPanel.js","sources":["../../../../src/components/whats-new/WhatsNewPanel.tsx"],"sourcesContent":["import { differenceInBusinessDays, format } from 'date-fns';\nimport React, { useMemo, useState } from 'react';\nimport SearchIconSvg from '../../assets/icons/searchIcon.svg';\nimport WhatsNewIcon from '../../assets/icons/whatsNew.svg';\nimport { COLORS } from '../../constants/Theme';\nimport { Button } from '../button';\nimport { VideoModal } from '../feature-announcements/VideoModal';\nimport { SearchBar } from '../searchBar';\nimport { SideModal } from '../side-modal';\nimport {\n\tBodyPrimary,\n\tCaption,\n\tTitleMedium,\n\tTitleRegular,\n\tTitleSmall,\n} from '../TypographyStyle';\nimport {\n\tBackgroundImageContainer,\n\tMainCardContainer,\n\tMainContainer,\n\tWhatsNewWrapper,\n} from './WhatsNew.styles';\nimport { WhatsNewContent, WhatsNewPanelProps } from './WhatsNew.types';\n\nexport const WhatsNewPanel: React.FC<WhatsNewPanelProps> = ({\n\tisOpen,\n\tonClose,\n\tcontent,\n\tisLoading = false,\n\ttitle = \"What's new on BIK\",\n\tsearchPlaceholder = 'Search posts',\n\temptyStateTitle = 'Nothing new!',\n\temptyStateDescription = 'There are no new updates or features at the moment. Check back soon!',\n\tnoResultsText = 'Sorry, no results found.',\n\twidth = '480px',\n\tonContentClick,\n\trenderCustomContent,\n}) => {\n\tconst [searchText, setSearchText] = useState('');\n\tconst [isVideoModalOpen, setIsVideoModalOpen] = useState(false);\n\tconst [videoUrl, setVideoUrl] = useState('');\n\n\tconst ifNewContent = (contentItem: WhatsNewContent): boolean => {\n\t\tif (!contentItem.createdAt) return false;\n\t\tconst createdAt = contentItem.createdAt.toDate\n\t\t\t? contentItem.createdAt.toDate()\n\t\t\t: new Date(contentItem.createdAt);\n\t\treturn differenceInBusinessDays(new Date(), createdAt) < 7;\n\t};\n\n\tconst modifiedWhatsNewContent = useMemo(() => {\n\t\tif (!searchText.trim()) return content;\n\n\t\tconst searchLower = searchText.toLowerCase();\n\t\treturn content.filter(\n\t\t\t(item) =>\n\t\t\t\titem.title.toLowerCase().includes(searchLower) ||\n\t\t\t\titem.body.toLowerCase().includes(searchLower) ||\n\t\t\t\t(item.content && item.content.toLowerCase().includes(searchLower)),\n\t\t);\n\t}, [content, searchText]);\n\n\tconst handleContentClick = (contentItem: WhatsNewContent) => {\n\t\tconst action = contentItem.primaryButton?.action;\n\t\tif (action === 'Play Video' || (!action && contentItem.productVideo)) {\n\t\t\tif (contentItem.productVideo) {\n\t\t\t\tsetVideoUrl(contentItem.productVideo);\n\t\t\t\tsetIsVideoModalOpen(true);\n\t\t\t}\n\t\t} else {\n\t\t\tconst redirectionUrl =\n\t\t\t\tcontentItem.primaryButton?.redirectionUrl || contentItem.redirectUrl;\n\t\t\tif (redirectionUrl) {\n\t\t\t\tconst isExternal = redirectionUrl.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(redirectionUrl, '_blank', 'noopener,noreferrer');\n\t\t\t\t} else {\n\t\t\t\t\twindow.location.href = redirectionUrl;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (onContentClick) {\n\t\t\tonContentClick(contentItem);\n\t\t}\n\t};\n\n\tconst isWhatsNewContentEmpty = content.length === 0;\n\tconst isModifiedWhatsNewContentEmpty = modifiedWhatsNewContent.length === 0;\n\n\tif (!isOpen) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<SideModal\n\t\t\twidth={width}\n\t\t\tonClose={onClose}\n\t\t\theader=\"\"\n\t\t\theaderCustomComponent={\n\t\t\t\t<TitleMedium color={COLORS.background.inverse}>{title}</TitleMedium>\n\t\t\t}\n\t\t\theaderStyle={{ background: COLORS.background.brandLight }}\n\t\t\thideFooter={true}\n\t\t>\n\t\t\t<MainContainer>\n\t\t\t\t<div className=\"mt-8\">\n\t\t\t\t\t<SearchBar\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tisEnabled={!isWhatsNewContentEmpty}\n\t\t\t\t\t\tonChange={(inputText: string) => {\n\t\t\t\t\t\t\tsetSearchText(inputText);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonEnter={(inputText: string) => {\n\t\t\t\t\t\t\tsetSearchText(inputText);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tplaceholder={searchPlaceholder}\n\t\t\t\t\t\tvariant=\"default\"\n\t\t\t\t\t\tsearchValue={searchText}\n\t\t\t\t\t\tonClickCross={() => {\n\t\t\t\t\t\t\tsetSearchText('');\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<WhatsNewWrapper>\n\t\t\t\t\t{isWhatsNewContentEmpty || isModifiedWhatsNewContentEmpty ? (\n\t\t\t\t\t\t<div className=\"no--data--found\">\n\t\t\t\t\t\t\t<div className=\"icon--wrapper\">\n\t\t\t\t\t\t\t\t{isWhatsNewContentEmpty ? (\n\t\t\t\t\t\t\t\t\t<WhatsNewIcon width={32} height={32} />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<SearchIconSvg width={32} height={32} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{isWhatsNewContentEmpty ? (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<TitleRegular>{emptyStateTitle}</TitleRegular>\n\t\t\t\t\t\t\t\t\t<BodyPrimary\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\tclassName=\"text--align\"\n\t\t\t\t\t\t\t\t\t\tstyle={{ maxWidth: 300 }}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{emptyStateDescription}\n\t\t\t\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) : isModifiedWhatsNewContentEmpty ? (\n\t\t\t\t\t\t\t\t<BodyPrimary\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\tclassName=\"text--align\"\n\t\t\t\t\t\t\t\t\tstyle={{ maxWidth: 300 }}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{noResultsText}\n\t\t\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<div className=\"scroller\">\n\t\t\t\t\t\t\t{modifiedWhatsNewContent.map((contentItem, index) => {\n\t\t\t\t\t\t\t\tif (renderCustomContent) {\n\t\t\t\t\t\t\t\t\treturn renderCustomContent(contentItem);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<MainCardContainer\n\t\t\t\t\t\t\t\t\t\tclassName=\"padding--16 mb-mt-8\"\n\t\t\t\t\t\t\t\t\t\tkey={`whats-new-${index}`}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<BackgroundImageContainer\n\t\t\t\t\t\t\t\t\t\t\timageUrl={contentItem.image}\n\t\t\t\t\t\t\t\t\t\t\theight=\"209px\"\n\t\t\t\t\t\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ borderRadius: '4px' }}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<div className=\"mt-20 full--width\">\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"created--at flex flex--row\">\n\t\t\t\t\t\t\t\t\t\t\t\t{ifNewContent(contentItem) ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"new--content--tag\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Caption>New</Caption>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t<Caption style={{ color: COLORS.content.placeholder }}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{contentItem.createdAt\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? format(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontentItem.createdAt.toDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? contentItem.createdAt.toDate()\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: new Date(contentItem.createdAt),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'dd MMMM yyyy',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: ''}\n\t\t\t\t\t\t\t\t\t\t\t\t</Caption>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"mt--8\">\n\t\t\t\t\t\t\t\t\t\t\t<TitleSmall>{contentItem.title}</TitleSmall>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tdangerouslySetInnerHTML={{ __html: contentItem.body }}\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"card--desc mt--12\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<div className=\"flex flex--row mt-20 full--width\">\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\tbuttonText={\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontentItem.primaryButton?.text ||\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontentItem.buttonText ||\n\t\t\t\t\t\t\t\t\t\t\t\t\t'Explore the feature'\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => handleContentClick(contentItem)}\n\t\t\t\t\t\t\t\t\t\t\t\tmatchParentWidth={true}\n\t\t\t\t\t\t\t\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</MainCardContainer>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</WhatsNewWrapper>\n\t\t\t</MainContainer>\n\t\t\t<VideoModal\n\t\t\t\tisOpen={isVideoModalOpen}\n\t\t\t\tvideoUrl={videoUrl}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tsetIsVideoModalOpen(false);\n\t\t\t\t}}\n\t\t\t/>\n\t\t</SideModal>\n\t);\n};\n"],"names":["WhatsNewPanel","isOpen","onClose","content","isLoading","title","searchPlaceholder","emptyStateTitle","emptyStateDescription","noResultsText","width","onContentClick","renderCustomContent","searchText","setSearchText","useState","isVideoModalOpen","setIsVideoModalOpen","videoUrl","setVideoUrl","ifNewContent","contentItem","createdAt","differenceInBusinessDays","modifiedWhatsNewContent","useMemo","searchLower","item","handleContentClick","action","redirectionUrl","isWhatsNewContentEmpty","isModifiedWhatsNewContentEmpty","jsxs","SideModal","jsx","TitleMedium","COLORS","MainContainer","SearchBar","inputText","WhatsNewWrapper","WhatsNewIcon","SearchIconSvg","Fragment","TitleRegular","BodyPrimary","index","MainCardContainer","BackgroundImageContainer","Caption","format","TitleSmall","Button","VideoModal"],"mappings":"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"}

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

@@ -1,11 +1,15 @@
 export declare const BASE_COLORS: {
     brand: {
         900: string;
+        850: string;
         800: string;
+        700: string;
         500: string;
         100: string;
         50: string;
         10: string;
+        7: string;
+        5: string;
     };
     grayscale: {
         900: string;
@@ -52,8 +56,11 @@ export declare const COLORS: {
         brand: string;
         brandLight: string;
         brandVeryLight: string;
+        brandUltraLight: string;
+        brandGhost: string;
         pureWhite: string;
         brandTint: string;
+        brandHovered: string;
         negative: {
             vibrant: string;
             light: string;
@@ -114,6 +121,7 @@ export declare const COLORS: {
             vibrant: string;
         };
         brandLightAlt: string;
+        brandSubdued: string;
         blue: {
             lightAlt: string;
         };
@@ -182,6 +190,12 @@ export declare const FONTS: {
         lineHeight: number;
         letterSpacing: number;
     };
+    titleTiny: {
+        fontWeight: string;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: number;
+    };
     bodyPrimary: {
         fontWeight: string;
         fontSize: number;
@@ -206,6 +220,12 @@ export declare const FONTS: {
         lineHeight: number;
         letterSpacing: number;
     };
+    bodyTinySemiBold: {
+        fontWeight: string;
+        fontSize: number;
+        lineHeight: number;
+        letterSpacing: number;
+    };
     tiny: {
         fontWeight: string;
         fontSize: number;
@@ -343,8 +363,11 @@ export declare const DEFAULT_THEME: {
             brand: string;
             brandLight: string;
             brandVeryLight: string;
+            brandUltraLight: string;
+            brandGhost: string;
             pureWhite: string;
             brandTint: string;
+            brandHovered: string;
             negative: {
                 vibrant: string;
                 light: string;
@@ -405,6 +428,7 @@ export declare const DEFAULT_THEME: {
                 vibrant: string;
             };
             brandLightAlt: string;
+            brandSubdued: string;
             blue: {
                 lightAlt: string;
             };
@@ -473,6 +497,12 @@ export declare const DEFAULT_THEME: {
             lineHeight: number;
             letterSpacing: number;
         };
+        titleTiny: {
+            fontWeight: string;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: number;
+        };
         bodyPrimary: {
             fontWeight: string;
             fontSize: number;
@@ -497,6 +527,12 @@ export declare const DEFAULT_THEME: {
             lineHeight: number;
             letterSpacing: number;
         };
+        bodyTinySemiBold: {
+            fontWeight: string;
+            fontSize: number;
+            lineHeight: number;
+            letterSpacing: number;
+        };
         tiny: {
             fontWeight: string;
             fontSize: number;

package/dist/esm/constants/Theme.js

@@ -1,11 +1,15 @@
 const e = {
   brand: {
     900: "#28034E",
+    850: "#360A63",
     800: "#4B1583",
+    700: "#5E3A83",
     500: "#731DCF",
     100: "#F3EDF9",
     50: "#EFE6F9",
-    10: "#F9F3FF"
+    10: "#F9F3FF",
+    7: "#F7F2FC",
+    5: "#FDFBFF"
   },
   grayscale: {
     900: "#212121",
@@ -51,8 +55,11 @@ const e = {
     brand: e.brand[500],
     brandLight: e.brand[50],
     brandVeryLight: e.brand[10],
+    brandUltraLight: e.brand[7],
+    brandGhost: e.brand[5],
     pureWhite: e.grayscale.white,
     brandTint: e.brand[100],
+    brandHovered: e.brand[850],
     negative: {
       vibrant: e.negative[700],
       light: e.negative[50]
@@ -111,6 +118,7 @@ const e = {
       vibrant: e.positive[700]
     },
     brandLightAlt: "#DDCCF0",
+    brandSubdued: e.brand[700],
     blue: {
       lightAlt: "#C3D5E5"
     },
@@ -178,6 +186,12 @@ const e = {
     lineHeight: 20,
     letterSpacing: 0
   },
+  titleTiny: {
+    fontWeight: "600",
+    fontSize: 12,
+    lineHeight: 16,
+    letterSpacing: 0
+  },
   bodyPrimary: {
     fontWeight: "400",
     fontSize: 16,
@@ -202,6 +216,12 @@ const e = {
     lineHeight: 16,
     letterSpacing: 0
   },
+  bodyTinySemiBold: {
+    fontWeight: "600",
+    fontSize: 12,
+    lineHeight: 16,
+    letterSpacing: 0
+  },
   tiny: {
     fontWeight: "400",
     fontSize: 10,

package/dist/esm/constants/Theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.js","sources":["../../../src/constants/Theme.ts"],"sourcesContent":["export const BASE_COLORS = {\n\tbrand: {\n\t\t900: '#28034E',\n\t\t800: '#4B1583',\n\t\t500: '#731DCF',\n\t\t100: '#F3EDF9',\n\t\t50: '#EFE6F9',\n\t\t10: '#F9F3FF',\n\t},\n\tgrayscale: {\n\t\t900: '#212121',\n\t\t700: '#616161',\n\t\t500: '#9E9E9E',\n\t\t400: '#BDBDBD',\n\t\t200: '#E0E0E0',\n\t\t100: '#F0F0F0',\n\t\t70: '#F7F7F7',\n\t\t50: '#FAFAFA',\n\t\twhite: '#FFFFFF',\n\t\talpha: '#00000088',\n\t},\n\tnegative: {\n\t\t900: '#B92321',\n\t\t700: '#D53434',\n\t\t100: '#FFCED4',\n\t\t50: '#FFEBEF',\n\t},\n\twarning: {\n\t\t900: '#99631B',\n\t\t500: '#FEC02D',\n\t\t100: '#FFEABE',\n\t\t50: '#FFF7E5',\n\t},\n\tpositive: {\n\t\t900: '#00580E',\n\t\t700: '#1A872C',\n\t\t100: '#C3E4C4',\n\t\t50: '#E6F4E7',\n\t},\n\tbikAi: {\n\t\t500: 'linear-gradient(93deg, #FF166A 0.37%, #FB5F08 100%)',\n\t\t100: 'linear-gradient(93deg, #FEBAD2 0.37%, #FDD1B9 100%)',\n\t\t50: 'linear-gradient(93deg, #FFE6EE 0.37%, #FFF0E7 100%)',\n\t},\n};\n\nexport const COLORS = {\n\tbackground: {\n\t\tinactive: BASE_COLORS.grayscale['200'],\n\t\tbase: BASE_COLORS.grayscale['100'],\n\t\tinverse: BASE_COLORS.brand['900'],\n\t\tinverseLight: BASE_COLORS.brand['800'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\tbrandLight: BASE_COLORS.brand['50'],\n\t\tbrandVeryLight: BASE_COLORS.brand['10'],\n\t\tpureWhite: BASE_COLORS.grayscale.white,\n\t\tbrandTint: BASE_COLORS.brand['100'],\n\t\tnegative: {\n\t\t\tvibrant: BASE_COLORS.negative['700'],\n\t\t\tlight: BASE_COLORS.negative['50'],\n\t\t},\n\t\twarning: {\n\t\t\tvibrant: BASE_COLORS.warning['500'],\n\t\t\tlight: BASE_COLORS.warning['50'],\n\t\t},\n\t\tpositive: {\n\t\t\tvibrant: BASE_COLORS.positive['700'],\n\t\t\tlight: BASE_COLORS.positive['50'],\n\t\t},\n\t\tblue: {\n\t\t\tlight: '#E5F2FF',\n\t\t},\n\t},\n\ticon: { placeholder: '#9E9E9E' },\n\tscrim: {\n\t\tstandard: '#00000099',\n\t},\n\tsurface: {\n\t\tstandard: BASE_COLORS.grayscale['white'],\n\t\tsubdued: BASE_COLORS.grayscale['50'],\n\t\thovered: BASE_COLORS.grayscale['100'],\n\t\tgrey: BASE_COLORS.grayscale['70'],\n\t\tai: BASE_COLORS.bikAi['500'],\n\t\taiLight: BASE_COLORS.bikAi['50'],\n\t},\n\tcontent: {\n\t\tprimary: BASE_COLORS.grayscale['900'],\n\t\tsecondary: BASE_COLORS.grayscale['700'],\n\t\tplaceholder: BASE_COLORS.grayscale['500'],\n\t\tinactive: BASE_COLORS.grayscale['400'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\tprimaryInverse: BASE_COLORS.grayscale['white'],\n\t\tsecondaryInverse: '#ffffffcc',\n\t\tnegative: BASE_COLORS.negative['900'],\n\t\twarning: BASE_COLORS.warning['900'],\n\t\tpositive: BASE_COLORS.positive['900'],\n\t\tblue: '#28458F',\n\t\tai: BASE_COLORS.bikAi['500'],\n\t},\n\tstroke: {\n\t\tprimary: BASE_COLORS.grayscale['200'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\tnegative: {\n\t\t\tlightAlt: BASE_COLORS.negative['100'],\n\t\t\tvibrant: BASE_COLORS.negative['700'],\n\t\t},\n\t\twarning: {\n\t\t\tlightAlt: BASE_COLORS.warning['100'],\n\t\t\tvibrant: BASE_COLORS.warning['500'],\n\t\t},\n\t\tpositive: {\n\t\t\tlightAlt: BASE_COLORS.positive['100'],\n\t\t\tvibrant: BASE_COLORS.positive['700'],\n\t\t},\n\t\tbrandLightAlt: '#DDCCF0',\n\t\tblue: {\n\t\t\tlightAlt: '#C3D5E5',\n\t\t},\n\t\tai: {\n\t\t\tlightAlt: '#FEBAD2',\n\t\t\tvibrant: '#F23275',\n\t\t},\n\t},\n\tspecial: {\n\t\twhatsapp: {\n\t\t\tbrand: '#25D366',\n\t\t\tgradient: 'linear-gradient(360deg, #20B038 0%, #60D66A 100%)',\n\t\t\tdark: '#455A64',\n\t\t\tgradientArr: ['#20B038', '#60D66A'],\n\t\t},\n\t\tbrand: {\n\t\t\tgoogle: '#DD4B39',\n\t\t\tfacebook: '#1877F2',\n\t\t},\n\t},\n\ttext: {\n\t\tprimary: BASE_COLORS.grayscale['900'],\n\t\tsecondary: BASE_COLORS.grayscale['700'],\n\t\tplaceholder: BASE_COLORS.grayscale['500'],\n\t\tdisabled: BASE_COLORS.grayscale['400'],\n\t\twhite: BASE_COLORS.grayscale['white'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\taltPrimary: BASE_COLORS.brand['900'],\n\t\taltSecondary: BASE_COLORS.brand['800'],\n\t},\n};\n\nexport const FONTS = {\n\tdisplay: {\n\t\tfontWeight: '400',\n\t\tfontSize: 32,\n\t\tlineHeight: 40,\n\t\tletterSpacing: 0,\n\t},\n\ttitleXLarge: {\n\t\tfontWeight: '600',\n\t\tfontSize: 32,\n\t\tlineHeight: 40,\n\t\tletterSpacing: 0,\n\t},\n\ttitleLarge: {\n\t\tfontWeight: '600',\n\t\tfontSize: 28,\n\t\tlineHeight: 40,\n\t\tletterSpacing: 0,\n\t},\n\ttitleMedium: {\n\t\tfontWeight: '600',\n\t\tfontSize: 20,\n\t\tlineHeight: 28,\n\t\tletterSpacing: 0,\n\t},\n\ttitleRegular: {\n\t\tfontWeight: '600',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttitleSmall: {\n\t\tfontWeight: '600',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tbodyPrimary: {\n\t\tfontWeight: '400',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\tbodyLarge: {\n\t\tfontWeight: '400',\n\t\tfontSize: 20,\n\t\tlineHeight: 28,\n\t\tletterSpacing: 0,\n\t},\n\tbodySecondary: {\n\t\tfontWeight: '400',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tcaption: {\n\t\tfontWeight: '400',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\ttiny: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\tsubHeading: {\n\t\tfontWeight: '600',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\n\ttitle1: {\n\t\tfontWeight: '600',\n\t\tfontSize: 24,\n\t\tlineHeight: 32,\n\t\tletterSpacing: 0,\n\t},\n\ttitle1Mobile: {\n\t\tfontWeight: '600',\n\t\tfontSize: 20,\n\t\tlineHeight: 30,\n\t\tletterSpacing: 0,\n\t},\n\ttitle2: {\n\t\tfontWeight: '600',\n\t\tfontSize: 20,\n\t\tlineHeight: 28,\n\t\tletterSpacing: 0,\n\t},\n\ttitle2Mobile: {\n\t\tfontWeight: '600',\n\t\tfontSize: 18,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttitle3: {\n\t\tfontWeight: '600',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttitle3Mobile: {\n\t\tfontWeight: '500',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\ttitle4: {\n\t\tfontWeight: '400',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\ttextPlaceholder: {\n\t\tfontWeight: '400',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\ttitle4Mobile: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\tbodyRegularMobile: {\n\t\tfontWeight: '400',\n\t\tfontSize: 14,\n\t\tlineHeight: 18,\n\t\tletterSpacing: 0,\n\t},\n\tbodyRegular: {\n\t\tfontWeight: '400',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\n\tbodySmall: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\tbuttonLarge: {\n\t\tfontWeight: '600',\n\t\tfontSize: 16,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tbuttonRegular: {\n\t\tfontWeight: '600',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tcaptionMobile: {\n\t\tfontWeight: '500',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\tcaptionBold: {\n\t\tfontWeight: '700',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\ttext1Bold: {\n\t\tfontWeight: '700',\n\t\tfontSize: 10,\n\t\tlineHeight: 14,\n\t\tletterSpacing: 0,\n\t},\n\ttoast: {\n\t\tfontWeight: '400',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttoastMobile: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n};\n\n// For backward compatibility\nexport const DEFAULT_THEME = {\n\tcolorsV2: COLORS,\n\tfonts: FONTS,\n};\n"],"names":["BASE_COLORS","COLORS","FONTS","DEFAULT_THEME"],"mappings":"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"}
+{"version":3,"file":"Theme.js","sources":["../../../src/constants/Theme.ts"],"sourcesContent":["export const BASE_COLORS = {\n\tbrand: {\n\t\t900: '#28034E',\n\t\t850: '#360A63',\n\t\t800: '#4B1583',\n\t\t700: '#5E3A83',\n\t\t500: '#731DCF',\n\t\t100: '#F3EDF9',\n\t\t50: '#EFE6F9',\n\t\t10: '#F9F3FF',\n\t\t7: '#F7F2FC',\n\t\t5: '#FDFBFF',\n\t},\n\tgrayscale: {\n\t\t900: '#212121',\n\t\t700: '#616161',\n\t\t500: '#9E9E9E',\n\t\t400: '#BDBDBD',\n\t\t200: '#E0E0E0',\n\t\t100: '#F0F0F0',\n\t\t70: '#F7F7F7',\n\t\t50: '#FAFAFA',\n\t\twhite: '#FFFFFF',\n\t\talpha: '#00000088',\n\t},\n\tnegative: {\n\t\t900: '#B92321',\n\t\t700: '#D53434',\n\t\t100: '#FFCED4',\n\t\t50: '#FFEBEF',\n\t},\n\twarning: {\n\t\t900: '#99631B',\n\t\t500: '#FEC02D',\n\t\t100: '#FFEABE',\n\t\t50: '#FFF7E5',\n\t},\n\tpositive: {\n\t\t900: '#00580E',\n\t\t700: '#1A872C',\n\t\t100: '#C3E4C4',\n\t\t50: '#E6F4E7',\n\t},\n\tbikAi: {\n\t\t500: 'linear-gradient(93deg, #FF166A 0.37%, #FB5F08 100%)',\n\t\t100: 'linear-gradient(93deg, #FEBAD2 0.37%, #FDD1B9 100%)',\n\t\t50: 'linear-gradient(93deg, #FFE6EE 0.37%, #FFF0E7 100%)',\n\t},\n};\n\nexport const COLORS = {\n\tbackground: {\n\t\tinactive: BASE_COLORS.grayscale['200'],\n\t\tbase: BASE_COLORS.grayscale['100'],\n\t\tinverse: BASE_COLORS.brand['900'],\n\t\tinverseLight: BASE_COLORS.brand['800'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\tbrandLight: BASE_COLORS.brand['50'],\n\t\tbrandVeryLight: BASE_COLORS.brand['10'],\n\t\tbrandUltraLight: BASE_COLORS.brand['7'],\n\t\tbrandGhost: BASE_COLORS.brand['5'],\n\t\tpureWhite: BASE_COLORS.grayscale.white,\n\t\tbrandTint: BASE_COLORS.brand['100'],\n\t\tbrandHovered: BASE_COLORS.brand['850'],\n\t\tnegative: {\n\t\t\tvibrant: BASE_COLORS.negative['700'],\n\t\t\tlight: BASE_COLORS.negative['50'],\n\t\t},\n\t\twarning: {\n\t\t\tvibrant: BASE_COLORS.warning['500'],\n\t\t\tlight: BASE_COLORS.warning['50'],\n\t\t},\n\t\tpositive: {\n\t\t\tvibrant: BASE_COLORS.positive['700'],\n\t\t\tlight: BASE_COLORS.positive['50'],\n\t\t},\n\t\tblue: {\n\t\t\tlight: '#E5F2FF',\n\t\t},\n\t},\n\ticon: { placeholder: '#9E9E9E' },\n\tscrim: {\n\t\tstandard: '#00000099',\n\t},\n\tsurface: {\n\t\tstandard: BASE_COLORS.grayscale['white'],\n\t\tsubdued: BASE_COLORS.grayscale['50'],\n\t\thovered: BASE_COLORS.grayscale['100'],\n\t\tgrey: BASE_COLORS.grayscale['70'],\n\t\tai: BASE_COLORS.bikAi['500'],\n\t\taiLight: BASE_COLORS.bikAi['50'],\n\t},\n\tcontent: {\n\t\tprimary: BASE_COLORS.grayscale['900'],\n\t\tsecondary: BASE_COLORS.grayscale['700'],\n\t\tplaceholder: BASE_COLORS.grayscale['500'],\n\t\tinactive: BASE_COLORS.grayscale['400'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\tprimaryInverse: BASE_COLORS.grayscale['white'],\n\t\tsecondaryInverse: '#ffffffcc',\n\t\tnegative: BASE_COLORS.negative['900'],\n\t\twarning: BASE_COLORS.warning['900'],\n\t\tpositive: BASE_COLORS.positive['900'],\n\t\tblue: '#28458F',\n\t\tai: BASE_COLORS.bikAi['500'],\n\t},\n\tstroke: {\n\t\tprimary: BASE_COLORS.grayscale['200'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\tnegative: {\n\t\t\tlightAlt: BASE_COLORS.negative['100'],\n\t\t\tvibrant: BASE_COLORS.negative['700'],\n\t\t},\n\t\twarning: {\n\t\t\tlightAlt: BASE_COLORS.warning['100'],\n\t\t\tvibrant: BASE_COLORS.warning['500'],\n\t\t},\n\t\tpositive: {\n\t\t\tlightAlt: BASE_COLORS.positive['100'],\n\t\t\tvibrant: BASE_COLORS.positive['700'],\n\t\t},\n\t\tbrandLightAlt: '#DDCCF0',\n\t\tbrandSubdued: BASE_COLORS.brand['700'],\n\t\tblue: {\n\t\t\tlightAlt: '#C3D5E5',\n\t\t},\n\t\tai: {\n\t\t\tlightAlt: '#FEBAD2',\n\t\t\tvibrant: '#F23275',\n\t\t},\n\t},\n\tspecial: {\n\t\twhatsapp: {\n\t\t\tbrand: '#25D366',\n\t\t\tgradient: 'linear-gradient(360deg, #20B038 0%, #60D66A 100%)',\n\t\t\tdark: '#455A64',\n\t\t\tgradientArr: ['#20B038', '#60D66A'],\n\t\t},\n\t\tbrand: {\n\t\t\tgoogle: '#DD4B39',\n\t\t\tfacebook: '#1877F2',\n\t\t},\n\t},\n\ttext: {\n\t\tprimary: BASE_COLORS.grayscale['900'],\n\t\tsecondary: BASE_COLORS.grayscale['700'],\n\t\tplaceholder: BASE_COLORS.grayscale['500'],\n\t\tdisabled: BASE_COLORS.grayscale['400'],\n\t\twhite: BASE_COLORS.grayscale['white'],\n\t\tbrand: BASE_COLORS.brand['500'],\n\t\taltPrimary: BASE_COLORS.brand['900'],\n\t\taltSecondary: BASE_COLORS.brand['800'],\n\t},\n};\n\nexport const FONTS = {\n\tdisplay: {\n\t\tfontWeight: '400',\n\t\tfontSize: 32,\n\t\tlineHeight: 40,\n\t\tletterSpacing: 0,\n\t},\n\ttitleXLarge: {\n\t\tfontWeight: '600',\n\t\tfontSize: 32,\n\t\tlineHeight: 40,\n\t\tletterSpacing: 0,\n\t},\n\ttitleLarge: {\n\t\tfontWeight: '600',\n\t\tfontSize: 28,\n\t\tlineHeight: 40,\n\t\tletterSpacing: 0,\n\t},\n\ttitleMedium: {\n\t\tfontWeight: '600',\n\t\tfontSize: 20,\n\t\tlineHeight: 28,\n\t\tletterSpacing: 0,\n\t},\n\ttitleRegular: {\n\t\tfontWeight: '600',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttitleSmall: {\n\t\tfontWeight: '600',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\ttitleTiny: {\n\t\tfontWeight: '600',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\tbodyPrimary: {\n\t\tfontWeight: '400',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\tbodyLarge: {\n\t\tfontWeight: '400',\n\t\tfontSize: 20,\n\t\tlineHeight: 28,\n\t\tletterSpacing: 0,\n\t},\n\tbodySecondary: {\n\t\tfontWeight: '400',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tcaption: {\n\t\tfontWeight: '400',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\tbodyTinySemiBold: {\n\t\tfontWeight: '600',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\ttiny: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\tsubHeading: {\n\t\tfontWeight: '600',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\n\ttitle1: {\n\t\tfontWeight: '600',\n\t\tfontSize: 24,\n\t\tlineHeight: 32,\n\t\tletterSpacing: 0,\n\t},\n\ttitle1Mobile: {\n\t\tfontWeight: '600',\n\t\tfontSize: 20,\n\t\tlineHeight: 30,\n\t\tletterSpacing: 0,\n\t},\n\ttitle2: {\n\t\tfontWeight: '600',\n\t\tfontSize: 20,\n\t\tlineHeight: 28,\n\t\tletterSpacing: 0,\n\t},\n\ttitle2Mobile: {\n\t\tfontWeight: '600',\n\t\tfontSize: 18,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttitle3: {\n\t\tfontWeight: '600',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttitle3Mobile: {\n\t\tfontWeight: '500',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\ttitle4: {\n\t\tfontWeight: '400',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\ttextPlaceholder: {\n\t\tfontWeight: '400',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\ttitle4Mobile: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\tbodyRegularMobile: {\n\t\tfontWeight: '400',\n\t\tfontSize: 14,\n\t\tlineHeight: 18,\n\t\tletterSpacing: 0,\n\t},\n\tbodyRegular: {\n\t\tfontWeight: '400',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\n\tbodySmall: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\tbuttonLarge: {\n\t\tfontWeight: '600',\n\t\tfontSize: 16,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tbuttonRegular: {\n\t\tfontWeight: '600',\n\t\tfontSize: 14,\n\t\tlineHeight: 20,\n\t\tletterSpacing: 0,\n\t},\n\tcaptionMobile: {\n\t\tfontWeight: '500',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n\tcaptionBold: {\n\t\tfontWeight: '700',\n\t\tfontSize: 12,\n\t\tlineHeight: 16,\n\t\tletterSpacing: 0,\n\t},\n\ttext1Bold: {\n\t\tfontWeight: '700',\n\t\tfontSize: 10,\n\t\tlineHeight: 14,\n\t\tletterSpacing: 0,\n\t},\n\ttoast: {\n\t\tfontWeight: '400',\n\t\tfontSize: 16,\n\t\tlineHeight: 24,\n\t\tletterSpacing: 0,\n\t},\n\ttoastMobile: {\n\t\tfontWeight: '400',\n\t\tfontSize: 10,\n\t\tlineHeight: 12,\n\t\tletterSpacing: 0,\n\t},\n};\n\n// For backward compatibility\nexport const DEFAULT_THEME = {\n\tcolorsV2: COLORS,\n\tfonts: FONTS,\n};\n"],"names":["BASE_COLORS","COLORS","FONTS","DEFAULT_THEME"],"mappings":"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"}