@lightsparkdev/ui 1.0.8 → 1.0.9

package/dist/{chunk-EM7O6Y3M.cjs → chunk-UJLCYOEL.cjs}

@@ -4,10 +4,10 @@ var _chunkT7ZB3XF7cjs = require('./chunk-T7ZB3XF7.cjs');
 
 
 
-var _chunkPYL3O7AFcjs = require('./chunk-PYL3O7AF.cjs');
+var _chunk23NA5VW6cjs = require('./chunk-23NA5VW6.cjs');
 
 
-var _chunkWTHHP7G2cjs = require('./chunk-WTHHP7G2.cjs');
+var _chunkJX6HEEEQcjs = require('./chunk-JX6HEEEQ.cjs');
 
 
 var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
@@ -22,7 +22,7 @@ var globalComponentStyles = ({ theme }) => _react.css`
   @import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
 
   html {
-    font-size: ${_chunkPYL3O7AFcjs.rootFontSizeRems}rem;
+    font-size: ${_chunk23NA5VW6cjs.rootFontSizeRems}rem;
     color: ${theme.text};
 
     /* required for iOS https://bit.ly/3Q8syG8 */
@@ -52,7 +52,7 @@ var globalComponentStyles = ({ theme }) => _react.css`
 
   * {
     box-sizing: border-box;
-    line-height: ${_chunkPYL3O7AFcjs.standardLineHeightEms}em;
+    line-height: ${_chunk23NA5VW6cjs.standardLineHeightEms}em;
   }
 
   code {
@@ -99,7 +99,7 @@ var globalComponentStyles = ({ theme }) => _react.css`
 `;
 function GlobalStyles() {
   const theme = _react.useTheme.call(void 0, );
-  const bg = _chunkWTHHP7G2cjs.useThemeBg.call(void 0, );
+  const bg = _chunkJX6HEEEQcjs.useThemeBg.call(void 0, );
   _react3.useEffect.call(void 0, () => {
     const documentHeight = () => {
       const doc = document.documentElement;

package/dist/chunk-UKMVD656.cjs

@@ -0,0 +1,86 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+
+
+var _chunk4WKQPWLIcjs = require('./chunk-4WKQPWLI.cjs');
+
+
+var _chunkJA26JNLKcjs = require('./chunk-JA26JNLK.cjs');
+
+
+var _chunkN4HNDEUNcjs = require('./chunk-N4HNDEUN.cjs');
+
+
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
+
+
+var _chunkYDTPEU32cjs = require('./chunk-YDTPEU32.cjs');
+
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/utils/toReactNodes/toReactNodesBase.tsx
+var _core = require('@lightsparkdev/core');
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function toReactNodesBase(toReactNodesBaseArg) {
+  const toReactNodesArray = _core.ensureArray.call(void 0, toReactNodesBaseArg);
+  const reactNodes = toReactNodesArray.map((node, i) => {
+    if (_chunk4WKQPWLIcjs.isLinkNode.call(void 0, node)) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYDTPEU32cjs.Link, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.link), `link-${i}-${node.link.id}`);
+    } else if (_chunk4WKQPWLIcjs.isNextLinkNode.call(void 0, node)) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkJA26JNLKcjs.NextLink,
+        _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.nextLink),
+        `next-link-${i}-${node.nextLink.id}`
+      );
+    } else if (_chunk4WKQPWLIcjs.isIconNode.call(void 0, node)) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkI6Y7IHF5cjs.Icon,
+        _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.icon), {
+          width: node.icon.width || 12
+        }),
+        `icon-${i}-${node.icon.id}`
+      );
+    } else if (_chunk4WKQPWLIcjs.isCurrencyAmountNode.call(void 0, node)) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkN4HNDEUNcjs.CurrencyAmount,
+        _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.currencyAmount),
+        `currency-amount-${i}-${node.currencyAmount.id}`
+      );
+    } else if (typeof node === "string" || _chunk4WKQPWLIcjs.isTextNode.call(void 0, node)) {
+      const text = typeof node === "string" ? node : node.text;
+      const key = `str-${i}-${text.substr(0, 10)}`;
+      let content = text.split("\n").map((str, j, strArr) => (
+        /* Must use spans to avoid conditional Fragment rendering errors https://bit.ly/3zkHEEM */
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { children: [
+          str.length ? str.split(" ").map((strPart, k, strPartArr) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { children: [
+            strPart,
+            k < strPartArr.length - 1 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: "\xA0" }) : null
+          ] }, `str-${i}-part-${k}`)) : null,
+          j < strArr.length - 1 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "br", {}) : null
+        ] }, `str-${i}-break-${j}`)
+      ));
+      if (_chunk4WKQPWLIcjs.isTextNode.call(void 0, node) && "onClick" in node) {
+        content = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "span",
+          {
+            onClick: node.onClick,
+            style: { cursor: "pointer" },
+            children: content
+          },
+          `onClick-span-${key}`
+        );
+      }
+      return content;
+    }
+    return null;
+  });
+  return reactNodes;
+}
+
+
+
+exports.toReactNodesBase = toReactNodesBase;

package/dist/{chunk-ZBBVZQKJ.cjs → chunk-UN4FMYEQ.cjs}

@@ -1,17 +1,17 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkWTHHP7G2cjs = require('./chunk-WTHHP7G2.cjs');
+var _chunkJX6HEEEQcjs = require('./chunk-JX6HEEEQ.cjs');
 
 
-var _chunkTMTEVKSDcjs = require('./chunk-TMTEVKSD.cjs');
+var _chunkDCQM7IVKcjs = require('./chunk-DCQM7IVK.cjs');
 
 // src/styles/typography.tsx
 var applyTypography = (theme, typographyType, size, color = "inherit", applyToAll = true) => {
   const selector = applyToAll ? "&, & *" : "&";
   return `
     ${selector} {
-      ${_chunkTMTEVKSDcjs.getTypographyString.call(void 0, theme, typographyType, size)};
-      color: ${_chunkWTHHP7G2cjs.getFontColor.call(void 0, theme, color)};
+      ${_chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, typographyType, size)};
+      color: ${_chunkJX6HEEEQcjs.getFontColor.call(void 0, theme, color)};
     }
   `;
 };

package/dist/{chunk-HSBQGWYB.js → chunk-UQ4RW6PE.js}

@@ -1,22 +1,22 @@
 import {
   CopyToClipboardButton
-} from "./chunk-F4RWDLPI.js";
+} from "./chunk-YFKVNM5L.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-DNRHVCOE.js";
+} from "./chunk-IGZYEIQS.js";
 import {
   standardBorderRadius
-} from "./chunk-APUV4UN4.js";
+} from "./chunk-ZMK4RE5I.js";
 import {
   themeOr
-} from "./chunk-W5I53DTZ.js";
+} from "./chunk-GZW6KBUI.js";
 import {
   colors
-} from "./chunk-REL56P3K.js";
+} from "./chunk-RTRS42I3.js";
 import {
   __spreadProps,
   __spreadValues
-} from "./chunk-LOPKRCGI.js";
+} from "./chunk-CWMXXUWU.js";
 
 // src/components/CodeBlock.tsx
 import styled from "@emotion/styled";
@@ -81,7 +81,7 @@ var codeSelectStyles = {
       color: "#ffffff"
     }
   }),
-  indicatorSeparator: (styles) => ({
+  indicatorSeparator: () => ({
     display: "none"
   }),
   input: (styles) => __spreadProps(__spreadValues({}, styles), {

package/dist/{chunk-24PXYMSU.js → chunk-VASG2BKI.js}

@@ -17,6 +17,7 @@ var FONT_FAMILIES = {
 };
 var LINE_HEIGHTS = {
   ["Lightspark" /* Lightspark */]: {
+    "8xl": "72px",
     "7xl": "72px",
     "6xl": "60px",
     "5xl": "44px",
@@ -31,6 +32,7 @@ var LINE_HEIGHTS = {
     xs: "16px"
   },
   ["LightsparkDocs" /* LightsparkDocs */]: {
+    "8xl": "72px",
     "7xl": "72px",
     "6xl": "60px",
     "5xl": "44px",
@@ -45,6 +47,9 @@ var LINE_HEIGHTS = {
     xs: "16px"
   },
   ["UmaAuthSdk" /* UmaAuthSdk */]: {
+    "8xl": "72px",
+    "7xl": "72px",
+    "6xl": "72px",
     "5xl": "72px",
     "4xl": "60px",
     "3xl": "44px",
@@ -57,6 +62,9 @@ var LINE_HEIGHTS = {
     xs: "20px"
   },
   ["UmameDocs" /* UmameDocs */]: {
+    "8xl": "72px",
+    "7xl": "72px",
+    "6xl": "72px",
     "5xl": "72px",
     "4xl": "60px",
     "3xl": "44px",
@@ -75,6 +83,7 @@ var LINE_HEIGHTS = {
     "5xl": "40px",
     "4xl": "36px",
     "3xl": "32px",
+    "2xs": "16px",
     "2xl": "28px",
     lg: "22px",
     md: "20px",
@@ -83,6 +92,12 @@ var LINE_HEIGHTS = {
     xs: "16px"
   }
 };
+var lineHeightKeys = Object.keys(
+  LINE_HEIGHTS.Lightspark
+);
+function getLineHeightFromKey(key, theme) {
+  return theme.typography.lineHeights[key];
+}
 var FONT_WEIGHTS = {
   main: {
     ExtraBold: 800,
@@ -4046,11 +4061,32 @@ var getTypographyString = (theme, typographyType, size) => {
   `;
   return typographyStr;
 };
+function getLineHeightForTypographyType(type, size, theme) {
+  const desktopTokenGroups = theme.typography.types["Desktop"];
+  const desktopTokenSizes = desktopTokenGroups[type];
+  if (!desktopTokenSizes) {
+    console.error(
+      `getLineHeightForTypographyType: Attempted to use a typography type "${type}" that does not exist in the current theme. Falling back to default tokens.`
+    );
+    return defaultTokens.lineHeight;
+  }
+  const desktopTokens = desktopTokenSizes[size];
+  if (!desktopTokens) {
+    console.error(
+      `getLineHeightForTypographyType: Attempted to use a typography size "${size}" that does not exist for typography type "${type}" in the current theme. Falling back to default tokens.`
+    );
+    return defaultTokens.lineHeight;
+  }
+  return desktopTokens.lineHeight;
+}
 
 export {
   TypographyGroup,
+  lineHeightKeys,
+  getLineHeightFromKey,
   TokenSize,
   TypographyType,
   getTypography,
-  getTypographyString
+  getTypographyString,
+  getLineHeightForTypographyType
 };

package/dist/chunk-VC743SV7.cjs

@@ -0,0 +1,53 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkPZKJ4CZWcjs = require('./chunk-PZKJ4CZW.cjs');
+
+
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
+
+
+var _chunk4WKQPWLIcjs = require('./chunk-4WKQPWLI.cjs');
+
+
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
+
+
+var _chunk7PRNB5U5cjs = require('./chunk-7PRNB5U5.cjs');
+
+// src/components/SatoshiInputLabel.tsx
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function SatoshiInputLabel({
+  text,
+  availableSats,
+  showTooltip = true
+}) {
+  const availableSatsTooltipNode = showTooltip ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkNVVAOGNLcjs.Label, { style: { display: "inline-flex", margin: "0 0 0 3px" }, children: [
+    "available",
+    " ",
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkPZKJ4CZWcjs.InfoIconTooltip,
+      {
+        id: "available-balance-tooltip",
+        content: [
+          "Your available balance may differ from your total balance due to operational funds being held on the Lightning Network. ",
+          _chunk4WKQPWLIcjs.link.call(void 0, {
+            text: "Learn more",
+            externalLink: "https://docs.lightspark.com/lightspark-sdk/api-reference/types/Balances"
+          })
+        ]
+      }
+    )
+  ] }) : null;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkNVVAOGNLcjs.Label, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: text }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: availableSats !== void 0 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "Satoshi", width: 8, mr: 4, verticalAlign: -2 }),
+      _chunk7PRNB5U5cjs.addCommasToDigits.call(void 0, Math.floor(availableSats)),
+      availableSatsTooltipNode
+    ] }) })
+  ] });
+}
+
+
+
+exports.SatoshiInputLabel = SatoshiInputLabel;

package/dist/{chunk-T7PTO2D2.cjs → chunk-VF6BYQHD.cjs}

@@ -1,13 +1,13 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkNNTGGG2Ccjs = require('./chunk-NNTGGG2C.cjs');
+var _chunkVNWCUVYQcjs = require('./chunk-VNWCUVYQ.cjs');
 
 
-var _chunkKLC2OBTGcjs = require('./chunk-KLC2OBTG.cjs');
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
 
 
 
-var _chunkLKKJVJCGcjs = require('./chunk-LKKJVJCG.cjs');
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
 
 // src/components/CodeInput/CodeInput.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -59,8 +59,8 @@ function CodeInput({
     [getInputId, autoFocus]
   );
   const [inputState, setInputState] = _react.useState.call(void 0, 
-    Array(codeLength).fill(0).reduce((acc, item, i) => {
-      return _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, acc), {
+    Array(codeLength).fill(0).reduce((acc, _, i) => {
+      return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, acc), {
         [getInputId(i)]: {
           value: ""
         }
@@ -141,10 +141,10 @@ function CodeInput({
         return;
       }
       if (event.key === "Backspace" && (event.metaKey || event.ctrlKey || event.altKey)) {
-        replaceEntireState = _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, inputState);
+        replaceEntireState = _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, inputState);
         Object.keys(replaceEntireState).forEach((inputId2) => {
           const newState2 = replaceEntireState;
-          newState2[inputId2] = _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, newState2[inputId2]), {
+          newState2[inputId2] = _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, newState2[inputId2]), {
             value: ""
           });
         });
@@ -175,7 +175,7 @@ function CodeInput({
         nextInputRef.focus();
         nextInputRef.select();
       }
-      const newState = replaceEntireState ? replaceEntireState : _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, inputState), {
+      const newState = replaceEntireState ? replaceEntireState : _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, inputState), {
         [inputId]: { value }
       });
       const code = codeFromInputState(newState);
@@ -195,10 +195,10 @@ function CodeInput({
         return;
       }
       const inputValues = text.split("");
-      const newState = _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, inputState);
+      const newState = _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, inputState);
       inputValues.forEach((value, i) => {
         const inputId = getInputId(i);
-        newState[inputId] = _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, newState[inputId]), {
+        newState[inputId] = _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, newState[inputId]), {
           value
         });
       });
@@ -241,7 +241,7 @@ function CodeInput({
     const inputId = getInputId(i);
     inputs.push(
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkNNTGGG2Ccjs.SingleCodeInput,
+        _chunkVNWCUVYQcjs.SingleCodeInput,
         {
           value: inputState[inputId].value,
           id: inputId,
@@ -252,8 +252,8 @@ function CodeInput({
             if (_reactdevicedetect.isMobileSafari && event.nativeEvent instanceof CustomEvent) {
               autofillValuesRef.current += event.target.value;
               if (autofillValuesRef.current.length === codeLength) {
-                const newState = Array(codeLength).fill(0).reduce((acc, item, i2) => {
-                  return _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, acc), {
+                const newState = Array(codeLength).fill(0).reduce((acc, _, i2) => {
+                  return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, acc), {
                     [getInputId(i2)]: {
                       value: autofillValuesRef.current[i2]
                     }
@@ -266,8 +266,8 @@ function CodeInput({
                 autofillValuesRef.current = "";
               }
             } else if (_reactdevicedetect.isMobile && _reactdevicedetect.isChrome && event.target.value.length === codeLength) {
-              const newState = Array(codeLength).fill(0).reduce((acc, item, i2) => {
-                return _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, acc), {
+              const newState = Array(codeLength).fill(0).reduce((acc, _, i2) => {
+                return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, acc), {
                   [getInputId(i2)]: {
                     value: event.target.value[i2]
                   }
@@ -316,7 +316,7 @@ var CodeInputGroup = _styled2.default.div`
 var CodeInputGroupSeparator = _styled2.default.div`
   width: ${separatorWidth}px;
   height: 4px;
-  background-color: ${_chunkKLC2OBTGcjs.textInputBorderColor};
+  background-color: ${_chunkNVVAOGNLcjs.textInputBorderColor};
   border-radius: 2px;
   margin: 0 ${separatorMargin}px;
 `;

package/dist/{chunk-BBPNYL4K.js → chunk-VKVJMZXL.js}

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

package/dist/{chunk-NNTGGG2C.cjs → chunk-VNWCUVYQ.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkKLC2OBTGcjs = require('./chunk-KLC2OBTG.cjs');
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
 
 // src/components/CodeInput/SingleCodeInput.tsx
 var _react = require('@emotion/react');
@@ -31,7 +31,7 @@ function SingleCodeInput({
   const theme = _react.useTheme.call(void 0, );
   const defaultCSS = _react.css.call(void 0, 
     `
-      ${_chunkKLC2OBTGcjs.textInputStyle.call(void 0, {
+      ${_chunkNVVAOGNLcjs.textInputStyle.call(void 0, {
       theme,
       disabled: Boolean(disabled),
       hasError: false

package/dist/{chunk-YZVHWN44.cjs → chunk-VSBIQ3WK.cjs}

@@ -1,15 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkBOBYW7PPcjs = require('./chunk-BOBYW7PP.cjs');
+var _chunk7QXYBPSJcjs = require('./chunk-7QXYBPSJ.cjs');
 
 
-var _chunkPYL3O7AFcjs = require('./chunk-PYL3O7AF.cjs');
+var _chunkJX6HEEEQcjs = require('./chunk-JX6HEEEQ.cjs');
 
 
-var _chunkWTHHP7G2cjs = require('./chunk-WTHHP7G2.cjs');
-
-
-var _chunkKSKKC6C2cjs = require('./chunk-KSKKC6C2.cjs');
+var _chunkO7USIZI6cjs = require('./chunk-O7USIZI6.cjs');
 
 // src/components/Toggle.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -50,8 +47,8 @@ function Toggle({
 var width = 44;
 var circleDim = 20;
 var circleOffset = 2;
-var ToggleButton = _styled2.default.call(void 0, _chunkBOBYW7PPcjs.UnstyledButton)`
-  color: ${_chunkKSKKC6C2cjs.colors.white};
+var ToggleButton = _styled2.default.call(void 0, _chunk7QXYBPSJcjs.UnstyledButton)`
+  color: ${_chunkO7USIZI6cjs.colors.white};
   font-weight: 500;
   border-radius: 44px;
   width: ${width}px;
@@ -63,7 +60,7 @@ var ToggleButton = _styled2.default.call(void 0, _chunkBOBYW7PPcjs.UnstyledButto
   } else if (isOn) {
     return theme.success;
   }
-  return _chunkWTHHP7G2cjs.themeOr.call(void 0, theme.c1Neutral, theme.c4Neutral)({ theme });
+  return _chunkJX6HEEEQcjs.themeOr.call(void 0, theme.c1Neutral, theme.c4Neutral)({ theme });
 }};
   position: relative;
   &:after {
@@ -75,24 +72,25 @@ var ToggleButton = _styled2.default.call(void 0, _chunkBOBYW7PPcjs.UnstyledButto
     box-shadow:
       0 3px 8px 0 rgba(0, 0, 0, 0.15),
       0 3px 1px 0 rgba(0, 0, 0, 0.06);
-    background-color: ${_chunkKSKKC6C2cjs.colors.white};
+    background-color: ${_chunkO7USIZI6cjs.colors.white};
     width: ${circleDim}px;
     height: ${circleDim}px;
     top: ${circleOffset}px;
     right: ${({ isOn }) => isOn ? `${circleOffset}px` : `${width - circleDim - circleOffset}px`};
   }
 `;
+var gap = 12;
 var ToggleContainer = _styled2.default.span`
   display: flex;
   margin-bottom: ${({ mb }) => mb}px;
   margin-top: ${({ mt }) => mt}px;
   margin-left: ${({ ml }) => ml}px;
   align-items: center;
+  gap: ${gap}px;
 `;
 var ToggleLabel = _styled2.default.label`
-  margin-left: 12px;
+  width: calc(100% - ${width + gap}px);
   cursor: pointer;
-  height: ${_chunkPYL3O7AFcjs.standardLineHeightEms}em;
 `;
 
 

package/dist/chunk-VZEYA2KH.cjs

@@ -0,0 +1,90 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkLHXL6GOOcjs = require('./chunk-LHXL6GOO.cjs');
+
+
+
+
+
+
+var _chunk4WKQPWLIcjs = require('./chunk-4WKQPWLI.cjs');
+
+
+var _chunk7PRNB5U5cjs = require('./chunk-7PRNB5U5.cjs');
+
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/utils/toReactNodes/setReactNodesTypography.tsx
+var _core = require('@lightsparkdev/core');
+function isNonTypographicReactNode(node) {
+  return typeof node === "undefined" || node === null || _chunk4WKQPWLIcjs.isIconNode.call(void 0, node);
+}
+function setReactNodesTypography(nodesArg, typography, replaceExistingTypography = true) {
+  const nodes = _core.ensureArray.call(void 0, nodesArg);
+  const nodesWithTypography = nodes.map((node) => {
+    if (isNonTypographicReactNode(node)) {
+      return node;
+    } else if (_chunk4WKQPWLIcjs.isLinkNode.call(void 0, node) && typography.link) {
+      return {
+        link: _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.link), {
+          typography: replaceExistingTypography ? typography.link : node.link.typography || typography.link
+        })
+      };
+    } else if (_chunk4WKQPWLIcjs.isNextLinkNode.call(void 0, node) && typography.nextLink) {
+      return {
+        nextLink: _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.nextLink), {
+          typography: replaceExistingTypography ? typography.nextLink : node.nextLink.typography || typography.nextLink
+        })
+      };
+    } else if (_chunk4WKQPWLIcjs.isCurrencyAmountNode.call(void 0, node) && typography.currencyAmount) {
+      return {
+        currencyAmount: _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node.currencyAmount), {
+          typography: typography.currencyAmount
+        })
+      };
+    } else if ((_chunk4WKQPWLIcjs.isTextNode.call(void 0, node) || _chunk7PRNB5U5cjs.isString.call(void 0, node)) && typography.text) {
+      return setTextNodeTypography(
+        node,
+        typography.text,
+        replaceExistingTypography
+      );
+    }
+    return node;
+  });
+  return nodesWithTypography;
+}
+function setTextNodeTypography(node, typography, replaceExistingTypography = true) {
+  if (_chunk7PRNB5U5cjs.isString.call(void 0, node)) {
+    return {
+      text: node,
+      typography
+    };
+  }
+  const useExistingTypography = !replaceExistingTypography && "typography" in node ? node.typography : void 0;
+  return _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, node), {
+    typography: useExistingTypography || typography
+  });
+}
+function toReactNodesWithTypographyMap(nodesArg, nodesTypographyMap) {
+  if (!nodesArg) {
+    return null;
+  }
+  const nodesWithTypography = setReactNodesTypography(
+    nodesArg,
+    nodesTypographyMap
+  );
+  const nodes = _chunkLHXL6GOOcjs.toReactNodes.call(void 0, nodesWithTypography);
+  return nodes;
+}
+function setDefaultReactNodesTypography(nodesArg, nodesTypographyMap) {
+  return setReactNodesTypography(nodesArg, nodesTypographyMap, false);
+}
+
+
+
+
+
+
+exports.isNonTypographicReactNode = isNonTypographicReactNode; exports.setReactNodesTypography = setReactNodesTypography; exports.toReactNodesWithTypographyMap = toReactNodesWithTypographyMap; exports.setDefaultReactNodesTypography = setDefaultReactNodesTypography;

package/dist/{chunk-RZMG2TID.js → chunk-W5NH2F3D.js}

@@ -1,16 +1,16 @@
 import {
   applyTypography
-} from "./chunk-GHXNMLAB.js";
+} from "./chunk-U4Y4CF4A.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
   standardBorderRadius,
   subtext
-} from "./chunk-APUV4UN4.js";
+} from "./chunk-ZMK4RE5I.js";
 import {
   themeOr
-} from "./chunk-W5I53DTZ.js";
+} from "./chunk-GZW6KBUI.js";
 
 // src/styles/fields.tsx
 import { css } from "@emotion/react";