@lightsparkdev/ui 1.1.0 → 1.1.2

package/dist/chunk-D4UK7XQF.js

@@ -0,0 +1,48 @@
+// src/icons/central/WeakStrength.tsx
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+function WeakStrengthIcon({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      strokeWidth,
+      strokeLinecap,
+      strokeLinejoin,
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M11.6133 2C10.969 2 10.4467 2.52233 10.4467 3.16667V12.8333C10.4467 13.4777 10.969 14 11.6133 14H12.8333C13.4777 14 14 13.4777 14 12.8333V3.16667C14 2.52233 13.4777 2 12.8333 2H11.6133Z",
+            fill: "#B6BAC3"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M7.38677 5.55566C6.74244 5.55566 6.22009 6.078 6.22009 6.72234V12.8335C6.22009 13.4777 6.74244 14.0001 7.38677 14.0001H8.60677C9.25111 14.0001 9.77344 13.4777 9.77344 12.8334V6.72234C9.77344 6.078 9.25111 5.55566 8.60677 5.55566H7.38677Z",
+            fill: "#B6BAC3"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M3.16667 8.51855C2.52233 8.51855 2 9.04089 2 9.68522V12.8334C2 13.4778 2.52233 14.0001 3.16667 14.0001H4.38667C5.031 14.0001 5.55333 13.4778 5.55333 12.8334V9.68522C5.55333 9.04089 5.031 8.51855 4.38667 8.51855H3.16667Z",
+            fill: "currentColor"
+          }
+        )
+      ]
+    }
+  );
+}
+
+export {
+  WeakStrengthIcon
+};

package/dist/{chunk-JU2FTCTN.js → chunk-DFYU5VPB.js}

@@ -1,41 +1,41 @@
 import {
   ToggleContainer
-} from "./chunk-FXDEUNPF.js";
+} from "./chunk-R2AGQ3JJ.js";
 import {
   InputSubtext,
   defaultTextInputTypography,
   inputSpacingPx,
   textInputPlaceholderColor,
   textInputStyle
-} from "./chunk-KU4X4VPI.js";
+} from "./chunk-TKOYRZ7J.js";
 import {
   CheckboxContainer
-} from "./chunk-C2LNBFQJ.js";
+} from "./chunk-KMV6MVFT.js";
 import {
   Loading
-} from "./chunk-MYRSWJPJ.js";
-import {
-  Tooltip
-} from "./chunk-KPNJ6H7M.js";
+} from "./chunk-4D4LDRA5.js";
 import {
   UnstyledButton
-} from "./chunk-Z6I64NIF.js";
+} from "./chunk-BJP4OTMN.js";
+import {
+  Tooltip
+} from "./chunk-EOKBV2EI.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
   Icon,
   IconContainer
-} from "./chunk-DJOYSVI3.js";
+} from "./chunk-JWFDHULW.js";
 import {
   standardBorderRadius
-} from "./chunk-E46IHC27.js";
+} from "./chunk-HQN2LS2G.js";
 import {
   applyTypography
-} from "./chunk-H2R5LMTF.js";
+} from "./chunk-I6WJCP2T.js";
 import {
   getFontColor
-} from "./chunk-AM7EMJXN.js";
+} from "./chunk-NF6LGARO.js";
 import {
   __spreadProps,
   __spreadValues
@@ -47,8 +47,9 @@ import React, { useState } from "react";
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";
 var selectLeftOffset = 10;
 var iconSides = ["left", "right"];
-var iconOffsets = ["small", "large"];
-var iconWidths = [8, 12, 16];
+var iconOffsets = ["small", "medium", "large"];
+var iconWidths = [8, 12, 16, 20];
+var iconStrokeWidths = [1, 1.5, 2];
 function withDefaults(textInputProps) {
   return __spreadProps(__spreadValues({}, textInputProps), {
     width: textInputProps.width || "full",
@@ -58,7 +59,7 @@ function withDefaults(textInputProps) {
   });
 }
 function TextInput(textInputProps) {
-  var _a, _b;
+  var _a, _b, _c, _d, _e;
   const props = withDefaults(textInputProps);
   const [focused, setFocused] = useState(false);
   const inputRef = props.inputRef || React.createRef();
@@ -71,13 +72,14 @@ function TextInput(textInputProps) {
       props.onEnter();
     }
   };
-  const hasError = Boolean(props.error);
+  const hasError = Boolean(props.error || props.contentError);
+  const hasSuccess = Boolean(props.success || props.contentSuccess);
   const iconSide = props.icon ? props.icon.side || "right" : void 0;
   const hasIconLeft = Boolean(props.icon && iconSide === "left");
   const hasIconRight = Boolean(props.icon && iconSide === "right") || props.loading;
   const iconWidth = ((_a = props.icon) == null ? void 0 : _a.width) || 12;
-  const iconCenterOffset = ((_b = props.icon) == null ? void 0 : _b.offset) === "large" ? 26 : 18;
-  const iconTextOffset = iconCenterOffset === 18 ? 4 : 14;
+  const iconCenterOffset = ((_b = props.icon) == null ? void 0 : _b.offset) === "large" || ((_c = props.icon) == null ? void 0 : _c.offset) === "medium" ? 26 : 18;
+  const iconTextOffset = ((_d = props.icon) == null ? void 0 : _d.offset) === "large" ? 14 : ((_e = props.icon) == null ? void 0 : _e.offset) === "medium" ? 8 : 4;
   const leftIconOffset = iconCenterOffset - iconWidth / 2;
   let paddingLeftPx;
   if (typeof props.paddingX === "number") {
@@ -149,6 +151,7 @@ function TextInput(textInputProps) {
         activeOutline: props.activeOutline,
         activeOutlineColor: props.activeOutlineColor,
         hasError,
+        hasSuccess,
         "data-test-id": props.testId,
         typography: props.typography,
         autoComplete: props.autoComplete === "off" ? "new-password" : props.autoComplete,
@@ -159,6 +162,7 @@ function TextInput(textInputProps) {
           }
         },
         borderRadius: props.borderRadius,
+        borderWidth: props.borderWidth,
         enterKeyHint: props.enterKeyHint,
         autoFocus: props.autoFocus
       }
@@ -177,7 +181,14 @@ function TextInput(textInputProps) {
           hasValue: Boolean(props.value),
           colorProp: props.typography.color,
           iconOffset: typeof props.paddingX === "number" ? props.paddingX : leftIconOffset,
-          children: /* @__PURE__ */ jsx(Icon, { name: props.icon.name, width: iconWidth })
+          children: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: props.icon.name,
+              width: iconWidth,
+              iconProps: { strokeWidth: props.icon.strokeWidth }
+            }
+          )
         }
       ),
       input,
@@ -191,20 +202,28 @@ function TextInput(textInputProps) {
           hasValue: Boolean(props.value),
           colorProp: props.typography.color,
           iconOffset: typeof props.paddingX === "number" ? props.paddingX : rightIconOffset,
-          children: props.loading ? /* @__PURE__ */ jsx(Loading, { center: false, size: rightIconWidth }) : props.icon && iconSide === "right" ? /* @__PURE__ */ jsx(Icon, { name: props.icon.name, width: rightIconWidth }) : null
+          children: props.loading ? /* @__PURE__ */ jsx(Loading, { center: false, size: rightIconWidth }) : props.icon && iconSide === "right" ? /* @__PURE__ */ jsx(
+            Icon,
+            {
+              name: props.icon.name,
+              width: rightIconWidth,
+              iconProps: { strokeWidth: props.icon.strokeWidth }
+            }
+          ) : null
         }
       )
     ] });
   }
   const hintTooltipId = props.hintTooltip ? `${props.id || "input"}-hint-tooltip` : void 0;
   const { select } = props;
-  return /* @__PURE__ */ jsxs(StyledTextInput, { widthProp: textInputWidth, children: [
+  return /* @__PURE__ */ jsxs(StyledTextInput, { widthProp: textInputWidth, marginTop: props.marginTop, children: [
     props.label ? /* @__PURE__ */ jsx(TextInputLabel, { hasError, children: props.label }) : null,
     select && /* @__PURE__ */ jsx(
       TextInputSelect,
       {
         value: select.value,
         widthProp: select.width,
+        heightProp: select.height,
         typography: props.typography,
         onChange: (event) => {
           var _a2;
@@ -218,9 +237,13 @@ function TextInput(textInputProps) {
     /* @__PURE__ */ jsx(
       InputSubtext,
       {
-        text: props.error || props.hint,
+        text: props.error || props.success || props.hint,
+        content: props.contentError || props.contentSuccess,
         hasError,
-        tooltipId: hintTooltipId
+        hasSuccess,
+        tooltipId: hintTooltipId,
+        hideNonErrorsIfBlurred: props.hideNonErrorsIfBlurred,
+        focused
       }
     ),
     props.hintTooltip ? /* @__PURE__ */ jsx(Tooltip, { id: hintTooltipId, content: props.hintTooltip, place: "right" }) : null
@@ -234,7 +257,7 @@ var TextInputSelect = styled.select`
   background-color: transparent;
   top: 0;
   left: ${selectLeftOffset}px;
-  height: 48px;
+  height: ${({ heightProp }) => `${heightProp}px`};
   width: ${({ widthProp }) => `${widthProp}px`};
 `;
 var WithIcon = styled.div`
@@ -259,7 +282,6 @@ var TextInputIconContainer = styled.div`
 `;
 var Input = styled.input`
   ${textInputStyle};
-
   // disable autofill styles in chrome https://stackoverflow.com/a/68240841/9808766
   &:-webkit-autofill,
   &:-webkit-autofill:focus,
@@ -314,6 +336,8 @@ var TextInputHalfRow = styled.div`
 var StyledTextInput = styled.div`
   width: ${({ widthProp }) => widthProp};
   position: relative;
+  /* Apply marginTop to every TextInput when specified */
+  margin-top: ${({ marginTop }) => marginTop !== void 0 ? `${marginTop}px` : ""};
 
   /* eg forms, should be left consistent: */
   & + & {
@@ -339,6 +363,7 @@ export {
   iconSides,
   iconOffsets,
   iconWidths,
+  iconStrokeWidths,
   TextInput,
   TextInputHalfRow
 };

package/dist/chunk-DG46HTPM.cjs

@@ -0,0 +1,28 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/Lock2.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function Lock2({ strokeWidth = "1.4" }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "svg",
+    {
+      width: "100%",
+      viewBox: "0 0 12 12",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      opacity: 0.9,
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "path",
+        {
+          d: "M8.125 4.875V3.625C8.125 2.4514 7.1736 1.5 6 1.5C4.8264 1.5 3.875 2.4514 3.875 3.625V4.875M6 7V8.5M2.875 10.625H9.125C9.40115 10.625 9.625 10.4011 9.625 10.125V5.375C9.625 5.09885 9.40115 4.875 9.125 4.875H2.875C2.59886 4.875 2.375 5.09885 2.375 5.375V10.125C2.375 10.4011 2.59885 10.625 2.875 10.625Z",
+          stroke: "currentColor",
+          strokeWidth,
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+
+
+
+exports.Lock2 = Lock2;

package/dist/chunk-DH3F4ATS.cjs

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/hooks/useWhatChanged.tsx
+var _usewhatchanged = require('@simbathesailor/use-what-changed');
+
+
+
+exports.useWhatChanged = _usewhatchanged.useWhatChanged;

package/dist/{chunk-GRQWHUKD.js → chunk-DJEBFC67.js}

@@ -3,16 +3,16 @@ import {
 } from "./chunk-JJC2AUQ3.js";
 import {
   TextButton
-} from "./chunk-SNSZGFFQ.js";
+} from "./chunk-73YPCCU5.js";
 import {
   IconContainer
-} from "./chunk-DJOYSVI3.js";
+} from "./chunk-JWFDHULW.js";
 import {
   bp
 } from "./chunk-JSGRNWSB.js";
 import {
   colors
-} from "./chunk-YJIIP7IY.js";
+} from "./chunk-QPO3F72O.js";
 
 // src/components/PageSection/PageSectionNav.tsx
 import styled from "@emotion/styled";

package/dist/chunk-DORBQICL.cjs

@@ -0,0 +1,44 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/NubankLogo.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function NubankLogo() {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "svg",
+    {
+      width: "100%",
+      viewBox: "0 0 27 14",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "g", { "clip-path": "url(#clip0_6775_256125)", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "path",
+            {
+              d: "M5.39308 1.33545C6.1955 0.492437 7.25989 0 8.51036 0C10.9464 0 12.5615 1.77862 12.8705 4.44312C12.9707 5.30841 12.9698 6.52833 12.9688 7.94133C12.9687 8.08622 12.9686 8.23318 12.9686 8.38198V13.6753H9.61854V9.76019C9.61854 9.76019 9.61172 6.40942 9.59124 5.78318C9.50134 3.05571 7.88666 1.34191 5.39273 1.34007C4.6403 2.13503 4.23713 3.107 4.17768 4.59318C4.1695 4.80047 4.17156 5.53521 4.17427 6.50357C4.17567 7.00529 4.17725 7.56976 4.17768 8.15605C4.18016 10.7079 4.17768 13.6759 4.17768 13.6759H0.827667V7.65056C0.827667 7.44411 0.823905 7.2359 0.820128 7.02686C0.81253 6.60638 0.804872 6.18266 0.827667 5.7631C0.865517 5.06367 0.986512 4.37609 1.31289 3.73735C2.05995 2.27404 3.5907 1.33186 5.22259 1.33186C5.27959 1.33186 5.33664 1.33306 5.39308 1.33545Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "path",
+            {
+              d: "M26.1726 8.23662C26.1954 7.81705 26.1877 7.39329 26.1802 6.97285C26.1764 6.76382 26.1726 6.55561 26.1726 6.34915V0.323846H22.8226C22.8226 0.323846 22.8201 3.29176 22.8226 5.84362C22.823 6.42992 22.8246 6.99434 22.826 7.49606C22.8287 8.46447 22.8308 9.1992 22.8226 9.40649C22.7632 10.8927 22.36 11.8647 21.6075 12.6597C19.1137 12.6578 17.499 10.944 17.4091 8.21654C17.3886 7.5903 17.3799 6.03625 17.3799 4.23638V0.321289L14.0324 0.324417V5.61774C14.0324 5.76654 14.0323 5.91345 14.0322 6.05839C14.0311 7.47139 14.0303 8.69127 14.1305 9.5566C14.4388 12.2211 16.0539 13.9997 18.49 13.9997C19.7405 13.9997 20.8049 13.5073 21.6073 12.6642C21.6637 12.6667 21.7207 12.6678 21.7777 12.6678C23.4096 12.6678 24.9403 11.7257 25.6874 10.2624C26.0138 9.62358 26.1348 8.93605 26.1726 8.23662Z",
+              fill: "currentColor"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "defs", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "clipPath", { id: "clip0_6775_256125", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "rect",
+          {
+            width: "25.6667",
+            height: "14",
+            fill: "currentColor",
+            transform: "translate(0.666748)"
+          }
+        ) }) })
+      ]
+    }
+  );
+}
+
+
+
+exports.NubankLogo = NubankLogo;

package/dist/{chunk-K2JYBOWY.js → chunk-DP3CK7ZD.js}

@@ -1,13 +1,13 @@
-import {
-  Pill
-} from "./chunk-ITYZTIJS.js";
 import {
   InputSubtext,
   inputBlockStyle
-} from "./chunk-KU4X4VPI.js";
+} from "./chunk-TKOYRZ7J.js";
+import {
+  Pill
+} from "./chunk-HTCBI467.js";
 import {
   Icon
-} from "./chunk-DJOYSVI3.js";
+} from "./chunk-JWFDHULW.js";
 
 // src/components/FileInput.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-4LG6VAAC.js → chunk-E5PZI3R6.js}

@@ -1,15 +1,15 @@
 import {
   Filter
-} from "./chunk-C3ZJV5MQ.js";
+} from "./chunk-CSQII7YP.js";
 import {
   Select_default
-} from "./chunk-Y4T7OW76.js";
+} from "./chunk-ZHKLSHFU.js";
 import {
   Spacing
 } from "./chunk-E5DUKMCU.js";
 import {
   Button
-} from "./chunk-U6EBWLCK.js";
+} from "./chunk-ADV4UT4X.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
@@ -63,7 +63,7 @@ var EnumFilter = ({
       Select_default,
       {
         zIndex: z.dropdown + 1,
-        placeholder: "Select event",
+        placeholder: "Select value",
         options,
         onChange: (option) => {
           if (option) {

package/dist/{chunk-EZRJ2DD2.cjs → chunk-E73KOBFO.cjs}

@@ -1,6 +1,6 @@
 "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 _chunkXIFHBLNQcjs = require('./chunk-XIFHBLNQ.cjs');
 
 // src/components/StatusIndicator.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -15,7 +15,7 @@ function StatusIndicator({
 }
 var StyledStatusIndicator = _styled2.default.div`
   color: ${({ theme, color }) => theme[color]};
-  font-size: ${({ size }) => _chunk7H2OXTENcjs.pxToRems.call(void 0, size)};
+  font-size: ${({ size }) => _chunkXIFHBLNQcjs.pxToRems.call(void 0, size)};
   font-weight: ${({ fontWeight }) => fontWeight};
 `;
 

package/dist/{chunk-AHC2USPG.js → chunk-E7KQDR6U.js}

@@ -8,22 +8,22 @@ import {
 } from "./chunk-FZUV52PP.js";
 import {
   NextLink
-} from "./chunk-Y477LK2G.js";
-import {
-  CurrencyAmount
-} from "./chunk-XOJGASAT.js";
+} from "./chunk-U5XHY2DK.js";
 import {
   ClipboardTextField
-} from "./chunk-NXZY7WP4.js";
+} from "./chunk-MKERXZUC.js";
+import {
+  CurrencyAmount
+} from "./chunk-SUUX24ML.js";
 import {
   Icon
-} from "./chunk-DJOYSVI3.js";
+} from "./chunk-JWFDHULW.js";
 import {
   Link
-} from "./chunk-5HDXWO2E.js";
+} from "./chunk-YIEDSI2X.js";
 import {
   renderTypography
-} from "./chunk-6H54ZONZ.js";
+} from "./chunk-MSMN63ZY.js";
 import {
   stringToNodes
 } from "./chunk-2466FZJC.js";

package/dist/{chunk-EO4RGSN6.cjs → chunk-EBN2WCW3.cjs}

@@ -1,11 +1,14 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/ZapLite.tsx
 var _jsxruntime = require('@emotion/react/jsx-runtime');
-function ZapLite() {
+function ZapLite({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     "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-4UFYMBJK.cjs → chunk-ECFNSLYP.cjs}

@@ -1,34 +1,34 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkBL5NDVAZcjs = require('./chunk-BL5NDVAZ.cjs');
+var _chunkXMSQNWZKcjs = require('./chunk-XMSQNWZK.cjs');
 
 
-var _chunkE2672QPScjs = require('./chunk-E2672QPS.cjs');
+var _chunkJRCDVJMMcjs = require('./chunk-JRCDVJMM.cjs');
 
 
-var _chunkK5JJ5ZJPcjs = require('./chunk-K5JJ5ZJP.cjs');
+var _chunkXWOTPLY4cjs = require('./chunk-XWOTPLY4.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 _chunkI4L4UO26cjs = require('./chunk-I4L4UO26.cjs');
+var _chunk4DJ33XMZcjs = require('./chunk-4DJ33XMZ.cjs');
 
 
-var _chunk5SPEBEERcjs = require('./chunk-5SPEBEER.cjs');
+var _chunkOBUN65IKcjs = require('./chunk-OBUN65IK.cjs');
 
 
 var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
 
 
-var _chunkDO3PWX7Qcjs = require('./chunk-DO3PWX7Q.cjs');
+var _chunkLDNG63AKcjs = require('./chunk-LDNG63AK.cjs');
 
 
 
-var _chunkHGCI5IAMcjs = require('./chunk-HGCI5IAM.cjs');
+var _chunkQI7YHMJZcjs = require('./chunk-QI7YHMJZ.cjs');
 
 
 
@@ -51,6 +51,7 @@ var buttonKinds = [
   "ghost",
   "transparent",
   "green33",
+  "green37",
   "purple55",
   "blue43",
   "blue39",
@@ -62,17 +63,19 @@ var buttonKinds = [
   "roundSingleChar",
   "roundIcon",
   "gray",
-  "grayGradient"
+  "grayGradient",
+  "gray99",
+  "white21"
 ];
 function resolveBackgroundColorKey(theme, kind, defaultKey) {
   var _a;
   const defaultBackgroundColorKey = (_a = theme.buttons.kinds[kind]) == null ? void 0 : _a[defaultKey];
   let backgroundColorKey = defaultBackgroundColorKey;
-  if (!backgroundColorKey && _chunkHGCI5IAMcjs.isThemeOrColorKey.call(void 0, kind)) {
+  if (!backgroundColorKey && _chunkQI7YHMJZcjs.isThemeOrColorKey.call(void 0, kind)) {
     backgroundColorKey = kind;
   }
   const defaultBackgroundColor = theme.buttons[defaultKey];
-  const backgroundColor = _chunkHGCI5IAMcjs.getBackgroundColor.call(void 0, 
+  const backgroundColor = _chunkQI7YHMJZcjs.getBackgroundColor.call(void 0, 
     theme,
     backgroundColorKey,
     defaultBackgroundColor
@@ -197,6 +200,7 @@ var Button = _react3.forwardRef.call(void 0, (props, ref) => {
     disabled = false,
     mt = 0,
     ml = 0,
+    mb = 0,
     type = "button",
     newTab = false,
     zIndex = void 0,
@@ -215,7 +219,7 @@ var Button = _react3.forwardRef.call(void 0, (props, ref) => {
         typography,
         kind,
         paddingX,
-        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBL5NDVAZcjs.Loading, { size: defaultIconWidth, center: false, kind: loadingKind })
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXMSQNWZKcjs.Loading, { size: defaultIconWidth, center: false, kind: loadingKind })
       }
     );
   } else if (icon) {
@@ -228,7 +232,7 @@ var Button = _react3.forwardRef.call(void 0, (props, ref) => {
         kind,
         paddingX,
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunk6Z6ZBZEJcjs.Icon,
+          _chunk4JJ5GJLEcjs.Icon,
           _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, icon), {
             width: icon.width || defaultIconWidth,
             square: true,
@@ -257,7 +261,7 @@ var Button = _react3.forwardRef.call(void 0, (props, ref) => {
                 textOverflow: "ellipsis",
                 overflow: "hidden"
               },
-              children: _chunk5SPEBEERcjs.renderTypography.call(void 0, typography.type, {
+              children: _chunkOBUN65IKcjs.renderTypography.call(void 0, typography.type, {
                 children: text,
                 color: typography.color,
                 size
@@ -268,7 +272,7 @@ var Button = _react3.forwardRef.call(void 0, (props, ref) => {
         ]
       })
     ),
-    tooltipText ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkE2672QPScjs.Tooltip, { id: tooltipId.current, content: tooltipText }) : null
+    tooltipText ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXWOTPLY4cjs.Tooltip, { id: tooltipId.current, content: tooltipText }) : null
   ] });
   const commonProps = {
     id,
@@ -296,7 +300,8 @@ var Button = _react3.forwardRef.call(void 0, (props, ref) => {
     disabled: disabled || loading,
     css: {
       marginTop: mt ? typeof mt === "number" ? `${mt}px` : "auto" : void 0,
-      marginLeft: ml ? typeof ml === "number" ? `${ml}px` : "auto" : void 0
+      marginLeft: ml ? typeof ml === "number" ? `${ml}px` : "auto" : void 0,
+      marginBottom: mb ? typeof mb === "number" ? `${mb}px` : "auto" : void 0
     },
     newTab,
     borderRadius,
@@ -354,7 +359,7 @@ var buttonStyle = ({
 
     ${zIndex && `z-index: ${zIndex};`}
 
-    ${_chunkDO3PWX7Qcjs.applyTypography.call(void 0, 
+    ${_chunkLDNG63AKcjs.applyTypography.call(void 0, 
     theme,
     typography.type,
     typography.size,
@@ -362,7 +367,7 @@ var buttonStyle = ({
   )}
 
     &:focus-visible {
-      outline: ${_chunkFPQ2OUYXcjs.getFocusOutline.call(void 0, { theme })};
+      outline: ${_chunkO6BZRC56cjs.getFocusOutline.call(void 0, { theme })};
       /* Slightly different offset for buttons so the outline is visible: */
       outline-offset: 0px;
     }
@@ -402,9 +407,9 @@ var ButtonIcon = _styled2.default.div`
   ${({ iconSide, paddingX }) => `${iconSide}: ${paddingX}px;`}
 `;
 var LinkWithoutTypography = _react3.forwardRef.call(void 0, (props, ref) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI4L4UO26cjs.Link, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, props), { ref }));
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4DJ33XMZcjs.Link, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, props), { ref }));
 });
-var StyledButton = _styled2.default.call(void 0, _chunkK5JJ5ZJPcjs.UnstyledButton)`
+var StyledButton = _styled2.default.call(void 0, _chunkJRCDVJMMcjs.UnstyledButton)`
   ${(props) => buttonStyle(props)}
 `;
 var ButtonLink = _styled2.default.call(void 0, LinkWithoutTypography)`