@lightsparkdev/ui 1.0.1 → 1.0.2

package/dist/{chunk-4QVTXKRX.js → chunk-AAFUVYVP.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-EDN2QDCB.js";
 import {
   colors
-} from "./chunk-KYTOF4WO.js";
+} from "./chunk-XUWFUTR4.js";
 
 // src/router.tsx
 import { omit } from "lodash-es";

package/dist/chunk-ABSTTY5Q.js

@@ -0,0 +1,7 @@
+// src/hooks/useIsomorphicLayoutEffect.tsx
+import React from "react";
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect;
+
+export {
+  useIsomorphicLayoutEffect
+};

package/dist/{chunk-KOD6R7U5.js → chunk-AI6DCUWK.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-UAFWDZRG.js";
+} from "./chunk-KBYU4ZQ3.js";
 
 // src/components/CurrencyAmount.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-54WKLEUU.js → chunk-BMSSV6NX.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-UAFWDZRG.js";
+} from "./chunk-KBYU4ZQ3.js";
 
 // src/components/Loading.tsx
 import { useTheme } from "@emotion/react";

package/dist/{chunk-TKERS7F6.js → chunk-CHK5DOMV.js}

@@ -1,9 +1,9 @@
 import {
   CopyToClipboardButton
-} from "./chunk-PK4E5P4Q.js";
+} from "./chunk-SGSLTG65.js";
 import {
   standardBorderRadius
-} from "./chunk-52POF2W4.js";
+} from "./chunk-7NPHOJXD.js";
 
 // src/components/SecretContainer.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-HV6SRK57.js → chunk-CMQELZES.js}

@@ -1,9 +1,9 @@
 import {
   toNonTypographicReactNodes
-} from "./chunk-QBJ57KNQ.js";
+} from "./chunk-6H7PZJ2A.js";
 import {
   applyTypography
-} from "./chunk-WIFHFWAN.js";
+} from "./chunk-VUXU77SU.js";
 
 // src/components/typography/Title.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-FUC2Z5QZ.js → chunk-CZCPVHVB.js}

@@ -1,9 +1,9 @@
 import {
   toNonTypographicReactNodes
-} from "./chunk-QBJ57KNQ.js";
+} from "./chunk-6H7PZJ2A.js";
 import {
   applyTypography
-} from "./chunk-WIFHFWAN.js";
+} from "./chunk-VUXU77SU.js";
 
 // src/components/typography/LabelStrong.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-SW6GFFIG.js → chunk-CZQER3QD.js}

@@ -1,6 +1,6 @@
 import {
   standardLineHeightEms
-} from "./chunk-52POF2W4.js";
+} from "./chunk-7NPHOJXD.js";
 
 // src/components/Checkbox.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-CY3LZRBR.js → chunk-D73OOC3E.js}

@@ -1,12 +1,12 @@
 import {
   Button
-} from "./chunk-GHIYWOAC.js";
+} from "./chunk-EV6PGQPM.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-JXXIU52B.js";
+} from "./chunk-KFX7US6Y.js";
 import {
   standardContentInset
-} from "./chunk-52POF2W4.js";
+} from "./chunk-7NPHOJXD.js";
 import {
   bp
 } from "./chunk-JSGRNWSB.js";

package/dist/{chunk-44UNWWP3.js → chunk-DCFB5MJ7.js}

@@ -1,33 +1,33 @@
 import {
   Label
-} from "./chunk-3TKO2L4T.js";
+} from "./chunk-SKXCT2FQ.js";
 import {
   LabelModerate
-} from "./chunk-NMJGBK5W.js";
+} from "./chunk-56QJRFP2.js";
 import {
   LabelStrong
-} from "./chunk-FUC2Z5QZ.js";
+} from "./chunk-CZCPVHVB.js";
 import {
   Overline
-} from "./chunk-AHIR5UAO.js";
-import {
-  Title
-} from "./chunk-HV6SRK57.js";
+} from "./chunk-UBYBILLK.js";
 import {
   Code
-} from "./chunk-IOWK2GBE.js";
+} from "./chunk-GNVEN6UE.js";
 import {
   Display
-} from "./chunk-YQP6EWZY.js";
+} from "./chunk-HRZNVE2K.js";
 import {
-  Headline
-} from "./chunk-4YN25H5H.js";
+  Title
+} from "./chunk-CMQELZES.js";
 import {
   Body
-} from "./chunk-POTDIFIX.js";
+} from "./chunk-TM3C4LEG.js";
 import {
   BodyStrong
-} from "./chunk-MGXWKJDU.js";
+} from "./chunk-HP4VPMN7.js";
+import {
+  Headline
+} from "./chunk-PNSZAJL7.js";
 import {
   __spreadValues
 } from "./chunk-LOPKRCGI.js";

package/dist/{chunk-VRZRCDI4.js → chunk-DNVKN2FG.js}

@@ -6,25 +6,25 @@ import {
 } from "./chunk-E3FGOYEJ.js";
 import {
   toReactNodes
-} from "./chunk-VENBTZHV.js";
+} from "./chunk-UVGBD7XM.js";
 import {
   Link
-} from "./chunk-4QVTXKRX.js";
+} from "./chunk-AAFUVYVP.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
   Icon
-} from "./chunk-UAFWDZRG.js";
+} from "./chunk-KBYU4ZQ3.js";
 import {
   getColor
-} from "./chunk-ZFDYANKZ.js";
+} from "./chunk-A4JZESAS.js";
 import {
   bp
 } from "./chunk-JSGRNWSB.js";
 import {
   colors
-} from "./chunk-KYTOF4WO.js";
+} from "./chunk-XUWFUTR4.js";
 
 // src/components/Banner/Banner.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-E6XGSPA6.js → chunk-EMXTALIX.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-2NT4RAQ3.js";
 import {
   StyledHeadline
-} from "./chunk-4YN25H5H.js";
+} from "./chunk-PNSZAJL7.js";
 
 // src/components/documentation/DocsHeadline.tsx
 import React from "react";

package/dist/{chunk-GHIYWOAC.js → chunk-EV6PGQPM.js}

@@ -1,34 +1,34 @@
 import {
   renderTypography
-} from "./chunk-44UNWWP3.js";
+} from "./chunk-DCFB5MJ7.js";
 import {
   Loading
-} from "./chunk-54WKLEUU.js";
+} from "./chunk-BMSSV6NX.js";
 import {
   select
 } from "./chunk-YMNSXZ5D.js";
 import {
   Link
-} from "./chunk-4QVTXKRX.js";
+} from "./chunk-AAFUVYVP.js";
 import {
   applyTypography
-} from "./chunk-WIFHFWAN.js";
+} from "./chunk-VUXU77SU.js";
 import {
   Tooltip
-} from "./chunk-3A6TEYT3.js";
+} from "./chunk-27SFWLPS.js";
 import {
   UnstyledButton
-} from "./chunk-HGYVPOA7.js";
+} from "./chunk-6JFJDBV2.js";
 import {
   Icon
-} from "./chunk-UAFWDZRG.js";
+} from "./chunk-KBYU4ZQ3.js";
 import {
   getFocusOutline
-} from "./chunk-52POF2W4.js";
+} from "./chunk-7NPHOJXD.js";
 import {
   getBackgroundColor,
   isThemeOrColorKey
-} from "./chunk-ZFDYANKZ.js";
+} from "./chunk-A4JZESAS.js";
 import {
   TokenSize
 } from "./chunk-ENBUKLVT.js";
@@ -54,22 +54,6 @@ var buttonKinds = [
   "blue39",
   "danger"
 ];
-function getDefaultTextColor({ kind }) {
-  switch (kind) {
-    case "blue43":
-    case "green33":
-    case "purple55":
-    case "danger":
-      return "white";
-    case "blue39":
-      return "gray98";
-    case "primary": {
-      return "bg";
-    }
-    default:
-      return "text";
-  }
-}
 var roundPaddingsX = {
   [TokenSize.ExtraSmall]: 10,
   [TokenSize.Small]: 10,
@@ -122,12 +106,14 @@ function resolveProps(props, theme) {
     kind = "secondary",
     size: sizeProp,
     paddingY: paddingYType = "regular",
-    borderRadius
+    borderRadius,
+    typography: typographyProp
   } = _a, rest = __objRest(_a, [
     "kind",
     "size",
     "paddingY",
-    "borderRadius"
+    "borderRadius",
+    "typography"
   ]);
   const size = resolveProp(sizeProp, kind, "defaultSize", theme);
   const defaultPaddingsY = resolveProp(null, kind, "defaultPaddingsY", theme);
@@ -153,9 +139,15 @@ function resolveProps(props, theme) {
     kind,
     "defaultHoverBorderColor"
   );
+  const typography = {
+    type: (typographyProp == null ? void 0 : typographyProp.type) || resolveProp(null, kind, "defaultTypographyType", theme),
+    color: (typographyProp == null ? void 0 : typographyProp.color) || resolveProp(null, kind, "defaultColor", theme),
+    size
+  };
   return __spreadProps(__spreadValues({}, rest), {
     kind,
     size,
+    typography,
     paddingY: typeof defaultPaddingY === "number" ? defaultPaddingY : defaultPaddingY[paddingYType],
     borderRadius: resolveProp(borderRadius, kind, "defaultBorderRadius", theme),
     backgroundColor,
@@ -199,12 +191,6 @@ function Button(props) {
     borderRadius
   } = resolveProps(props, theme);
   const tooltipId = useRef(uniqueId());
-  const fontColor = (typography == null ? void 0 : typography.color) || getDefaultTextColor({ kind, theme });
-  const buttonTypography = {
-    type: (typography == null ? void 0 : typography.type) || theme.buttons.defaultTypography,
-    size,
-    color: fontColor
-  };
   const iconSize = size === "ExtraSmall" ? 12 : 16;
   let currentIcon = null;
   if (loading) {
@@ -213,7 +199,7 @@ function Button(props) {
       {
         iconSide,
         text,
-        typography: buttonTypography,
+        typography,
         kind,
         children: /* @__PURE__ */ jsx(Loading, { size: iconSize, center: false })
       }
@@ -224,9 +210,9 @@ function Button(props) {
       {
         iconSide,
         text,
-        typography: buttonTypography,
+        typography,
         kind,
-        children: /* @__PURE__ */ jsx(Icon, { name: icon, width: iconSize, color: fontColor })
+        children: /* @__PURE__ */ jsx(Icon, { name: icon, width: iconSize, color: typography.color })
       }
     );
   }
@@ -249,10 +235,10 @@ function Button(props) {
                 textOverflow: "ellipsis",
                 overflow: "hidden"
               },
-              children: renderTypography(buttonTypography.type, {
+              children: renderTypography(typography.type, {
                 content: text,
-                color: buttonTypography.color,
-                size: buttonTypography.size
+                color: typography.color,
+                size
               })
             }
           ),
@@ -267,7 +253,7 @@ function Button(props) {
     id,
     kind,
     type,
-    typography: buttonTypography,
+    typography,
     onClick,
     fullWidth,
     iconSide,

package/dist/{chunk-4CYGTH2J.js → chunk-F6EVBEMN.js}

@@ -1,9 +1,9 @@
 import {
   SingleCodeInput
-} from "./chunk-QSVZXM35.js";
+} from "./chunk-SRHSJOES.js";
 import {
   textInputBorderColor
-} from "./chunk-FEJU2K4L.js";
+} from "./chunk-S6AOKANU.js";
 import {
   __spreadProps,
   __spreadValues

package/dist/{chunk-GKBQAEH5.js → chunk-FO7I4E45.js}

@@ -15,7 +15,8 @@ var allowedButtonTypographyTypes = [
 ];
 var buttonsThemeBase = {
   defaultSize: "Small",
-  defaultTypography: "Body Strong",
+  defaultTypographyType: "Body Strong",
+  defaultColor: "text",
   defaultBorderRadius: 32,
   defaultBorderWidth: 1,
   defaultBackgroundColor: "bg",
@@ -39,6 +40,7 @@ var buttonsThemeBase = {
 var defaultButtonsTheme = __spreadProps(__spreadValues({}, buttonsThemeBase), {
   kinds: {
     primary: {
+      defaultColor: "bg",
       defaultBorderWidth: 0,
       defaultBackgroundColor: "c9Neutral",
       defaultBorderColor: "c9Neutral",
@@ -66,7 +68,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"
     }
   }
 });