@lightsparkdev/ui 1.1.8 → 1.1.9

package/dist/{chunk-LKPOBVNO.cjs → chunk-L3ANMAP5.cjs}

@@ -3,33 +3,33 @@
 var _chunkB6Y7HCBMcjs = require('./chunk-B6Y7HCBM.cjs');
 
 
-var _chunkZHZWTVS5cjs = require('./chunk-ZHZWTVS5.cjs');
+var _chunkFSHYBUHOcjs = require('./chunk-FSHYBUHO.cjs');
 
 
-var _chunk5TDELL2Ncjs = require('./chunk-5TDELL2N.cjs');
+var _chunkM5SCY5B5cjs = require('./chunk-M5SCY5B5.cjs');
 
 
-var _chunkGYFYOAO2cjs = require('./chunk-GYFYOAO2.cjs');
+var _chunkKZOTKUFAcjs = require('./chunk-KZOTKUFA.cjs');
 
 
-var _chunk22Q6UJGLcjs = require('./chunk-22Q6UJGL.cjs');
+var _chunkBB4ZAFU4cjs = require('./chunk-BB4ZAFU4.cjs');
 
 
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunk5R7OENS4cjs = require('./chunk-5R7OENS4.cjs');
+var _chunk4PZLEYONcjs = require('./chunk-4PZLEYON.cjs');
 
 
 
 
-var _chunkUL22WLXRcjs = require('./chunk-UL22WLXR.cjs');
+var _chunkYSMG5R44cjs = require('./chunk-YSMG5R44.cjs');
 
 
-var _chunk4FVDOZDAcjs = require('./chunk-4FVDOZDA.cjs');
+var _chunkM3TXRVC3cjs = require('./chunk-M3TXRVC3.cjs');
 
 
-var _chunkLPTWQ2KPcjs = require('./chunk-LPTWQ2KP.cjs');
+var _chunkLL3KJ7DBcjs = require('./chunk-LL3KJ7DB.cjs');
 
 
 var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
@@ -59,6 +59,7 @@ function Dropdown({
   horizontalScrollRef,
   onClickDropdownItems,
   getCSS,
+  getDropdownItemsCSS,
   isOpen: isOpenProp,
   onOpen,
   onClose,
@@ -254,9 +255,10 @@ function Dropdown({
   } else if ("getContent" in button) {
     buttonNode = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, UnstyledDropdownButton, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, commonUnstyledButtonProps), { children: button.getContent({ isOpen, theme }) }));
   } else {
-    buttonNode = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkGYFYOAO2cjs.Button, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, button), commonButtonProps));
+    buttonNode = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkKZOTKUFAcjs.Button, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, button), commonButtonProps));
   }
   const containerCSS = getCSS && getCSS({ isOpen, theme });
+  const dropdownItemsCSS = getDropdownItemsCSS && getDropdownItemsCSS({ isOpen, theme });
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
@@ -276,6 +278,7 @@ function Dropdown({
               maxWidth: maxDropdownItemsWidth,
               hasItems: dropdownItems ? dropdownItems.length > 0 : false,
               borderRadius,
+              css: dropdownItemsCSS,
               children: [
                 dropdownItems == null ? void 0 : dropdownItems.map((dropdownItem, i) => {
                   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { onBlur: handleBlur, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -303,9 +306,9 @@ var DropdownFooter = _styled2.default.div`
   margin-top: 16px;
 `;
 var DropdownItems = _styled2.default.ul`
-  ${_chunkUL22WLXRcjs.overlaySurface}
-  color: ${({ theme }) => _chunkLPTWQ2KPcjs.themeOr.call(void 0, theme.c6Neutral, theme.c8Neutral)};
-  ${({ borderRadius }) => _chunkUL22WLXRcjs.standardBorderRadius.call(void 0, borderRadius)}
+  ${_chunkYSMG5R44cjs.overlaySurface}
+  color: ${({ theme }) => _chunkLL3KJ7DBcjs.themeOr.call(void 0, theme.c6Neutral, theme.c8Neutral)};
+  ${({ borderRadius }) => _chunkYSMG5R44cjs.standardBorderRadius.call(void 0, borderRadius)}
   ${({ hasItems }) => hasItems ? "padding: 12px 0;" : "padding: 0;"}
   visibility: ${({ isOpen }) => isOpen ? "visible" : "hidden"};
   position: fixed;
@@ -321,7 +324,7 @@ function DropdownItem({ dropdownItem, onClick }) {
   const theme = _react.useTheme.call(void 0, );
   const dropdownItemIcon = dropdownItem.getIcon && dropdownItem.getIcon({ dropdownItem, theme });
   const dropdownItemIconNode = dropdownItemIcon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunk5R7OENS4cjs.Icon,
+    _chunk4PZLEYONcjs.Icon,
     {
       name: dropdownItemIcon.name,
       width: dropdownItemIcon.width || 12,
@@ -355,7 +358,7 @@ function DropdownItem({ dropdownItem, onClick }) {
     return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DropdownItemDiv, { selected: false, css: cssProp2, withHoverColor: false, children: [
       dropdownItemIconNode,
       dropdownItem.label,
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginLeft: "auto" }, children: "options" in dropdownItem.toggle ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZHZWTVS5cjs.MultiToggle, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, dropdownItem.toggle)) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5TDELL2Ncjs.Toggle, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, dropdownItem.toggle)) })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginLeft: "auto" }, children: "options" in dropdownItem.toggle ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkFSHYBUHOcjs.MultiToggle, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, dropdownItem.toggle)) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkM5SCY5B5cjs.Toggle, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, dropdownItem.toggle)) })
     ] });
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -371,8 +374,8 @@ function DropdownItem({ dropdownItem, onClick }) {
     }
   );
 }
-var UnstyledDropdownButton = _styled2.default.call(void 0, _chunk22Q6UJGLcjs.UnstyledButton)`
-  ${_chunkUL22WLXRcjs.standardFocusOutline}
+var UnstyledDropdownButton = _styled2.default.call(void 0, _chunkBB4ZAFU4cjs.UnstyledButton)`
+  ${_chunkYSMG5R44cjs.standardFocusOutline}
 `;
 var dropdownItemStyle = ({
   theme,
@@ -403,12 +406,12 @@ var cssProp = ({
   selected
 }) => _react.css`
   ${dropdownItemStyle({ theme, selected: Boolean(selected) })}
-  ${_chunkUL22WLXRcjs.standardFocusOutline.call(void 0, { theme })}
+  ${_chunkYSMG5R44cjs.standardFocusOutline.call(void 0, { theme })}
 `;
 function DropdownItemLink(props) {
   const theme = _react.useTheme.call(void 0, );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunk4FVDOZDAcjs.Link,
+    _chunkM3TXRVC3cjs.Link,
     _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, props), {
       css: cssProp({ theme, selected: Boolean(props.selected) })
     })
@@ -416,7 +419,7 @@ function DropdownItemLink(props) {
 }
 var DropdownItemDiv = _styled2.default.div`
   ${dropdownItemStyle}
-  ${_chunkUL22WLXRcjs.standardFocusOutline}
+  ${_chunkYSMG5R44cjs.standardFocusOutline}
 `;
 
 

package/dist/{chunk-7PLRPYVC.js → chunk-LB2TLBRA.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-YW4BJCOL.js";
 import {
   applyTypography
-} from "./chunk-XIWXA6GF.js";
+} from "./chunk-YBIDE35T.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-WPI73XRG.js → chunk-LDMNFPJO.js}

@@ -2,11 +2,11 @@ import {
   standardBorderRadius,
   standardCardShadow,
   standardContentInset
-} from "./chunk-33BECMKR.js";
+} from "./chunk-FS5ZY6RP.js";
 import {
   isDark,
   themeOr
-} from "./chunk-2JNM2KTT.js";
+} from "./chunk-A2JXE76O.js";
 
 // src/components/Table/TableEmptyState.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-LPTWQ2KP.cjs → chunk-LL3KJ7DB.cjs}

@@ -21,7 +21,7 @@ var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
 
 
 
-var _chunk2J2ZDWLFcjs = require('./chunk-2J2ZDWLF.cjs');
+var _chunkBQ5MMYMPcjs = require('./chunk-BQ5MMYMP.cjs');
 
 
 
@@ -49,126 +49,126 @@ function isTheme(theme) {
   return Object.values(Themes).includes(theme);
 }
 var baseThemeColors = {
-  bg: _chunk2J2ZDWLFcjs.colors.white,
-  smBg: _chunk2J2ZDWLFcjs.colors.white,
-  c02Neutral: _chunk2J2ZDWLFcjs.colors.gray98,
+  bg: _chunkBQ5MMYMPcjs.colors.white,
+  smBg: _chunkBQ5MMYMPcjs.colors.white,
+  c02Neutral: _chunkBQ5MMYMPcjs.colors.gray98,
   c02NeutralLight: "#F9F9F91A",
-  c05Neutral: _chunk2J2ZDWLFcjs.colors.gray95,
-  c1Neutral: _chunk2J2ZDWLFcjs.colors.gray90,
-  c15Neutral: _chunk2J2ZDWLFcjs.colors.gray85,
-  c2Neutral: _chunk2J2ZDWLFcjs.colors.gray80,
-  c25Neutral: _chunk2J2ZDWLFcjs.colors.gray75,
-  c3Neutral: _chunk2J2ZDWLFcjs.colors.gray70,
-  c4Neutral: _chunk2J2ZDWLFcjs.colors.gray60,
-  c5Neutral: _chunk2J2ZDWLFcjs.colors.gray50,
-  c6Neutral: _chunk2J2ZDWLFcjs.colors.gray40,
-  c7Neutral: _chunk2J2ZDWLFcjs.colors.gray30,
-  c8Neutral: _chunk2J2ZDWLFcjs.colors.gray20,
-  c9Neutral: _chunk2J2ZDWLFcjs.colors.gray10,
-  danger: _chunk2J2ZDWLFcjs.colors.danger,
-  hcNeutral: _chunk2J2ZDWLFcjs.colors.black,
-  info: _chunk2J2ZDWLFcjs.colors.blue43,
-  lcNeutral: _chunk2J2ZDWLFcjs.colors.gray80,
-  link: _chunk2J2ZDWLFcjs.colors.blue43,
+  c05Neutral: _chunkBQ5MMYMPcjs.colors.gray95,
+  c1Neutral: _chunkBQ5MMYMPcjs.colors.gray90,
+  c15Neutral: _chunkBQ5MMYMPcjs.colors.gray85,
+  c2Neutral: _chunkBQ5MMYMPcjs.colors.gray80,
+  c25Neutral: _chunkBQ5MMYMPcjs.colors.gray75,
+  c3Neutral: _chunkBQ5MMYMPcjs.colors.gray70,
+  c4Neutral: _chunkBQ5MMYMPcjs.colors.gray60,
+  c5Neutral: _chunkBQ5MMYMPcjs.colors.gray50,
+  c6Neutral: _chunkBQ5MMYMPcjs.colors.gray40,
+  c7Neutral: _chunkBQ5MMYMPcjs.colors.gray30,
+  c8Neutral: _chunkBQ5MMYMPcjs.colors.gray20,
+  c9Neutral: _chunkBQ5MMYMPcjs.colors.gray10,
+  danger: _chunkBQ5MMYMPcjs.colors.danger,
+  hcNeutral: _chunkBQ5MMYMPcjs.colors.black,
+  info: _chunkBQ5MMYMPcjs.colors.blue43,
+  lcNeutral: _chunkBQ5MMYMPcjs.colors.gray80,
+  link: _chunkBQ5MMYMPcjs.colors.blue43,
   linkLight: "#0068C90F",
-  mcNeutral: _chunk2J2ZDWLFcjs.colors.gray40,
-  onInfoText: _chunk2J2ZDWLFcjs.colors.white,
-  onPrimaryText: _chunk2J2ZDWLFcjs.colors.black,
-  onSuccessText: _chunk2J2ZDWLFcjs.colors.white,
-  primary: _chunk2J2ZDWLFcjs.colors.primary,
-  secondary: _chunk2J2ZDWLFcjs.colors.secondary,
-  tertiary: _chunk2J2ZDWLFcjs.colors.black,
-  success: _chunk2J2ZDWLFcjs.colors.success,
-  text: _chunk2J2ZDWLFcjs.colors.black,
-  vlcNeutral: _chunk2J2ZDWLFcjs.colors.gray95,
-  warning: _chunk2J2ZDWLFcjs.colors.warning,
-  errorBackground: _chunk2J2ZDWLFcjs.colors.errorBackground,
-  errorText: _chunk2J2ZDWLFcjs.colors.errorText,
-  transparent: _chunk2J2ZDWLFcjs.colors.transparent
+  mcNeutral: _chunkBQ5MMYMPcjs.colors.gray40,
+  onInfoText: _chunkBQ5MMYMPcjs.colors.white,
+  onPrimaryText: _chunkBQ5MMYMPcjs.colors.black,
+  onSuccessText: _chunkBQ5MMYMPcjs.colors.white,
+  primary: _chunkBQ5MMYMPcjs.colors.primary,
+  secondary: _chunkBQ5MMYMPcjs.colors.secondary,
+  tertiary: _chunkBQ5MMYMPcjs.colors.black,
+  success: _chunkBQ5MMYMPcjs.colors.success,
+  text: _chunkBQ5MMYMPcjs.colors.black,
+  vlcNeutral: _chunkBQ5MMYMPcjs.colors.gray95,
+  warning: _chunkBQ5MMYMPcjs.colors.warning,
+  errorBackground: _chunkBQ5MMYMPcjs.colors.errorBackground,
+  errorText: _chunkBQ5MMYMPcjs.colors.errorText,
+  transparent: _chunkBQ5MMYMPcjs.colors.transparent
 };
 var themeOrColorKeyValues = [
   ...Object.keys(baseThemeColors),
-  ...Object.keys(_chunk2J2ZDWLFcjs.colors)
+  ...Object.keys(_chunkBQ5MMYMPcjs.colors)
 ];
 var baseTheme = _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, baseThemeColors), {
   // base type should be Themes but default to Light
   type: "light" /* Light */,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "Lightspark" /* Lightspark */),
-  hcNeutralFromBg: (bgHex) => _chunk2J2ZDWLFcjs.hcNeutralFromBg.call(void 0, bgHex, _chunk2J2ZDWLFcjs.colors.black, _chunk2J2ZDWLFcjs.colors.white),
+  hcNeutralFromBg: (bgHex) => _chunkBQ5MMYMPcjs.hcNeutralFromBg.call(void 0, bgHex, _chunkBQ5MMYMPcjs.colors.black, _chunkBQ5MMYMPcjs.colors.white),
   buttons: _chunkRTBR3MYScjs.defaultButtonsTheme,
   loading: _chunkXUHJLDRXcjs.defaultLoadingTheme,
   cardForm: _chunkVUI7MCNEcjs.defaultCardFormTheme,
   badge: {
     bg: "c05Neutral"
   },
-  inputBackground: _chunk2J2ZDWLFcjs.colors.white
+  inputBackground: _chunkBQ5MMYMPcjs.colors.white
 });
 var lightBaseTheme = baseTheme;
 var darkBaseTheme = {
   type: "dark" /* Dark */,
-  bg: _chunk2J2ZDWLFcjs.colors.black,
-  smBg: _chunk2J2ZDWLFcjs.colors.black,
-  c02Neutral: _chunk2J2ZDWLFcjs.colors.gray98,
+  bg: _chunkBQ5MMYMPcjs.colors.black,
+  smBg: _chunkBQ5MMYMPcjs.colors.black,
+  c02Neutral: _chunkBQ5MMYMPcjs.colors.gray98,
   c02NeutralLight: "#F9F9F91A",
-  c05Neutral: _chunk2J2ZDWLFcjs.colors.gray5,
-  c1Neutral: _chunk2J2ZDWLFcjs.colors.gray10,
-  c15Neutral: _chunk2J2ZDWLFcjs.colors.gray15,
-  c2Neutral: _chunk2J2ZDWLFcjs.colors.gray20,
-  c25Neutral: _chunk2J2ZDWLFcjs.colors.gray25,
-  c3Neutral: _chunk2J2ZDWLFcjs.colors.gray30,
-  c4Neutral: _chunk2J2ZDWLFcjs.colors.gray40,
-  c5Neutral: _chunk2J2ZDWLFcjs.colors.gray50,
-  c6Neutral: _chunk2J2ZDWLFcjs.colors.gray60,
-  c7Neutral: _chunk2J2ZDWLFcjs.colors.gray70,
-  c8Neutral: _chunk2J2ZDWLFcjs.colors.gray80,
-  c9Neutral: _chunk2J2ZDWLFcjs.colors.gray90,
-  danger: _chunk2J2ZDWLFcjs.colors.danger,
-  hcNeutral: _chunk2J2ZDWLFcjs.colors.white,
-  hcNeutralFromBg: (bgHex) => _chunk2J2ZDWLFcjs.hcNeutralFromBg.call(void 0, bgHex, _chunk2J2ZDWLFcjs.colors.white, _chunk2J2ZDWLFcjs.colors.black),
-  info: _chunk2J2ZDWLFcjs.colors.white,
-  lcNeutral: _chunk2J2ZDWLFcjs.colors.gray40,
-  link: _chunk2J2ZDWLFcjs.colors.blue43,
+  c05Neutral: _chunkBQ5MMYMPcjs.colors.gray5,
+  c1Neutral: _chunkBQ5MMYMPcjs.colors.gray10,
+  c15Neutral: _chunkBQ5MMYMPcjs.colors.gray15,
+  c2Neutral: _chunkBQ5MMYMPcjs.colors.gray20,
+  c25Neutral: _chunkBQ5MMYMPcjs.colors.gray25,
+  c3Neutral: _chunkBQ5MMYMPcjs.colors.gray30,
+  c4Neutral: _chunkBQ5MMYMPcjs.colors.gray40,
+  c5Neutral: _chunkBQ5MMYMPcjs.colors.gray50,
+  c6Neutral: _chunkBQ5MMYMPcjs.colors.gray60,
+  c7Neutral: _chunkBQ5MMYMPcjs.colors.gray70,
+  c8Neutral: _chunkBQ5MMYMPcjs.colors.gray80,
+  c9Neutral: _chunkBQ5MMYMPcjs.colors.gray90,
+  danger: _chunkBQ5MMYMPcjs.colors.danger,
+  hcNeutral: _chunkBQ5MMYMPcjs.colors.white,
+  hcNeutralFromBg: (bgHex) => _chunkBQ5MMYMPcjs.hcNeutralFromBg.call(void 0, bgHex, _chunkBQ5MMYMPcjs.colors.white, _chunkBQ5MMYMPcjs.colors.black),
+  info: _chunkBQ5MMYMPcjs.colors.white,
+  lcNeutral: _chunkBQ5MMYMPcjs.colors.gray40,
+  link: _chunkBQ5MMYMPcjs.colors.blue43,
   linkLight: "#0068C90F",
-  mcNeutral: _chunk2J2ZDWLFcjs.colors.gray60,
-  onInfoText: _chunk2J2ZDWLFcjs.colors.white,
-  onPrimaryText: _chunk2J2ZDWLFcjs.colors.black,
-  onSuccessText: _chunk2J2ZDWLFcjs.colors.white,
-  primary: _chunk2J2ZDWLFcjs.colors.primary,
-  secondary: _chunk2J2ZDWLFcjs.colors.secondary,
-  tertiary: _chunk2J2ZDWLFcjs.colors.white,
-  success: _chunk2J2ZDWLFcjs.colors.success,
-  text: _chunk2J2ZDWLFcjs.colors.white,
+  mcNeutral: _chunkBQ5MMYMPcjs.colors.gray60,
+  onInfoText: _chunkBQ5MMYMPcjs.colors.white,
+  onPrimaryText: _chunkBQ5MMYMPcjs.colors.black,
+  onSuccessText: _chunkBQ5MMYMPcjs.colors.white,
+  primary: _chunkBQ5MMYMPcjs.colors.primary,
+  secondary: _chunkBQ5MMYMPcjs.colors.secondary,
+  tertiary: _chunkBQ5MMYMPcjs.colors.white,
+  success: _chunkBQ5MMYMPcjs.colors.success,
+  text: _chunkBQ5MMYMPcjs.colors.white,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "Lightspark" /* Lightspark */),
-  vlcNeutral: _chunk2J2ZDWLFcjs.colors.gray20,
-  warning: _chunk2J2ZDWLFcjs.colors.warning,
-  errorBackground: _chunk2J2ZDWLFcjs.colors.errorBackground,
-  errorText: _chunk2J2ZDWLFcjs.colors.errorText,
-  transparent: _chunk2J2ZDWLFcjs.colors.transparent,
+  vlcNeutral: _chunkBQ5MMYMPcjs.colors.gray20,
+  warning: _chunkBQ5MMYMPcjs.colors.warning,
+  errorBackground: _chunkBQ5MMYMPcjs.colors.errorBackground,
+  errorText: _chunkBQ5MMYMPcjs.colors.errorText,
+  transparent: _chunkBQ5MMYMPcjs.colors.transparent,
   buttons: _chunkRTBR3MYScjs.defaultButtonsTheme,
   loading: _chunkXUHJLDRXcjs.defaultLoadingTheme,
   cardForm: _chunkVUI7MCNEcjs.defaultCardFormTheme,
-  inputBackground: _chunk2J2ZDWLFcjs.colors.black,
+  inputBackground: _chunkBQ5MMYMPcjs.colors.black,
   badge: {
     bg: "c15Neutral"
   }
 };
 var lightTheme = extend(lightBaseTheme, {
   header: extendBase(lightBaseTheme, {
-    text: _chunk2J2ZDWLFcjs.colors.gray60
+    text: _chunkBQ5MMYMPcjs.colors.gray60
   }),
   nav: extendBase(lightBaseTheme, {
-    text: _chunk2J2ZDWLFcjs.colors.gray10,
-    secondary: _chunk2J2ZDWLFcjs.colors.gray40
+    text: _chunkBQ5MMYMPcjs.colors.gray10,
+    secondary: _chunkBQ5MMYMPcjs.colors.gray40
   }),
   content: extendBase(lightBaseTheme, {
-    bg: _chunk2J2ZDWLFcjs.colors.white,
-    smBg: _chunk2J2ZDWLFcjs.colors.white
+    bg: _chunkBQ5MMYMPcjs.colors.white,
+    smBg: _chunkBQ5MMYMPcjs.colors.white
   }),
   controls: extendBase(lightBaseTheme, {
-    bg: _chunk2J2ZDWLFcjs.colors.gray95,
-    smBg: _chunk2J2ZDWLFcjs.colors.gray95,
-    text: _chunk2J2ZDWLFcjs.colors.gray60,
-    secondary: _chunk2J2ZDWLFcjs.colors.secondary
+    bg: _chunkBQ5MMYMPcjs.colors.gray95,
+    smBg: _chunkBQ5MMYMPcjs.colors.gray95,
+    text: _chunkBQ5MMYMPcjs.colors.gray60,
+    secondary: _chunkBQ5MMYMPcjs.colors.secondary
   })
 });
 var darkTheme = extend(darkBaseTheme, {
@@ -176,10 +176,10 @@ var darkTheme = extend(darkBaseTheme, {
   nav: extendBase(darkBaseTheme, {}),
   content: extendBase(darkBaseTheme, {}),
   controls: extendBase(darkBaseTheme, {
-    bg: _chunk2J2ZDWLFcjs.colors.gray40,
-    smBg: _chunk2J2ZDWLFcjs.colors.gray40,
-    text: _chunk2J2ZDWLFcjs.colors.white,
-    secondary: _chunk2J2ZDWLFcjs.colors.secondary
+    bg: _chunkBQ5MMYMPcjs.colors.gray40,
+    smBg: _chunkBQ5MMYMPcjs.colors.gray40,
+    text: _chunkBQ5MMYMPcjs.colors.white,
+    secondary: _chunkBQ5MMYMPcjs.colors.secondary
   }),
   buttons: _deepmerge2.default.call(void 0, _chunkRTBR3MYScjs.defaultButtonsTheme, {
     kinds: {
@@ -191,30 +191,30 @@ var darkTheme = extend(darkBaseTheme, {
 });
 var umaAuthSdkLightTheme = extend(lightTheme, {
   type: "umaAuthSdkLight" /* UmaAuthSdkLight */,
-  bg: _chunk2J2ZDWLFcjs.colors.gray98,
-  smBg: _chunk2J2ZDWLFcjs.colors.gray98,
-  secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  tertiary: _chunk2J2ZDWLFcjs.colors.grayBlue9,
+  bg: _chunkBQ5MMYMPcjs.colors.gray98,
+  smBg: _chunkBQ5MMYMPcjs.colors.gray98,
+  secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  tertiary: _chunkBQ5MMYMPcjs.colors.grayBlue9,
   warning: "#F7E3E3",
   danger: "#E31A1A",
-  text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-  link: _chunk2J2ZDWLFcjs.colors.blue39,
+  text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+  link: _chunkBQ5MMYMPcjs.colors.blue39,
   linkLight: "#0068C90F",
-  inputBackground: _chunk2J2ZDWLFcjs.colors.white,
+  inputBackground: _chunkBQ5MMYMPcjs.colors.white,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "UmaAuthSdk" /* UmaAuthSdk */, {
     main: "Manrope",
     code: "Monaco"
   }),
   content: extendBase(lightBaseTheme, {
-    bg: _chunk2J2ZDWLFcjs.colors.gray98,
-    smBg: _chunk2J2ZDWLFcjs.colors.gray98,
-    text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-    secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43
+    bg: _chunkBQ5MMYMPcjs.colors.gray98,
+    smBg: _chunkBQ5MMYMPcjs.colors.gray98,
+    text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+    secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43
   }),
   controls: extendBase(lightBaseTheme, {
-    text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-    secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-    bg: _chunk2J2ZDWLFcjs.colors.grayBlue94
+    text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+    secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+    bg: _chunkBQ5MMYMPcjs.colors.grayBlue94
   }),
   buttons: _deepmerge2.default.call(void 0, _chunkRTBR3MYScjs.buttonsThemeBase, {
     defaultTypographyType: "Title",
@@ -334,27 +334,27 @@ var umaAuthSdkLightTheme = extend(lightTheme, {
 });
 var umaAuthSdkDarkTheme = extend(darkTheme, {
   type: "umaAuthSdkDark" /* UmaAuthSdkDark */,
-  bg: _chunk2J2ZDWLFcjs.colors.gray5,
-  smBg: _chunk2J2ZDWLFcjs.colors.gray5,
-  secondary: _chunk2J2ZDWLFcjs.colors.grayBlue57,
-  tertiary: _chunk2J2ZDWLFcjs.colors.gray98,
-  text: _chunk2J2ZDWLFcjs.colors.gray98,
-  link: _chunk2J2ZDWLFcjs.colors.blue39,
-  inputBackground: _chunk2J2ZDWLFcjs.colors.gray5,
+  bg: _chunkBQ5MMYMPcjs.colors.gray5,
+  smBg: _chunkBQ5MMYMPcjs.colors.gray5,
+  secondary: _chunkBQ5MMYMPcjs.colors.grayBlue57,
+  tertiary: _chunkBQ5MMYMPcjs.colors.gray98,
+  text: _chunkBQ5MMYMPcjs.colors.gray98,
+  link: _chunkBQ5MMYMPcjs.colors.blue39,
+  inputBackground: _chunkBQ5MMYMPcjs.colors.gray5,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "UmaAuthSdk" /* UmaAuthSdk */, {
     main: "Manrope",
     code: "Monaco"
   }),
   content: extendBase(lightBaseTheme, {
-    bg: _chunk2J2ZDWLFcjs.colors.gray5,
-    smBg: _chunk2J2ZDWLFcjs.colors.gray5,
-    text: _chunk2J2ZDWLFcjs.colors.grayBlue94,
-    secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43
+    bg: _chunkBQ5MMYMPcjs.colors.gray5,
+    smBg: _chunkBQ5MMYMPcjs.colors.gray5,
+    text: _chunkBQ5MMYMPcjs.colors.grayBlue94,
+    secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43
   }),
   controls: extendBase(lightBaseTheme, {
-    text: _chunk2J2ZDWLFcjs.colors.grayBlue94,
-    secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-    bg: _chunk2J2ZDWLFcjs.colors.grayBlue9
+    text: _chunkBQ5MMYMPcjs.colors.grayBlue94,
+    secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+    bg: _chunkBQ5MMYMPcjs.colors.grayBlue9
   }),
   buttons: _deepmerge2.default.call(void 0, _chunkRTBR3MYScjs.buttonsThemeBase, {
     defaultTypographyType: "Title",
@@ -450,35 +450,35 @@ var umaAuthSdkDarkTheme = extend(darkTheme, {
 });
 var umameDocsLightTheme = extend(lightTheme, {
   type: "umameDocsLight" /* UmameDocsLight */,
-  bg: _chunk2J2ZDWLFcjs.colors.gray98,
-  smBg: _chunk2J2ZDWLFcjs.colors.gray98,
-  secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-  link: _chunk2J2ZDWLFcjs.colors.blue39,
-  inputBackground: _chunk2J2ZDWLFcjs.colors.white,
+  bg: _chunkBQ5MMYMPcjs.colors.gray98,
+  smBg: _chunkBQ5MMYMPcjs.colors.gray98,
+  secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+  link: _chunkBQ5MMYMPcjs.colors.blue39,
+  inputBackground: _chunkBQ5MMYMPcjs.colors.white,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "UmameDocs" /* UmameDocs */, {
     main: "Manrope",
     code: "Monaco"
   }),
   content: extendBase(lightBaseTheme, {
-    bg: _chunk2J2ZDWLFcjs.colors.gray98,
-    smBg: _chunk2J2ZDWLFcjs.colors.gray98,
-    text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-    secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43
+    bg: _chunkBQ5MMYMPcjs.colors.gray98,
+    smBg: _chunkBQ5MMYMPcjs.colors.gray98,
+    text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+    secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43
   }),
   controls: extendBase(lightBaseTheme, {
-    text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-    secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-    bg: _chunk2J2ZDWLFcjs.colors.grayBlue94
+    text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+    secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+    bg: _chunkBQ5MMYMPcjs.colors.grayBlue94
   })
 });
 var umameDocsDarkTheme = extend(darkTheme, {
   type: "umameDocsDark" /* UmameDocsDark */,
-  bg: _chunk2J2ZDWLFcjs.colors.gray98,
-  smBg: _chunk2J2ZDWLFcjs.colors.gray98,
-  secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-  link: _chunk2J2ZDWLFcjs.colors.blue39,
+  bg: _chunkBQ5MMYMPcjs.colors.gray98,
+  smBg: _chunkBQ5MMYMPcjs.colors.gray98,
+  secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+  link: _chunkBQ5MMYMPcjs.colors.blue39,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "UmameDocs" /* UmameDocs */, {
     main: "Manrope",
     code: "Monaco"
@@ -493,11 +493,11 @@ var lightsparkDocsDarkTheme = extend(darkTheme, {
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "LightsparkDocs" /* LightsparkDocs */)
 });
 var bridgeBaseSettings = {
-  secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  mcNeutral: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  success: _chunk2J2ZDWLFcjs.colors.green37,
-  link: _chunk2J2ZDWLFcjs.colors.blue39,
-  linkLight: _chunk2J2ZDWLFcjs.colors.blue10,
+  secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  mcNeutral: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  success: _chunkBQ5MMYMPcjs.colors.green37,
+  link: _chunkBQ5MMYMPcjs.colors.blue39,
+  linkLight: _chunkBQ5MMYMPcjs.colors.blue10,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "Bridge" /* Bridge */, {
     main: "Manrope",
     code: "Roboto Mono"
@@ -682,21 +682,21 @@ var bridgeBaseSettings = {
 };
 var bridgeLightTheme = extend(lightTheme, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,
-  bg: _chunk2J2ZDWLFcjs.colors.gray98,
-  smBg: _chunk2J2ZDWLFcjs.colors.gray98,
-  text: _chunk2J2ZDWLFcjs.colors.grayBlue9,
-  secondary: _chunk2J2ZDWLFcjs.colors.gray2,
-  tertiary: _chunk2J2ZDWLFcjs.colors.gray6,
-  inputBackground: _chunk2J2ZDWLFcjs.colors.white,
-  danger: _chunk2J2ZDWLFcjs.colors.red50
+  bg: _chunkBQ5MMYMPcjs.colors.gray98,
+  smBg: _chunkBQ5MMYMPcjs.colors.gray98,
+  text: _chunkBQ5MMYMPcjs.colors.grayBlue9,
+  secondary: _chunkBQ5MMYMPcjs.colors.gray2,
+  tertiary: _chunkBQ5MMYMPcjs.colors.gray6,
+  inputBackground: _chunkBQ5MMYMPcjs.colors.white,
+  danger: _chunkBQ5MMYMPcjs.colors.red50
 }));
 var bridgeDarkTheme = extend(darkTheme, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, bridgeBaseSettings), {
   type: "bridgeDark" /* BridgeDark */
 }));
 var nageBaseSettings = {
-  secondary: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  mcNeutral: _chunk2J2ZDWLFcjs.colors.grayBlue43,
-  success: _chunk2J2ZDWLFcjs.colors.green37,
+  secondary: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  mcNeutral: _chunkBQ5MMYMPcjs.colors.grayBlue43,
+  success: _chunkBQ5MMYMPcjs.colors.green37,
   typography: _chunkN6HLM4KCcjs.getTypography.call(void 0, "Nage" /* Nage */, {
     main: "SuisseIntl",
     code: "SuisseIntl-Mono"
@@ -771,6 +771,14 @@ var nageBaseSettings = {
         defaultHoverBorderColor: "warningBackgroundHover",
         defaultActiveBackgroundColor: "warningBackgroundActive",
         defaultActiveBorderColor: "warningBackgroundActive"
+      },
+      transparent: {
+        defaultBackgroundColor: "transparent",
+        defaultBorderColor: "transparent",
+        defaultHoverBackgroundColor: "black-04",
+        defaultHoverBorderColor: "transparent",
+        defaultActiveBackgroundColor: "black-10",
+        defaultActiveBorderColor: "transparent"
       }
     }
   }),
@@ -788,13 +796,13 @@ var nageBaseSettings = {
 };
 var nageLightTheme = extend(lightTheme, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, nageBaseSettings), {
   type: "nageLight" /* NageLight */,
-  bg: _chunk2J2ZDWLFcjs.colors["gray-100"],
-  smBg: _chunk2J2ZDWLFcjs.colors["gray-100"],
-  text: _chunk2J2ZDWLFcjs.colors["gray-950"],
-  secondary: _chunk2J2ZDWLFcjs.colors["gray-500"],
-  tertiary: _chunk2J2ZDWLFcjs.colors.gray6,
-  inputBackground: _chunk2J2ZDWLFcjs.colors.white,
-  danger: _chunk2J2ZDWLFcjs.colors.red50
+  bg: _chunkBQ5MMYMPcjs.colors["gray-100"],
+  smBg: _chunkBQ5MMYMPcjs.colors["gray-100"],
+  text: _chunkBQ5MMYMPcjs.colors["gray-950"],
+  secondary: _chunkBQ5MMYMPcjs.colors["gray-500"],
+  tertiary: _chunkBQ5MMYMPcjs.colors.gray6,
+  inputBackground: _chunkBQ5MMYMPcjs.colors["gray-050"],
+  danger: _chunkBQ5MMYMPcjs.colors.red50
 }));
 var nageDarkTheme = extend(darkTheme, _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, nageBaseSettings), {
   type: "nageDark" /* NageDark */
@@ -829,7 +837,7 @@ function isThemeColorKey(key) {
 }
 function isThemeOrColorKey(key) {
   return Boolean(
-    typeof key === "string" && (isThemeColorKey(key) || _chunk2J2ZDWLFcjs.isColorKey.call(void 0, key) || Array.isArray(key) && key.length === 2 && isThemeColorKey(key[1]))
+    typeof key === "string" && (isThemeColorKey(key) || _chunkBQ5MMYMPcjs.isColorKey.call(void 0, key) || Array.isArray(key) && key.length === 2 && isThemeColorKey(key[1]))
   );
 }
 function getColor(theme, key) {
@@ -840,8 +848,8 @@ function getColor(theme, key) {
     const surfaceTheme = theme[surface];
     const color = surfaceTheme[colorKey];
     return color;
-  } else if (key && _chunk2J2ZDWLFcjs.isColorKey.call(void 0, key)) {
-    return _chunk2J2ZDWLFcjs.colors[key];
+  } else if (key && _chunkBQ5MMYMPcjs.isColorKey.call(void 0, key)) {
+    return _chunkBQ5MMYMPcjs.colors[key];
   }
   return theme.text;
 }
@@ -926,7 +934,7 @@ function useThemeBg() {
   const bp = _chunkKW3JYLRIcjs.useBreakpoints.call(void 0, );
   const isSm = bp.current("sm" /* sm */);
   if (isDark(theme)) {
-    return _chunk2J2ZDWLFcjs.darkGradient;
+    return _chunkBQ5MMYMPcjs.darkGradient;
   }
   return isSm ? theme.smBg : theme.bg;
 }