@lightsparkdev/ui 1.0.0 → 1.0.2

package/dist/styles/fields.cjs

@@ -237,7 +237,7 @@ var colors = baseColors;
 function isColorKey(key) {
   return key in colors;
 }
-function hcNeutralFromBg(bgHex, defaultHex, altHex) {
+function hcNeutralFromBg(bgHex, defaultHex = colors.black, altHex = colors.white) {
   const bgRGB = hexToRGB(bgHex);
   const hcRGB = hexToRGB(defaultHex);
   if (!bgRGB || !hcRGB)
@@ -278,7 +278,8 @@ var import_deepmerge = __toESM(require("deepmerge"), 1);
 // src/styles/buttons.tsx
 var buttonsThemeBase = {
   defaultSize: "Small",
-  defaultTypography: "Body Strong",
+  defaultTypographyType: "Body Strong",
+  defaultColor: "text",
   defaultBorderRadius: 32,
   defaultBorderWidth: 1,
   defaultBackgroundColor: "bg",
@@ -302,6 +303,7 @@ var buttonsThemeBase = {
 var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
   kinds: {
     primary: {
+      defaultColor: "bg",
       defaultBorderWidth: 0,
       defaultBackgroundColor: "c9Neutral",
       defaultBorderColor: "c9Neutral",
@@ -329,7 +331,20 @@ var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
       defaultHoverBorderColor: ["gray90", "gray20"]
     },
     blue39: {
-      defaultBorderColor: "blue39"
+      defaultBorderColor: "blue39",
+      defaultColor: "gray98"
+    },
+    blue43: {
+      defaultColor: "white"
+    },
+    green33: {
+      defaultColor: "white"
+    },
+    purple55: {
+      defaultColor: "white"
+    },
+    danger: {
+      defaultColor: "white"
     }
   }
 });
@@ -3703,28 +3718,30 @@ var bridgeBaseSettings = {
     code: "Monaco"
   }),
   buttons: (0, import_deepmerge.default)(buttonsThemeBase, {
-    defaultTypography: "Title",
+    defaultTypographyType: "Title",
     defaultSize: "Medium",
     defaultBorderRadius: 8,
     defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 14,
+      Small: 14,
+      Schmedium: 14,
+      Medium: 14,
+      Mlarge: 14,
+      Large: 14
+    },
     kinds: {
       primary: {
+        defaultColor: "bg",
         defaultBackgroundColor: "blue39",
         defaultHoverBackgroundColor: "blue37"
       },
       ghost: {
+        defaultColor: "secondary",
         defaultBackgroundColor: "transparent",
         defaultBorderWidth: 0,
         defaultHoverBackgroundColor: "transparent",
-        defaultHoverBorderColor: "transparent",
-        defaultPaddingsY: {
-          ExtraSmall: 0,
-          Small: 0,
-          Schmedium: 0,
-          Medium: 0,
-          Mlarge: 0,
-          Large: 0
-        }
+        defaultHoverBorderColor: "transparent"
       },
       secondary: {
         defaultBackgroundColor: "transparent",

package/dist/styles/fields.d.cts

@@ -2,7 +2,7 @@ import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
-import { a as ThemeProp, W as WithTheme } from '../buttons-73127447.js';
+import { b as ThemeProp, W as WithTheme } from '../buttons-b7f56076.js';
 import { SimpleTypographyProps } from './typography.cjs';
 import './tokens/typography.cjs';
 import '@emotion/css';

package/dist/styles/fields.d.ts

@@ -2,7 +2,7 @@ import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import * as _emotion_styled from '@emotion/styled';
 import * as react from 'react';
 import * as _emotion_react from '@emotion/react';
-import { a as ThemeProp, W as WithTheme } from '../buttons-5a4562d5.js';
+import { b as ThemeProp, W as WithTheme } from '../buttons-e4eb84a2.js';
 import { SimpleTypographyProps } from './typography.js';
 import './tokens/typography.js';
 import '@emotion/css';

package/dist/styles/fields.js

@@ -22,15 +22,15 @@ import {
   textInputPaddingPx,
   textInputPlaceholderColor,
   textInputStyle
-} from "../chunk-FEJU2K4L.js";
-import "../chunk-WIFHFWAN.js";
+} from "../chunk-S6AOKANU.js";
+import "../chunk-VUXU77SU.js";
 import "../chunk-55OQPFLF.js";
-import "../chunk-52POF2W4.js";
-import "../chunk-ZFDYANKZ.js";
+import "../chunk-7NPHOJXD.js";
+import "../chunk-A4JZESAS.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-GKBQAEH5.js";
-import "../chunk-KYTOF4WO.js";
+import "../chunk-FO7I4E45.js";
+import "../chunk-XUWFUTR4.js";
 import "../chunk-LOPKRCGI.js";
 export {
   FieldError,

package/dist/styles/global.cjs

@@ -233,7 +233,7 @@ var baseColors = __spreadProps(__spreadValues({}, neutral), {
   secondary: neutral.black
 });
 var colors = baseColors;
-function hcNeutralFromBg(bgHex, defaultHex, altHex) {
+function hcNeutralFromBg(bgHex, defaultHex = colors.black, altHex = colors.white) {
   const bgRGB = hexToRGB(bgHex);
   const hcRGB = hexToRGB(defaultHex);
   if (!bgRGB || !hcRGB)
@@ -274,7 +274,8 @@ var import_deepmerge = __toESM(require("deepmerge"), 1);
 // src/styles/buttons.tsx
 var buttonsThemeBase = {
   defaultSize: "Small",
-  defaultTypography: "Body Strong",
+  defaultTypographyType: "Body Strong",
+  defaultColor: "text",
   defaultBorderRadius: 32,
   defaultBorderWidth: 1,
   defaultBackgroundColor: "bg",
@@ -298,6 +299,7 @@ var buttonsThemeBase = {
 var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
   kinds: {
     primary: {
+      defaultColor: "bg",
       defaultBorderWidth: 0,
       defaultBackgroundColor: "c9Neutral",
       defaultBorderColor: "c9Neutral",
@@ -325,7 +327,20 @@ var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
       defaultHoverBorderColor: ["gray90", "gray20"]
     },
     blue39: {
-      defaultBorderColor: "blue39"
+      defaultBorderColor: "blue39",
+      defaultColor: "gray98"
+    },
+    blue43: {
+      defaultColor: "white"
+    },
+    green33: {
+      defaultColor: "white"
+    },
+    purple55: {
+      defaultColor: "white"
+    },
+    danger: {
+      defaultColor: "white"
     }
   }
 });
@@ -3647,28 +3662,30 @@ var bridgeBaseSettings = {
     code: "Monaco"
   }),
   buttons: (0, import_deepmerge.default)(buttonsThemeBase, {
-    defaultTypography: "Title",
+    defaultTypographyType: "Title",
     defaultSize: "Medium",
     defaultBorderRadius: 8,
     defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 14,
+      Small: 14,
+      Schmedium: 14,
+      Medium: 14,
+      Mlarge: 14,
+      Large: 14
+    },
     kinds: {
       primary: {
+        defaultColor: "bg",
         defaultBackgroundColor: "blue39",
         defaultHoverBackgroundColor: "blue37"
       },
       ghost: {
+        defaultColor: "secondary",
         defaultBackgroundColor: "transparent",
         defaultBorderWidth: 0,
         defaultHoverBackgroundColor: "transparent",
-        defaultHoverBorderColor: "transparent",
-        defaultPaddingsY: {
-          ExtraSmall: 0,
-          Small: 0,
-          Schmedium: 0,
-          Medium: 0,
-          Mlarge: 0,
-          Large: 0
-        }
+        defaultHoverBorderColor: "transparent"
       },
       secondary: {
         defaultBackgroundColor: "transparent",

package/dist/styles/global.d.cts

@@ -1,6 +1,6 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import * as _emotion_react from '@emotion/react';
-import { a as ThemeProp } from '../buttons-73127447.js';
+import { b as ThemeProp } from '../buttons-b7f56076.js';
 import './tokens/typography.cjs';
 import '@emotion/css';
 import './colors.cjs';

package/dist/styles/global.d.ts

@@ -1,6 +1,6 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import * as _emotion_react from '@emotion/react';
-import { a as ThemeProp } from '../buttons-5a4562d5.js';
+import { b as ThemeProp } from '../buttons-e4eb84a2.js';
 import './tokens/typography.js';
 import '@emotion/css';
 import './colors.js';

package/dist/styles/global.js

@@ -1,14 +1,14 @@
 import {
   GlobalStyles,
   globalComponentStyles
-} from "../chunk-UKAPI3BN.js";
+} from "../chunk-VYTN6ASZ.js";
 import "../chunk-VQVEZVAG.js";
-import "../chunk-52POF2W4.js";
-import "../chunk-ZFDYANKZ.js";
+import "../chunk-7NPHOJXD.js";
+import "../chunk-A4JZESAS.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-GKBQAEH5.js";
-import "../chunk-KYTOF4WO.js";
+import "../chunk-FO7I4E45.js";
+import "../chunk-XUWFUTR4.js";
 import "../chunk-LOPKRCGI.js";
 export {
   GlobalStyles,

package/dist/styles/themes.cjs

@@ -187,7 +187,8 @@ function useBreakpoints() {
 // src/styles/buttons.tsx
 var buttonsThemeBase = {
   defaultSize: "Small",
-  defaultTypography: "Body Strong",
+  defaultTypographyType: "Body Strong",
+  defaultColor: "text",
   defaultBorderRadius: 32,
   defaultBorderWidth: 1,
   defaultBackgroundColor: "bg",
@@ -211,6 +212,7 @@ var buttonsThemeBase = {
 var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
   kinds: {
     primary: {
+      defaultColor: "bg",
       defaultBorderWidth: 0,
       defaultBackgroundColor: "c9Neutral",
       defaultBorderColor: "c9Neutral",
@@ -238,7 +240,20 @@ var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
       defaultHoverBorderColor: ["gray90", "gray20"]
     },
     blue39: {
-      defaultBorderColor: "blue39"
+      defaultBorderColor: "blue39",
+      defaultColor: "gray98"
+    },
+    blue43: {
+      defaultColor: "white"
+    },
+    green33: {
+      defaultColor: "white"
+    },
+    purple55: {
+      defaultColor: "white"
+    },
+    danger: {
+      defaultColor: "white"
     }
   }
 });
@@ -304,7 +319,7 @@ var colors = baseColors;
 function isColorKey(key) {
   return key in colors;
 }
-function hcNeutralFromBg(bgHex, defaultHex, altHex) {
+function hcNeutralFromBg(bgHex, defaultHex = colors.black, altHex = colors.white) {
   const bgRGB = hexToRGB(bgHex);
   const hcRGB = hexToRGB(defaultHex);
   if (!bgRGB || !hcRGB)
@@ -3666,28 +3681,30 @@ var bridgeBaseSettings = {
     code: "Monaco"
   }),
   buttons: (0, import_deepmerge.default)(buttonsThemeBase, {
-    defaultTypography: "Title",
+    defaultTypographyType: "Title",
     defaultSize: "Medium",
     defaultBorderRadius: 8,
     defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 14,
+      Small: 14,
+      Schmedium: 14,
+      Medium: 14,
+      Mlarge: 14,
+      Large: 14
+    },
     kinds: {
       primary: {
+        defaultColor: "bg",
         defaultBackgroundColor: "blue39",
         defaultHoverBackgroundColor: "blue37"
       },
       ghost: {
+        defaultColor: "secondary",
         defaultBackgroundColor: "transparent",
         defaultBorderWidth: 0,
         defaultHoverBackgroundColor: "transparent",
-        defaultHoverBorderColor: "transparent",
-        defaultPaddingsY: {
-          ExtraSmall: 0,
-          Small: 0,
-          Schmedium: 0,
-          Medium: 0,
-          Mlarge: 0,
-          Large: 0
-        }
+        defaultHoverBorderColor: "transparent"
       },
       secondary: {
         defaultBackgroundColor: "transparent",

package/dist/styles/themes.d.cts

@@ -1,5 +1,5 @@
 import '@emotion/react';
-export { f as BackgroundColorKey, h as BackgroundColorKeyArg, F as FontColorKey, L as LightsparkTheme, S as SurfaceThemeColorKey, T as ThemeOrColorKey, a as ThemeProp, b as Themes, W as WithTheme, l as getBackgroundColor, g as getColor, e as getFontColor, q as ifDark, p as ifLight, j as isBackgroundColorKey, k as isBackgroundColorKeyTuple, m as isDark, n as isLight, i as isThemeColorKey, d as isThemeOrColorKey, s as setFonts, o as themeOr, t as themeOrColorKeyValues, c as themes, u as useThemeBg } from '../buttons-73127447.js';
+export { h as BackgroundColorKey, j as BackgroundColorKeyArg, F as FontColorKey, L as LightsparkTheme, S as SurfaceThemeColorKey, T as ThemeOrColorKey, b as ThemeProp, c as Themes, W as WithTheme, m as getBackgroundColor, g as getColor, f as getFontColor, r as ifDark, q as ifLight, k as isBackgroundColorKey, l as isBackgroundColorKeyTuple, n as isDark, o as isLight, i as isThemeColorKey, e as isThemeOrColorKey, s as setFonts, p as themeOr, t as themeOrColorKeyValues, d as themes, u as useThemeBg } from '../buttons-b7f56076.js';
 import './tokens/typography.cjs';
 import '@emotion/css';
 import './colors.cjs';

package/dist/styles/themes.d.ts

@@ -1,5 +1,5 @@
 import '@emotion/react';
-export { f as BackgroundColorKey, h as BackgroundColorKeyArg, F as FontColorKey, L as LightsparkTheme, S as SurfaceThemeColorKey, T as ThemeOrColorKey, a as ThemeProp, b as Themes, W as WithTheme, l as getBackgroundColor, g as getColor, e as getFontColor, q as ifDark, p as ifLight, j as isBackgroundColorKey, k as isBackgroundColorKeyTuple, m as isDark, n as isLight, i as isThemeColorKey, d as isThemeOrColorKey, s as setFonts, o as themeOr, t as themeOrColorKeyValues, c as themes, u as useThemeBg } from '../buttons-5a4562d5.js';
+export { h as BackgroundColorKey, j as BackgroundColorKeyArg, F as FontColorKey, L as LightsparkTheme, S as SurfaceThemeColorKey, T as ThemeOrColorKey, b as ThemeProp, c as Themes, W as WithTheme, m as getBackgroundColor, g as getColor, f as getFontColor, r as ifDark, q as ifLight, k as isBackgroundColorKey, l as isBackgroundColorKeyTuple, n as isDark, o as isLight, i as isThemeColorKey, e as isThemeOrColorKey, s as setFonts, p as themeOr, t as themeOrColorKeyValues, d as themes, u as useThemeBg } from '../buttons-e4eb84a2.js';
 import './tokens/typography.js';
 import '@emotion/css';
 import './colors.js';

package/dist/styles/themes.js

@@ -16,11 +16,11 @@ import {
   themeOrColorKeyValues,
   themes,
   useThemeBg
-} from "../chunk-ZFDYANKZ.js";
+} from "../chunk-A4JZESAS.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-GKBQAEH5.js";
-import "../chunk-KYTOF4WO.js";
+import "../chunk-FO7I4E45.js";
+import "../chunk-XUWFUTR4.js";
 import "../chunk-LOPKRCGI.js";
 export {
   Themes,

package/dist/styles/type.d.cts

@@ -1,6 +1,6 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import _emotion_styled__default from '@emotion/styled';
-import '../buttons-73127447.js';
+import '../buttons-b7f56076.js';
 import '@emotion/react';
 import './tokens/typography.cjs';
 import '@emotion/css';

package/dist/styles/type.d.ts

@@ -1,6 +1,6 @@
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import _emotion_styled__default from '@emotion/styled';
-import '../buttons-5a4562d5.js';
+import '../buttons-e4eb84a2.js';
 import '@emotion/react';
 import './tokens/typography.js';
 import '@emotion/css';

package/dist/styles/type.js

@@ -3,14 +3,14 @@ import {
   Heading,
   headingWithDefaults,
   headings
-} from "../chunk-BPZ7AV7W.js";
-import "../chunk-JXXIU52B.js";
-import "../chunk-52POF2W4.js";
-import "../chunk-ZFDYANKZ.js";
+} from "../chunk-5H32AOXL.js";
+import "../chunk-KFX7US6Y.js";
+import "../chunk-7NPHOJXD.js";
+import "../chunk-A4JZESAS.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-GKBQAEH5.js";
-import "../chunk-KYTOF4WO.js";
+import "../chunk-FO7I4E45.js";
+import "../chunk-XUWFUTR4.js";
 import "../chunk-LOPKRCGI.js";
 export {
   Heading,

package/dist/styles/typography.cjs

@@ -154,7 +154,8 @@ function inRange(currentBp, assertBp) {
 // src/styles/buttons.tsx
 var buttonsThemeBase = {
   defaultSize: "Small",
-  defaultTypography: "Body Strong",
+  defaultTypographyType: "Body Strong",
+  defaultColor: "text",
   defaultBorderRadius: 32,
   defaultBorderWidth: 1,
   defaultBackgroundColor: "bg",
@@ -178,6 +179,7 @@ var buttonsThemeBase = {
 var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
   kinds: {
     primary: {
+      defaultColor: "bg",
       defaultBorderWidth: 0,
       defaultBackgroundColor: "c9Neutral",
       defaultBorderColor: "c9Neutral",
@@ -205,7 +207,20 @@ var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
       defaultHoverBorderColor: ["gray90", "gray20"]
     },
     blue39: {
-      defaultBorderColor: "blue39"
+      defaultBorderColor: "blue39",
+      defaultColor: "gray98"
+    },
+    blue43: {
+      defaultColor: "white"
+    },
+    green33: {
+      defaultColor: "white"
+    },
+    purple55: {
+      defaultColor: "white"
+    },
+    danger: {
+      defaultColor: "white"
     }
   }
 });
@@ -270,7 +285,7 @@ var colors = baseColors;
 function isColorKey(key) {
   return key in colors;
 }
-function hcNeutralFromBg(bgHex, defaultHex, altHex) {
+function hcNeutralFromBg(bgHex, defaultHex = colors.black, altHex = colors.white) {
   const bgRGB = hexToRGB(bgHex);
   const hcRGB = hexToRGB(defaultHex);
   if (!bgRGB || !hcRGB)
@@ -3673,28 +3688,30 @@ var bridgeBaseSettings = {
     code: "Monaco"
   }),
   buttons: (0, import_deepmerge.default)(buttonsThemeBase, {
-    defaultTypography: "Title",
+    defaultTypographyType: "Title",
     defaultSize: "Medium",
     defaultBorderRadius: 8,
     defaultBorderWidth: 0,
+    defaultPaddingsY: {
+      ExtraSmall: 14,
+      Small: 14,
+      Schmedium: 14,
+      Medium: 14,
+      Mlarge: 14,
+      Large: 14
+    },
     kinds: {
       primary: {
+        defaultColor: "bg",
         defaultBackgroundColor: "blue39",
         defaultHoverBackgroundColor: "blue37"
       },
       ghost: {
+        defaultColor: "secondary",
         defaultBackgroundColor: "transparent",
         defaultBorderWidth: 0,
         defaultHoverBackgroundColor: "transparent",
-        defaultHoverBorderColor: "transparent",
-        defaultPaddingsY: {
-          ExtraSmall: 0,
-          Small: 0,
-          Schmedium: 0,
-          Medium: 0,
-          Mlarge: 0,
-          Large: 0
-        }
+        defaultHoverBorderColor: "transparent"
       },
       secondary: {
         defaultBackgroundColor: "transparent",

package/dist/styles/typography.d.cts

@@ -1,6 +1,6 @@
 import { Theme } from '@emotion/react';
 import { Complete } from '@lightsparkdev/core';
-import { F as FontColorKey } from '../buttons-73127447.js';
+import { F as FontColorKey } from '../buttons-b7f56076.js';
 import { TypographyTypeKey, TokenSizeKey } from './tokens/typography.cjs';
 import '@emotion/css';
 import './colors.cjs';

package/dist/styles/typography.d.ts

@@ -1,6 +1,6 @@
 import { Theme } from '@emotion/react';
 import { Complete } from '@lightsparkdev/core';
-import { F as FontColorKey } from '../buttons-5a4562d5.js';
+import { F as FontColorKey } from '../buttons-e4eb84a2.js';
 import { TypographyTypeKey, TokenSizeKey } from './tokens/typography.js';
 import '@emotion/css';
 import './colors.js';

package/dist/styles/typography.js

@@ -1,11 +1,11 @@
 import {
   applyTypography
-} from "../chunk-WIFHFWAN.js";
-import "../chunk-ZFDYANKZ.js";
+} from "../chunk-VUXU77SU.js";
+import "../chunk-A4JZESAS.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-GKBQAEH5.js";
-import "../chunk-KYTOF4WO.js";
+import "../chunk-FO7I4E45.js";
+import "../chunk-XUWFUTR4.js";
 import "../chunk-LOPKRCGI.js";
 export {
   applyTypography

package/dist/styles/utils.js

@@ -13,13 +13,13 @@ import {
   remsToPx,
   size,
   textCenter
-} from "../chunk-JXXIU52B.js";
-import "../chunk-52POF2W4.js";
-import "../chunk-ZFDYANKZ.js";
+} from "../chunk-KFX7US6Y.js";
+import "../chunk-7NPHOJXD.js";
+import "../chunk-A4JZESAS.js";
 import "../chunk-ENBUKLVT.js";
 import "../chunk-JSGRNWSB.js";
-import "../chunk-GKBQAEH5.js";
-import "../chunk-KYTOF4WO.js";
+import "../chunk-FO7I4E45.js";
+import "../chunk-XUWFUTR4.js";
 import "../chunk-LOPKRCGI.js";
 export {
   absoluteCenter,