@lightsparkdev/ui 1.0.3 → 1.0.5

package/dist/components/typography/Headline.js

@@ -5,13 +5,13 @@ import {
   StyledHeadline,
   headlineElements,
   headlineSelector
-} from "../../chunk-CRTTTIAD.js";
+} from "../../chunk-BNHCCR3C.js";
 import "../../chunk-YMNSXZ5D.js";
-import "../../chunk-XDP7GCYE.js";
+import "../../chunk-HNK2KIC7.js";
 import "../../chunk-OPV246QW.js";
-import "../../chunk-AAFUVYVP.js";
-import "../../chunk-4C2TISN7.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";
@@ -126,12 +126,12 @@ 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 {
   ALL_HEADLINE_SELECTORS,

package/dist/components/typography/Label.cjs

@@ -259,7 +259,6 @@ var neutral = {
   gray30: "#4D4D4D",
   gray40: "#666666",
   gray50: "#808080",
-  gray57: "#8B8E98",
   gray60: "#999999",
   gray70: "#B3B3B3",
   gray80: "#CCCCCC",
@@ -283,10 +282,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",
@@ -3581,8 +3583,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),
@@ -3594,6 +3595,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;
@@ -3631,7 +3636,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, {
@@ -3747,7 +3755,10 @@ var bridgeBaseSettings = {
         defaultBorderWidth: 1
       }
     }
-  })
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
 };
 var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,

package/dist/components/typography/Label.d.cts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-36cdd0fe.js';
+import { F as FontColorKey } from '../../themes-37e92940.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.cjs';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.cjs';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.cjs';
 type LabelProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
 };
 declare const Label: ({ content, color, size, children, }: LabelProps) => _emotion_react_jsx_runtime.JSX.Element;

package/dist/components/typography/Label.d.ts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-35280bfe.js';
+import { F as FontColorKey } from '../../themes-832e46b2.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.js';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.js';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.js';
 type LabelProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
 };
 declare const Label: ({ content, color, size, children, }: LabelProps) => _emotion_react_jsx_runtime.JSX.Element;

package/dist/components/typography/Label.js

@@ -2,12 +2,12 @@
 import {
   Label,
   StyledLabel
-} from "../../chunk-BDZ46Z2I.js";
-import "../../chunk-XDP7GCYE.js";
+} from "../../chunk-IH5SIRJL.js";
+import "../../chunk-HNK2KIC7.js";
 import "../../chunk-OPV246QW.js";
-import "../../chunk-AAFUVYVP.js";
-import "../../chunk-4C2TISN7.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";
@@ -122,12 +122,12 @@ 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 {
   Label,

package/dist/components/typography/LabelModerate.cjs

@@ -259,7 +259,6 @@ var neutral = {
   gray30: "#4D4D4D",
   gray40: "#666666",
   gray50: "#808080",
-  gray57: "#8B8E98",
   gray60: "#999999",
   gray70: "#B3B3B3",
   gray80: "#CCCCCC",
@@ -283,10 +282,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",
@@ -3581,8 +3583,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),
@@ -3594,6 +3595,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;
@@ -3631,7 +3636,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, {
@@ -3747,7 +3755,10 @@ var bridgeBaseSettings = {
         defaultBorderWidth: 1
       }
     }
-  })
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
 };
 var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,

package/dist/components/typography/LabelModerate.d.cts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-36cdd0fe.js';
+import { F as FontColorKey } from '../../themes-37e92940.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.cjs';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.cjs';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.cjs';
 type LabelModerateProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
 };
 declare const LabelModerate: ({ content, color, size, children, }: LabelModerateProps) => _emotion_react_jsx_runtime.JSX.Element;

package/dist/components/typography/LabelModerate.d.ts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-35280bfe.js';
+import { F as FontColorKey } from '../../themes-832e46b2.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.js';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.js';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.js';
 type LabelModerateProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
 };
 declare const LabelModerate: ({ content, color, size, children, }: LabelModerateProps) => _emotion_react_jsx_runtime.JSX.Element;

package/dist/components/typography/LabelModerate.js

@@ -2,12 +2,12 @@
 import {
   LabelModerate,
   StyledLabelModerate
-} from "../../chunk-B6S7Y4K7.js";
-import "../../chunk-XDP7GCYE.js";
+} from "../../chunk-GGWFUEDW.js";
+import "../../chunk-HNK2KIC7.js";
 import "../../chunk-OPV246QW.js";
-import "../../chunk-AAFUVYVP.js";
-import "../../chunk-4C2TISN7.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";
@@ -122,12 +122,12 @@ 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 {
   LabelModerate,

package/dist/components/typography/LabelStrong.cjs

@@ -259,7 +259,6 @@ var neutral = {
   gray30: "#4D4D4D",
   gray40: "#666666",
   gray50: "#808080",
-  gray57: "#8B8E98",
   gray60: "#999999",
   gray70: "#B3B3B3",
   gray80: "#CCCCCC",
@@ -283,10 +282,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",
@@ -3581,8 +3583,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),
@@ -3594,6 +3595,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;
@@ -3631,7 +3636,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, {
@@ -3747,7 +3755,10 @@ var bridgeBaseSettings = {
         defaultBorderWidth: 1
       }
     }
-  })
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
 };
 var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,

package/dist/components/typography/LabelStrong.d.cts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-36cdd0fe.js';
+import { F as FontColorKey } from '../../themes-37e92940.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.cjs';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.cjs';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.cjs';
 type LabelStrongProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
     block?: boolean | undefined;
 };

package/dist/components/typography/LabelStrong.d.ts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-35280bfe.js';
+import { F as FontColorKey } from '../../themes-832e46b2.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.js';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.js';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.js';
 type LabelStrongProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
     block?: boolean | undefined;
 };

package/dist/components/typography/LabelStrong.js

@@ -2,12 +2,12 @@
 import {
   LabelStrong,
   StyledLabelStrong
-} from "../../chunk-GSKTHUQJ.js";
-import "../../chunk-XDP7GCYE.js";
+} from "../../chunk-XLKL3DNK.js";
+import "../../chunk-HNK2KIC7.js";
 import "../../chunk-OPV246QW.js";
-import "../../chunk-AAFUVYVP.js";
-import "../../chunk-4C2TISN7.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";
@@ -122,12 +122,12 @@ 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 {
   LabelStrong,

package/dist/components/typography/Overline.cjs

@@ -259,7 +259,6 @@ var neutral = {
   gray30: "#4D4D4D",
   gray40: "#666666",
   gray50: "#808080",
-  gray57: "#8B8E98",
   gray60: "#999999",
   gray70: "#B3B3B3",
   gray80: "#CCCCCC",
@@ -283,10 +282,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",
@@ -3581,8 +3583,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),
@@ -3594,6 +3595,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;
@@ -3631,7 +3636,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, {
@@ -3747,7 +3755,10 @@ var bridgeBaseSettings = {
         defaultBorderWidth: 1
       }
     }
-  })
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
 };
 var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,

package/dist/components/typography/Overline.d.cts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-36cdd0fe.js';
+import { F as FontColorKey } from '../../themes-37e92940.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.cjs';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.cjs';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.cjs';
 type OverlineProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
 };
 declare const Overline: ({ content, color, size, children, }: OverlineProps) => _emotion_react_jsx_runtime.JSX.Element;

package/dist/components/typography/Overline.d.ts

@@ -2,7 +2,7 @@ import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
-import { F as FontColorKey } from '../../buttons-35280bfe.js';
+import { F as FontColorKey } from '../../themes-832e46b2.js';
 import { TokenSizeKey } from '../../styles/tokens/typography.js';
 import { ToNonTypographicReactNodesArgs } from '../../utils/toNonTypographicReactNodes.js';
 import '@emotion/css';
@@ -125,7 +125,7 @@ import '../../types/index.js';
 type OverlineProps = {
     content?: ToNonTypographicReactNodesArgs | undefined | null;
     children?: string | undefined | null;
-    size?: TokenSizeKey;
+    size?: TokenSizeKey | undefined;
     color?: FontColorKey | undefined;
 };
 declare const Overline: ({ content, color, size, children, }: OverlineProps) => _emotion_react_jsx_runtime.JSX.Element;

package/dist/components/typography/Overline.js

@@ -2,12 +2,12 @@
 import {
   Overline,
   StyledOverline
-} from "../../chunk-WGKUDRZ7.js";
-import "../../chunk-XDP7GCYE.js";
+} from "../../chunk-HLZNFEDV.js";
+import "../../chunk-HNK2KIC7.js";
 import "../../chunk-OPV246QW.js";
-import "../../chunk-AAFUVYVP.js";
-import "../../chunk-4C2TISN7.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";
@@ -122,12 +122,12 @@ 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 {
   Overline,

package/dist/components/typography/Title.cjs

@@ -259,7 +259,6 @@ var neutral = {
   gray30: "#4D4D4D",
   gray40: "#666666",
   gray50: "#808080",
-  gray57: "#8B8E98",
   gray60: "#999999",
   gray70: "#B3B3B3",
   gray80: "#CCCCCC",
@@ -283,10 +282,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",
@@ -3581,8 +3583,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),
@@ -3594,6 +3595,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;
@@ -3631,7 +3636,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, {
@@ -3747,7 +3755,10 @@ var bridgeBaseSettings = {
         defaultBorderWidth: 1
       }
     }
-  })
+  }),
+  badge: {
+    bg: "grayBlue94"
+  }
 };
 var bridgeLightTheme = extend(lightTheme, __spreadProps(__spreadValues({}, bridgeBaseSettings), {
   type: "bridgeLight" /* BridgeLight */,