@lightsparkdev/ui 1.0.8 → 1.0.9

package/dist/chunk-X65D3BZG.cjs

@@ -0,0 +1,165 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkUGGHTD3Vcjs = require('./chunk-UGGHTD3V.cjs');
+
+
+var _chunkEZNRFABOcjs = require('./chunk-EZNRFABO.cjs');
+
+
+var _chunkGFKY6YX2cjs = require('./chunk-GFKY6YX2.cjs');
+
+
+
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
+
+
+var _chunk7QXYBPSJcjs = require('./chunk-7QXYBPSJ.cjs');
+
+
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
+
+
+var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/components/ReadClipboardButton.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _react = require('react');
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+function ReadClipboardButton({
+  onChangeTextInput = () => {
+  },
+  onPasteValue,
+  onRemoveValue,
+  valueLoading = false,
+  value,
+  errorMsg,
+  description,
+  autoButtonText,
+  onClickAutoButton,
+  hint,
+  clipboardCallbacks
+}) {
+  const bp = _chunkKW3JYLRIcjs.useBreakpoints.call(void 0, );
+  const { canReadFromClipboard, readTextFromClipboard } = _chunkEZNRFABOcjs.useClipboard.call(void 0, clipboardCallbacks);
+  const [isEditingTextInput, setIsEditingTextInput] = _react.useState.call(void 0, false);
+  const isDeleting = _react.useRef.call(void 0, false);
+  const getTextFromClipboard = _react.useCallback.call(void 0, () => _chunkYM5JDZDQcjs.__async.call(void 0, this, null, function* () {
+    const text = yield readTextFromClipboard();
+    if (text !== null) {
+      const value2 = text.trim();
+      if (value2 === "") {
+        setIsEditingTextInput(true);
+      } else {
+        onPasteValue(value2);
+      }
+    }
+  }), [onPasteValue, readTextFromClipboard]);
+  function onClick() {
+    if (!isDeleting.current) {
+      void getTextFromClipboard();
+    } else {
+      isDeleting.current = false;
+    }
+  }
+  function onDeleteMouseDown(e) {
+    e.stopPropagation();
+    isDeleting.current = true;
+    onRemoveValue();
+  }
+  function onDeleteMouseUp() {
+    isDeleting.current = false;
+  }
+  const onKeyDown = _react.useCallback.call(void 0, 
+    (event) => {
+      const charCode = String.fromCharCode(event.which).toLowerCase();
+      if (document.activeElement === document.body) {
+        if (canReadFromClipboard) {
+          if ((event.ctrlKey || event.metaKey) && charCode === "v") {
+            event.preventDefault();
+            void getTextFromClipboard();
+            return;
+          }
+        }
+        if (event.key === "Escape" || event.key === "Delete") {
+          onRemoveValue();
+        } else if (charCode.match(/^[a-z0-9]$/i)) {
+          setIsEditingTextInput(true);
+        }
+      }
+    },
+    [getTextFromClipboard, canReadFromClipboard, onRemoveValue]
+  );
+  _react.useEffect.call(void 0, () => {
+    document.addEventListener("keydown", onKeyDown);
+    return () => {
+      document.removeEventListener("keydown", onKeyDown);
+    };
+  }, [onKeyDown]);
+  return (canReadFromClipboard || onClickAutoButton) && !bp.isSm() ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      ReadClipboardButtonContainer,
+      {
+        onClick: onClickAutoButton ? onClickAutoButton : onClick,
+        hasAddress: Boolean(value),
+        hasError: Boolean(errorMsg),
+        onMouseUp: onDeleteMouseUp,
+        children: autoButtonText ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunk7QXYBPSJcjs.UnstyledButton,
+          {
+            onClick: onClickAutoButton,
+            css: { cursor: "pointer" },
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _chunkUGGHTD3Vcjs.Pill,
+              {
+                text: autoButtonText,
+                icon: "MagicWand",
+                cursor: "pointer",
+                loading: valueLoading,
+                onClickPillBody: onClickAutoButton
+              }
+            )
+          }
+        ) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
+          !value && !isEditingTextInput ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunk7QXYBPSJcjs.UnstyledButton, { onClick, children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "Copy", width: 19 }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginTop: "8px" }, children: description })
+          ] }) : null,
+          value || isEditingTextInput ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkUGGHTD3Vcjs.Pill,
+            {
+              text: value,
+              onDeleteMouseDown,
+              loading: valueLoading,
+              isEditing: isEditingTextInput,
+              onChangeTextInput: (value2) => {
+                onChangeTextInput(value2);
+              },
+              onFocusTextInput: () => setIsEditingTextInput(true),
+              onBlurTextInput: () => setIsEditingTextInput(false),
+              onClickPillBody: onClickAutoButton ? onClickAutoButton : () => setIsEditingTextInput(true)
+            }
+          ) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNVVAOGNLcjs.InputSubtext, { text: errorMsg || hint, hasError: Boolean(errorMsg) })
+  ] }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _react.Fragment, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkGFKY6YX2cjs.TextInput,
+    {
+      onChange: onChangeTextInput,
+      value,
+      hint,
+      error: errorMsg || void 0
+    }
+  ) });
+}
+var ReadClipboardButtonContainer = _styled2.default.div`
+  ${({ theme, hasAddress, hasError }) => _chunkNVVAOGNLcjs.inputBlockStyle.call(void 0, { theme, hasValue: hasAddress, hasError })}
+`;
+
+
+
+exports.ReadClipboardButton = ReadClipboardButton;

package/dist/{chunk-V5DGRLV7.cjs → chunk-XJP6PQIC.cjs}

@@ -3,7 +3,7 @@
 var _chunkAGIM6BKCcjs = require('./chunk-AGIM6BKC.cjs');
 
 
-var _chunkLLVW7HU4cjs = require('./chunk-LLVW7HU4.cjs');
+var _chunkSFTKSNEKcjs = require('./chunk-SFTKSNEK.cjs');
 
 // src/components/documentation/DocsHeadline.tsx
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
@@ -51,7 +51,7 @@ var DocsHeadline = ({
 }) => {
   const id = toKebabCase(getHeaderId(children));
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkLLVW7HU4cjs.StyledHeadline,
+    _chunkSFTKSNEKcjs.StyledHeadline,
     {
       as: heading,
       id,

package/dist/chunk-XNZEPKAL.cjs

@@ -0,0 +1,54 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+
+var _chunkNVVAOGNLcjs = require('./chunk-NVVAOGNL.cjs');
+
+// src/components/TextArea.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _react = require('react');
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+var defaultProps = {
+  disabled: false
+};
+function TextArea({
+  value,
+  onChange,
+  label,
+  error,
+  placeholder,
+  id,
+  hint,
+  disabled = defaultProps.disabled,
+  minHeight,
+  readOnly = false
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
+    label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNVVAOGNLcjs.Label, { children: label }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      StyledTextArea,
+      {
+        id,
+        value,
+        minHeight,
+        onChange: (event) => {
+          onChange(event.target.value, event);
+        },
+        disabled,
+        hasError: Boolean(error),
+        placeholder,
+        readOnly
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNVVAOGNLcjs.InputSubtext, { text: error || hint })
+  ] });
+}
+var StyledTextArea = _styled2.default.textarea`
+  ${_chunkNVVAOGNLcjs.textInputStyle}
+  resize: none;
+  min-height: ${({ minHeight }) => typeof minHeight === "number" ? `${minHeight}px` : "initial"};
+`;
+
+
+
+exports.TextArea = TextArea;

package/dist/{chunk-DBMGV4DX.js → chunk-XPMIPSEB.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-E5DUKMCU.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-DNRHVCOE.js";
+} from "./chunk-IGZYEIQS.js";
 import {
   Icon
-} from "./chunk-QQTZ6DZL.js";
+} from "./chunk-K3DMPJSX.js";
 import {
   standardBorderRadius
-} from "./chunk-APUV4UN4.js";
+} from "./chunk-ZMK4RE5I.js";
 
 // src/components/Collapsible.tsx
 import styled from "@emotion/styled";

package/dist/chunk-XS2KC4AS.js

@@ -0,0 +1,24 @@
+// src/components/QRReader/utils.ts
+var isMediaDevicesSupported = () => {
+  const isMediaDevicesSupported2 = typeof navigator !== "undefined" && !!navigator.mediaDevices;
+  if (!isMediaDevicesSupported2) {
+    console.warn(
+      `[ReactQRReader]: MediaDevices API has no support for your browser. You can fix this by running "npm i webrtc-adapter"`
+    );
+  }
+  return isMediaDevicesSupported2;
+};
+var isValidType = (value, name, type) => {
+  const isValid = typeof value === type;
+  if (!isValid) {
+    console.warn(
+      `[ReactQRReader]: Expected "${name}" to be a of type "${type}".`
+    );
+  }
+  return isValid;
+};
+
+export {
+  isMediaDevicesSupported,
+  isValidType
+};

package/dist/{chunk-HOKT6NQP.js → chunk-XWSMLTYM.js}

@@ -1,6 +1,6 @@
 import {
   Label
-} from "./chunk-GB2UBWT4.js";
+} from "./chunk-4MZNGM5R.js";
 import {
   Spacing
 } from "./chunk-E5DUKMCU.js";

package/dist/{chunk-KACMKEQC.cjs → chunk-YB3AGHD5.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkBY47I7ZPcjs = require('./chunk-BY47I7ZP.cjs');
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
 
 // src/components/ContentTable.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -18,7 +18,7 @@ function ContentTable({
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { children: row.title }),
       columns.map((column) => {
         const value = row[column.key];
-        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { children: value === true ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBY47I7ZPcjs.Icon, { name: "CheckmarkCircleGreen", width: 16 }) : value }, column.key);
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { children: value === true ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "CheckmarkCircleGreen", width: 16 }) : value }, column.key);
       })
     ] }, index)) })
   ] });

package/dist/{chunk-QCJWZRIP.cjs → chunk-YDTPEU32.cjs}

@@ -1,9 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
+var _chunk2ZRPJUTYcjs = require('./chunk-2ZRPJUTY.cjs');
+
+
 var _chunk7PRNB5U5cjs = require('./chunk-7PRNB5U5.cjs');
 
 
-var _chunkKSKKC6C2cjs = require('./chunk-KSKKC6C2.cjs');
+var _chunkO7USIZI6cjs = require('./chunk-O7USIZI6.cjs');
 
 // src/router.tsx
 var _lodashes = require('lodash-es');
@@ -45,12 +48,14 @@ function Link({
   filename,
   params,
   children,
+  text,
   css,
   onClick,
   className,
   hash = null,
   blue = false,
-  newTab = false
+  newTab: newTabProp,
+  typography
 }) {
   if (!_chunk7PRNB5U5cjs.isString.call(void 0, to) && !externalLink && !onClick) {
     throw new Error(
@@ -58,6 +63,7 @@ function Link({
     );
   }
   let toStr;
+  let newTab = Boolean(newTabProp);
   if (_chunk7PRNB5U5cjs.isString.call(void 0, to)) {
     toStr = replaceParams(to, params);
     toStr += hash ? `#${hash}` : "";
@@ -66,10 +72,21 @@ function Link({
     if (!definedExternalLink.startsWith("http")) {
       throw new Error("Link's externalLink must start with http");
     }
+    if (newTabProp === void 0) {
+      newTab = true;
+    }
     toStr = definedExternalLink;
   } else {
     toStr = "#";
   }
+  let content = children;
+  if (text) {
+    content = typography ? _chunk2ZRPJUTYcjs.renderTypography.call(void 0, typography.type, {
+      size: typography.size,
+      color: typography.color,
+      content: text
+    }) : text;
+  }
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _reactrouterdom.Link,
     {
@@ -79,10 +96,10 @@ function Link({
       onClick,
       className,
       download: filename,
-      style: { color: blue ? _chunkKSKKC6C2cjs.colors.blue43 : "inherit" },
+      style: { color: blue ? _chunkO7USIZI6cjs.colors.blue43 : "inherit" },
       target: newTab ? "_blank" : void 0,
       rel: newTab ? "noopener noreferrer" : void 0,
-      children
+      children: content
     }
   );
 }

package/dist/{chunk-F4RWDLPI.js → chunk-YFKVNM5L.js}

@@ -1,15 +1,15 @@
-import {
-  Tooltip
-} from "./chunk-5W523NQP.js";
 import {
   UnstyledButton
-} from "./chunk-E7RKIBJY.js";
+} from "./chunk-EYWGUIVP.js";
+import {
+  Tooltip
+} from "./chunk-GUGOSES5.js";
 import {
   Icon
-} from "./chunk-QQTZ6DZL.js";
+} from "./chunk-K3DMPJSX.js";
 import {
   __async
-} from "./chunk-LOPKRCGI.js";
+} from "./chunk-CWMXXUWU.js";
 
 // src/components/CopyToClipboardButton.tsx
 import styled from "@emotion/styled";

package/dist/chunk-YKG4VEBV.cjs

@@ -0,0 +1,75 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+
+var _chunk23NA5VW6cjs = require('./chunk-23NA5VW6.cjs');
+
+
+
+var _chunkJX6HEEEQcjs = require('./chunk-JX6HEEEQ.cjs');
+
+// src/components/Table/TableEmptyState.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+var TableEmptyState = (props) => {
+  const lines = [];
+  for (let i = 0; i < 10; i++) {
+    const percentage = randomIntFromInterval(70, 100);
+    lines.push(/* @__PURE__ */ _jsxruntime.jsx.call(void 0, TableEmptyStateLine, { percentage }, i));
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledTableEmptyState, { children: [
+    lines,
+    props.cardTitle || props.cardText ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TableEmptyStateCardContainer, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, TableEmptyStateCard, { children: [
+      props.cardTitle ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TableEmptyStateCardTitle, { children: props.cardTitle }) : null,
+      props.cardText ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TableEmptyStateCardText, { children: props.cardText }) : null
+    ] }) }) : null
+  ] });
+};
+var StyledTableEmptyState = _styled2.default.div`
+  position: relative;
+  ${_chunk23NA5VW6cjs.standardContentInset.css}
+`;
+var TableEmptyStateLine = _styled2.default.div`
+  background: linear-gradient(
+    90deg,
+    ${({ theme }) => _chunkJX6HEEEQcjs.isDark.call(void 0, theme) ? theme.c1Neutral : theme.c05Neutral} 0%,
+    rgba(242, 242, 242, 0) 100%
+  );
+  height: 16px;
+  margin: 15px 0;
+  width: ${(props) => props.percentage}%;
+`;
+function randomIntFromInterval(min, max) {
+  return Math.floor(Math.random() * (max - min + 1) + min);
+}
+var TableEmptyStateCardContainer = _styled2.default.div`
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  position: absolute;
+  top: 0;
+  height: 100%;
+  width: 100%;
+`;
+var TableEmptyStateCard = _styled2.default.div`
+  ${_chunk23NA5VW6cjs.standardCardShadow}
+  ${_chunk23NA5VW6cjs.standardBorderRadius.call(void 0, 16)}
+  padding: 32px;
+  width: 320px;
+  max-width: 100%;
+  ${({ theme }) => _chunkJX6HEEEQcjs.themeOr.call(void 0, `background-color: ${theme.bg}`, "transparent")({ theme })};
+`;
+var TableEmptyStateCardTitle = _styled2.default.p`
+  font-weight: bold;
+  margin: 0;
+`;
+var TableEmptyStateCardText = _styled2.default.p`
+  color: ${({ theme }) => theme.c6Neutral};
+  margin-top: 6px;
+  margin-bottom: 0;
+`;
+
+
+
+exports.TableEmptyState = TableEmptyState;

package/dist/{chunk-FH3E64BU.js → chunk-YOHFXRAS.js}

@@ -1,12 +1,12 @@
-import {
-  toNonTypographicReactNodes
-} from "./chunk-UC6SP4KJ.js";
 import {
   typographyStyles
-} from "./chunk-EGOOSBGG.js";
+} from "./chunk-X5SBSJ3Z.js";
 import {
   applyTypography
-} from "./chunk-GHXNMLAB.js";
+} from "./chunk-U4Y4CF4A.js";
+import {
+  toReactNodesBase
+} from "./chunk-HQO3PIAY.js";
 
 // src/components/typography/Code.tsx
 import styled from "@emotion/styled";
@@ -23,7 +23,7 @@ var Code = ({
 }) => {
   let reactNodes = children || null;
   if (content) {
-    reactNodes = toNonTypographicReactNodes(content);
+    reactNodes = toReactNodesBase(content);
   }
   return /* @__PURE__ */ jsx(
     StyledCode,

package/dist/{chunk-TPL3YXOG.js → chunk-YPNJVLQ6.js}

@@ -1,33 +1,33 @@
 import {
-  toReactNodes
-} from "./chunk-JZJQOZEN.js";
+  extend,
+  flexCenter,
+  pxToRems
+} from "./chunk-IGZYEIQS.js";
 import {
   UnstyledButton
-} from "./chunk-E7RKIBJY.js";
+} from "./chunk-EYWGUIVP.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
-  extend,
-  flexCenter,
-  pxToRems
-} from "./chunk-DNRHVCOE.js";
+  toReactNodes
+} from "./chunk-NXSA7WNB.js";
 import {
   Icon
-} from "./chunk-QQTZ6DZL.js";
+} from "./chunk-K3DMPJSX.js";
 import {
   standardContentInset
-} 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/Toasts.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-IJ4XF2NA.cjs → chunk-ZAP2S2HO.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkDBB5TKTScjs = require('./chunk-DBB5TKTS.cjs');
+var _chunkGFKY6YX2cjs = require('./chunk-GFKY6YX2.cjs');
 
 
 
@@ -11,7 +11,7 @@ var _chunk7PRNB5U5cjs = require('./chunk-7PRNB5U5.cjs');
 
 
 
-var _chunkLKKJVJCGcjs = require('./chunk-LKKJVJCG.cjs');
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
 
 // src/components/CommaNumberInput.tsx
 var _core = require('@lightsparkdev/core');
@@ -24,7 +24,7 @@ var _core = require('@lightsparkdev/core');
 var _react = require('react');
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 function CommaNumberInput(props) {
-  const _a = props, { onChange, value } = _a, rest = _chunkLKKJVJCGcjs.__objRest.call(void 0, _a, ["onChange", "value"]);
+  const _a = props, { onChange, value } = _a, rest = _chunkYM5JDZDQcjs.__objRest.call(void 0, _a, ["onChange", "value"]);
   const inputRef = _react.useRef.call(void 0, null);
   const cursorIndex = _react.useRef.call(void 0, null);
   const [valueWithCommas, setValueWithCommas] = _react.useState.call(void 0, value);
@@ -102,8 +102,8 @@ function CommaNumberInput(props) {
     [valueWithCommas, onChange]
   );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkDBB5TKTScjs.TextInput,
-    _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {
+    _chunkGFKY6YX2cjs.TextInput,
+    _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {
       placeholder: "Enter a number"
     }, rest), {
       onKeyDown: handleKeyDown,

package/dist/chunk-ZARPNNHA.js

@@ -0,0 +1,53 @@
+import {
+  InfoIconTooltip
+} from "./chunk-3NCG3JGI.js";
+import {
+  Label
+} from "./chunk-W5NH2F3D.js";
+import {
+  link
+} from "./chunk-G5IVQ4O3.js";
+import {
+  Icon
+} from "./chunk-K3DMPJSX.js";
+import {
+  addCommasToDigits
+} from "./chunk-EDN2QDCB.js";
+
+// src/components/SatoshiInputLabel.tsx
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+function SatoshiInputLabel({
+  text,
+  availableSats,
+  showTooltip = true
+}) {
+  const availableSatsTooltipNode = showTooltip ? /* @__PURE__ */ jsxs(Label, { style: { display: "inline-flex", margin: "0 0 0 3px" }, children: [
+    "available",
+    " ",
+    /* @__PURE__ */ jsx(
+      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. ",
+          link({
+            text: "Learn more",
+            externalLink: "https://docs.lightspark.com/lightspark-sdk/api-reference/types/Balances"
+          })
+        ]
+      }
+    )
+  ] }) : null;
+  return /* @__PURE__ */ jsxs(Label, { children: [
+    /* @__PURE__ */ jsx("div", { children: text }),
+    /* @__PURE__ */ jsx("div", { children: availableSats !== void 0 && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(Icon, { name: "Satoshi", width: 8, mr: 4, verticalAlign: -2 }),
+      addCommasToDigits(Math.floor(availableSats)),
+      availableSatsTooltipNode
+    ] }) })
+  ] });
+}
+
+export {
+  SatoshiInputLabel
+};

package/dist/{chunk-SEJXEWOJ.cjs → chunk-ZC7NYTXW.cjs}

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkAZRC3MXCcjs = require('./chunk-AZRC3MXC.cjs');
+var _chunkOVJZVL57cjs = require('./chunk-OVJZVL57.cjs');
 
 
-var _chunkG5HBO2FIcjs = require('./chunk-G5HBO2FI.cjs');
+var _chunkUN4FMYEQcjs = require('./chunk-UN4FMYEQ.cjs');
 
 
-var _chunkZBBVZQKJcjs = require('./chunk-ZBBVZQKJ.cjs');
+var _chunkUKMVD656cjs = require('./chunk-UKMVD656.cjs');
 
 // src/components/typography/Body.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -24,7 +24,7 @@ var Body = ({
 }) => {
   let reactNodes = children || null;
   if (content) {
-    reactNodes = _chunkAZRC3MXCcjs.toNonTypographicReactNodes.call(void 0, content);
+    reactNodes = _chunkUKMVD656cjs.toReactNodesBase.call(void 0, content);
   }
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     StyledBody,
@@ -41,8 +41,8 @@ var Body = ({
   );
 };
 var StyledBody = _styled2.default.span`
-  ${({ theme, size, colorProp }) => _chunkZBBVZQKJcjs.applyTypography.call(void 0, theme, "Body", size, colorProp)}
-  ${_chunkG5HBO2FIcjs.typographyStyles}
+  ${({ theme, size, colorProp }) => _chunkUN4FMYEQcjs.applyTypography.call(void 0, theme, "Body", size, colorProp)}
+  ${_chunkOVJZVL57cjs.typographyStyles}
 `;