npm - @bikdotai/bik-component-library - Versions diffs - 0.0.824 → 0.0.825-2 - Mend

@bikdotai/bik-component-library 0.0.824 → 0.0.825-2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (299) hide show

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

@@ -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 CHANGED Viewed

@@ -1,19 +1,22 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { jsxs as r, 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,
-  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: [
+import { COLORS as e } from "../../constants/Theme.js";
+import { WhatsNewIconContainer as p } from "./WhatsNew.styles.js";
+import { Tooltip as u } from "../tooltips/Tooltip.js";
+import { IconButton as x } from "../icon-button/IconButton.js";
+const W = ({
+  onClick: n,
+  newContentCount: o = 0,
+  isOpen: i = !1,
+  isLoading: a = !1,
+  tooltip: s = "What's new",
+  testId: d = "whats-new-button",
+  iconWidth: c = 24,
+  iconHeight: m = 24,
+  iconColor: l,
+  iconPadding: b,
+  customIcon: f
+}) => a ? /* @__PURE__ */ r("div", { style: { margin: "0px 8px" }, children: [
   /* @__PURE__ */ t(
     "div",
     {
@@ -33,29 +36,22 @@ const g = ({
 							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 }) })
-    ]
-  }
-) });
+] }) : /* @__PURE__ */ r(p, { count: o, children: [
+  /* @__PURE__ */ t(u, { body: s, placement: "bottom", children: /* @__PURE__ */ t(
+    x,
+    {
+      Icon: f ?? h,
+      width: c,
+      height: m,
+      isSelected: i,
+      iconColor: l ?? (i ? e.content.brand : e.content.primary),
+      onClick: n,
+      "data-testid": d
+    }
+  ) }),
+  o > 0 && /* @__PURE__ */ t("div", { className: "notification--count", children: /* @__PURE__ */ t("div", { className: "count--text", children: o }) })
+] });
 export {
-  g as WhatsNewButton
+  W as WhatsNewButton
 };
 //# sourceMappingURL=WhatsNewButton.js.map

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

	@@ -1 +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;~~"}
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 { 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\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 ?? WhatsNewIcon) 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\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/>\n\t\t\t</Tooltip>\n\t\t\t{newContentCount > 0 && (\n\t\t\t\t<div className=\"notification--count\">\n\t\t\t\t\t<div className=\"count--text\">{newContentCount}</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","jsxs","WhatsNewIconContainer","Tooltip","IconButton","WhatsNewIcon","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,MACKP,sBAED,OAAA,EAAI,OAAO,EAAE,QAAQ,aAErB,UAAA;AAAA,EAAA,gBAAAQ;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,gBAAAC,EAACC,GAAA,EAAsB,OAAOZ,GAC7B,UAAA;AAAA,EAAA,gBAAAU,EAACG,GAAA,EAAQ,MAAMV,GAAS,WAAW,UAClC,UAAA,gBAAAO;AAAA,IAACI;AAAA,IAAA;AAAA,MACA,MACEL,KAAcM;AAAAA,MAIhB,OAAOV;AAAA,MACP,QAAQC;AAAA,MACR,YAAYL;AAAA,MACZ,WACCM,MACCN,IAASe,EAAO,QAAQ,QAAQA,EAAO,QAAQ;AAAA,MAEjD,SAAAjB;AAAA,MACA,eAAaK;AAAA,IAAA;AAAA,EAAA,GAEf;AAAA,EACCJ,IAAkB,KAClB,gBAAAU,EAAC,OAAA,EAAI,WAAU,uBACd,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,eAAe,UAAAV,EAAA,CAAgB,EAAA,CAC/C;AAAA,GAEF;"}

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

	@@ -1 +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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"}
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\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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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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"}
1	+ {"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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"}

package/dist/esm/editor/BikEditor.styles.js CHANGED Viewed

@@ -9,7 +9,6 @@ const a = o.div`
 		max-height: ${({ maxHeight: e }) => e ?? "none"};
 		overflow-y: auto;
 		outline: none;
-		padding: 8px 12px;
 		font-size: 14px;
 		line-height: 1.5;
 		word-break: break-word;

package/dist/esm/editor/BikEditor.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BikEditor.styles.js","sources":["../../../src/editor/BikEditor.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '../constants/Theme';\n\nexport const BikEditorShell = styled.div<{\n\tminHeight?: string;\n\tmaxHeight?: string;\n\ttightParagraphs?: boolean;\n\tjsonMode?: boolean;\n}>`\n\tposition: relative;\n\twidth: 100%;\n\n\t.ProseMirror {\n\t\tmin-height: ${({ minHeight }) => minHeight ?? '60px'};\n\t\tmax-height: ${({ maxHeight }) => maxHeight ?? 'none'};\n\t\toverflow-y: auto;\n\t\toutline: none;\n\t\~~tpadding: 8px 12px;\n\t\~~tfont-size: 14px;\n\t\tline-height: 1.5;\n\t\tword-break: break-word;\n\n\t\t/* Paragraph spacing.\n\t\t Email/signature (rich): paragraphs carry the browser-default 1em block\n\t\t margin — the SAME spacing the sent HTML gets (we emit plain <p>, which\n\t\t renders against the default <p> margin in Gmail and our email viewer),\n\t\t so editor view == emitted HTML == Gmail. A single Enter = a new\n\t\t paragraph with a visible gap, like pasted Gmail/ChatGPT/Docs content.\n\t\t Other channels (WhatsApp/IG/FB/comments) are plain-text messaging, with\n\t\t no paragraph-gap concept — paragraphs are tight (margin:0) regardless of\n\t\t typed vs pasted. (A margin:0 attr still overrides to tight either way.) /\n\t\tp {\n\t\t\tmargin: ${({ tightParagraphs }) => (tightParagraphs ? '0' : '1em 0')};\n\t\t\tpadding: 0;\n\t\t}\n\n\t\tul,\n\t\tol {\n\t\t\tmargin: 0;\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\tli + li {\n\t\t\tmargin-top: 2px;\n\t\t}\n\n\t\tp.is-editor-empty:first-child::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tfloat: left;\n\t\t\tcolor: #adb5bd;\n\t\t\tpointer-events: none;\n\t\t\theight: 0;\n\t\t}\n\t}\n\n\t.bik-mention {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 4px;\n\t}\n\t.bik-mention--team {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\t/ Typed mention chips (agent-builder): distinct colour per reference kind. /\n\t.bik-mention[data-kind='tool'] {\n\t\tcolor: #1570ef;\n\t\tbackground: #eff8ff;\n\t\tborder-radius: 4px;\n\t\tfont-weight: 500;\n\t}\n\t.bik-mention[data-kind='subagent'] {\n\t\tcolor: #6938ef;\n\t\tbackground: #f4f3ff;\n\t\tborder-radius: 4px;\n\t\tfont-weight: 500;\n\t}\n\t.bik-variable {\n\t}\n\n\t/ JSON body mode — scoped so normal-mode code blocks keep their default look\n\t (no reserved gutter, no monospace override). /\n\t${({ jsonMode }) =>\n\t\tjsonMode &&\n\t\tcss`\n\t\t\t/ Self-framed card: the header bar and the code area share one rounded\n\t\t\t border, so the component renders as a complete panel without the\n\t\t\t consumer having to wrap it. /\n\t\t\tborder: 1px solid #e1e4e8;\n\t\t\tborder-radius: 8px;\n\t\t\toverflow: hidden;\n\n\t\t\t/ The code block IS the editor surface, sitting below the header bar.\n\t\t\t White fills the scroller down to the min-height (no blank strip below\n\t\t\t short JSON); the header owns the grey. /\n\t\t\t.ProseMirror {\n\t\t\t\tpadding: 0;\n\t\t\t\tbackground: #ffffff;\n\t\t\t}\n\t\t\t/ ProseMirror appends an empty trailing paragraph AFTER the code block\n\t\t\t (a <p><br class=\"ProseMirror-trailingBreak\"></p> caret-escape node).\n\t\t\t In JSON mode there's nothing to escape to — it only renders as a blank\n\t\t\t line under the JSON, which is the \"extra space at the bottom\". Hide it. /\n\t\t\t.ProseMirror pre + p {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t\t.ProseMirror pre {\n\t\t\t\tposition: relative;\n\t\t\t\tmargin: 0;\n\t\t\t\tbackground: transparent;\n\t\t\t\t/ Left padding reserves the line-number gutter; each .bik-json-lineno\n\t\t\t\t widget hangs back into it with a matching negative margin. /\n\t\t\t\tpadding: 12px 12px 12px 3.5em;\n\t\t\t\tfont-family: 'SFMono-Regular', ui-monospace, 'JetBrains Mono', Menlo,\n\t\t\t\t\tConsolas, 'Liberation Mono', monospace;\n\t\t\t\tfont-size: 13px;\n\t\t\t\tline-height: 1.6;\n\t\t\t\twhite-space: pre;\n\t\t\t\toverflow-x: auto;\n\t\t\t\ttab-size: 2;\n\t\t\t}\n\t\t\t.ProseMirror pre code {\n\t\t\t\tbackground: none;\n\t\t\t\tpadding: 0;\n\t\t\t\tfont-size: inherit;\n\t\t\t\tcolor: #1f2328;\n\t\t\t}\n\t\t\t/ Line-number gutter. Numbers hang into the code block's left padding via\n\t\t\t a negative margin (width + margin-right == the reserved padding, so the\n\t\t\t code text still starts at the padding edge). Stacked right borders form\n\t\t\t one continuous divider line. /\n\t\t\t.bik-json-lineno {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 2.5em;\n\t\t\t\tmargin-left: -3.5em;\n\t\t\t\tmargin-right: 1em;\n\t\t\t\tpadding-right: 0.7em;\n\t\t\t\ttext-align: right;\n\t\t\t\tcolor: #8c959f;\n\t\t\t\tborder-right: 1px solid #e1e4e8;\n\t\t\t\tuser-select: none;\n\t\t\t\t-webkit-user-select: none;\n\t\t\t}\n\t\t\t.bik-json-key {\n\t\t\t\tcolor: #0550ae;\n\t\t\t}\n\t\t\t.bik-json-string {\n\t\t\t\tcolor: #0a7d33;\n\t\t\t}\n\t\t\t.bik-json-number {\n\t\t\t\tcolor: #b5590a;\n\t\t\t}\n\t\t\t.bik-json-boolean,\n\t\t\t.bik-json-null {\n\t\t\t\tcolor: #8250df;\n\t\t\t\tfont-weight: 500;\n\t\t\t}\n\t\t\t.bik-json-punct {\n\t\t\t\tcolor: #57606a;\n\t\t\t}\n\t\t`}\n\n\ta,\n\t.bik-link {\n\t\tcolor: #4f46e5;\n\t\ttext-decoration: underline;\n\t\ttext-decoration-color: #a5b4fc;\n\t\ttext-underline-offset: 2px;\n\t\tcursor: pointer;\n\t\t&:hover {\n\t\t\tcolor: #3730a3;\n\t\t\ttext-decoration-color: #6366f1;\n\t\t}\n\t}\n`;\n\n/\n jsonMode header bar: a \"JSON\" label on the left and the Beautify / Copy actions\n * on the right, sitting above the code area with a bottom divider. Grey fill sets\n * it apart from the white code surface below (see the jsonMode block above).\n /\nexport const BikJsonHeader = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tbackground: #f6f8fa;\n\tborder-bottom: 1px solid #e1e4e8;\n\n\t.bik-json-header-label {\n\t\tfont-family: inherit;\n\t\tfont-size: 14px;\n\t\tfont-weight: 500;\n\t\tcolor: #3c4149;\n\t\tuser-select: none;\n\t}\n\n\t.bik-json-header-actions {\n\t\tdisplay: flex;\n\t\tgap: 6px;\n\t}\n\n\tbutton {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tgap: 6px;\n\t\tpadding: 6px 10px;\n\t\tfont-family: inherit;\n\t\tfont-size: 13px;\n\t\tline-height: 1.4;\n\t\tcolor: #3c4149;\n\t\tbackground: #ffffff;\n\t\tborder: 1px solid #d0d7de;\n\t\tborder-radius: 6px;\n\t\tcursor: pointer;\n\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground: #f3f4f6;\n\t\t\tborder-color: #adb5bd;\n\t\t}\n\t\t&:disabled {\n\t\t\topacity: 0.5;\n\t\t\tcursor: not-allowed;\n\t\t}\n\t}\n`;\n\n/* Inline JSON parse-error banner rendered by BikEditor in jsonMode. */\nexport const BikJsonError = styled.div`\n\tpadding: 6px 12px;\n\tfont-size: 12px;\n\tline-height: 1.5;\n\tcolor: #d1242f;\n\tbackground: #fff0f0;\n\tborder-top: 1px solid #ffd7d5;\n\tword-break: break-word;\n\n\tstrong {\n\t\tfont-weight: 600;\n\t}\n`;\n"],"names":["BikEditorShell","styled","minHeight","maxHeight","tightParagraphs","COLORS","jsonMode","css","BikJsonHeader","BikJsonError"],"mappings":";;AAGO,MAAMA,IAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAUrB,CAAC,EAAE,WAAAC,QAAgBA,KAAa,MAAM;AAAA,gBACtC,CAAC,EAAE,WAAAC,QAAgBA,KAAa,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA~~;AAAA~~,~~aAkBzC~~,CAAC,EAAE,iBAAAC,EAAA,MAAuBA,IAAkB,MAAM,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAwB5DC,EAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA,WAIpBA,EAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAoB5B,CAAC,EAAE,UAAAC,QACJA,KACAC;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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6EC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAqBUC,IAAgBP,EAAO;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,GAgDvBQ,IAAeR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
1	+ {"version":3,"file":"BikEditor.styles.js","sources":["../../../src/editor/BikEditor.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '../constants/Theme';\n\nexport const BikEditorShell = styled.div<{\n\tminHeight?: string;\n\tmaxHeight?: string;\n\ttightParagraphs?: boolean;\n\tjsonMode?: boolean;\n}>`\n\tposition: relative;\n\twidth: 100%;\n\n\t.ProseMirror {\n\t\tmin-height: ${({ minHeight }) => minHeight ?? '60px'};\n\t\tmax-height: ${({ maxHeight }) => maxHeight ?? 'none'};\n\t\toverflow-y: auto;\n\t\toutline: none;\n\t\tfont-size: 14px;\n\t\tline-height: 1.5;\n\t\tword-break: break-word;\n\n\t\t/* Paragraph spacing.\n\t\t Email/signature (rich): paragraphs carry the browser-default 1em block\n\t\t margin — the SAME spacing the sent HTML gets (we emit plain <p>, which\n\t\t renders against the default <p> margin in Gmail and our email viewer),\n\t\t so editor view == emitted HTML == Gmail. A single Enter = a new\n\t\t paragraph with a visible gap, like pasted Gmail/ChatGPT/Docs content.\n\t\t Other channels (WhatsApp/IG/FB/comments) are plain-text messaging, with\n\t\t no paragraph-gap concept — paragraphs are tight (margin:0) regardless of\n\t\t typed vs pasted. (A margin:0 attr still overrides to tight either way.) /\n\t\tp {\n\t\t\tmargin: ${({ tightParagraphs }) => (tightParagraphs ? '0' : '1em 0')};\n\t\t\tpadding: 0;\n\t\t}\n\n\t\tul,\n\t\tol {\n\t\t\tmargin: 0;\n\t\t\tpadding-left: 1.5em;\n\t\t}\n\n\t\tli + li {\n\t\t\tmargin-top: 2px;\n\t\t}\n\n\t\tp.is-editor-empty:first-child::before {\n\t\t\tcontent: attr(data-placeholder);\n\t\t\tfloat: left;\n\t\t\tcolor: #adb5bd;\n\t\t\tpointer-events: none;\n\t\t\theight: 0;\n\t\t}\n\t}\n\n\t.bik-mention {\n\t\tcolor: ${COLORS.content.brand};\n\t\tpadding: 1px 4px;\n\t}\n\t.bik-mention--team {\n\t\tcolor: ${COLORS.content.brand};\n\t}\n\t/ Typed mention chips (agent-builder): distinct colour per reference kind. /\n\t.bik-mention[data-kind='tool'] {\n\t\tcolor: #1570ef;\n\t\tbackground: #eff8ff;\n\t\tborder-radius: 4px;\n\t\tfont-weight: 500;\n\t}\n\t.bik-mention[data-kind='subagent'] {\n\t\tcolor: #6938ef;\n\t\tbackground: #f4f3ff;\n\t\tborder-radius: 4px;\n\t\tfont-weight: 500;\n\t}\n\t.bik-variable {\n\t}\n\n\t/ JSON body mode — scoped so normal-mode code blocks keep their default look\n\t (no reserved gutter, no monospace override). /\n\t${({ jsonMode }) =>\n\t\tjsonMode &&\n\t\tcss`\n\t\t\t/ Self-framed card: the header bar and the code area share one rounded\n\t\t\t border, so the component renders as a complete panel without the\n\t\t\t consumer having to wrap it. /\n\t\t\tborder: 1px solid #e1e4e8;\n\t\t\tborder-radius: 8px;\n\t\t\toverflow: hidden;\n\n\t\t\t/ The code block IS the editor surface, sitting below the header bar.\n\t\t\t White fills the scroller down to the min-height (no blank strip below\n\t\t\t short JSON); the header owns the grey. /\n\t\t\t.ProseMirror {\n\t\t\t\tpadding: 0;\n\t\t\t\tbackground: #ffffff;\n\t\t\t}\n\t\t\t/ ProseMirror appends an empty trailing paragraph AFTER the code block\n\t\t\t (a <p><br class=\"ProseMirror-trailingBreak\"></p> caret-escape node).\n\t\t\t In JSON mode there's nothing to escape to — it only renders as a blank\n\t\t\t line under the JSON, which is the \"extra space at the bottom\". Hide it. /\n\t\t\t.ProseMirror pre + p {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t\t.ProseMirror pre {\n\t\t\t\tposition: relative;\n\t\t\t\tmargin: 0;\n\t\t\t\tbackground: transparent;\n\t\t\t\t/ Left padding reserves the line-number gutter; each .bik-json-lineno\n\t\t\t\t widget hangs back into it with a matching negative margin. /\n\t\t\t\tpadding: 12px 12px 12px 3.5em;\n\t\t\t\tfont-family: 'SFMono-Regular', ui-monospace, 'JetBrains Mono', Menlo,\n\t\t\t\t\tConsolas, 'Liberation Mono', monospace;\n\t\t\t\tfont-size: 13px;\n\t\t\t\tline-height: 1.6;\n\t\t\t\twhite-space: pre;\n\t\t\t\toverflow-x: auto;\n\t\t\t\ttab-size: 2;\n\t\t\t}\n\t\t\t.ProseMirror pre code {\n\t\t\t\tbackground: none;\n\t\t\t\tpadding: 0;\n\t\t\t\tfont-size: inherit;\n\t\t\t\tcolor: #1f2328;\n\t\t\t}\n\t\t\t/ Line-number gutter. Numbers hang into the code block's left padding via\n\t\t\t a negative margin (width + margin-right == the reserved padding, so the\n\t\t\t code text still starts at the padding edge). Stacked right borders form\n\t\t\t one continuous divider line. /\n\t\t\t.bik-json-lineno {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 2.5em;\n\t\t\t\tmargin-left: -3.5em;\n\t\t\t\tmargin-right: 1em;\n\t\t\t\tpadding-right: 0.7em;\n\t\t\t\ttext-align: right;\n\t\t\t\tcolor: #8c959f;\n\t\t\t\tborder-right: 1px solid #e1e4e8;\n\t\t\t\tuser-select: none;\n\t\t\t\t-webkit-user-select: none;\n\t\t\t}\n\t\t\t.bik-json-key {\n\t\t\t\tcolor: #0550ae;\n\t\t\t}\n\t\t\t.bik-json-string {\n\t\t\t\tcolor: #0a7d33;\n\t\t\t}\n\t\t\t.bik-json-number {\n\t\t\t\tcolor: #b5590a;\n\t\t\t}\n\t\t\t.bik-json-boolean,\n\t\t\t.bik-json-null {\n\t\t\t\tcolor: #8250df;\n\t\t\t\tfont-weight: 500;\n\t\t\t}\n\t\t\t.bik-json-punct {\n\t\t\t\tcolor: #57606a;\n\t\t\t}\n\t\t`}\n\n\ta,\n\t.bik-link {\n\t\tcolor: #4f46e5;\n\t\ttext-decoration: underline;\n\t\ttext-decoration-color: #a5b4fc;\n\t\ttext-underline-offset: 2px;\n\t\tcursor: pointer;\n\t\t&:hover {\n\t\t\tcolor: #3730a3;\n\t\t\ttext-decoration-color: #6366f1;\n\t\t}\n\t}\n`;\n\n/\n jsonMode header bar: a \"JSON\" label on the left and the Beautify / Copy actions\n * on the right, sitting above the code area with a bottom divider. Grey fill sets\n * it apart from the white code surface below (see the jsonMode block above).\n /\nexport const BikJsonHeader = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: 8px;\n\tpadding: 8px 12px;\n\tbackground: #f6f8fa;\n\tborder-bottom: 1px solid #e1e4e8;\n\n\t.bik-json-header-label {\n\t\tfont-family: inherit;\n\t\tfont-size: 14px;\n\t\tfont-weight: 500;\n\t\tcolor: #3c4149;\n\t\tuser-select: none;\n\t}\n\n\t.bik-json-header-actions {\n\t\tdisplay: flex;\n\t\tgap: 6px;\n\t}\n\n\tbutton {\n\t\tdisplay: inline-flex;\n\t\talign-items: center;\n\t\tgap: 6px;\n\t\tpadding: 6px 10px;\n\t\tfont-family: inherit;\n\t\tfont-size: 13px;\n\t\tline-height: 1.4;\n\t\tcolor: #3c4149;\n\t\tbackground: #ffffff;\n\t\tborder: 1px solid #d0d7de;\n\t\tborder-radius: 6px;\n\t\tcursor: pointer;\n\n\t\t&:hover:not(:disabled) {\n\t\t\tbackground: #f3f4f6;\n\t\t\tborder-color: #adb5bd;\n\t\t}\n\t\t&:disabled {\n\t\t\topacity: 0.5;\n\t\t\tcursor: not-allowed;\n\t\t}\n\t}\n`;\n\n/* Inline JSON parse-error banner rendered by BikEditor in jsonMode. */\nexport const BikJsonError = styled.div`\n\tpadding: 6px 12px;\n\tfont-size: 12px;\n\tline-height: 1.5;\n\tcolor: #d1242f;\n\tbackground: #fff0f0;\n\tborder-top: 1px solid #ffd7d5;\n\tword-break: break-word;\n\n\tstrong {\n\t\tfont-weight: 600;\n\t}\n`;\n"],"names":["BikEditorShell","styled","minHeight","maxHeight","tightParagraphs","COLORS","jsonMode","css","BikJsonHeader","BikJsonError"],"mappings":";;AAGO,MAAMA,IAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAUrB,CAAC,EAAE,WAAAC,QAAgBA,KAAa,MAAM;AAAA,gBACtC,CAAC,EAAE,WAAAC,QAAgBA,KAAa,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAiBzC,CAAC,EAAE,iBAAAC,EAAA,MAAuBA,IAAkB,MAAM,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAwB5DC,EAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA,WAIpBA,EAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAoB5B,CAAC,EAAE,UAAAC,QACJA,KACAC;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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6EC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAqBUC,IAAgBP,EAAO;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,GAgDvBQ,IAAeR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/esm/editor/extensions/editorDropdown.styles.d.ts CHANGED Viewed

@@ -8,5 +8,11 @@ export declare const MentionLabel: import('styled-components').StyledComponent<"
 export declare const MentionPresenceDot: import('styled-components').StyledComponent<"span", any, {
     $online?: boolean | undefined;
 }, never>;
-export declare const SlashLabel: import('styled-components').StyledComponent<"span", any, {}, never>;
-export declare const SlashDescription: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const SlashLabel: import('styled-components').StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const SlashDescription: import('styled-components').StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;

package/dist/esm/editor/extensions/editorDropdown.styles.js CHANGED Viewed

@@ -1,33 +1,31 @@
 import t from "styled-components";
 import { COLORS as o } from "../../constants/Theme.js";
-const i = t.div`
+import { BodyCaption as n } from "../../components/TypographyStyle.js";
+const c = t.div`
 	background: ${o.surface.standard};
-	border: 1px solid ${o.stroke.primary};
-	border-radius: 8px;
+	border-radius: 4px;
 	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
-	padding: 4px;
 	min-width: 330px;
 	max-height: 260px;
 	overflow-y: auto;
 	font-size: 14px;
 	color: ${o.content.primary};
-`, a = t.div`
+`, p = t.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
-	padding: 12px 16px;
+	padding: 8px;
 	min-height: 43px;
-	border-radius: 6px;
 	cursor: pointer;
 	color: ${o.content.primary};
 	background: ${({ $isActive: r }) => r ? o.surface.hovered : "transparent"};
-`, p = t.img`
+`, s = t.img`
 	width: 24px;
 	height: 24px;
 	border-radius: 50%;
 	object-fit: cover;
 	flex-shrink: 0;
-`, s = t.div`
+`, d = t.div`
 	width: 24px;
 	height: 24px;
 	border-radius: 50%;
@@ -39,32 +37,30 @@ const i = t.div`
 	font-weight: 600;
 	color: ${o.content.primary};
 	flex-shrink: 0;
-`, c = t.span`
+`, l = t.span`
 	font-weight: 500;
 	color: ${o.content.primary};
-`, d = t.span`
+`, h = t.span`
 	width: 8px;
 	height: 8px;
 	border-radius: 50%;
 	background: ${({ $online: r }) => r ? o.content.positive : o.content.placeholder};
 	margin-left: auto;
 	flex-shrink: 0;
-`, x = t.span`
-	font-weight: 500;
+`, x = t(n)`
 	color: ${o.content.primary};
-`, l = t.span`
-	font-size: 12px;
+`, f = t(n)`
 	color: ${o.content.secondary};
 	margin-left: auto;
 `;
 export {
-  i as DropdownContainer,
-  a as DropdownItem,
-  p as MentionAvatar,
-  s as MentionAvatarFallback,
-  c as MentionLabel,
-  d as MentionPresenceDot,
-  l as SlashDescription,
+  c as DropdownContainer,
+  p as DropdownItem,
+  s as MentionAvatar,
+  d as MentionAvatarFallback,
+  l as MentionLabel,
+  h as MentionPresenceDot,
+  f as SlashDescription,
   x as SlashLabel
 };
 //# sourceMappingURL=editorDropdown.styles.js.map

package/dist/esm/editor/extensions/editorDropdown.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder~~: 1px solid ${COLORS.stroke.primary};\n\tborder~~-radius: ~~8px~~;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\~~tpadding: 4px;\n\~~tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: ~~12px 16px~~;\n\tmin-height: 43px;\n\~~tborder-radius: 6px;\n\~~tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionAvatarFallback = styled.div`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tcolor: ${COLORS.content.primary};\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled~~.span~~`\n\~~tfont-weight: 500;\n\~~tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled~~.span~~`\n\~~tfont-size: 12px;\n\~~tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","COLORS","DropdownItem","$isActive","MentionAvatar","MentionAvatarFallback","MentionLabel","MentionPresenceDot","$online","SlashLabel","SlashDescription"],"mappings":"~~;;AAGO~~,MAAMA,IAAoBC,EAAO;AAAA,eACzBC,EAAO,QAAQ,QAAQ;AAAA~~,qBACjBA,EAAO,OAAO,OAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA~~;AAAA;AAAA~~,~~UAQhCA~~,EAAO,QAAQ,OAAO;AAAA,GAGnBC,IAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA~~;AAAA~~,~~UAQzBC~~,EAAO,QAAQ,OAAO;AAAA,eACjB,CAAC,EAAE,WAAAE,QAChBA,IAAYF,EAAO,QAAQ,UAAU,aAAa;AAAA,GAGvCG,IAAgBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQvBK,IAAwBL,EAAO;AAAA;AAAA;AAAA;AAAA,eAI7BC,EAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAM3BA,EAAO,QAAQ,OAAO;AAAA;AAAA,GAInBK,IAAeN,EAAO;AAAA;AAAA,UAEzBC,EAAO,QAAQ,OAAO;AAAA,GAGnBM,IAAqBP,EAAO;AAAA;AAAA;AAAA;AAAA,eAI1B,CAAC,EAAE,SAAAQ,EAAA,MAChBA,IAAUP,EAAO,QAAQ,WAAWA,EAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,GAKnDQ,IAAaT,~~EAAO~~;AAAA~~;AAAA~~,~~UAEvBC~~,EAAO,QAAQ,OAAO;AAAA,~~GAGnBS~~,~~IAAmBV~~,~~EAAO~~;AAAA~~;AAAA~~,~~UAE7BC~~,EAAO,QAAQ,SAAS;AAAA;AAAA;"}
1	+ {"version":3,"file":"editorDropdown.styles.js","sources":["../../../../src/editor/extensions/editorDropdown.styles.ts"],"sourcesContent":["import { BodyCaption } from '@src/index';\nimport styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const DropdownContainer = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder-radius: 4px;\n\tbox-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n\tmin-width: 330px;\n\tmax-height: 260px;\n\toverflow-y: auto;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const DropdownItem = styled.div<{ $isActive?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 8px;\n\tmin-height: 43px;\n\tcursor: pointer;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${({ $isActive }) =>\n\t\t$isActive ? COLORS.surface.hovered : 'transparent'};\n`;\n\nexport const MentionAvatar = styled.img`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tobject-fit: cover;\n\tflex-shrink: 0;\n`;\n\nexport const MentionAvatarFallback = styled.div`\n\twidth: 24px;\n\theight: 24px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.hovered};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\tcolor: ${COLORS.content.primary};\n\tflex-shrink: 0;\n`;\n\nexport const MentionLabel = styled.span`\n\tfont-weight: 500;\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const MentionPresenceDot = styled.span<{ $online?: boolean }>`\n\twidth: 8px;\n\theight: 8px;\n\tborder-radius: 50%;\n\tbackground: ${({ $online }) =>\n\t\t$online ? COLORS.content.positive : COLORS.content.placeholder};\n\tmargin-left: auto;\n\tflex-shrink: 0;\n`;\n\nexport const SlashLabel = styled(BodyCaption)`\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const SlashDescription = styled(BodyCaption)`\n\tcolor: ${COLORS.content.secondary};\n\tmargin-left: auto;\n`;\n"],"names":["DropdownContainer","styled","COLORS","DropdownItem","$isActive","MentionAvatar","MentionAvatarFallback","MentionLabel","MentionPresenceDot","$online","SlashLabel","BodyCaption","SlashDescription"],"mappings":";;;AAIO,MAAMA,IAAoBC,EAAO;AAAA,eACzBC,EAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAO5BA,EAAO,QAAQ,OAAO;AAAA,GAGnBC,IAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOzBC,EAAO,QAAQ,OAAO;AAAA,eACjB,CAAC,EAAE,WAAAE,QAChBA,IAAYF,EAAO,QAAQ,UAAU,aAAa;AAAA,GAGvCG,IAAgBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQvBK,IAAwBL,EAAO;AAAA;AAAA;AAAA;AAAA,eAI7BC,EAAO,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAM3BA,EAAO,QAAQ,OAAO;AAAA;AAAA,GAInBK,IAAeN,EAAO;AAAA;AAAA,UAEzBC,EAAO,QAAQ,OAAO;AAAA,GAGnBM,IAAqBP,EAAO;AAAA;AAAA;AAAA;AAAA,eAI1B,CAAC,EAAE,SAAAQ,EAAA,MAChBA,IAAUP,EAAO,QAAQ,WAAWA,EAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,GAKnDQ,IAAaT,EAAOU,CAAW;AAAA,UAClCT,EAAO,QAAQ,OAAO;AAAA,GAGnBU,IAAmBX,EAAOU,CAAW;AAAA,UACxCT,EAAO,QAAQ,SAAS;AAAA;AAAA;"}

package/dist/esm/icons/Arrows/Chevron/ChevronUp.d.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import { SVGProps } from 'react';
 interface Props extends SVGProps<SVGSVGElement> {
-    size?: number | string;
     color?: string;
 }
-declare const SvgChevronUp: ({ size, color, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const SvgChevronUp: ({ width, height, color, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
 export default SvgChevronUp;