@lightsparkdev/ui 1.1.0 → 1.1.2

package/CHANGELOG.md

@@ -1,5 +1,54 @@
 # @lightsparkdev/ui
 
+## 1.1.2
+
+### Patch Changes
+
+- 5cfff96: - **BirthdayInput**
+  - Dropped internal validity state; added `formatDateToText` hint formatter and “must be before today” validation.
+  - **TextInput**
+    - Introduced `success` & `contentError` props, `hideNonErrorsIfBlurred`, configurable `iconOffsets`, `iconStrokeWidths`.
+  - **PhoneInput**
+    - Added `onFocus` callback.
+  - **QRCode**
+    - Swapped in new `LogoMark` asset (vs. `FramedLogoOnCircle`), adjusted image sizing.
+  - **Drawer & Modal**
+    - Added `alignBottom` and `disableTouchMove` flags to support bottom-aligned, non-dismissable drawers.
+  - **Button & Checkbox**
+    - New kinds: `green37`, `gray99`, `white21`.
+    - Added margin props (`mb`, `ml`, `mr`) for fine-grained spacing.
+  - **CardForm**
+    - Major refactor: dozens of new props (`aboveHeaderContent`, `graphicHeader`, `centeredContent`, `paddingX`, `contentMarginTop`, `formButtonTopMargin`, `selectMarginTop`, `smDontAdjustWidth`, etc.).
+    - Extracted `CardFormHeadline`/`CenteredHeader`, wrapped forms in a `Flex` when using graphic headers.
+  - **InputSubtext**
+    - Now supports rich React-node `content`, distinguishes error vs. success styling, and respects “hide if blurred” logic.
+  - **Toasts**
+    - Added optional `type` (`error` | `success` | `info`) to color toast backgrounds.
+  - **Hooks**
+    - **`useFields`**: validator signature now `(value, fields?)`; added `matchesField` and `clabe` validators; smarter merge to prevent unnecessary rerenders.
+    - **`useQueryParamBooleans`**: new hook for parsing multiple boolean query parameters at once.
+  - **Icons**
+    - Introduced dozens of new icons (e.g. `LogoMark`, `LightningBoltOutline`, `NonagonCheckmark`, `NubankLogo`) plus a full “central” icon set under `icons/central/`.
+    - Standardized on a `PathProps` interface for configurable strokes.
+  - **Styles & Theme**
+    - **Colors**: added `gray35`, `gray7`, `white21`, `green37`, `blue32`, `linkLight`.
+    - **Layout helper**: `buildStandardContentInset` gains an `smDontAdjustWidth` opt-out.
+    - Tweaked `smHeaderLogoMarginLeft` (30px → 20px).
+    - **Button themes**: added `white21`, `linkLight`, and `tertiary` kinds.
+    - **CardForm theme**: now allows zero padding for new layout options.
+- Updated dependencies [5cfff96]
+  - @lightsparkdev/core@1.4.0
+
+## 1.1.1
+
+### Patch Changes
+
+- b21b85e: \* Surface error name when the requester hits a graphQL error.
+  - Update Turbo
+  - Several small UI package improvements.
+- Updated dependencies [b21b85e]
+  - @lightsparkdev/core@1.3.1
+
 ## 1.1.0
 
 ### Minor Changes

package/dist/{chunk-BWOYXWUT.cjs → chunk-24JSFAVR.cjs}

@@ -1,15 +1,15 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunk7JIOBZFScjs = require('./chunk-7JIOBZFS.cjs');
+var _chunkHW7ECH4Ncjs = require('./chunk-HW7ECH4N.cjs');
 
 
-var _chunk2PI3XHGDcjs = require('./chunk-2PI3XHGD.cjs');
+var _chunkAO75KOAAcjs = require('./chunk-AO75KOAA.cjs');
 
 
 var _chunkCH2PLO6Fcjs = require('./chunk-CH2PLO6F.cjs');
 
 
-var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
+var _chunk4JJ5GJLEcjs = require('./chunk-4JJ5GJLE.cjs');
 
 
 var _chunkJA7KZV3Qcjs = require('./chunk-JA7KZV3Q.cjs');
@@ -21,11 +21,11 @@ function SatoshiInputLabel({
   availableSats,
   showTooltip = true
 }) {
-  const availableSatsTooltipNode = showTooltip ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunk2PI3XHGDcjs.Label, { style: { display: "inline-flex", margin: "0 0 0 3px" }, children: [
+  const availableSatsTooltipNode = showTooltip ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHW7ECH4Ncjs.Label, { style: { display: "inline-flex", margin: "0 0 0 3px" }, children: [
     "available",
     " ",
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunk7JIOBZFScjs.InfoIconTooltip,
+      _chunkAO75KOAAcjs.InfoIconTooltip,
       {
         id: "available-balance-tooltip",
         content: [
@@ -38,10 +38,10 @@ function SatoshiInputLabel({
       }
     )
   ] }) : null;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunk2PI3XHGDcjs.Label, { children: [
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHW7ECH4Ncjs.Label, { children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: text }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: availableSats !== void 0 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6Z6ZBZEJcjs.Icon, { name: "Satoshi", width: 8, mr: 4, verticalAlign: -2 }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4JJ5GJLEcjs.Icon, { name: "Satoshi", width: 8, mr: 4, verticalAlign: -2 }),
       _chunkJA7KZV3Qcjs.addCommasToDigits.call(void 0, Math.floor(availableSats)),
       availableSatsTooltipNode
     ] }) })

package/dist/{chunk-37ZNE6RR.cjs → chunk-26C7EHMN.cjs}

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkPMF5K72Fcjs = require('./chunk-PMF5K72F.cjs');
+var _chunkKOGW3LJCcjs = require('./chunk-KOGW3LJC.cjs');
 
 
 
-var _chunkTBJKNYG4cjs = require('./chunk-TBJKNYG4.cjs');
+var _chunkW4A62SQRcjs = require('./chunk-W4A62SQR.cjs');
 
 
 
@@ -13,12 +13,12 @@ var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
 // src/components/typography/Headline.tsx
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 function Headline(props) {
-  const propsWithDefaults = _chunkTBJKNYG4cjs.getPropDefaults.call(void 0, props);
+  const propsWithDefaults = _chunkW4A62SQRcjs.getPropDefaults.call(void 0, props);
   let reactNodes = props.children || null;
   if (props.content) {
-    reactNodes = _chunkPMF5K72Fcjs.toReactNodes.call(void 0, props.content);
+    reactNodes = _chunkKOGW3LJCcjs.toReactNodes.call(void 0, props.content);
   }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTBJKNYG4cjs.StyledHeadline, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, propsWithDefaults), { children: reactNodes }));
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkW4A62SQRcjs.StyledHeadline, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, propsWithDefaults), { children: reactNodes }));
 }
 
 

package/dist/{chunk-2BUWDSLS.js → chunk-27SNMODC.js}

@@ -1,15 +1,15 @@
 import {
   Filter
-} from "./chunk-C3ZJV5MQ.js";
+} from "./chunk-CSQII7YP.js";
 import {
   TextInput
-} from "./chunk-JU2FTCTN.js";
+} from "./chunk-DFYU5VPB.js";
 import {
   Spacing
 } from "./chunk-E5DUKMCU.js";
 import {
   Button
-} from "./chunk-U6EBWLCK.js";
+} from "./chunk-ADV4UT4X.js";
 import {
   __spreadProps,
   __spreadValues

package/dist/{chunk-GWGAYSYH.cjs → chunk-2A6IUQFD.cjs}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
+var _chunk4JJ5GJLEcjs = require('./chunk-4JJ5GJLE.cjs');
 
 
-var _chunk5SPEBEERcjs = require('./chunk-5SPEBEER.cjs');
+var _chunkOBUN65IKcjs = require('./chunk-OBUN65IK.cjs');
 
 // src/components/CurrencyAmount.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -78,7 +78,7 @@ function CurrencyAmount({
   }
   let content = formattedNumber;
   if (typography && typography.type) {
-    content = _chunk5SPEBEERcjs.renderTypography.call(void 0, typography.type, {
+    content = _chunkOBUN65IKcjs.renderTypography.call(void 0, typography.type, {
       size: typography.size,
       color: typography.color,
       children: formattedNumber
@@ -93,9 +93,9 @@ function CurrencyAmount({
 var CurrencyIcon = ({ unit }) => {
   switch (unit) {
     case _core.CurrencyUnit.BITCOIN:
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6Z6ZBZEJcjs.Icon, { name: "BitcoinB", width: 8, verticalAlign: -2, mr: 2 });
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4JJ5GJLEcjs.Icon, { name: "BitcoinB", width: 8, verticalAlign: -2, mr: 2 });
     case _core.CurrencyUnit.SATOSHI:
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6Z6ZBZEJcjs.Icon, { name: "Satoshi", width: 8, verticalAlign: -2, mr: 2 });
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4JJ5GJLEcjs.Icon, { name: "Satoshi", width: 8, verticalAlign: -2, mr: 2 });
     default:
       return null;
   }

package/dist/{chunk-OLNRE3IL.js → chunk-2BAYI25M.js}

@@ -1,9 +1,9 @@
 import {
   SingleCodeInput
-} from "./chunk-22SE37H7.js";
+} from "./chunk-QZ2TJYBO.js";
 import {
   textInputBorderColor
-} from "./chunk-KU4X4VPI.js";
+} from "./chunk-TKOYRZ7J.js";
 import {
   __spreadProps,
   __spreadValues

package/dist/{chunk-63FTHNXH.js → chunk-2FY7MSPJ.js}

@@ -1,11 +1,14 @@
 // src/icons/ZapLite.tsx
 import { jsx } from "@emotion/react/jsx-runtime";
-function ZapLite() {
+function ZapLite({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
   return /* @__PURE__ */ jsx(
     "svg",
     {
-      width: "24",
-      height: "24",
+      width: "100%",
       viewBox: "0 0 24 24",
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
@@ -13,9 +16,10 @@ function ZapLite() {
         "path",
         {
           d: "M19.7977 8.74998H13.7499C13.4738 8.74998 13.2499 8.52612 13.2499 8.24998V2.35568C13.2499 1.86503 12.6168 1.6679 12.3383 2.07181L3.79055 14.4661C3.5618 14.7978 3.79923 15.25 4.20215 15.25H10.2499C10.526 15.25 10.7499 15.4739 10.7499 15.75V21.6443C10.7499 22.135 11.3829 22.3321 11.6615 21.9282L20.2093 9.53385C20.4381 9.20216 20.2006 8.74998 19.7977 8.74998Z",
-          stroke: "#16171A",
-          strokeWidth: "1.5",
-          strokeLinejoin: "round"
+          stroke: "currentColor",
+          strokeWidth,
+          strokeLinecap,
+          strokeLinejoin
         }
       )
     }

package/dist/chunk-2GW2BIB4.cjs

@@ -0,0 +1,36 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/NonagonCheckmark.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function NonagonCheckmark() {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 12 12",
+      fill: "none",
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "path",
+          {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M6.00008 1C6.10868 1 6.21193 1.04708 6.28313 1.12905L7.36998 2.37994L9.00663 2.12032C9.11388 2.10331 9.22323 2.13362 9.30643 2.20342C9.38963 2.27322 9.43848 2.37566 9.44033 2.48423L9.46883 4.14109L10.8895 4.99422C10.9826 5.05015 11.0469 5.14365 11.0657 5.2506C11.0846 5.35755 11.0561 5.4674 10.9878 5.55175L9.94463 6.83935L10.4845 8.406C10.5199 8.5087 10.509 8.62165 10.4547 8.7157C10.4004 8.80975 10.308 8.87565 10.2014 8.8963L8.57468 9.2121L7.98123 10.7593C7.94233 10.8607 7.86138 10.9403 7.75933 10.9774C7.65728 11.0146 7.54418 11.0056 7.44923 10.953L6.00008 10.1492L4.55092 10.953C4.45596 11.0056 4.34282 11.0146 4.24078 10.9774C4.13874 10.9403 4.0578 10.8607 4.01891 10.7593L3.42543 9.2121L1.7987 8.8963C1.6921 8.87565 1.5997 8.80975 1.5454 8.7157C1.49111 8.62165 1.48024 8.5087 1.51562 8.406L2.0555 6.83935L1.01234 5.55175C0.943982 5.4674 0.915552 5.35755 0.934412 5.2506C0.953267 5.14365 1.01756 5.05015 1.11065 4.99422L2.53127 4.14109L2.55979 2.48423C2.56166 2.37566 2.61051 2.27322 2.69369 2.20342C2.77688 2.13362 2.88624 2.10331 2.99349 2.12032L4.63013 2.37994L5.71698 1.12905C5.78823 1.04708 5.89148 1 6.00008 1ZM7.51523 5.64015C7.66168 5.4937 7.66168 5.2563 7.51523 5.10985C7.36878 4.96339 7.13133 4.96339 6.98488 5.10985L5.50008 6.59465L5.01523 6.10985C4.86878 5.9634 4.63134 5.9634 4.4849 6.10985C4.33845 6.2563 4.33845 6.4937 4.4849 6.64015L5.23488 7.39015C5.30523 7.4605 5.40063 7.5 5.50008 7.5C5.59953 7.5 5.69493 7.4605 5.76523 7.39015L7.51523 5.64015Z",
+            fill: "currentColor"
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "path",
+          {
+            d: "M7.51523 5.64015C7.66168 5.4937 7.66168 5.2563 7.51523 5.10985C7.36878 4.96339 7.13133 4.96339 6.98488 5.10985L5.50008 6.59465L5.01523 6.10985C4.86878 5.9634 4.63134 5.9634 4.4849 6.10985C4.33845 6.2563 4.33845 6.4937 4.4849 6.64015L5.23488 7.39015C5.30523 7.4605 5.40063 7.5 5.50008 7.5C5.59953 7.5 5.69493 7.4605 5.76523 7.39015L7.51523 5.64015Z",
+            fill: "#0068C9"
+          }
+        )
+      ]
+    }
+  );
+}
+
+
+
+exports.NonagonCheckmark = NonagonCheckmark;

package/dist/{chunk-3GWGT73J.cjs → chunk-2ICSBUTV.cjs}

@@ -1,32 +1,32 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkFOUSEEFHcjs = require('./chunk-FOUSEEFH.cjs');
+var _chunkNN6GDACAcjs = require('./chunk-NN6GDACA.cjs');
 
 
-var _chunkPMF5K72Fcjs = require('./chunk-PMF5K72F.cjs');
+var _chunkKOGW3LJCcjs = require('./chunk-KOGW3LJC.cjs');
 
 
 
 
-var _chunk7H2OXTENcjs = require('./chunk-7H2OXTEN.cjs');
+var _chunkXIFHBLNQcjs = require('./chunk-XIFHBLNQ.cjs');
 
 
-var _chunkK5JJ5ZJPcjs = require('./chunk-K5JJ5ZJP.cjs');
+var _chunkJRCDVJMMcjs = require('./chunk-JRCDVJMM.cjs');
 
 
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
+var _chunk4JJ5GJLEcjs = require('./chunk-4JJ5GJLE.cjs');
 
 
-var _chunkFPQ2OUYXcjs = require('./chunk-FPQ2OUYX.cjs');
+var _chunkO6BZRC56cjs = require('./chunk-O6BZRC56.cjs');
 
 
-var _chunkHGCI5IAMcjs = require('./chunk-HGCI5IAM.cjs');
+var _chunkQI7YHMJZcjs = require('./chunk-QI7YHMJZ.cjs');
 
 
-var _chunkQYVQII3Icjs = require('./chunk-QYVQII3I.cjs');
+var _chunkGICIJWP3cjs = require('./chunk-GICIJWP3.cjs');
 
 
 
@@ -183,7 +183,7 @@ function Toasts({
     const fromCurrent = i === currentToastIndex ? 0 : currentToastIndex - i;
     const movingToCurrent = currentToast.isHiding && i === currentToastIndex - 1;
     const hidingFromCurrent = currentToast.isHiding ? fromCurrent - 1 : fromCurrent;
-    const nodes = toast.content ? _chunkFOUSEEFHcjs.setDefaultReactNodesTypography.call(void 0, toast.content, {
+    const nodes = toast.content ? _chunkNN6GDACAcjs.setDefaultReactNodesTypography.call(void 0, toast.content, {
       default: defaultTypography
     }).map((node) => {
       if (_lodashes.isObject.call(void 0, node) && "typography" in node && node.typography) {
@@ -201,11 +201,12 @@ function Toasts({
       }
       return node;
     }) : null;
-    const contentNode = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: nodes ? _chunkPMF5K72Fcjs.toReactNodes.call(void 0, nodes) : null });
+    const contentNode = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: nodes ? _chunkKOGW3LJCcjs.toReactNodes.call(void 0, nodes) : null });
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react.Fragment, { children: _reactdom2.default.createPortal(
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
         StyledToast,
         {
+          backgroundColor: toast.type === "error" ? _chunkGICIJWP3cjs.colors.red50 : toast.type === "success" ? _chunkGICIJWP3cjs.colors.green37 : void 0,
           isActive: toast.isActive,
           isHiding: toast.isHiding,
           isVisible: fromCurrent < maxVisible,
@@ -224,18 +225,18 @@ function Toasts({
           children: [
             contentNode,
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkK5JJ5ZJPcjs.UnstyledButton,
+              _chunkJRCDVJMMcjs.UnstyledButton,
               {
-                css: _chunk7H2OXTENcjs.extend.call(void 0, _chunk7H2OXTENcjs.flexCenter, {
+                css: _chunkXIFHBLNQcjs.extend.call(void 0, _chunkXIFHBLNQcjs.flexCenter, {
                   position: "absolute",
                   right: "5px",
                   top: "-1px",
                   height: "50px",
                   width: "50px",
-                  outlineColor: `${_chunkQYVQII3Icjs.colors.white} !important`
+                  outlineColor: `${_chunkGICIJWP3cjs.colors.white} !important`
                 }),
                 onClick: () => hideToast(toast.id),
-                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk6Z6ZBZEJcjs.Icon, { name: "Close", width: 9 })
+                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4JJ5GJLEcjs.Icon, { name: "Close", width: 9 })
               }
             )
           ]
@@ -252,12 +253,12 @@ var minScale = 0.95;
 var StyledToast = _styled2.default.div`
   position: fixed;
   z-index: ${_chunkZU72XWNEcjs.z.toast};
-  line-height: ${_chunk7H2OXTENcjs.pxToRems.call(void 0, 16)};
+  line-height: ${_chunkXIFHBLNQcjs.pxToRems.call(void 0, 16)};
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   font-weight: 500;
-  background-color: ${({ isCurrent, movingToCurrent }) => isCurrent || movingToCurrent ? _chunkQYVQII3Icjs.colors.blue43 : _chunkHGCI5IAMcjs.themeOr.call(void 0, "#2A50B2", _chunkQYVQII3Icjs.colors.blue43)};
+  background-color: ${({ isCurrent, movingToCurrent, backgroundColor }) => isCurrent || movingToCurrent ? backgroundColor != null ? backgroundColor : _chunkGICIJWP3cjs.colors.blue43 : backgroundColor != null ? backgroundColor : _chunkQI7YHMJZcjs.themeOr.call(void 0, "#2A50B2", _chunkGICIJWP3cjs.colors.blue43)};
   color: rgba(255, 255, 255, 0);
   padding: 16px 24px;
   ${({ duration }) => !duration && "padding-right: 50px;"}
@@ -272,7 +273,7 @@ var StyledToast = _styled2.default.div`
   transform: translateX(-50%);
   text-overflow: ellipsis;
   overflow: hidden;
-  max-width: calc(100% - ${_chunkFPQ2OUYXcjs.standardContentInset.smPx * 2}px);
+  max-width: calc(100% - ${_chunkO6BZRC56cjs.standardContentInset.smPx * 2}px);
 
   max-height: ${beginHeightPx}px;
   width: 0px;

package/dist/{chunk-A7A4CG6B.cjs → chunk-2RBXFWZM.cjs}

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

package/dist/{chunk-PMKBHZ4E.cjs → chunk-2W2RDGG3.cjs}

@@ -1,6 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/Uma.tsx
 var _jsxruntime = require('@emotion/react/jsx-runtime');
-function Uma() {
+function Uma({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "svg",
     {

package/dist/{chunk-LGS3OH6G.js → chunk-2X3SN2NQ.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-E5DUKMCU.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-RKAVKJX6.js";
+} from "./chunk-YWNKHN46.js";
 import {
   Icon
-} from "./chunk-DJOYSVI3.js";
+} from "./chunk-JWFDHULW.js";
 import {
   standardBorderRadius
-} from "./chunk-E46IHC27.js";
+} from "./chunk-HQN2LS2G.js";
 
 // src/components/Collapsible.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-CC3VPMH3.cjs → chunk-2XUU3FQ4.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunk2PI3XHGDcjs = require('./chunk-2PI3XHGD.cjs');
+var _chunkHW7ECH4Ncjs = require('./chunk-HW7ECH4N.cjs');
 
 // src/components/CodeInput/SingleCodeInput.tsx
 var _react = require('@emotion/react');
@@ -31,10 +31,11 @@ function SingleCodeInput({
   const theme = _react.useTheme.call(void 0, );
   const defaultCSS = _react.css.call(void 0, 
     `
-      ${_chunk2PI3XHGDcjs.textInputStyle.call(void 0, {
+      ${_chunkHW7ECH4Ncjs.textInputStyle.call(void 0, {
       theme,
       disabled: Boolean(disabled),
-      hasError: false
+      hasError: false,
+      borderRadius: 8
     }).styles}
       width: ${width};
       max-width: ${defaultWidth};

package/dist/{chunk-K33DLKPB.cjs → chunk-2YBZV2K6.cjs}

@@ -5,6 +5,7 @@ var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
 
 // src/components/Flex.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _lodashes = require('lodash-es');
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 function Flex({
   center = false,
@@ -26,7 +27,10 @@ function Flex({
   pt,
   pr,
   pb,
-  pl
+  pl,
+  height,
+  width,
+  position
 }) {
   const justify = justifyProp ? justifyProp : center ? "center" : "stretch";
   const align = alignProp ? alignProp : center ? "center" : "stretch";
@@ -50,7 +54,10 @@ function Flex({
       pr,
       pb,
       pl,
-      gap
+      gap,
+      height,
+      width,
+      position
     }, asButtonProps), {
       children
     })
@@ -99,6 +106,10 @@ var StyledFlex = _styled2.default.div`
   ${({ pr }) => pr && `padding-right: ${pr}px;`}
   ${({ pb }) => pb && `padding-bottom: ${pb}px;`}
   ${({ pl }) => pl && `padding-left: ${pl}px;`}
+
+  ${({ height }) => height && (_lodashes.isNumber.call(void 0, height) ? `height: ${height}px;` : `height: ${height};`)}
+  ${({ width }) => width && (_lodashes.isNumber.call(void 0, width) ? `width: ${width}px;` : `width: ${width};`)}
+  ${({ position }) => position && `position: ${position};`}
 `;
 
 

package/dist/{chunk-HBDF6JWW.cjs → chunk-3EIRVYIC.cjs}

@@ -1,21 +1,21 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunk7H2OXTENcjs = require('./chunk-7H2OXTEN.cjs');
+var _chunkJZ3TGO3Dcjs = require('./chunk-JZ3TGO3D.cjs');
 
 
-var _chunk6Z6ZBZEJcjs = require('./chunk-6Z6ZBZEJ.cjs');
+var _chunkXIFHBLNQcjs = require('./chunk-XIFHBLNQ.cjs');
 
 
-var _chunkDO3PWX7Qcjs = require('./chunk-DO3PWX7Q.cjs');
+var _chunk4JJ5GJLEcjs = require('./chunk-4JJ5GJLE.cjs');
 
 
-var _chunkJA7KZV3Qcjs = require('./chunk-JA7KZV3Q.cjs');
+var _chunkLDNG63AKcjs = require('./chunk-LDNG63AK.cjs');
 
 
-var _chunkTBZZXLAMcjs = require('./chunk-TBZZXLAM.cjs');
+var _chunkJA7KZV3Qcjs = require('./chunk-JA7KZV3Q.cjs');
 
 
-var _chunkJZ3TGO3Dcjs = require('./chunk-JZ3TGO3D.cjs');
+var _chunkWKRK7DGRcjs = require('./chunk-WKRK7DGR.cjs');
 
 
 
@@ -79,7 +79,7 @@ function ClipboardTextField({
   };
   const typographyType = (typography == null ? void 0 : typography.type) || "Body";
   const typographySize = (typography == null ? void 0 : typography.size) || "ExtraSmall";
-  const lineHeight = _chunkTBZZXLAMcjs.getLineHeightNumberForTypographyType.call(void 0, 
+  const lineHeight = _chunkWKRK7DGRcjs.getLineHeightNumberForTypographyType.call(void 0, 
     typographyType,
     typographySize,
     theme
@@ -95,7 +95,7 @@ function ClipboardTextField({
     }, commonProps), {
       children: [
         icon && iconSide === "left" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunk6Z6ZBZEJcjs.Icon,
+          _chunk4JJ5GJLEcjs.Icon,
           {
             name: "Copy",
             width: lineHeight * 0.7,
@@ -105,7 +105,7 @@ function ClipboardTextField({
         ) : null,
         valueNode,
         icon && iconSide === "right" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunk6Z6ZBZEJcjs.Icon,
+          _chunk4JJ5GJLEcjs.Icon,
           {
             name: "Copy",
             width: lineHeight * 0.7,
@@ -141,11 +141,11 @@ var ClipboardTextFieldValue = _styled2.default.span`
   vertical-align: middle;
 
   ${({ addLineClamp, maxLines }) => addLineClamp && maxLines ? `
-        ${_chunk7H2OXTENcjs.lineClamp.call(void 0, maxLines).styles}
+        ${_chunkXIFHBLNQcjs.lineClamp.call(void 0, maxLines).styles}
         align-self: baseline;
       ` : ""}
 
-  ${({ theme, typography }) => _chunkDO3PWX7Qcjs.applyTypography.call(void 0, 
+  ${({ theme, typography }) => _chunkLDNG63AKcjs.applyTypography.call(void 0, 
   theme,
   (typography == null ? void 0 : typography.type) || "Body",
   (typography == null ? void 0 : typography.size) || "ExtraSmall",

package/dist/{chunk-RAIZMT6F.js → chunk-3JLU2SA3.js}

@@ -1,36 +1,36 @@
 import {
   InfoIconTooltip
-} from "./chunk-7GO3GN57.js";
+} from "./chunk-STCHSKF7.js";
 import {
   ClipboardTextField
-} from "./chunk-NXZY7WP4.js";
+} from "./chunk-MKERXZUC.js";
+import {
+  useClipboard
+} from "./chunk-QHODHUW2.js";
 import {
   lineClamp,
   overflowAutoWithoutScrollbars
-} from "./chunk-RKAVKJX6.js";
+} from "./chunk-YWNKHN46.js";
 import {
   Loading
-} from "./chunk-MYRSWJPJ.js";
+} from "./chunk-4D4LDRA5.js";
 import {
   Icon
-} from "./chunk-DJOYSVI3.js";
+} from "./chunk-JWFDHULW.js";
 import {
   standardContentInset
-} from "./chunk-E46IHC27.js";
+} from "./chunk-HQN2LS2G.js";
 import {
   Link,
   replaceParams,
   useNavigate
-} from "./chunk-5HDXWO2E.js";
+} from "./chunk-YIEDSI2X.js";
 import {
   themeOrWithKey
-} from "./chunk-AM7EMJXN.js";
+} from "./chunk-NF6LGARO.js";
 import {
   bp
 } from "./chunk-JSGRNWSB.js";
-import {
-  useClipboard
-} from "./chunk-QHODHUW2.js";
 import {
   __spreadProps,
   __spreadValues

package/dist/chunk-3KRQU3PT.js

@@ -0,0 +1,25 @@
+// src/hooks/useDebounce.tsx
+import { debounce } from "lodash-es";
+import { useEffect, useState } from "react";
+function useDebounce(value, delay = 0, options) {
+  const [current, setCurrent] = useState(value);
+  const jsonOptions = JSON.stringify(options);
+  useEffect(() => {
+    const debounced = debounce(
+      () => {
+        setCurrent(value);
+      },
+      delay,
+      options
+    );
+    debounced();
+    return () => {
+      debounced.cancel();
+    };
+  }, [value, delay, jsonOptions]);
+  return current;
+}
+
+export {
+  useDebounce
+};

package/dist/{chunk-6X6QKELE.cjs → chunk-3MYJB3JQ.cjs}

@@ -9,7 +9,7 @@ var _chunkB2MHM6CYcjs = require('./chunk-B2MHM6CY.cjs');
 var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
 
 
-var _chunkDO3PWX7Qcjs = require('./chunk-DO3PWX7Q.cjs');
+var _chunkLDNG63AKcjs = require('./chunk-LDNG63AK.cjs');
 
 
 
@@ -28,7 +28,7 @@ function getPropDefaults(props) {
   return _chunkSFGLEWHWcjs.getPropDefaultsBase.call(void 0, props, { as: props.tag || "h1" });
 }
 var StyledDisplay = _styled2.default.h1`
-  ${({ theme, size, colorProp }) => _chunkDO3PWX7Qcjs.applyTypography.call(void 0, theme, "Display", size, colorProp)}
+  ${({ theme, size, colorProp }) => _chunkLDNG63AKcjs.applyTypography.call(void 0, theme, "Display", size, colorProp)}
   ${_chunkB2MHM6CYcjs.typographyStyles}
 `;
 function displaySelector(element) {