@lightsparkdev/ui 0.0.4 → 0.0.6

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @lightsparkdev/ui
 
+## 0.0.6
+
+### Patch Changes
+
+- 66e76d3: - Avoid requiring babel transform to process selectors - convert selectors to strings instead with new select util.
+  - withTheme util
+  - standardBorderRadius util
+  - Fix issue where ProgressBar state is not properly reset
+  - scroll-behavior: smooth applied globally
+- Updated dependencies [66e76d3]
+  - @lightsparkdev/core@1.0.15
+
+## 0.0.5
+
+### Patch Changes
+
+- Updated dependencies [b9dd0c2]
+  - @lightsparkdev/core@1.0.14
+
 ## 0.0.4
 
 ### Patch Changes

package/README.md

@@ -21,3 +21,5 @@ function App() {
   );
 }
 ```
+
+TODO

package/dist/{chunk-3PB5DNAL.js → chunk-23SR7TFO.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 
 // src/components/CurrencyAmount.tsx
 import { gql } from "@apollo/client";

package/dist/{chunk-VV7F7VVL.js → chunk-2WYVO6B2.js}

@@ -1,6 +1,6 @@
 import {
   GlobalStyles
-} from "./chunk-YHSFWCFN.js";
+} from "./chunk-T33SBHYI.js";
 import {
   themes
 } from "./chunk-2VBDEO6M.js";

package/dist/{chunk-PVUPVJ3F.js → chunk-3CZOYF3X.js}

@@ -1,6 +1,9 @@
 import {
   CopyToClipboardButton
-} from "./chunk-FRIQXHPR.js";
+} from "./chunk-WWFDI534.js";
+import {
+  standardBorderRadius
+} from "./chunk-RFGKH3R6.js";
 
 // src/components/SecretContainer.tsx
 import styled from "@emotion/styled";
@@ -24,7 +27,7 @@ function SecretContainer(props) {
 }
 var StyledSecretContainer = styled.div`
   background-color: ${({ theme, hasSecret, success }) => hasSecret ? success ? theme.success : theme.c05Neutral : theme.bg};
-  border-radius: 8px;
+  ${standardBorderRadius(8)}
   padding: 18px 20px;
   color: ${({ theme, success }) => success ? theme.hcNeutral : theme.text};
   border: solid 1px

package/dist/{chunk-4K2KAYVH.js → chunk-4TFRLWCC.js}

@@ -1,3 +1,6 @@
+import {
+  select
+} from "./chunk-YMNSXZ5D.js";
 import {
   colors
 } from "./chunk-2VBDEO6M.js";
@@ -73,7 +76,7 @@ var StyledHeadline = styled.span`
   }
 `;
 function headlineSelector(heading) {
-  return `${heading}${StyledHeadline.toString()}`;
+  return `${heading}${select(StyledHeadline)}`;
 }
 var ALL_HEADLINE_SELECTORS = HEADINGS.map(headlineSelector).join(",");
 

package/dist/{chunk-SUD5NOKE.js → chunk-FKETYVPP.js}

@@ -1,18 +1,21 @@
 import {
   Link
-} from "./chunk-6RXFA73Z.js";
+} from "./chunk-M56R3RJ7.js";
+import {
+  select
+} from "./chunk-YMNSXZ5D.js";
 import {
   Loading
-} from "./chunk-OLAFBUE5.js";
+} from "./chunk-NGS4OSWT.js";
 import {
   UnstyledButton
-} from "./chunk-DHNWT2E5.js";
+} from "./chunk-IQFU7CM5.js";
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 import {
   getFocusOutline
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 import {
   colors,
   themeOr
@@ -254,7 +257,9 @@ var ButtonLink = styled(Link)`
 var ButtonHrefLink = styled.a`
   ${(props) => buttonStyle(props)}
 `;
-var ButtonSelector = (prepend = "", append = "") => `${prepend}${StyledButton.toString()}${append}, ${prepend}${ButtonLink.toString()}${append}, ${prepend}${ButtonHrefLink.toString()}${append}`;
+var ButtonSelector = (prepend = "", append = "") => `${prepend}${select(StyledButton)}${append}, ${prepend}${select(
+  ButtonLink
+)}${append}, ${prepend}${select(ButtonHrefLink)}${append}`;
 
 export {
   Button,

package/dist/{chunk-6R6A5H4I.js → chunk-G2PZZFJL.js}

@@ -1,35 +1,42 @@
+import {
+  toReactNodes
+} from "./chunk-TAI352I3.js";
 import {
   useLiveRef
 } from "./chunk-NBCCPGA4.js";
 import {
   ProgressBar
-} from "./chunk-ZQTE53SK.js";
+} from "./chunk-RTUZVKPK.js";
 import {
   Button
-} from "./chunk-SUD5NOKE.js";
+} from "./chunk-FKETYVPP.js";
+import {
+  select
+} from "./chunk-YMNSXZ5D.js";
 import {
   overflowAutoWithoutScrollbars,
   pxToRems
-} from "./chunk-SV5QPU7N.js";
+} from "./chunk-UO6U7AYM.js";
 import {
   UnstyledButton
-} from "./chunk-DHNWT2E5.js";
+} from "./chunk-IQFU7CM5.js";
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 import {
   overlaySurface,
   smContentInset,
+  standardBorderRadius,
   standardContentInsetSmPx,
   standardFocusOutline
-} from "./chunk-XUGLVWSH.js";
-import {
-  z
-} from "./chunk-CLU2FRJZ.js";
+} from "./chunk-RFGKH3R6.js";
 import {
   bp,
   useBreakpoints
 } from "./chunk-JSGRNWSB.js";
+import {
+  z
+} from "./chunk-CLU2FRJZ.js";
 
 // src/components/Modal.tsx
 import styled from "@emotion/styled";
@@ -67,6 +74,7 @@ function Modal({
   const modalContainerRef = useRef(null);
   const bp2 = useBreakpoints();
   const isSm = bp2.current("sm" /* sm */);
+  const formattedDescription = description ? toReactNodes(description) : null;
   useEffect(() => {
     if (visible !== visibleChangedRef.current) {
       visibleChangedRef.current = visible;
@@ -175,7 +183,7 @@ function Modal({
               }
             ) }) : null,
             title ? /* @__PURE__ */ jsx("h4", { children: title }) : null,
-            description ? /* @__PURE__ */ jsx(Description, { children: description }) : null,
+            formattedDescription ? /* @__PURE__ */ jsx(Description, { children: formattedDescription }) : null,
             /* @__PURE__ */ jsx("div", { children }),
             onSubmit ? /* @__PURE__ */ jsxs(ModalButtonRow, { children: [
               !isSm && !cancelHidden && /* @__PURE__ */ jsx(
@@ -272,13 +280,13 @@ var ModalButtonRow = styled.div`
 var ModalContent = styled.div`
   ${overflowAutoWithoutScrollbars}
   ${smContentInset}
+  ${standardBorderRadius(16)}
   ${(props) => props.ghost ? "" : overlaySurface}
   pointer-events: auto;
   transition: width 0.25s ease-in;
   width: ${(props) => props.width}px;
   max-width: 100%;
   max-height: 100%;
-  border-radius: 16px;
   position: absolute;
   ${(props) => props.ghost ? "" : "padding: 16px 16px 40px;"}
 
@@ -286,7 +294,7 @@ var ModalContent = styled.div`
     margin: 0;
     font-weight: 800;
     font-size: ${pxToRems(21)};
-    & + *:not(${Description}) {
+    & + *:not(${select(Description)}) {
       margin-top: ${contentTopMarginPx}px;
     }
   }

package/dist/{chunk-WB6FFT7Y.js → chunk-I74XQIVV.js}

@@ -1,9 +1,12 @@
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-SV5QPU7N.js";
+} from "./chunk-UO6U7AYM.js";
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
+import {
+  standardBorderRadius
+} from "./chunk-RFGKH3R6.js";
 
 // src/components/Collapsible.tsx
 import styled from "@emotion/styled";
@@ -59,7 +62,7 @@ var StyledCollapsibleButton = styled.button`
   background: none;
   border: none;
   cursor: pointer;
-  border-radius: 8px;
+  ${standardBorderRadius(8)}
   padding: 0;
 `;
 var IconContainer = styled.div`

package/dist/{chunk-DHNWT2E5.js → chunk-IQFU7CM5.js}

@@ -1,6 +1,6 @@
 import {
   standardFocusOutline
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 
 // src/components/UnstyledButton.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-U6LQLAWI.js → chunk-JYWYEOM6.js}

@@ -1,12 +1,12 @@
 import {
   Button
-} from "./chunk-SUD5NOKE.js";
+} from "./chunk-FKETYVPP.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-SV5QPU7N.js";
+} from "./chunk-UO6U7AYM.js";
 import {
   standardContentInsetSmPx
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 import {
   bp
 } from "./chunk-JSGRNWSB.js";

package/dist/{chunk-EZ4RHFY7.js → chunk-K7D7A34K.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 
 // src/components/ContentTable.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-6RXFA73Z.js → chunk-M56R3RJ7.js}

@@ -120,6 +120,14 @@ function useCurrentRoute() {
   const location = useLocation();
   return location.pathname;
 }
+function getRouteName(path, routes) {
+  for (const routeName of Object.keys(routes)) {
+    if (matchPath(routes[routeName], path)) {
+      return routeName;
+    }
+  }
+  return null;
+}
 
 export {
   replaceParams,
@@ -129,5 +137,6 @@ export {
   useMatchRoutes,
   useFindMatchingRoute,
   useMatchRoute,
-  useCurrentRoute
+  useCurrentRoute,
+  getRouteName
 };

package/dist/{chunk-WEPQ7LRL.js → chunk-N2RDQJQ5.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 
 // src/components/TextIconAligner.tsx
 import { jsx, jsxs } from "@emotion/react/jsx-runtime";

package/dist/{chunk-OLAFBUE5.js → chunk-NGS4OSWT.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 
 // src/components/Loading.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-ANJDI74G.js → chunk-NH25O7PC.js}

@@ -1,9 +1,12 @@
 import {
   Headline
-} from "./chunk-4K2KAYVH.js";
+} from "./chunk-4TFRLWCC.js";
+import {
+  select
+} from "./chunk-YMNSXZ5D.js";
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 import {
   __spreadProps,
   __spreadValues
@@ -50,7 +53,7 @@ var StyledAnchorLinkHeader = styled.div`
     padding-right: 24px;
   }
 
-  &:hover ${IconWrapper} {
+  &:hover ${select(IconWrapper)} {
     opacity: 1;
     transform: translateX(0px);
   }

package/dist/{chunk-MYG24ZWT.js → chunk-NZJCJJH5.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-LAMQKQU3.js";
 import {
   rootFontSizePx
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 import {
   __async
 } from "./chunk-CIGAQ47A.js";

package/dist/{chunk-SW6ZA7W2.js → chunk-QGGOMPHZ.js}

@@ -1,3 +1,6 @@
+import {
+  select
+} from "./chunk-YMNSXZ5D.js";
 import {
   colors
 } from "./chunk-2VBDEO6M.js";
@@ -24,7 +27,7 @@ var StyledDisplay = styled.span`
 }}
 `;
 function displaySelector(element) {
-  return `${element}${StyledDisplay.toString()}`;
+  return `${element}${select(StyledDisplay)}`;
 }
 
 export {

package/dist/{chunk-XUGLVWSH.js → chunk-RFGKH3R6.js}

@@ -1,6 +1,3 @@
-import {
-  z
-} from "./chunk-CLU2FRJZ.js";
 import {
   colors,
   darkGradient,
@@ -9,6 +6,9 @@ import {
 import {
   bp
 } from "./chunk-JSGRNWSB.js";
+import {
+  z
+} from "./chunk-CLU2FRJZ.js";
 
 // src/styles/common.tsx
 import { css } from "@emotion/react";
@@ -22,6 +22,12 @@ var standardContentInsetPx = 32;
 var standardContentInsetMdPx = 24;
 var standardContentInsetSmPx = 16;
 var cardBorderRadiusPx = 16;
+var standardBorderRadius = (radius) => {
+  const borderRadiusPx = Array.isArray(radius) ? radius.map((r) => `${r}px`).join(" ") : `${radius}px`;
+  return `
+    border-radius: ${borderRadiusPx};
+  `;
+};
 var smContentInset = css`
   ${bp.sm(`
     margin-left: auto;
@@ -88,11 +94,23 @@ var darkGradientBg = css`
 var StyledTooltip = styled(Tooltip)`
   z-index: ${z.modalOverlay};
 `;
-var overlaySurface = ({ theme }) => css`
-  background-color: ${themeOr(colors.white, theme.c1Neutral)({ theme })};
-  border: 0.5px solid ${themeOr(theme.c1Neutral, theme.c3Neutral)({ theme })};
+var overlaySurfaceBorderColor = ({
+  theme,
+  important = false
+}) => css`
+  border-color: ${themeOr(theme.c1Neutral, theme.c3Neutral)({ theme })}
+    ${important ? "!important" : ""};
+`;
+var overlaySurface = ({
+  theme,
+  important = false
+}) => css`
+  background-color: ${themeOr(colors.white, theme.c1Neutral)({ theme })}
+    ${important ? "!important" : ""};
+  border: 0.5px solid ${important ? "!important" : ""};
+  ${overlaySurfaceBorderColor({ theme, important })};
   ${themeOr(
-  "box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 1px 4px rgba(0, 0, 0, 0.1);",
+  `box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 1px 4px rgba(0, 0, 0, 0.1) ${important ? "!important" : ""};`,
   ""
 )({ theme })}
 `;
@@ -111,6 +129,7 @@ export {
   standardContentInsetMdPx,
   standardContentInsetSmPx,
   cardBorderRadiusPx,
+  standardBorderRadius,
   smContentInset,
   minSmMaxLgContentInset,
   standardContentInset,
@@ -125,6 +144,7 @@ export {
   Subtext,
   darkGradientBg,
   StyledTooltip,
+  overlaySurfaceBorderColor,
   overlaySurface,
   mcBold,
   mcBoldStyled

package/dist/{chunk-ZQTE53SK.js → chunk-RTUZVKPK.js}

@@ -1,3 +1,6 @@
+import {
+  standardBorderRadius
+} from "./chunk-RFGKH3R6.js";
 import {
   themeOr
 } from "./chunk-2VBDEO6M.js";
@@ -17,14 +20,13 @@ function ProgressBar({
   stepDuration = defaultProps.stepDuration
 }) {
   const [percentage, setPercentage] = useState(5);
-  if (progressPercentage === void 0) {
-    setTimeout(() => {
-      setPercentage(100);
-    }, 0);
-  }
   useEffect(() => {
     if (progressPercentage !== void 0) {
       setPercentage(progressPercentage);
+    } else {
+      setTimeout(() => {
+        setPercentage(100);
+      }, 0);
     }
   }, [progressPercentage]);
   return /* @__PURE__ */ jsx(ProgressBarContainer, { isSm, children: /* @__PURE__ */ jsx(Bar, { isSm, percentage, stepDuration, children: /* @__PURE__ */ jsx(
@@ -39,8 +41,8 @@ function ProgressBar({
 }
 ProgressBar.defaultProps = defaultProps;
 var ProgressBarContainer = styled.div`
+  ${standardBorderRadius(16)}
   background-color: ${({ theme }) => themeOr(theme.c05Neutral, theme.c1Neutral)({ theme })};
-  border-radius: 16px;
   box-sizing: border-box;
   display: flex;
   height: ${({ isSm }) => isSm ? "6px" : "16px"};
@@ -49,7 +51,7 @@ var ProgressBarContainer = styled.div`
   position: relative;
 `;
 var BarBg = styled.div`
-  border-radius: 16px;
+  ${standardBorderRadius(16)}
   width: ${({ percentage }) => 100 / percentage * 100}%;
   height: 100%;
 
@@ -63,8 +65,8 @@ var BarBg = styled.div`
   )`};
 `;
 var Bar = styled.div`
+  ${standardBorderRadius(16)}
   overflow: hidden;
-  border-radius: ${({ isSm }) => isSm ? "6px" : "16px"};
   box-sizing: border-box;
   display: inline-block;
   height: ${({ isSm }) => isSm ? "6px" : "16px"};

package/dist/{chunk-YHSFWCFN.js → chunk-T33SBHYI.js}

@@ -4,7 +4,7 @@ import {
 import {
   rootFontSizeRems,
   standardLineHeightEms
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 import {
   useThemeBg
 } from "./chunk-2VBDEO6M.js";
@@ -28,6 +28,7 @@ var globalComponentStyles = ({ theme }) => css`
     /* required for iOS https://bit.ly/3Q8syG8 */
     -webkit-text-size-adjust: none;
     text-size-adjust: none;
+    scroll-behavior: smooth;
   }
 
   body {
@@ -108,7 +109,7 @@ function GlobalStyles() {
 
     :root {
       ${cssVars.docHeight}: 100vh;
-      --rt-opacity: 1;
+      --rt-opacity: 1 !important;
     }
 
     html {

package/dist/chunk-TAI352I3.js

@@ -0,0 +1,30 @@
+import {
+  Link
+} from "./chunk-M56R3RJ7.js";
+
+// src/utils/toReactNodes.tsx
+import { Fragment } from "react";
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+var ToReactNodesTypes = {
+  Link: "link"
+};
+function toReactNodes(toReactNodesArg) {
+  const toReactNodesArray = Array.isArray(toReactNodesArg) ? toReactNodesArg : [toReactNodesArg];
+  const reactNodes = toReactNodesArray.map((node, i) => {
+    if (typeof node === "string") {
+      return /* @__PURE__ */ jsx(Fragment, { children: node.split("\n").map((str, j, strArr) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        str,
+        j < strArr.length - 1 && /* @__PURE__ */ jsx("br", {})
+      ] }, `str-${i}-break-${j}`)) }, `str-${i}`);
+    } else if (node.type === ToReactNodesTypes.Link) {
+      return /* @__PURE__ */ jsx(Link, { to: node.to, children: node.text }, `link-${i}`);
+    }
+    return null;
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: reactNodes });
+}
+
+export {
+  ToReactNodesTypes,
+  toReactNodes
+};

package/dist/{chunk-SV5QPU7N.js → chunk-UO6U7AYM.js}

@@ -1,6 +1,6 @@
 import {
   rootFontSizePx
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 
 // src/styles/utils.tsx
 import { css } from "@emotion/react";

package/dist/{chunk-4ZZHBSW4.js → chunk-VBWTKANQ.js}

@@ -9,17 +9,23 @@ import {
 } from "./chunk-BCFRW7CV.js";
 import {
   displaySelector
-} from "./chunk-SW6ZA7W2.js";
+} from "./chunk-QGGOMPHZ.js";
 import {
   ALL_HEADLINE_SELECTORS,
   headlineSelector
-} from "./chunk-4K2KAYVH.js";
+} from "./chunk-4TFRLWCC.js";
+import {
+  select
+} from "./chunk-YMNSXZ5D.js";
 import {
   overflowAutoWithoutScrollbars
-} from "./chunk-SV5QPU7N.js";
+} from "./chunk-UO6U7AYM.js";
 import {
   StyledContentTable
-} from "./chunk-EZ4RHFY7.js";
+} from "./chunk-K7D7A34K.js";
+import {
+  standardBorderRadius
+} from "./chunk-RFGKH3R6.js";
 import {
   colors
 } from "./chunk-2VBDEO6M.js";
@@ -69,12 +75,12 @@ var Article = styled.article`
     margin: 0;
   }
 
-  ${StyledBody} {
+  ${select(StyledBody)} {
     margin-top: ${"8px" /* xs */};
     margin-bottom: ${"8px" /* xs */};
   }
 
-  ${StyledContentTable} {
+  ${select(StyledContentTable)} {
     margin: ${"40px" /* 2xl */} 0;
   }
 
@@ -87,7 +93,8 @@ var Article = styled.article`
     font-weight: 700;
   }
 
-  *:not(${ALL_HEADLINE_SELECTORS},${StyledTitle},${StyledCode}) > a {
+  *:not(${ALL_HEADLINE_SELECTORS},${select(StyledTitle)},${select(StyledCode)})
+    > a {
     ${({ theme }) => getTypographyString(
   theme.typography[theme.app]["Label Strong"]["Large" /* Large */]
 )}
@@ -121,7 +128,7 @@ var Article = styled.article`
   }
 
   pre[class|="language"] {
-    border-radius: 8px;
+    ${standardBorderRadius(8)}
     width: 100%;
     padding: ${"16px" /* md */} ${"24px" /* lg */};
     margin: ${"16px" /* md */} 0;

package/dist/{chunk-FRIQXHPR.js → chunk-WWFDI534.js}

@@ -1,12 +1,12 @@
 import {
   UnstyledButton
-} from "./chunk-DHNWT2E5.js";
+} from "./chunk-IQFU7CM5.js";
 import {
   Icon
-} from "./chunk-MYG24ZWT.js";
+} from "./chunk-NZJCJJH5.js";
 import {
   StyledTooltip
-} from "./chunk-XUGLVWSH.js";
+} from "./chunk-RFGKH3R6.js";
 import {
   __async
 } from "./chunk-CIGAQ47A.js";

package/dist/chunk-YMNSXZ5D.js

@@ -0,0 +1,8 @@
+// src/utils/emotion.tsx
+function select(component) {
+  return component.toString();
+}
+
+export {
+  select
+};

package/dist/components/Button.cjs

@@ -1454,6 +1454,11 @@ var StyledTooltip = (0, import_styled.default)(import_react_tooltip.Tooltip)`
   z-index: ${z.modalOverlay};
 `;
 
+// src/utils/emotion.tsx
+function select(component) {
+  return component.toString();
+}
+
 // src/components/Icon.tsx
 var import_styled2 = __toESM(require("@emotion/styled"), 1);
 var import_react6 = require("react");
@@ -1829,7 +1834,9 @@ var ButtonLink = (0, import_styled5.default)(Link)`
 var ButtonHrefLink = import_styled5.default.a`
   ${(props) => buttonStyle(props)}
 `;
-var ButtonSelector = (prepend = "", append = "") => `${prepend}${StyledButton.toString()}${append}, ${prepend}${ButtonLink.toString()}${append}, ${prepend}${ButtonHrefLink.toString()}${append}`;
+var ButtonSelector = (prepend = "", append = "") => `${prepend}${select(StyledButton)}${append}, ${prepend}${select(
+  ButtonLink
+)}${append}, ${prepend}${select(ButtonHrefLink)}${append}`;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Button,