@lightsparkdev/ui 1.0.16 → 1.1.0

package/dist/{chunk-4OHQICOD.cjs → chunk-UNDTHMBS.cjs}

@@ -7,17 +7,17 @@
 
 
 
-var _chunkVS54P2UScjs = require('./chunk-VS54P2US.cjs');
+var _chunk2PI3XHGDcjs = require('./chunk-2PI3XHGD.cjs');
 
 
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunkAPCRRZMTcjs = require('./chunk-APCRRZMT.cjs');
+var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
 
 
 
-var _chunkEUDYMZXOcjs = require('./chunk-EUDYMZXO.cjs');
+var _chunkHGCI5IAMcjs = require('./chunk-HGCI5IAM.cjs');
 
 
 
@@ -51,8 +51,8 @@ function Select(_a) {
   const styles = {
     container: (styles2, state) => {
       return _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, styles2), {
-        width: _chunkVS54P2UScjs.fieldWidth,
-        maxWidth: _chunkVS54P2UScjs.maxFieldWidth,
+        width: _chunk2PI3XHGDcjs.fieldWidth,
+        maxWidth: _chunk2PI3XHGDcjs.maxFieldWidth,
         zIndex: _chunkZU72XWNEcjs.z.select
       });
     },
@@ -60,16 +60,16 @@ function Select(_a) {
       const controlStyles = getControlStyles ? getControlStyles(styles2, state) : {};
       return _chunkZ6EUSUADcjs.__spreadValues.call(void 0, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, styles2), {
         transition: "none",
-        padding: state.menuIsOpen || state.isFocused ? `${_chunkVS54P2UScjs.textInputPaddingPx - 1}px` : _chunkVS54P2UScjs.textInputPadding,
+        padding: state.menuIsOpen || state.isFocused ? `${_chunk2PI3XHGDcjs.textInputPaddingPx - 1}px` : _chunk2PI3XHGDcjs.textInputPadding,
         boxShadow: "none",
         background: theme.bg,
         minHeight: 0,
         fontSize: 14,
         borderWidth: state.menuIsOpen || state.isFocused ? "2px" : "1px",
         "&:hover": {
-          borderColor: state.menuIsOpen ? _chunkVS54P2UScjs.textInputBorderColorFocused.call(void 0, { theme }) : _chunkVS54P2UScjs.textInputBorderColor.call(void 0, { theme })
+          borderColor: state.menuIsOpen ? _chunk2PI3XHGDcjs.textInputBorderColorFocused.call(void 0, { theme }) : _chunk2PI3XHGDcjs.textInputBorderColor.call(void 0, { theme })
         },
-        borderColor: state.menuIsOpen || state.isFocused ? _chunkVS54P2UScjs.textInputBorderColorFocused.call(void 0, { theme }) : _chunkVS54P2UScjs.textInputBorderColor.call(void 0, { theme })
+        borderColor: state.menuIsOpen || state.isFocused ? _chunk2PI3XHGDcjs.textInputBorderColorFocused.call(void 0, { theme }) : _chunk2PI3XHGDcjs.textInputBorderColor.call(void 0, { theme })
       }), controlStyles);
     },
     indicatorsContainer: (styles2) => _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, styles2), {
@@ -92,13 +92,13 @@ function Select(_a) {
     option: (styles2, props) => {
       const optionStyles = getOptionStyles ? getOptionStyles(styles2, props) : {};
       return _chunkZ6EUSUADcjs.__spreadValues.call(void 0, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, styles2), {
-        color: props.isFocused ? _chunkEUDYMZXOcjs.getColor.call(void 0, theme, _chunkVS54P2UScjs.defaultTextInputTypography.color) : props.isDisabled ? _chunkVS54P2UScjs.textInputPlaceholderColor.call(void 0, { theme }) : _chunkEUDYMZXOcjs.getColor.call(void 0, theme, _chunkVS54P2UScjs.defaultTextInputTypography.color),
+        color: props.isFocused ? _chunkHGCI5IAMcjs.getColor.call(void 0, theme, _chunk2PI3XHGDcjs.defaultTextInputTypography.color) : props.isDisabled ? _chunk2PI3XHGDcjs.textInputPlaceholderColor.call(void 0, { theme }) : _chunkHGCI5IAMcjs.getColor.call(void 0, theme, _chunk2PI3XHGDcjs.defaultTextInputTypography.color),
         fontWeight: 600,
         cursor: "pointer",
-        backgroundColor: props.isFocused ? _chunkEUDYMZXOcjs.themeOr.call(void 0, theme.c05Neutral, theme.c2Neutral)({ theme }) : theme.bg,
+        backgroundColor: props.isFocused ? _chunkHGCI5IAMcjs.themeOr.call(void 0, theme.c05Neutral, theme.c2Neutral)({ theme }) : theme.bg,
         WebkitTapHighlightColor: theme.c1Neutral,
         "&:active": {
-          backgroundColor: _chunkEUDYMZXOcjs.themeOr.call(void 0, 
+          backgroundColor: _chunkHGCI5IAMcjs.themeOr.call(void 0, 
             theme.c05Neutral,
             theme.c5Neutral
           )({ theme })
@@ -137,7 +137,7 @@ function Select(_a) {
         menuPortalTarget: document.body,
         ref: selectRef,
         components: _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {
-          DropdownIndicator: () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: "Chevron", width: 16 })
+          DropdownIndicator: () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6Z6ZBZEJcjs.Icon, { name: "Chevron", width: 16 })
         }, rest.components),
         theme: (selectTheme) => _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, selectTheme), {
           borderRadius: 8,

package/dist/chunk-UOKPUAUZ.cjs

@@ -0,0 +1,33 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/central/Megaphone.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function Megaphone({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "path",
+        {
+          d: "M18.2461 14.0001C19.9029 14.0001 21.2461 12.6569 21.2461 11.0001C21.2461 9.34323 19.9029 8.00008 18.2461 8.00008M12.5754 18.2501C12.1636 19.4153 11.0523 20.2501 9.74609 20.2501C8.08924 20.2501 6.74609 18.9069 6.74609 17.2501V15.7501M6.74829 6.25009V15.7501M18.2461 4.10542V17.8947C18.2461 18.568 17.5943 19.0488 16.9511 18.8502L3.45108 14.682C3.03196 14.5526 2.74609 14.1652 2.74609 13.7265V8.27362C2.74609 7.83498 3.03196 7.44754 3.45108 7.31813L16.9511 3.14993C17.5943 2.95132 18.2461 3.43221 18.2461 4.10542Z",
+          stroke: "currentColor",
+          strokeWidth,
+          strokeLinecap,
+          strokeLinejoin,
+          vectorEffect: "non-scaling-stroke"
+        }
+      )
+    }
+  );
+}
+
+
+
+exports.Megaphone = Megaphone;

package/dist/{chunk-5QPEYF6O.cjs → chunk-UPWOS23Y.cjs}

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkQXYZAROGcjs = require('./chunk-QXYZAROG.cjs');
+var _chunkPMF5K72Fcjs = require('./chunk-PMF5K72F.cjs');
 
 
 
-var _chunk3IDFXUKWcjs = require('./chunk-3IDFXUKW.cjs');
+var _chunk3KSX3FCAcjs = require('./chunk-3KSX3FCA.cjs');
 
 
 
@@ -13,12 +13,12 @@ var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
 // src/components/typography/LabelStrong.tsx
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 function LabelStrong(props) {
-  const propsWithDefaults = _chunk3IDFXUKWcjs.getPropDefaults.call(void 0, props);
+  const propsWithDefaults = _chunk3KSX3FCAcjs.getPropDefaults.call(void 0, props);
   let reactNodes = props.children || null;
   if (props.content) {
-    reactNodes = _chunkQXYZAROGcjs.toReactNodes.call(void 0, props.content);
+    reactNodes = _chunkPMF5K72Fcjs.toReactNodes.call(void 0, props.content);
   }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk3IDFXUKWcjs.StyledLabelStrong, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, propsWithDefaults), { children: reactNodes }));
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk3KSX3FCAcjs.StyledLabelStrong, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, propsWithDefaults), { children: reactNodes }));
 }
 
 

package/dist/{chunk-BJYU635J.js → chunk-USA27D3E.js}

@@ -1,18 +1,18 @@
 import {
   CopyToClipboardButton
-} from "./chunk-OUGULECC.js";
+} from "./chunk-FHRJPK5E.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-OFNX3IEO.js";
+} from "./chunk-RKAVKJX6.js";
 import {
   standardBorderRadius
-} from "./chunk-WXQAFT6L.js";
+} from "./chunk-E46IHC27.js";
 import {
   themeOr
-} from "./chunk-WFSTDMMY.js";
+} from "./chunk-AM7EMJXN.js";
 import {
   colors
-} from "./chunk-HU2UCL6I.js";
+} from "./chunk-YJIIP7IY.js";
 import {
   __spreadProps,
   __spreadValues

package/dist/{chunk-JXTK5PZC.cjs → chunk-UTDID6QP.cjs}

@@ -3,22 +3,19 @@
 var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
 
 
-var _chunk2U6C2FAGcjs = require('./chunk-2U6C2FAG.cjs');
+var _chunk4UFYMBJKcjs = require('./chunk-4UFYMBJK.cjs');
 
 
-var _chunkND4ZEWCYcjs = require('./chunk-ND4ZEWCY.cjs');
+var _chunkK5JJ5ZJPcjs = require('./chunk-K5JJ5ZJP.cjs');
 
 
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunkAPCRRZMTcjs = require('./chunk-APCRRZMT.cjs');
+var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
 
 
-var _chunk2KKFVDUDcjs = require('./chunk-2KKFVDUD.cjs');
-
-
-var _chunkZBLXVPL4cjs = require('./chunk-ZBLXVPL4.cjs');
+var _chunkFPQ2OUYXcjs = require('./chunk-FPQ2OUYX.cjs');
 
 // src/components/Drawer.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -101,7 +98,7 @@ var Drawer = (props) => {
         children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DrawerInnerContainer, { kind: props.kind, padding: props.padding, children: [
           props.grabber && !props.nonDismissable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Grabber, { onClick: handleClose, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GrabberBar, {}) }),
           props.handleBack && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BackButtonContainer, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _chunk2U6C2FAGcjs.Button,
+            _chunk4UFYMBJKcjs.Button,
             {
               onClick: props.handleBack,
               icon: { name: "ChevronLeft" },
@@ -109,7 +106,15 @@ var Drawer = (props) => {
               size: "Small"
             }
           ) }),
-          props.closeButton && !props.nonDismissable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButtonContainer, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButton, { onClick: handleClose, type: "button", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: "Close", width: 10 }) }) }),
+          props.closeButton && !props.nonDismissable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButtonContainer, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CloseButton, { onClick: handleClose, type: "button", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunk6Z6ZBZEJcjs.Icon,
+            {
+              name: "CentralCrossLarge",
+              square: true,
+              width: 16,
+              color: "grayBlue43"
+            }
+          ) }) }),
           props.children
         ] })
       }
@@ -209,10 +214,10 @@ var CloseButtonContainer = _styled2.default.div`
   top: 20px;
   right: 20px;
   border-radius: 50%;
-  background-color: ${_chunkZBLXVPL4cjs.colors.grayBlue94};
-  padding: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
-  height: 30px;
-  width: 30px;
+  background-color: #edeef1; /* TODO: Use semantic token */
+  padding: ${_chunkZUAO4DW3cjs.Spacing.px["2xs"]};
+  height: 28px;
+  width: 28px;
   display: flex;
   align-items: center;
 
@@ -220,8 +225,8 @@ var CloseButtonContainer = _styled2.default.div`
     line-height: 14px;
   }
 `;
-var CloseButton = _styled2.default.call(void 0, _chunkND4ZEWCYcjs.UnstyledButton)`
-  ${_chunk2KKFVDUDcjs.standardFocusOutline}
+var CloseButton = _styled2.default.call(void 0, _chunkK5JJ5ZJPcjs.UnstyledButton)`
+  ${_chunkFPQ2OUYXcjs.standardFocusOutline}
   width: 24px;
   height: 24px;
   justify-self: flex-end;

package/dist/{chunk-5SDYMWK3.js → chunk-UVJK2G3B.js}

@@ -1,20 +1,20 @@
 import {
   Icon
-} from "./chunk-HOGSXW62.js";
+} from "./chunk-DJOYSVI3.js";
 import {
   getColor
-} from "./chunk-WFSTDMMY.js";
+} from "./chunk-AM7EMJXN.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
 } from "./chunk-W7FAWX6T.js";
 
-// src/components/IconToggle.tsx
+// src/components/MultiToggle.tsx
 import styled from "@emotion/styled";
 import { jsx } from "@emotion/react/jsx-runtime";
 import { createElement } from "@emotion/react";
-function IconToggle({
+function MultiToggle({
   options,
   selectedOption,
   onChange,
@@ -23,37 +23,43 @@ function IconToggle({
   bgColor = "c4Neutral",
   color = "mcNeutral"
 }) {
-  return /* @__PURE__ */ jsx(StyledIconToggle, { bgColor, children: options.map((_a) => {
-    var _b = _a, { key } = _b, iconProps = __objRest(_b, ["key"]);
+  return /* @__PURE__ */ jsx(StyledMultiToggle, { bgColor, children: options.map((_a) => {
+    var _b = _a, { key } = _b, optionProps = __objRest(_b, ["key"]);
+    let content = null;
+    if ("name" in optionProps) {
+      content = /* @__PURE__ */ createElement(
+        Icon,
+        __spreadProps(__spreadValues({}, optionProps), {
+          width: 11,
+          key,
+          color: key === selectedOption ? selectedColor : color
+        })
+      );
+    } else {
+      content = /* @__PURE__ */ jsx("span", { css: { fontSize: "11px", lineHeight: "11px" }, children: optionProps.text });
+    }
     return /* @__PURE__ */ jsx(
-      StyledIconToggleOption,
+      StyledMultiToggleOption,
       {
         onClick: () => onChange(key),
         selected: key === selectedOption,
         selectedBgColor,
         selectedColor,
         colorProp: color,
-        children: /* @__PURE__ */ createElement(
-          Icon,
-          __spreadProps(__spreadValues({}, iconProps), {
-            key,
-            width: 11,
-            color: key === selectedOption ? selectedColor : color
-          })
-        )
+        children: content
       },
       key
     );
   }) });
 }
-var StyledIconToggle = styled.div`
+var StyledMultiToggle = styled.div`
   border-radius: 999px;
   background: ${({ theme, bgColor }) => getColor(theme, bgColor)};
   padding: 2px;
   gap: 2px;
   display: flex;
 `;
-var StyledIconToggleOption = styled.div`
+var StyledMultiToggleOption = styled.div`
   display: flex;
   cursor: pointer;
   border-radius: 999px;
@@ -62,5 +68,5 @@ var StyledIconToggleOption = styled.div`
 `;
 
 export {
-  IconToggle
+  MultiToggle
 };

package/dist/chunk-UXQZQ4WU.js

@@ -0,0 +1,33 @@
+// src/icons/central/MagnifyingGlass.tsx
+import { jsx } from "@emotion/react/jsx-runtime";
+function MagnifyingGlass({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M20.25 20.25L16.1265 16.1265M16.1265 16.1265C17.4385 14.8145 18.25 13.002 18.25 11C18.25 6.99594 15.0041 3.75 11 3.75C6.99594 3.75 3.75 6.99594 3.75 11C3.75 15.0041 6.99594 18.25 11 18.25C13.002 18.25 14.8145 17.4385 16.1265 16.1265Z",
+          stroke: "currentColor",
+          strokeWidth,
+          strokeLinecap,
+          strokeLinejoin,
+          vectorEffect: "non-scaling-stroke"
+        }
+      )
+    }
+  );
+}
+
+export {
+  MagnifyingGlass
+};

package/dist/chunk-V62JEK7T.js

@@ -0,0 +1,10 @@
+// src/utils/locale.ts
+function getCurrentBaseLanguage() {
+  const userLocale = navigator.language;
+  const locale = new Intl.Locale(userLocale);
+  return locale.language;
+}
+
+export {
+  getCurrentBaseLanguage
+};

package/dist/chunk-VD2XST4J.js

@@ -0,0 +1,44 @@
+// src/icons/central/SettingsGear2.tsx
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+function SettingsGear2({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M8.5515 5.36958L6.7588 4.95588C6.42284 4.87835 6.07064 4.97936 5.82684 5.22316L5.22316 5.82684C4.97936 6.07064 4.87835 6.42284 4.95588 6.7588L5.36958 8.5515C5.46311 8.9568 5.29598 9.37768 4.94989 9.60841L3.1953 10.7781C2.9171 10.9636 2.75 11.2758 2.75 11.6102V12.3898C2.75 12.7242 2.9171 13.0364 3.1953 13.2219L4.94989 14.3916C5.29598 14.6223 5.46311 15.0432 5.36958 15.4485L4.95588 17.2412C4.87835 17.5772 4.97936 17.9294 5.22316 18.1732L5.82684 18.7768C6.07064 19.0206 6.42284 19.1217 6.7588 19.0441L8.5515 18.6304C8.9568 18.5369 9.37768 18.704 9.60841 19.0501L10.7781 20.8047C10.9636 21.0829 11.2758 21.25 11.6102 21.25H12.3898C12.7242 21.25 13.0364 21.0829 13.2219 20.8047L14.3916 19.0501C14.6223 18.704 15.0432 18.5369 15.4485 18.6304L17.2412 19.0441C17.5772 19.1217 17.9294 19.0206 18.1732 18.7768L18.7768 18.1732C19.0206 17.9294 19.1217 17.5772 19.0441 17.2412L18.6304 15.4485C18.5369 15.0432 18.704 14.6223 19.0501 14.3916L20.8047 13.2219C21.0829 13.0364 21.25 12.7242 21.25 12.3898V11.6102C21.25 11.2758 21.0829 10.9636 20.8047 10.7781L19.0501 9.60841C18.704 9.37768 18.5369 8.9568 18.6304 8.5515L19.0441 6.7588C19.1217 6.42284 19.0206 6.07064 18.7768 5.82684L18.1732 5.22316C17.9294 4.97936 17.5772 4.87835 17.2412 4.95588L15.4485 5.36958C15.0432 5.46311 14.6223 5.29598 14.3916 4.94989L13.2219 3.1953C13.0364 2.9171 12.7242 2.75 12.3898 2.75H11.6102C11.2758 2.75 10.9636 2.9171 10.7781 3.1953L9.60841 4.94989C9.37768 5.29598 8.9568 5.46311 8.5515 5.36958Z",
+            stroke: "currentColor",
+            strokeWidth,
+            strokeLinejoin,
+            vectorEffect: "non-scaling-stroke"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M14.75 12C14.75 13.5188 13.5188 14.75 12 14.75C10.4812 14.75 9.25 13.5188 9.25 12C9.25 10.4812 10.4812 9.25 12 9.25C13.5188 9.25 14.75 10.4812 14.75 12Z",
+            stroke: "currentColor",
+            strokeWidth,
+            strokeLinejoin,
+            vectorEffect: "non-scaling-stroke"
+          }
+        )
+      ]
+    }
+  );
+}
+
+export {
+  SettingsGear2
+};

package/dist/{chunk-DTMOOX5J.cjs → chunk-VE63R7LY.cjs}

@@ -1,18 +1,18 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkN6ND4BHBcjs = require('./chunk-N6ND4BHB.cjs');
+var _chunkVGMBQUOTcjs = require('./chunk-VGMBQUOT.cjs');
 
 
-var _chunk7QQBTG3Ocjs = require('./chunk-7QQBTG3O.cjs');
+var _chunk7H2OXTENcjs = require('./chunk-7H2OXTEN.cjs');
 
 
-var _chunk2KKFVDUDcjs = require('./chunk-2KKFVDUD.cjs');
+var _chunkFPQ2OUYXcjs = require('./chunk-FPQ2OUYX.cjs');
 
 
-var _chunkEUDYMZXOcjs = require('./chunk-EUDYMZXO.cjs');
+var _chunkHGCI5IAMcjs = require('./chunk-HGCI5IAM.cjs');
 
 
-var _chunkZBLXVPL4cjs = require('./chunk-ZBLXVPL4.cjs');
+var _chunkQYVQII3Icjs = require('./chunk-QYVQII3I.cjs');
 
 
 
@@ -55,7 +55,7 @@ var backgroundColor = "#2d2d2d";
 var InlineCode = _styled2.default.span`
   font-family: "Roboto Mono", monospace;
   background-color: #2d2d2d;
-  border: 1px solid ${_chunkEUDYMZXOcjs.themeOr.call(void 0, _chunkZBLXVPL4cjs.colors.gray90, _chunkZBLXVPL4cjs.colors.gray20)};
+  border: 1px solid ${_chunkHGCI5IAMcjs.themeOr.call(void 0, _chunkQYVQII3Icjs.colors.gray90, _chunkQYVQII3Icjs.colors.gray20)};
   border-radius: 3px;
   line-height: 24px;
   padding: 0 4px;
@@ -99,9 +99,9 @@ var codeSelectStyles = {
   }),
   option: (styles, state) => _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, styles), {
     cursor: "pointer",
-    backgroundColor: state.isSelected ? _chunkZBLXVPL4cjs.colors.gray25 : backgroundColor,
+    backgroundColor: state.isSelected ? _chunkQYVQII3Icjs.colors.gray25 : backgroundColor,
     "&:hover": {
-      backgroundColor: _chunkZBLXVPL4cjs.colors.gray25
+      backgroundColor: _chunkQYVQII3Icjs.colors.gray25
     }
   }),
   singleValue: (styles) => _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, styles), {
@@ -152,7 +152,7 @@ var CodeBlock = ({
               styles: codeSelectStyles
             }
           ) }) : null,
-          withCopyButton ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkN6ND4BHBcjs.CopyToClipboardButton, { value: children }) : null
+          withCopyButton ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVGMBQUOTcjs.CopyToClipboardButton, { value: children }) : null
         ]
       }
     )
@@ -166,7 +166,7 @@ var StyledCodeBlock = _styled2.default.div``;
 var CodeBlockHeader = _styled2.default.div`
   align-items: center;
   background-color: #2d2d2d;
-  border-bottom: 1px solid ${_chunkZBLXVPL4cjs.colors.gray25};
+  border-bottom: 1px solid ${_chunkQYVQII3Icjs.colors.gray25};
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
   color: #ffffff;
@@ -176,11 +176,11 @@ var CodeBlockHeader = _styled2.default.div`
   padding: 16px 20px;
 `;
 var CodeBlockContainer = _styled2.default.pre`
-  ${_chunk7QQBTG3Ocjs.overflowAutoWithoutScrollbars}
+  ${_chunk7H2OXTENcjs.overflowAutoWithoutScrollbars}
   &[class*="language-"] {
     padding: 20px;
     font-weight: 500;
-    ${_chunk2KKFVDUDcjs.standardBorderRadius.call(void 0, 8)}
+    ${_chunkFPQ2OUYXcjs.standardBorderRadius.call(void 0, 8)}
     ${(props) => props.hasHeader ? `border-top-left-radius: 0;
             border-top-right-radius: 0;
             margin-top: 0;` : ""}

package/dist/chunk-VF63C7JK.js

@@ -0,0 +1,33 @@
+// src/icons/central/Passkeys.tsx
+import { jsx } from "@emotion/react/jsx-runtime";
+function Passkeys({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M12.9996 12.8145C12.675 12.7719 12.3415 12.75 11.9996 12.75C8.17569 12.75 5.39226 15.4942 4.65442 19.1697C4.53893 19.745 5.00437 20.25 5.59116 20.25H13.9996M15.7496 6.5C15.7496 8.57107 14.0706 10.25 11.9996 10.25C9.9285 10.25 8.24957 8.57107 8.24957 6.5C8.24957 4.42893 9.9285 2.75 11.9996 2.75C14.0706 2.75 15.7496 4.42893 15.7496 6.5ZM15.7496 14C15.7496 12.7574 16.7569 11.75 17.9996 11.75C19.2422 11.75 20.2496 12.7574 20.2496 14C20.2496 14.7801 19.8526 15.4675 19.2496 15.8711V17L18.7496 17.9356L19.2496 18.9678V20L17.9996 21L16.7496 20V15.8711C16.1466 15.4675 15.7496 14.7801 15.7496 14Z",
+          stroke: "currentColor",
+          strokeWidth,
+          strokeLinecap,
+          strokeLinejoin,
+          vectorEffect: "non-scaling-stroke"
+        }
+      )
+    }
+  );
+}
+
+export {
+  Passkeys
+};

package/dist/{chunk-CAS7BGWD.js → chunk-VFOOK2Q5.js}

@@ -3,22 +3,19 @@ import {
 } from "./chunk-E5DUKMCU.js";
 import {
   Button
-} from "./chunk-ZR5RJNK6.js";
+} from "./chunk-U6EBWLCK.js";
 import {
   UnstyledButton
-} from "./chunk-WS4ZV4J2.js";
+} from "./chunk-Z6I64NIF.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
   Icon
-} from "./chunk-HOGSXW62.js";
+} from "./chunk-DJOYSVI3.js";
 import {
   standardFocusOutline
-} from "./chunk-WXQAFT6L.js";
-import {
-  colors
-} from "./chunk-HU2UCL6I.js";
+} from "./chunk-E46IHC27.js";
 
 // src/components/Drawer.tsx
 import styled from "@emotion/styled";
@@ -109,7 +106,15 @@ var Drawer = (props) => {
               size: "Small"
             }
           ) }),
-          props.closeButton && !props.nonDismissable && /* @__PURE__ */ jsx(CloseButtonContainer, { children: /* @__PURE__ */ jsx(CloseButton, { onClick: handleClose, type: "button", children: /* @__PURE__ */ jsx(Icon, { name: "Close", width: 10 }) }) }),
+          props.closeButton && !props.nonDismissable && /* @__PURE__ */ jsx(CloseButtonContainer, { children: /* @__PURE__ */ jsx(CloseButton, { onClick: handleClose, type: "button", children: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: "CentralCrossLarge",
+              square: true,
+              width: 16,
+              color: "grayBlue43"
+            }
+          ) }) }),
           props.children
         ] })
       }
@@ -209,10 +214,10 @@ var CloseButtonContainer = styled.div`
   top: 20px;
   right: 20px;
   border-radius: 50%;
-  background-color: ${colors.grayBlue94};
-  padding: ${Spacing.px.xs};
-  height: 30px;
-  width: 30px;
+  background-color: #edeef1; /* TODO: Use semantic token */
+  padding: ${Spacing.px["2xs"]};
+  height: 28px;
+  width: 28px;
   display: flex;
   align-items: center;
 

package/dist/{chunk-N6ND4BHB.cjs → chunk-VGMBQUOT.cjs}

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkELEYS3GZcjs = require('./chunk-ELEYS3GZ.cjs');
+var _chunkE2672QPScjs = require('./chunk-E2672QPS.cjs');
 
 
-var _chunkND4ZEWCYcjs = require('./chunk-ND4ZEWCY.cjs');
+var _chunkK5JJ5ZJPcjs = require('./chunk-K5JJ5ZJP.cjs');
 
 
-var _chunkAPCRRZMTcjs = require('./chunk-APCRRZMT.cjs');
+var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
 
 
 var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
@@ -45,12 +45,12 @@ var CopyToClipboardButton = (props) => {
         "data-tooltip-id": id,
         children: [
           props.children ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Children, { children: props.children }) : null,
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: icon, width: props.isSm ? 12 : 16 })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6Z6ZBZEJcjs.Icon, { name: icon, width: props.isSm ? 12 : 16 })
         ]
       }
     ),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkELEYS3GZcjs.Tooltip,
+      _chunkE2672QPScjs.Tooltip,
       {
         id,
         place: props.place || "right",
@@ -62,7 +62,7 @@ var CopyToClipboardButton = (props) => {
 var Children = _styled2.default.span`
   margin-right: 4px;
 `;
-var Button = _styled2.default.call(void 0, _chunkND4ZEWCYcjs.UnstyledButton)`
+var Button = _styled2.default.call(void 0, _chunkK5JJ5ZJPcjs.UnstyledButton)`
   background: rgba(0, 0, 0, 0);
   vertical-align: middle;
   ${({ ml }) => ml ? `margin-left: ${ml}px` : ""};

package/dist/{chunk-7PPCT47I.cjs → chunk-VK4EJLJ6.cjs}

@@ -6,7 +6,7 @@ var _chunkSFGLEWHWcjs = require('./chunk-SFGLEWHW.cjs');
 var _chunkB2MHM6CYcjs = require('./chunk-B2MHM6CY.cjs');
 
 
-var _chunkR5RXA5HTcjs = require('./chunk-R5RXA5HT.cjs');
+var _chunkDO3PWX7Qcjs = require('./chunk-DO3PWX7Q.cjs');
 
 
 
@@ -24,7 +24,7 @@ function getPropDefaults(props) {
   return _chunkSFGLEWHWcjs.getPropDefaultsBase.call(void 0, props, { as: props.tag || "span" });
 }
 var StyledCode = _styled2.default.span`
-  ${({ theme, size, colorProp }) => _chunkR5RXA5HTcjs.applyTypography.call(void 0, theme, "Code", size, colorProp)}
+  ${({ theme, size, colorProp }) => _chunkDO3PWX7Qcjs.applyTypography.call(void 0, theme, "Code", size, colorProp)}
   ${_chunkB2MHM6CYcjs.typographyStyles}
 `;