@lightsparkdev/ui 1.0.8 → 1.0.9

package/dist/{chunk-VNFSKZW2.cjs → chunk-M72EXGIS.cjs}

@@ -1,6 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkPYL3O7AFcjs = require('./chunk-PYL3O7AF.cjs');
+var _chunkVZEYA2KHcjs = require('./chunk-VZEYA2KH.cjs');
+
+
+var _chunkLHXL6GOOcjs = require('./chunk-LHXL6GOO.cjs');
 
 // src/components/Checkbox.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -17,8 +20,24 @@ function Checkbox({
   label,
   mt = 0,
   alignItems = "center",
-  disabled = false
+  disabled = false,
+  typography: typographyProp
 }) {
+  const defaultTypography = {
+    type: (typographyProp == null ? void 0 : typographyProp.type) || "Body",
+    size: (typographyProp == null ? void 0 : typographyProp.size) || "Medium",
+    color: (typographyProp == null ? void 0 : typographyProp.color) || "text"
+  };
+  const defaultTypographyMap = {
+    link: defaultTypography,
+    text: defaultTypography,
+    nextLink: defaultTypography
+  };
+  const nodesWithTypography = _chunkVZEYA2KHcjs.setDefaultReactNodesTypography.call(void 0, 
+    label,
+    defaultTypographyMap
+  );
+  const content = _chunkLHXL6GOOcjs.toReactNodes.call(void 0, nodesWithTypography);
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, CheckboxContainer, { mt, alignItems, children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       StyledCheckbox,
@@ -36,7 +55,7 @@ function Checkbox({
         }
       }
     ),
-    label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxLabel, { htmlFor: id, children: label })
+    label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CheckboxLabel, { htmlFor: id, children: content })
   ] });
 }
 var StyledCheckbox = _styled2.default.input`
@@ -58,7 +77,7 @@ var StyledCheckbox = _styled2.default.input`
 `;
 var CheckboxContainer = _styled2.default.span`
   display: flex;
-  margin-top: ${({ mt }) => mt}px;
+  ${({ mt }) => mt === 0 ? "" : `margin-top: ${mt}px;`}
   align-items: ${({ alignItems }) => alignItems};
 
   & + & {
@@ -68,7 +87,6 @@ var CheckboxContainer = _styled2.default.span`
 var CheckboxLabel = _styled2.default.label`
   margin-left: 12px;
   cursor: pointer;
-  height: ${_chunkPYL3O7AFcjs.standardLineHeightEms}em;
 `;
 
 

package/dist/chunk-MFOXSQYS.js

@@ -0,0 +1,77 @@
+import {
+  Spacing
+} from "./chunk-E5DUKMCU.js";
+import {
+  Button
+} from "./chunk-R35JXTPE.js";
+import {
+  z
+} from "./chunk-55OQPFLF.js";
+
+// src/components/DataManagerTable/Popover.tsx
+import styled from "@emotion/styled";
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+var Popover = ({
+  show,
+  setShow,
+  side = "left",
+  onApply,
+  onClear,
+  children
+}) => {
+  const handleApply = () => {
+    onApply();
+  };
+  const handleClear = () => {
+    onClear();
+  };
+  const handleKeyPress = (e) => {
+    if (e.key === "Enter") {
+      onApply();
+    }
+  };
+  return /* @__PURE__ */ jsx(Container, { show, side, onKeyDownCapture: handleKeyPress, children: /* @__PURE__ */ jsxs(Content, { children: [
+    children,
+    /* @__PURE__ */ jsxs(Footer, { children: [
+      /* @__PURE__ */ jsx(Button, { text: "Clear", onClick: handleClear }),
+      /* @__PURE__ */ jsxs(FooterRight, { children: [
+        /* @__PURE__ */ jsx(Button, { text: "Cancel", onClick: () => setShow(false) }),
+        /* @__PURE__ */ jsx(Button, { text: "Apply", kind: "primary", onClick: handleApply })
+      ] })
+    ] })
+  ] }) });
+};
+var Container = styled.div`
+  position: absolute;
+  z-index: ${z.dropdown};
+  top: 44px;
+  display: ${({ show }) => show ? "block" : "none"};
+  ${({ side }) => side === "right" ? "right: 0;" : "left: 0;"}
+  width: 400px;
+  background: white;
+  border: 0.5px solid ${({ theme }) => theme.c1Neutral};
+  border-radius: 12px;
+  box-shadow:
+    0px 1px 4px 0px rgba(0, 0, 0, 0.1),
+    0px 4px 8px 0px rgba(0, 0, 0, 0.08);
+`;
+var Content = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${Spacing.px.xl};
+  padding: ${Spacing.px.lg};
+`;
+var Footer = styled.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+`;
+var FooterRight = styled.div`
+  display: flex;
+  gap: ${Spacing.px.xs};
+`;
+
+export {
+  Popover
+};

package/dist/chunk-MOTLS6PJ.cjs

@@ -0,0 +1,233 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkZO52GP5Zcjs = require('./chunk-ZO52GP5Z.cjs');
+
+
+var _chunkI6Y7IHF5cjs = require('./chunk-I6Y7IHF5.cjs');
+
+
+var _chunkO7USIZI6cjs = require('./chunk-O7USIZI6.cjs');
+
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+
+// src/components/QRCode.tsx
+var _react = require('@emotion/react');
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _react3 = require('react');
+
+// src/static/images/FramedLogoOnCircle.svg?url
+var FramedLogoOnCircle_default = 'data:image/svg+xml,<svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg">%0A<g clip-path="url(%23clip0_1800_26563)">%0A<circle cx="17.3333" cy="17.3333" r="14.3333" fill="%23FFF14E"/>%0A<path d="M17.2382 17.9634H11.5472L19.5845 10.929L18.0111 14.3381H18.9129L21.9401 7.77759L9.37109 18.7824H16.861L17.2382 17.9634Z" fill="black"/>%0A<path d="M17.2979 15.884L16.9206 16.7029H22.6116L14.5743 23.7374L16.1477 20.3283H15.246L14.6295 21.6671L12.2188 26.8888L24.7877 15.884H17.2979Z" fill="black"/>%0A</g>%0A<defs>%0A<clipPath id="clip0_1800_26563">%0A<rect width="28.6667" height="28.6667" fill="white" transform="translate(3 3)"/>%0A</clipPath>%0A</defs>%0A</svg>%0A';
+
+// src/components/QRCode.tsx
+var _qrcodereact = require('qrcode.react');
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+var defaultProps = {
+  children: null,
+  border: true,
+  isCentered: true,
+  size: 256,
+  showLogo: true,
+  animated: false
+};
+function QRCode({
+  value,
+  children,
+  heading,
+  border = defaultProps.border,
+  isCentered = defaultProps.isCentered,
+  size = defaultProps.size,
+  showLogo = defaultProps.showLogo,
+  animated = defaultProps.animated
+}) {
+  const logoSize = Math.round(size * 0.2);
+  const imageSettingsProp = showLogo ? {
+    imageSettings: {
+      excavate: true,
+      height: logoSize,
+      src: FramedLogoOnCircle_default,
+      width: logoSize
+    }
+  } : {};
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react3.Fragment, { children: [
+    heading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QRCodeLabel, { children: heading }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QRCodeContainer, { isCentered, children: value ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QRCodeImage, { isCentered, border, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _qrcodereact.QRCodeSVG,
+      _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {
+        value,
+        size,
+        level: "L"
+      }, imageSettingsProp)
+    ) }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EmptyQRCodeSizer, { size, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      EmptyQRCode,
+      {
+        isCentered,
+        border,
+        animated,
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "LogoOnCircle", width: 30 })
+      }
+    ) }) }),
+    children
+  ] });
+}
+QRCode.defaultProps = defaultProps;
+var borderWidth = 10;
+var qr = ({ isCentered, border }) => _react.css`
+  display: inline-block;
+  ${border && `border: ${borderWidth}px solid #ffffff;`}
+  ${border && `border-radius: 8px;`}
+  ${border && "box-sizing: content-box;"}
+`;
+var QRCodeContainer = _styled2.default.div`
+  display: flex;
+  ${({ isCentered }) => isCentered && `
+      justify-content: center;
+      align-items: center;
+    `}
+  font-size: 12px;
+  svg {
+    max-width: 100%;
+    height: auto;
+    display: block;
+  }
+`;
+var QRCodeImage = _styled2.default.div`
+  ${qr}
+`;
+var shadowOffsetA = 2;
+var tailRadiusA = 1.1;
+var tailRadiusB = 0.5;
+var shadowColor = _chunkO7USIZI6cjs.colors.white;
+var initialBoxShadow = `
+  box-shadow: -${shadowOffsetA}px 0px ${tailRadiusA}px 1.5px ${shadowColor},
+  0 0 4px ${tailRadiusB}px ${shadowColor};
+`;
+var opacityMax = 1;
+var opacityMin = 0.05;
+var scaleMin = 4;
+var scaleMax = 33;
+var startingLeftPer = 55;
+var EmptyQRCodeSizer = _styled2.default.div`
+  width: ${({ size }) => size}px;
+  max-width: 100%;
+  position: relative;
+  padding-top: 100%;
+`;
+var EmptyQRCode = _styled2.default.div`
+  ${qr}
+  border-color: ${({ theme }) => theme.c2Neutral};
+  border-width: 1px;
+  width: calc(100% - 2px);
+  height: calc(100% - 2px);
+  position: absolute;
+  top: 0;
+  left: 0;
+
+  @keyframes circle {
+    0% {
+      top: 0%;
+      left: ${startingLeftPer}%;
+      box-shadow:
+        0px -${shadowOffsetA}px 0px ${tailRadiusA / 2}px ${shadowColor},
+        0 0 4px ${tailRadiusB}px ${shadowColor};
+    }
+    2% {
+      top: 0%;
+      left: 100%;
+      box-shadow:
+        0px -${shadowOffsetA}px 0px ${tailRadiusA / 2}px ${shadowColor},
+        0 0 4px ${tailRadiusB}px ${shadowColor};
+    }
+    4% {
+      top: 100%;
+      left: 100%;
+      box-shadow:
+        0px -${shadowOffsetA}px 0px ${tailRadiusA / 2}px ${shadowColor},
+        0 0 4px ${tailRadiusB}px ${shadowColor};
+    }
+    6% {
+      top: 100%;
+      left: 0%;
+    }
+    8% {
+      top: 0%;
+      left: 0%;
+      box-shadow:
+        0px ${shadowOffsetA}px 0px ${tailRadiusA / 2}px ${shadowColor},
+        0 0 4px ${tailRadiusB}px ${shadowColor};
+    }
+    10% {
+      top: 0;
+      left: ${startingLeftPer - 1e-3}%;
+      ${initialBoxShadow};
+    }
+    100% {
+      top: 0;
+      left: ${startingLeftPer}%;
+      ${initialBoxShadow};
+    }
+  }
+
+  @keyframes pulse {
+    0% {
+      opacity: ${opacityMax};
+      transform: scaleX(1);
+    }
+    10% {
+      opacity: ${opacityMax * 0.3};
+      transform: scaleX(1);
+    }
+    25% {
+      opacity: ${opacityMin};
+      transform: scaleX(${scaleMax / 3 * 1});
+    }
+    45% {
+      opacity: ${opacityMin};
+      transform: scaleX(${scaleMin});
+    }
+    72% {
+      opacity: ${opacityMax / 3 * 1.3};
+      transform: scaleX(${scaleMax / 4 * 2});
+    }
+    93% {
+      opacity: ${opacityMin};
+      transform: scaleX(${scaleMin});
+    }
+    100% {
+      opacity: ${opacityMax};
+      transform: scaleX(${scaleMax});
+    }
+  }
+
+  ${({ animated }) => animated && `
+    &:before {
+      content: "";
+      display: block;
+      position: absolute;
+      top: 0;
+      left: ${startingLeftPer}%;
+      transform: scaleX(1);
+      transform-origin: 50% 0%;
+      animation: circle 7s ease-out infinite,
+        pulse 7s cubic-bezier(0.36, 0.11, 0.84, 0.52) infinite;
+      ${initialBoxShadow}
+    }
+  `}
+
+  & > * {
+    ${_chunkZO52GP5Zcjs.absoluteCenter}
+  }
+`;
+var QRCodeLabel = _styled2.default.p`
+  color: ${({ theme }) => theme.text};
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.22em;
+  text-transform: uppercase;
+`;
+
+
+
+
+
+exports.QRCode = QRCode; exports.qr = qr; exports.QRCodeLabel = QRCodeLabel;

package/dist/{chunk-C5KQZIKL.js → chunk-MQTRGLN5.js}

@@ -1,12 +1,12 @@
 import {
   StatusIndicator
-} from "./chunk-SXY5KR2T.js";
+} from "./chunk-CN6AMXLK.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
   __spreadValues
-} from "./chunk-LOPKRCGI.js";
+} from "./chunk-CWMXXUWU.js";
 
 // src/components/GradientCardHeader.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-TSO4WRU4.js → chunk-MYJEL6LY.js}

@@ -1,9 +1,9 @@
 import {
   standardBorderRadius
-} from "./chunk-APUV4UN4.js";
+} from "./chunk-ZMK4RE5I.js";
 import {
   themeOr
-} from "./chunk-W5I53DTZ.js";
+} from "./chunk-GZW6KBUI.js";
 
 // src/components/ProgressBar.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-24G7XKW5.cjs → chunk-N4HNDEUN.cjs}

@@ -1,6 +1,9 @@
 "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');
+
+
+var _chunk2ZRPJUTYcjs = require('./chunk-2ZRPJUTY.cjs');
 
 // src/components/CurrencyAmount.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -18,7 +21,9 @@ function CurrencyAmount({
   showUnits = false,
   includeEstimatedIndicator = false,
   fullPrecision = false,
-  ml = 0
+  id,
+  ml = 0,
+  typography
 }) {
   const unit = displayUnit;
   const amountMap = _core.isCurrencyMap.call(void 0, amount) ? amount : _core.mapCurrencyAmount.call(void 0, amount);
@@ -39,18 +44,26 @@ function CurrencyAmount({
   if (showUnits) {
     formattedNumber += ` ${shorttext(unit, value)}`;
   }
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledCurrencyAmount, { ml, children: [
+  let content = formattedNumber;
+  if (typography && typography.type) {
+    content = _chunk2ZRPJUTYcjs.renderTypography.call(void 0, typography.type, {
+      size: typography.size,
+      color: typography.color,
+      content: formattedNumber
+    });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledCurrencyAmount, { ml, id, children: [
     includeEstimatedIndicator && "Est. ",
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CurrencyIcon, { unit }),
-    formattedNumber
+    content
   ] });
 }
 var CurrencyIcon = ({ unit }) => {
   switch (unit) {
     case _core.CurrencyUnit.BITCOIN:
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBY47I7ZPcjs.Icon, { name: "BitcoinB", width: 8, verticalAlign: -2, mr: 2 });
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "BitcoinB", width: 8, verticalAlign: -2, mr: 2 });
     case _core.CurrencyUnit.SATOSHI:
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBY47I7ZPcjs.Icon, { name: "Satoshi", width: 8, verticalAlign: -2, mr: 2 });
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkI6Y7IHF5cjs.Icon, { name: "Satoshi", width: 8, verticalAlign: -2, mr: 2 });
     default:
       return null;
   }