@lightsparkdev/ui 1.0.8 → 1.0.10

package/dist/chunk-OVL3XQUI.cjs

@@ -0,0 +1,291 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkRFO3GG6Rcjs = require('./chunk-RFO3GG6R.cjs');
+
+
+
+
+var _chunkJPRA3J5Ccjs = require('./chunk-JPRA3J5C.cjs');
+
+
+var _chunk6IU4OQOCcjs = require('./chunk-6IU4OQOC.cjs');
+
+
+var _chunk7LOKZM7Vcjs = require('./chunk-7LOKZM7V.cjs');
+
+
+var _chunk4EK5RAZScjs = require('./chunk-4EK5RAZS.cjs');
+
+
+var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
+
+
+var _chunkJMIYMECJcjs = require('./chunk-JMIYMECJ.cjs');
+
+
+var _chunkDIMJISMHcjs = require('./chunk-DIMJISMH.cjs');
+
+
+var _chunkCFG65CGCcjs = require('./chunk-CFG65CGC.cjs');
+
+// src/components/QRReaderButton.tsx
+var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+var _core = require('@lightsparkdev/core');
+var _react = require('react');
+var _reactdom = require('react-dom'); var _reactdom2 = _interopRequireDefault(_reactdom);
+var _jsxruntime = require('@emotion/react/jsx-runtime');
+var containerStyle = {};
+var videoContainerStyle = {
+  position: "static",
+  width: "auto",
+  height: "auto",
+  overflow: "initial"
+};
+var videoStyle = {};
+function QRReaderOverlay({
+  captureModeTitle,
+  onClickBack
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledQRReaderOverlay, { children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, ScreenContext, { children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, OverlayHeader, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BackButton, { onClick: onClickBack, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJMIYMECJcjs.Icon, { name: "ArrowLeft", width: 25 }) }),
+        captureModeTitle ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: captureModeTitle }) : null
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "div",
+        {
+          css: {
+            position: "absolute",
+            width: "146px",
+            top: "13%",
+            left: "0px",
+            right: "0px",
+            margin: "auto"
+          },
+          children: "Scan a BTC or Lightning QR code"
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, OverlayFooter, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: "or" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk7LOKZM7Vcjs.Button, { text: "Enter an address", onClick: onClickBack, mt: 12 })
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "svg",
+      {
+        height: "100%",
+        viewBox: "0 0 1784 623",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "path",
+            {
+              fillRule: "evenodd",
+              clipRule: "evenodd",
+              d: "M1784 0H0V623H1784V0ZM774.107 136C756.375 136 742 150.327 742 168V404C742 421.673 756.375 436 774.107 436H1009.89C1027.63 436 1042 421.673 1042 404V168C1042 150.327 1027.63 136 1009.89 136H774.107Z",
+              fill: "black",
+              fillOpacity: "0.5"
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "rect",
+            {
+              x: "742",
+              y: "136",
+              width: "300",
+              height: "300",
+              rx: "32",
+              stroke: "white",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeDasharray: "4 6"
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function QRReaderButton({
+  onResult,
+  onUserDenyAccess,
+  captureModeTitle
+}) {
+  const [capturing, setCapturing] = _react.useState.call(void 0, false);
+  const [errorMsg, setErrorMsg] = _react.useState.call(void 0, null);
+  const nodeRef = _react.useRef.call(void 0, null);
+  _react.useEffect.call(void 0, () => {
+    if (!nodeRef.current) {
+      nodeRef.current = document.createElement("div");
+      document.body.appendChild(nodeRef.current);
+    }
+    return () => {
+      if (nodeRef.current) {
+        document.body.removeChild(nodeRef.current);
+        nodeRef.current = null;
+      }
+    };
+  }, []);
+  _react.useEffect.call(void 0, () => {
+    if (capturing) {
+      document.body.style.overflow = "hidden";
+      document.body.style.overscrollBehavior = "none";
+      document.body.style.touchAction = "none";
+    } else {
+      document.body.style.overflow = "";
+      document.body.style.overscrollBehavior = "";
+      document.body.style.touchAction = "";
+    }
+  }, [capturing]);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, QRReaderButtonContainer, { children: [
+    capturing && nodeRef.current ? (
+      // portal needed to break outside card stacking context and stay above header
+      _reactdom2.default.createPortal(
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, QRContainer, { children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            QRReaderOverlay,
+            {
+              captureModeTitle: captureModeTitle || "Scan QR Code",
+              onClickBack: () => setCapturing(false)
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkRFO3GG6Rcjs.QRReader,
+            {
+              constraints: {
+                facingMode: "environment"
+              },
+              onResult: (result, error) => {
+                if (result) {
+                  setCapturing(false);
+                  onResult(result, error);
+                }
+                if (error) {
+                  if (_core.isError.call(void 0, error)) {
+                    if (error.message.match(/Permission denied/)) {
+                      setErrorMsg(
+                        "You must allow access to your camera to scan QR codes."
+                      );
+                      onUserDenyAccess();
+                    }
+                  }
+                }
+              },
+              containerStyle,
+              videoContainerStyle,
+              videoStyle
+            }
+          )
+        ] }),
+        nodeRef.current
+      )
+    ) : null,
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      ScanQRButton,
+      {
+        onClick: () => setCapturing(true),
+        hasError: Boolean(errorMsg),
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJMIYMECJcjs.Icon, { name: "CameraCapture", width: 64 }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { css: { marginTop: "21px" }, children: "Scan QR Code" })
+        ]
+      }
+    ),
+    errorMsg ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJPRA3J5Ccjs.FieldError, { children: errorMsg }) : null
+  ] });
+}
+var StyledQRReaderOverlay = _styled2.default.div`
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 100%;
+  z-index: ${_chunkZU72XWNEcjs.z.qrReaderOverlay};
+  left: 50%;
+  transform: translateX(-50%);
+`;
+var QRContainer = _styled2.default.div`
+  // some of these styles aren't applied properly via the provided props, override:
+  video {
+    z-index: ${_chunkZU72XWNEcjs.z.qrReaderVideo} !important;
+    padding: 0 !important;
+    position: fixed !important;
+    width: 100vw !important;
+    height: 100vh !important;
+    left: 50% !important;
+    transform: translateX(-50%) !important;
+    object-fit: cover !important;
+  }
+`;
+var QRReaderButtonContainer = _styled2.default.div``;
+var ScanQRButton = _styled2.default.call(void 0, _chunk4EK5RAZScjs.UnstyledButton)`
+  ${_chunkJPRA3J5Ccjs.standardBorderColor}
+  ${_chunkJPRA3J5Ccjs.aboveFieldError}
+  margin-top: 16px;
+  border-style: solid;
+  border-width: 1px;
+  ${_chunkDIMJISMHcjs.standardBorderRadius.call(void 0, 8)}
+  width: 100%;
+  padding: 24px 16px 16px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: ${({ theme }) => theme.lcNeutral};
+  div:last-of-type {
+    color: ${({ theme }) => theme.c4Neutral};
+    font-weight: 600;
+  }
+`;
+var ScreenContext = _styled2.default.div`
+  position: fixed;
+  width: 100vw;
+  height: 100vh;
+  left: 50%;
+  transform: translateX(-50%);
+  color: ${_chunkCFG65CGCcjs.colors.white};
+  text-align: center;
+`;
+var qrOverlayHeaderHeightPx = 80;
+var BackButton = _styled2.default.call(void 0, _chunk4EK5RAZScjs.UnstyledButton)`
+  height: ${qrOverlayHeaderHeightPx}px;
+  width: ${qrOverlayHeaderHeightPx}px;
+  color: ${_chunkCFG65CGCcjs.colors.white};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  top: 0;
+  left: 0;
+`;
+var OverlayHeader = _styled2.default.div`
+  position: absolute;
+  top: 0;
+  font-size: ${_chunk6IU4OQOCcjs.pxToRems.call(void 0, 16)};
+  text-align: center;
+  width: 100%;
+  height: ${qrOverlayHeaderHeightPx}px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`;
+var OverlayFooter = _styled2.default.div`
+  padding: 16px 0;
+  position: absolute;
+  height: 32%;
+  max-height: 250px;
+  background: ${_chunkCFG65CGCcjs.colors.black};
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  font-size: ${_chunk6IU4OQOCcjs.pxToRems.call(void 0, 16)};
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+`;
+
+
+
+exports.QRReaderButton = QRReaderButton;

package/dist/{chunk-3UXAUDOL.cjs → chunk-OVOZ4MWA.cjs}

@@ -1,40 +1,40 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkKACMKEQCcjs = require('./chunk-KACMKEQC.cjs');
+var _chunkRRPNFKNWcjs = require('./chunk-RRPNFKNW.cjs');
 
 
-var _chunkTRIJJTMXcjs = require('./chunk-TRIJJTMX.cjs');
+var _chunkE5ARGCTHcjs = require('./chunk-E5ARGCTH.cjs');
 
 
-var _chunkRKBBY43Dcjs = require('./chunk-RKBBY43D.cjs');
+var _chunkZPJOE4AScjs = require('./chunk-ZPJOE4AS.cjs');
 
 
-var _chunkVYKXX3SHcjs = require('./chunk-VYKXX3SH.cjs');
+var _chunkOCULQS4Scjs = require('./chunk-OCULQS4S.cjs');
 
 
-var _chunkSEJXEWOJcjs = require('./chunk-SEJXEWOJ.cjs');
 
+var _chunkDISSWFSScjs = require('./chunk-DISSWFSS.cjs');
 
 
-var _chunkLLVW7HU4cjs = require('./chunk-LLVW7HU4.cjs');
+var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
 
 
-var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
+var _chunkJUGL45TEcjs = require('./chunk-JUGL45TE.cjs');
 
 
-var _chunkZUAO4DW3cjs = require('./chunk-ZUAO4DW3.cjs');
+var _chunk6IU4OQOCcjs = require('./chunk-6IU4OQOC.cjs');
 
 
-var _chunk4P7RPU32cjs = require('./chunk-4P7RPU32.cjs');
+var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
 
 
-var _chunkPYL3O7AFcjs = require('./chunk-PYL3O7AF.cjs');
+var _chunkDIMJISMHcjs = require('./chunk-DIMJISMH.cjs');
 
 
-var _chunkTMTEVKSDcjs = require('./chunk-TMTEVKSD.cjs');
+var _chunkDCQM7IVKcjs = require('./chunk-DCQM7IVK.cjs');
 
 
-var _chunkKSKKC6C2cjs = require('./chunk-KSKKC6C2.cjs');
+var _chunkCFG65CGCcjs = require('./chunk-CFG65CGC.cjs');
 
 // src/components/typography/Article.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
@@ -50,53 +50,53 @@ function Article({ defaultTypography, children }) {
   );
 }
 var StyledArticle = _styled2.default.article`
-  ${({ theme, type, size }) => _chunkTMTEVKSDcjs.getTypographyString.call(void 0, theme, type, size)}
+  ${({ theme, type, size }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, type, size)}
 
-  ${_chunkRKBBY43Dcjs.displaySelector.call(void 0, "h1")} {
+  ${_chunkRRPNFKNWcjs.displaySelector.call(void 0, "h1")} {
     margin: 0;
   }
 
-  ${_chunkLLVW7HU4cjs.headlineSelector.call(void 0, "h1")} {
+  ${_chunkDISSWFSScjs.headlineSelector.call(void 0, "h1")} {
     margin: 0;
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
   }
 
-  ${_chunkLLVW7HU4cjs.headlineSelector.call(void 0, "h2")} {
+  ${_chunkDISSWFSScjs.headlineSelector.call(void 0, "h2")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunkLLVW7HU4cjs.headlineSelector.call(void 0, "h3")} {
+  ${_chunkDISSWFSScjs.headlineSelector.call(void 0, "h3")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunkLLVW7HU4cjs.headlineSelector.call(void 0, "h4")} {
+  ${_chunkDISSWFSScjs.headlineSelector.call(void 0, "h4")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunkLLVW7HU4cjs.headlineSelector.call(void 0, "h5")} {
+  ${_chunkDISSWFSScjs.headlineSelector.call(void 0, "h5")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunkLLVW7HU4cjs.headlineSelector.call(void 0, "h6")} {
+  ${_chunkDISSWFSScjs.headlineSelector.call(void 0, "h6")} {
     padding-top: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]};
     padding-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin: 0;
   }
 
-  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkSEJXEWOJcjs.StyledBody)} {
+  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkOCULQS4Scjs.StyledBody)} {
     margin-top: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
     margin-bottom: ${_chunkZUAO4DW3cjs.Spacing.px.xs};
   }
 
-  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkKACMKEQCcjs.StyledContentTable)} {
+  ${_chunk6VA4SAHQcjs.select.call(void 0, _chunkJUGL45TEcjs.StyledContentTable)} {
     margin: ${_chunkZUAO4DW3cjs.Spacing.px["2xl"]} 0;
   }
 
@@ -110,9 +110,9 @@ var StyledArticle = _styled2.default.article`
     font-weight: 700;
   }
 
-  *:not(${_chunkLLVW7HU4cjs.ALL_HEADLINE_SELECTORS},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkVYKXX3SHcjs.StyledTitle)},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkTRIJJTMXcjs.StyledCode)})
+  *:not(${_chunkDISSWFSScjs.ALL_HEADLINE_SELECTORS},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkE5ARGCTHcjs.StyledTitle)},${_chunk6VA4SAHQcjs.select.call(void 0, _chunkZPJOE4AScjs.StyledCode)})
     > a {
-    ${({ theme }) => _chunkTMTEVKSDcjs.getTypographyString.call(void 0, theme, "Label Strong", "Large")}
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Label Strong", "Large")}
     font-size: inherit;
     color: ${({ theme }) => theme.link};
   }
@@ -128,22 +128,22 @@ var StyledArticle = _styled2.default.article`
   }
 
   li {
-    ${({ theme }) => _chunkTMTEVKSDcjs.getTypographyString.call(void 0, theme, "Body", "Medium")}
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Body", "Medium")}
     :not(:last-child) {
       margin-bottom: ${_chunkZUAO4DW3cjs.Spacing.px["3xs"]};
     }
   }
 
   code:not([class|="language"]) {
-    ${({ theme }) => _chunkTMTEVKSDcjs.getTypographyString.call(void 0, theme, "Code", "Medium")}
-    background: ${_chunkKSKKC6C2cjs.colors.grayBlue94};
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Code", "Medium")}
+    background: ${_chunkCFG65CGCcjs.colors.grayBlue94};
     padding: ${_chunkZUAO4DW3cjs.Spacing.px["4xs"]} ${_chunkZUAO4DW3cjs.Spacing.px["2xs"]};
     margin: ${_chunkZUAO4DW3cjs.Spacing.px["4xs"]};
     border-radius: 4px;
   }
 
   pre[class|="language"] {
-    ${_chunkPYL3O7AFcjs.standardBorderRadius.call(void 0, 8)}
+    ${_chunkDIMJISMHcjs.standardBorderRadius.call(void 0, 8)}
     width: 100%;
     padding: ${_chunkZUAO4DW3cjs.Spacing.px.md} ${_chunkZUAO4DW3cjs.Spacing.px.lg};
     margin: ${_chunkZUAO4DW3cjs.Spacing.px.md} 0;
@@ -152,9 +152,9 @@ var StyledArticle = _styled2.default.article`
   // Must match specificity of prismjs to get proper line height!
   pre[class|="language"],
   code[class|="language"] {
-    ${({ theme }) => _chunkTMTEVKSDcjs.getTypographyString.call(void 0, theme, "Code", "Small")}
+    ${({ theme }) => _chunkDCQM7IVKcjs.getTypographyString.call(void 0, theme, "Code", "Small")}
 
-    ${_chunk4P7RPU32cjs.overflowAutoWithoutScrollbars}
+    ${_chunk6IU4OQOCcjs.overflowAutoWithoutScrollbars}
   }
 
   blockquote {

package/dist/{chunk-AVEKG63Q.js → chunk-OYWYTUJD.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-R4JQUMCP.js";
+import {
+  toReactNodesBase
+} from "./chunk-DILTUDQN.js";
 
 // src/components/typography/BodyStrong.tsx
 import styled from "@emotion/styled";
@@ -23,7 +23,7 @@ var BodyStrong = ({
 }) => {
   let reactNodes = children || null;
   if (content) {
-    reactNodes = toNonTypographicReactNodes(content);
+    reactNodes = toReactNodesBase(content);
   }
   return /* @__PURE__ */ jsx(
     StyledBodyStrong,

package/dist/{chunk-NPTHZ6KR.cjs → chunk-PFLKL4U5.cjs}

@@ -3,31 +3,31 @@
 var _chunkT7ZB3XF7cjs = require('./chunk-T7ZB3XF7.cjs');
 
 
-var _chunkQCJWZRIPcjs = require('./chunk-QCJWZRIP.cjs');
-
-
-var _chunkBOBYW7PPcjs = require('./chunk-BOBYW7PP.cjs');
+var _chunk4EK5RAZScjs = require('./chunk-4EK5RAZS.cjs');
 
 
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunkBY47I7ZPcjs = require('./chunk-BY47I7ZP.cjs');
+var _chunkJMIYMECJcjs = require('./chunk-JMIYMECJ.cjs');
 
 
 
 
-var _chunkPYL3O7AFcjs = require('./chunk-PYL3O7AF.cjs');
+var _chunkDIMJISMHcjs = require('./chunk-DIMJISMH.cjs');
 
 
-var _chunkWTHHP7G2cjs = require('./chunk-WTHHP7G2.cjs');
+var _chunkWKRK5OVEcjs = require('./chunk-WKRK5OVE.cjs');
 
 
 var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
 
 
+var _chunkQE67LKK5cjs = require('./chunk-QE67LKK5.cjs');
+
 
-var _chunkLKKJVJCGcjs = require('./chunk-LKKJVJCG.cjs');
+
+var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
 
 // src/components/Dropdown.tsx
 var _react = require('@emotion/react');
@@ -199,7 +199,7 @@ function Dropdown({
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
-      css: _chunkLKKJVJCGcjs.__spreadValues.call(void 0, { position: "relative", display: "inline-flex" }, containerCSS),
+      css: _chunkYM5JDZDQcjs.__spreadValues.call(void 0, { position: "relative", display: "inline-flex" }, containerCSS),
       ref: dropdownRef,
       children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -266,9 +266,9 @@ var DropdownFooter = _styled2.default.div`
   margin-top: 16px;
 `;
 var DropdownItems = _styled2.default.ul`
-  ${_chunkPYL3O7AFcjs.overlaySurface}
-  color: ${({ theme }) => _chunkWTHHP7G2cjs.themeOr.call(void 0, theme.c6Neutral, theme.c8Neutral)};
-  ${_chunkPYL3O7AFcjs.standardBorderRadius.call(void 0, 8)}
+  ${_chunkDIMJISMHcjs.overlaySurface}
+  color: ${({ theme }) => _chunkWKRK5OVEcjs.themeOr.call(void 0, theme.c6Neutral, theme.c8Neutral)};
+  ${_chunkDIMJISMHcjs.standardBorderRadius.call(void 0, 8)}
   padding: 12px 0;
   visibility: ${({ isOpen }) => isOpen ? "visible" : "hidden"};
   position: fixed;
@@ -280,14 +280,11 @@ var DropdownItems = _styled2.default.ul`
   list-style: none;
   margin: 0;
 `;
-function DropdownItem({
-  dropdownItem,
-  onClick
-}) {
+function DropdownItem({ dropdownItem, onClick }) {
   const theme = _react.useTheme.call(void 0, );
   const dropdownItemIcon = dropdownItem.getIcon && dropdownItem.getIcon({ dropdownItem, theme });
   const dropdownItemIconNode = dropdownItemIcon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkBY47I7ZPcjs.Icon,
+    _chunkJMIYMECJcjs.Icon,
     {
       name: dropdownItemIcon.name,
       width: dropdownItemIcon.width || 12,
@@ -330,8 +327,8 @@ function DropdownItem({
     }
   );
 }
-var DropdownButton = _styled2.default.call(void 0, _chunkBOBYW7PPcjs.UnstyledButton)`
-  ${_chunkPYL3O7AFcjs.standardFocusOutline}
+var DropdownButton = _styled2.default.call(void 0, _chunk4EK5RAZScjs.UnstyledButton)`
+  ${_chunkDIMJISMHcjs.standardFocusOutline}
 `;
 var dropdownItemStyle = ({ selected, theme }) => `
   background-color: ${selected ? theme.primary : "transparent"};
@@ -356,20 +353,20 @@ var cssProp = ({
   selected
 }) => _react.css`
   ${dropdownItemStyle({ theme, selected: Boolean(selected) })}
-  ${_chunkPYL3O7AFcjs.standardFocusOutline.call(void 0, { theme })}
+  ${_chunkDIMJISMHcjs.standardFocusOutline.call(void 0, { theme })}
 `;
 function DropdownItemLink(props) {
   const theme = _react.useTheme.call(void 0, );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkQCJWZRIPcjs.Link,
-    _chunkLKKJVJCGcjs.__spreadProps.call(void 0, _chunkLKKJVJCGcjs.__spreadValues.call(void 0, {}, props), {
+    _chunkQE67LKK5cjs.Link,
+    _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, props), {
       css: cssProp({ theme, selected: Boolean(props.selected) })
     })
   );
 }
 var DropdownItemDiv = _styled2.default.div`
   ${dropdownItemStyle}
-  ${_chunkPYL3O7AFcjs.standardFocusOutline}
+  ${_chunkDIMJISMHcjs.standardFocusOutline}
 `;
 
 

package/dist/{chunk-BCXQD6ZP.js → chunk-PPWQMT6L.js}

@@ -1,6 +1,6 @@
-// src/icons/TwoArrowsUp.tsx
+// src/icons/ArrowsUp.tsx
 import { jsx } from "@emotion/react/jsx-runtime";
-function TwoArrowsUp() {
+function ArrowsUp() {
   return /* @__PURE__ */ jsx(
     "svg",
     {
@@ -23,5 +23,5 @@ function TwoArrowsUp() {
 }
 
 export {
-  TwoArrowsUp
+  ArrowsUp
 };

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

@@ -4,10 +4,10 @@ var _chunkT7ZB3XF7cjs = require('./chunk-T7ZB3XF7.cjs');
 
 
 
-var _chunkPYL3O7AFcjs = require('./chunk-PYL3O7AF.cjs');
+var _chunkDIMJISMHcjs = require('./chunk-DIMJISMH.cjs');
 
 
-var _chunkWTHHP7G2cjs = require('./chunk-WTHHP7G2.cjs');
+var _chunkWKRK5OVEcjs = require('./chunk-WKRK5OVE.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: ${_chunkDIMJISMHcjs.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: ${_chunkDIMJISMHcjs.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 = _chunkWKRK5OVEcjs.useThemeBg.call(void 0, );
   _react3.useEffect.call(void 0, () => {
     const documentHeight = () => {
       const doc = document.documentElement;