@lightsparkdev/ui 1.0.3 → 1.0.5

package/dist/components/Badge.d.cts

@@ -1,13 +1,152 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
+import { F as FontColorKey } from '../themes-37e92940.js';
+import { TypographyTypeKey } from '../styles/tokens/typography.cjs';
+import { SimpleTypographyProps } from '../styles/typography.cjs';
+import { ToReactNodesArgs } from '../utils/toReactNodes.cjs';
+import { IconName } from './Icon/types.cjs';
+import '@emotion/react';
+import '@emotion/css';
+import '../styles/colors.cjs';
+import '@lightsparkdev/core';
+import './typography/renderTypography.cjs';
+import './typography/Code.cjs';
+import '@emotion/styled';
+import 'react';
+import '../utils/toNonTypographicReactNodes.cjs';
+import '../types/index.cjs';
+import './typography/Overline.cjs';
+import './typography/LabelStrong.cjs';
+import './typography/LabelModerate.cjs';
+import './typography/Title.cjs';
+import './typography/Display.cjs';
+import '../index-dcf19aa7.js';
+import '../icons/AI.cjs';
+import '../icons/AnchorLink.cjs';
+import '../icons/ApiConnection.cjs';
+import '../icons/AppIcon.cjs';
+import '../icons/ArrowCircle.cjs';
+import '../icons/ArrowCircleTier1.cjs';
+import '../icons/ArrowCircleTier2.cjs';
+import '../icons/ArrowCircleTier3.cjs';
+import '../icons/ArrowCornerDownRight.cjs';
+import '../icons/ArrowDown.cjs';
+import '../icons/ArrowUp.cjs';
+import '../icons/ArrowUpRightCircleFill.cjs';
+import '../icons/Bank.cjs';
+import '../icons/BitcoinB.cjs';
+import '../icons/BitcoinBOnRoundedSquare.cjs';
+import '../icons/CameraCapture.cjs';
+import '../icons/CaretRight.cjs';
+import '../icons/CentralArrowShareRight.cjs';
+import '../icons/Checkmark.cjs';
+import '../icons/CheckmarkCircleGreen.cjs';
+import '../icons/CheckmarkCircleTier1.cjs';
+import '../icons/CheckmarkCircleTier2.cjs';
+import '../icons/CheckmarkCircleTier3.cjs';
+import '../icons/Chevron.cjs';
+import '../icons/ChevronLeft.cjs';
+import '../icons/CircleCheck.cjs';
+import '../icons/CircleCheckOutline.cjs';
+import '../icons/CirclePlus.cjs';
+import '../icons/Clock.cjs';
+import '../icons/Close.cjs';
+import '../icons/Code.cjs';
+import '../icons/Copy.cjs';
+import '../icons/CreditCard.cjs';
+import '../icons/DeleteIcon.cjs';
+import '../icons/Dollar.cjs';
+import '../icons/DollarManrope.cjs';
+import '../icons/DollarManropeSmall.cjs';
+import '../icons/DotGrid1x3Horizontal.cjs';
+import '../icons/Download.cjs';
+import '../icons/Envelope.cjs';
+import '../icons/ExclamationPoint.cjs';
+import '../icons/Explorer.cjs';
+import '../icons/Eye.cjs';
+import '../icons/EyeDropper.cjs';
+import '../icons/Figma.cjs';
+import '../icons/FlutterTwoTone.cjs';
+import '../icons/FramedLetterI.cjs';
+import '../icons/Gear.cjs';
+import '../icons/Github.cjs';
+import '../icons/GoTwoTone.cjs';
+import '../icons/GraphQLTwoTone.cjs';
+import '../icons/HeartOutline.cjs';
+import '../icons/Home.cjs';
+import '../icons/HorizontalArrows.cjs';
+import '../icons/Info.cjs';
+import '../icons/JavaScriptTwoTone.cjs';
+import '../icons/JavaTwoTone.cjs';
+import '../icons/KotlinTwoTone.cjs';
+import '../icons/LeftArrow.cjs';
+import '../icons/LightningOnRoundedSquare.cjs';
+import '../icons/LinkIcon.cjs';
+import '../icons/LoadingSpinner.cjs';
+import '../icons/Lock.cjs';
+import '../icons/Logo.cjs';
+import '../icons/LogoBolt.cjs';
+import '../icons/LogoOnCircle.cjs';
+import '../icons/MagicWand.cjs';
+import '../icons/Minus.cjs';
+import '../icons/Monitor.cjs';
+import '../icons/NodeAdd.cjs';
+import '../icons/NotEye.cjs';
+import '../icons/PaperPlane.cjs';
+import '../icons/Pencil.cjs';
+import '../icons/Person.cjs';
+import '../icons/PersonCircle.cjs';
+import '../icons/PiggyBank.cjs';
+import '../icons/Plus.cjs';
+import '../icons/PythonTwoTone.cjs';
+import '../icons/QRCodeIcon.cjs';
+import '../icons/QuestionCircle.cjs';
+import '../icons/QuestionCircleStrong.cjs';
+import '../icons/ReactTwoTone.cjs';
+import '../icons/Recycling.cjs';
+import '../icons/Remove.cjs';
+import '../icons/Restart.cjs';
+import '../icons/RightArrow.cjs';
+import '../icons/Roadmap.cjs';
+import '../icons/RustTwoTone.cjs';
+import '../icons/Satoshi.cjs';
+import '../icons/SatoshiRounded.cjs';
+import '../icons/Search.cjs';
+import '../icons/SecurityKey.cjs';
+import '../icons/Selector.cjs';
+import '../icons/SemiCircleOverlap.cjs';
+import '../icons/Share.cjs';
+import '../icons/ShieldCheck.cjs';
+import '../icons/Sidebar.cjs';
+import '../icons/Sort.cjs';
+import '../icons/StackedLines.cjs';
+import '../icons/SwiftTwoTone.cjs';
+import '../icons/TapSingle.cjs';
+import '../icons/Team.cjs';
+import '../icons/Terminal.cjs';
+import '../icons/Trash.cjs';
+import '../icons/TwoArrowsDown.cjs';
+import '../icons/TwoArrowsUp.cjs';
+import '../icons/Uma.cjs';
+import '../icons/UmaBridgeLoading.cjs';
+import '../icons/Upload.cjs';
+import '../icons/WalletSDKIcon.cjs';
+import '../icons/WarningSign.cjs';
 
-type BadgeColor = "text" | "danger";
-type BadgeProps = {
-    text?: string | undefined;
-    color?: BadgeColor | undefined;
+type BadgeKind = "danger" | "default";
+type BadgeProps<T extends TypographyTypeKey> = {
+    content?: ToReactNodesArgs<T> | undefined;
+    kind?: BadgeKind | undefined;
     ml?: 0 | 4 | 6;
     mr?: 0 | 4 | 6;
+    block?: boolean;
+    size?: "sm" | "lg";
+    icon?: {
+        name: IconName;
+        color?: FontColorKey | undefined;
+    } | undefined;
+    typography?: SimpleTypographyProps;
 };
-declare function Badge({ text, color, ml, mr }: BadgeProps): _emotion_react_jsx_runtime.JSX.Element | null;
-declare const badgeVPadding = 2;
+declare function Badge<T extends TypographyTypeKey>({ content: contentProp, kind, icon, ml, mr, size, block, typography: typographyProp, }: BadgeProps<T>): _emotion_react_jsx_runtime.JSX.Element | null;
+declare const badgeSmVPadding = 2;
 
-export { Badge, BadgeProps, badgeVPadding };
+export { Badge, BadgeProps, badgeSmVPadding };

package/dist/components/Badge.d.ts

@@ -1,13 +1,152 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
+import { F as FontColorKey } from '../themes-832e46b2.js';
+import { TypographyTypeKey } from '../styles/tokens/typography.js';
+import { SimpleTypographyProps } from '../styles/typography.js';
+import { ToReactNodesArgs } from '../utils/toReactNodes.js';
+import { IconName } from './Icon/types.js';
+import '@emotion/react';
+import '@emotion/css';
+import '../styles/colors.js';
+import '@lightsparkdev/core';
+import './typography/renderTypography.js';
+import './typography/Code.js';
+import '@emotion/styled';
+import 'react';
+import '../utils/toNonTypographicReactNodes.js';
+import '../types/index.js';
+import './typography/Overline.js';
+import './typography/LabelStrong.js';
+import './typography/LabelModerate.js';
+import './typography/Title.js';
+import './typography/Display.js';
+import '../index-71766330.js';
+import '../icons/AI.js';
+import '../icons/AnchorLink.js';
+import '../icons/ApiConnection.js';
+import '../icons/AppIcon.js';
+import '../icons/ArrowCircle.js';
+import '../icons/ArrowCircleTier1.js';
+import '../icons/ArrowCircleTier2.js';
+import '../icons/ArrowCircleTier3.js';
+import '../icons/ArrowCornerDownRight.js';
+import '../icons/ArrowDown.js';
+import '../icons/ArrowUp.js';
+import '../icons/ArrowUpRightCircleFill.js';
+import '../icons/Bank.js';
+import '../icons/BitcoinB.js';
+import '../icons/BitcoinBOnRoundedSquare.js';
+import '../icons/CameraCapture.js';
+import '../icons/CaretRight.js';
+import '../icons/CentralArrowShareRight.js';
+import '../icons/Checkmark.js';
+import '../icons/CheckmarkCircleGreen.js';
+import '../icons/CheckmarkCircleTier1.js';
+import '../icons/CheckmarkCircleTier2.js';
+import '../icons/CheckmarkCircleTier3.js';
+import '../icons/Chevron.js';
+import '../icons/ChevronLeft.js';
+import '../icons/CircleCheck.js';
+import '../icons/CircleCheckOutline.js';
+import '../icons/CirclePlus.js';
+import '../icons/Clock.js';
+import '../icons/Close.js';
+import '../icons/Code.js';
+import '../icons/Copy.js';
+import '../icons/CreditCard.js';
+import '../icons/DeleteIcon.js';
+import '../icons/Dollar.js';
+import '../icons/DollarManrope.js';
+import '../icons/DollarManropeSmall.js';
+import '../icons/DotGrid1x3Horizontal.js';
+import '../icons/Download.js';
+import '../icons/Envelope.js';
+import '../icons/ExclamationPoint.js';
+import '../icons/Explorer.js';
+import '../icons/Eye.js';
+import '../icons/EyeDropper.js';
+import '../icons/Figma.js';
+import '../icons/FlutterTwoTone.js';
+import '../icons/FramedLetterI.js';
+import '../icons/Gear.js';
+import '../icons/Github.js';
+import '../icons/GoTwoTone.js';
+import '../icons/GraphQLTwoTone.js';
+import '../icons/HeartOutline.js';
+import '../icons/Home.js';
+import '../icons/HorizontalArrows.js';
+import '../icons/Info.js';
+import '../icons/JavaScriptTwoTone.js';
+import '../icons/JavaTwoTone.js';
+import '../icons/KotlinTwoTone.js';
+import '../icons/LeftArrow.js';
+import '../icons/LightningOnRoundedSquare.js';
+import '../icons/LinkIcon.js';
+import '../icons/LoadingSpinner.js';
+import '../icons/Lock.js';
+import '../icons/Logo.js';
+import '../icons/LogoBolt.js';
+import '../icons/LogoOnCircle.js';
+import '../icons/MagicWand.js';
+import '../icons/Minus.js';
+import '../icons/Monitor.js';
+import '../icons/NodeAdd.js';
+import '../icons/NotEye.js';
+import '../icons/PaperPlane.js';
+import '../icons/Pencil.js';
+import '../icons/Person.js';
+import '../icons/PersonCircle.js';
+import '../icons/PiggyBank.js';
+import '../icons/Plus.js';
+import '../icons/PythonTwoTone.js';
+import '../icons/QRCodeIcon.js';
+import '../icons/QuestionCircle.js';
+import '../icons/QuestionCircleStrong.js';
+import '../icons/ReactTwoTone.js';
+import '../icons/Recycling.js';
+import '../icons/Remove.js';
+import '../icons/Restart.js';
+import '../icons/RightArrow.js';
+import '../icons/Roadmap.js';
+import '../icons/RustTwoTone.js';
+import '../icons/Satoshi.js';
+import '../icons/SatoshiRounded.js';
+import '../icons/Search.js';
+import '../icons/SecurityKey.js';
+import '../icons/Selector.js';
+import '../icons/SemiCircleOverlap.js';
+import '../icons/Share.js';
+import '../icons/ShieldCheck.js';
+import '../icons/Sidebar.js';
+import '../icons/Sort.js';
+import '../icons/StackedLines.js';
+import '../icons/SwiftTwoTone.js';
+import '../icons/TapSingle.js';
+import '../icons/Team.js';
+import '../icons/Terminal.js';
+import '../icons/Trash.js';
+import '../icons/TwoArrowsDown.js';
+import '../icons/TwoArrowsUp.js';
+import '../icons/Uma.js';
+import '../icons/UmaBridgeLoading.js';
+import '../icons/Upload.js';
+import '../icons/WalletSDKIcon.js';
+import '../icons/WarningSign.js';
 
-type BadgeColor = "text" | "danger";
-type BadgeProps = {
-    text?: string | undefined;
-    color?: BadgeColor | undefined;
+type BadgeKind = "danger" | "default";
+type BadgeProps<T extends TypographyTypeKey> = {
+    content?: ToReactNodesArgs<T> | undefined;
+    kind?: BadgeKind | undefined;
     ml?: 0 | 4 | 6;
     mr?: 0 | 4 | 6;
+    block?: boolean;
+    size?: "sm" | "lg";
+    icon?: {
+        name: IconName;
+        color?: FontColorKey | undefined;
+    } | undefined;
+    typography?: SimpleTypographyProps;
 };
-declare function Badge({ text, color, ml, mr }: BadgeProps): _emotion_react_jsx_runtime.JSX.Element | null;
-declare const badgeVPadding = 2;
+declare function Badge<T extends TypographyTypeKey>({ content: contentProp, kind, icon, ml, mr, size, block, typography: typographyProp, }: BadgeProps<T>): _emotion_react_jsx_runtime.JSX.Element | null;
+declare const badgeSmVPadding = 2;
 
-export { Badge, BadgeProps, badgeVPadding };
+export { Badge, BadgeProps, badgeSmVPadding };

package/dist/components/Badge.js

@@ -1,28 +1,25 @@
 import {
   Badge,
-  badgeVPadding
-} from "../chunk-SEZEDINC.js";
-import "../chunk-B2VYAIYR.js";
-import "../chunk-4BFBANKF.js";
-import "../chunk-K7FYXGOI.js";
-import "../chunk-BDZ46Z2I.js";
-import "../chunk-B6S7Y4K7.js";
-import "../chunk-GSKTHUQJ.js";
-import "../chunk-WGKUDRZ7.js";
-import "../chunk-2AGBCGOW.js";
-import "../chunk-MRGHRTKA.js";
-import "../chunk-35PJW7RT.js";
-import "../chunk-GWHKALYQ.js";
-import "../chunk-WTMJTGW4.js";
-import "../chunk-CRTTTIAD.js";
+  badgeSmVPadding
+} from "../chunk-ERNTWEIJ.js";
+import "../chunk-AKGW3FMJ.js";
+import "../chunk-RQLRNKOP.js";
+import "../chunk-GGWFUEDW.js";
+import "../chunk-XLKL3DNK.js";
+import "../chunk-HLZNFEDV.js";
+import "../chunk-ZR2TARGX.js";
+import "../chunk-IXAXRBFS.js";
+import "../chunk-4EV5IUUJ.js";
+import "../chunk-PBLWYVQF.js";
+import "../chunk-QON4D7N2.js";
+import "../chunk-BNHCCR3C.js";
 import "../chunk-YMNSXZ5D.js";
-import "../chunk-XDP7GCYE.js";
+import "../chunk-IH5SIRJL.js";
+import "../chunk-HNK2KIC7.js";
 import "../chunk-OPV246QW.js";
-import "../chunk-AAFUVYVP.js";
-import "../chunk-4C2TISN7.js";
-import "../chunk-3XSQV5U4.js";
-import "../chunk-7WDAN3OC.js";
-import "../chunk-I3FI3FNP.js";
+import "../chunk-SCIQSZSW.js";
+import "../chunk-OPUCWQMK.js";
+import "../chunk-LAGOF7IU.js";
 import "../chunk-EDN2QDCB.js";
 import "../chunk-FT62PIPN.js";
 import "../chunk-5ZDDVLS6.js";
@@ -137,14 +134,14 @@ import "../chunk-VI6WTKMV.js";
 import "../chunk-QW2INB5A.js";
 import "../chunk-JLD7MGLC.js";
 import "../chunk-DW6LFUI2.js";
-import "../chunk-PG2W2HVB.js";
-import "../chunk-IBZBPQMZ.js";
+import "../chunk-YG5BANJH.js";
+import "../chunk-UAUAYQ3C.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
 import "../chunk-FO7I4E45.js";
-import "../chunk-XUWFUTR4.js";
+import "../chunk-KPAVY3UH.js";
 import "../chunk-LOPKRCGI.js";
 export {
   Badge,
-  badgeVPadding
+  badgeSmVPadding
 };

package/dist/components/Banner/Banner.cjs

@@ -22,6 +22,18 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -71,7 +83,7 @@ __export(Banner_exports, {
 });
 module.exports = __toCommonJS(Banner_exports);
 var import_styled13 = __toESM(require("@emotion/styled"), 1);
-var import_react23 = require("react");
+var import_react24 = require("react");
 
 // src/hooks/useResizeObserver.tsx
 var import_lodash_es = require("lodash-es");
@@ -139,7 +151,6 @@ var neutral = {
   gray30: "#4D4D4D",
   gray40: "#666666",
   gray50: "#808080",
-  gray57: "#8B8E98",
   gray60: "#999999",
   gray70: "#B3B3B3",
   gray80: "#CCCCCC",
@@ -163,10 +174,13 @@ var baseColors = __spreadProps(__spreadValues({}, neutral), {
   blue37: "#21529c",
   blue58: "#28BFFF",
   // less than 50% saturated blue
+  grayBlue5: "#0c0d0f",
   grayBlue9: "#16171A",
+  grayBlue18: "#21283a",
   grayBlue32: "#4F5156",
   grayBlue43: "#686A72",
   grayBlue45: "#676F80",
+  grayBlue57: "#8B8E98",
   grayBlue67: "#9BA7B9",
   grayBlue80: "#C0C9D6",
   grayBlue88: "#DEDFE4",
@@ -3711,8 +3725,7 @@ var baseThemeColors = {
   success: colors.success,
   text: colors.black,
   vlcNeutral: colors.gray95,
-  warning: colors.warning,
-  inputBackground: colors.white
+  warning: colors.warning
 };
 var themeOrColorKeyValues = [
   ...Object.keys(baseThemeColors),
@@ -3724,6 +3737,10 @@ var baseTheme = __spreadProps(__spreadValues({}, baseThemeColors), {
   typography: getTypography("Lightspark" /* Lightspark */),
   hcNeutralFromBg: (bgHex) => hcNeutralFromBg(bgHex, colors.black, colors.white),
   buttons: defaultButtonsTheme,
+  badge: {
+    bg: "c05Neutral"
+  },
+  inputBackground: colors.white,
   loading: "LoadingSpinner"
 });
 var lightBaseTheme = baseTheme;
@@ -3761,7 +3778,10 @@ var darkBaseTheme = {
   warning: colors.warning,
   buttons: defaultButtonsTheme,
   loading: "LoadingSpinner",
-  inputBackground: colors.black
+  inputBackground: colors.black,
+  badge: {
+    bg: "c15Neutral"
+  }
 };
 var lightTheme = extend(lightBaseTheme, {
   header: extendBase(lightBaseTheme, {
@@ -3877,7 +3897,10 @@ var bridgeBaseSettings = {
         defaultBorderWidth: 1
       }
     }
-  })
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
 };
 var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,
@@ -3947,7 +3970,11 @@ var z = {
 };
 
 // src/utils/toReactNodes.tsx
-var import_react22 = require("react");
+var import_lodash_es5 = require("lodash-es");
+var import_react23 = require("react");
+
+// src/components/typography/renderTypography.tsx
+var import_react22 = __toESM(require("react"), 1);
 
 // src/components/typography/Body.tsx
 var import_styled3 = __toESM(require("@emotion/styled"), 1);
@@ -8290,7 +8317,6 @@ var StyledTitle = import_styled12.default.span`
 `;
 
 // src/components/typography/renderTypography.tsx
-var import_jsx_runtime128 = require("@emotion/react/jsx-runtime");
 var typographyMap = {
   Display,
   Headline,
@@ -8302,34 +8328,34 @@ var typographyMap = {
   "Label Strong": LabelStrong,
   Overline,
   Code: Code2,
-  "Code Strong": () => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { children: "Unimplemented" })
+  "Code Strong": Code2
 };
 var renderTypography = (type, props) => {
   const TypographyComponent = typographyMap[type];
-  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(TypographyComponent, __spreadValues({}, props));
+  const _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
+  return import_react22.default.createElement(TypographyComponent, rest, children);
 };
 
 // src/utils/toReactNodes.tsx
-var import_jsx_runtime129 = require("@emotion/react/jsx-runtime");
+var import_jsx_runtime128 = require("@emotion/react/jsx-runtime");
 function toReactNodes(toReactNodesArg) {
   const toReactNodesArray = Array.isArray(toReactNodesArg) ? toReactNodesArg : [toReactNodesArg];
   const reactNodes = toReactNodesArray.map((node, i) => {
     let content;
     if (!node) {
       return null;
-    } else if (typeof node !== "string" && "typography" in node && node.typography.type && node.typography.props) {
-      content = /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_react22.Fragment, { children: renderTypography(
+    } else if (typeof node !== "string" && "typography" in node && node.typography.type) {
+      const props = node.typography.props || {};
+      content = /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_react23.Fragment, { children: renderTypography(
         node.typography.type,
-        Object.assign(node.typography.props, {
-          content: node
-        })
+        Object.assign(props, { content: node })
       ) }, `typography-${i}-${node.text.substr(0, 10)}`);
     } else {
       content = toNonTypographicReactNodes(node);
     }
     return content || null;
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(import_react22.Fragment, { children: reactNodes });
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(import_react23.Fragment, { children: reactNodes });
 }
 
 // src/components/Banner/constants.ts
@@ -8337,7 +8363,7 @@ var bannerTimingSecs = 0.2;
 var bannerTiming = `${bannerTimingSecs}s ease`;
 
 // src/components/Banner/Banner.tsx
-var import_jsx_runtime130 = require("@emotion/react/jsx-runtime");
+var import_jsx_runtime129 = require("@emotion/react/jsx-runtime");
 function Banner({
   content,
   to,
@@ -8353,17 +8379,17 @@ function Banner({
   hPadding = 0,
   borderColor
 }) {
-  const [width, setWidth] = (0, import_react23.useState)(70);
-  const resizeProps = (0, import_react23.useMemo)(() => ["height"], []);
+  const [width, setWidth] = (0, import_react24.useState)(70);
+  const resizeProps = (0, import_react24.useMemo)(() => ["height"], []);
   const { ref, rect } = useResizeObserver(resizeProps);
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (bgProgressDuration) {
       setTimeout(() => {
         setWidth(100);
       }, 0);
     }
   }, [bgProgressDuration]);
-  (0, import_react23.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (onHeightChange && typeof (rect == null ? void 0 : rect.height) === "number") {
       onHeightChange(rect.height);
     }
@@ -8372,15 +8398,15 @@ function Banner({
   if (content) {
     const contentNodes = toReactNodes(content);
     if (to) {
-      contentNode = /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Link, { to, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(BannerFlexInnerContent, { children: [
+      contentNode = /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Link, { to, children: /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(BannerFlexInnerContent, { children: [
         contentNodes,
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Icon, { name: "RightArrow", width: 12, ml: 6 })
+        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Icon, { name: "RightArrow", width: 12, ml: 6 })
       ] }) });
     } else {
       contentNode = contentNodes;
     }
   }
-  const innerContent = content ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
+  const innerContent = content ? /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
     BannerInnerContent,
     {
       isVisible: Boolean(content),
@@ -8389,7 +8415,7 @@ function Banner({
       children: contentNode
     }
   ) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
     StyledBanner,
     {
       colorProp: color,
@@ -8404,7 +8430,7 @@ function Banner({
         left,
         innerContent,
         right,
-        bgProgressDuration && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
+        bgProgressDuration && /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
           BannerGradientBg,
           {
             duration: bgProgressDuration,

package/dist/components/Banner/Banner.d.cts

@@ -1,6 +1,6 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import { ReactNode } from 'react';
-import { T as ThemeOrColorKey } from '../../buttons-36cdd0fe.js';
+import { T as ThemeOrColorKey } from '../../themes-37e92940.js';
 import { TypographyTypeKey } from '../../styles/tokens/typography.cjs';
 import { NewRoutesType } from '../../types/index.cjs';
 import { ToReactNodesArgs } from '../../utils/toReactNodes.cjs';

package/dist/components/Banner/Banner.d.ts

@@ -1,6 +1,6 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import { ReactNode } from 'react';
-import { T as ThemeOrColorKey } from '../../buttons-35280bfe.js';
+import { T as ThemeOrColorKey } from '../../themes-832e46b2.js';
 import { TypographyTypeKey } from '../../styles/tokens/typography.js';
 import { NewRoutesType } from '../../types/index.js';
 import { ToReactNodesArgs } from '../../utils/toReactNodes.js';