@daimo/pay 1.18.3 → 1.19.0

package/build/connectkit/src/components/Common/CopyToClipboard/CopyToClipboardIcon.js

@@ -0,0 +1,78 @@
+import { jsx } from 'react/jsx-runtime';
+import { motion } from 'framer-motion';
+import { css } from 'styled-components';
+import styled from '../../../styles/styled/index.js';
+import { CopyToClipboardIcon as CopyToClipboardIcon$1 } from '../../../assets/icons.js';
+
+const IconContainer = styled(motion.div)`
+  transition: all 220ms cubic-bezier(0.175, 0.885, 0.32, 1.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  svg {
+    display: block;
+  }
+  svg,
+  svg path,
+  svg rect {
+    transition: inherit;
+  }
+  svg path:first-child {
+    transform-origin: 50% 50%;
+    fill: var(--bg);
+    stroke: var(--color);
+  }
+  svg rect {
+    transform-origin: 53% 63%;
+    fill: var(--bg);
+    stroke: var(--color);
+  }
+  svg path:last-child {
+    opacity: 0;
+    stroke: var(--bg);
+    transform: translate(11.75px, 10px) rotate(90deg) scale(0.6);
+  }
+  ${(props) => props.$clipboard ? css`
+          --color: var(--ck-focus-color) !important;
+          --bg: var(--ck-body-background);
+          svg {
+            transition-delay: 0ms;
+            path:first-child {
+              opacity: 0;
+              transform: rotate(-90deg) scale(0.2);
+            }
+            rect {
+              rx: 10px;
+              fill: var(--color);
+              transform: rotate(-90deg) scale(1.45);
+            }
+            path:last-child {
+              transition-delay: 100ms;
+              opacity: 1;
+              transform: translate(7.75px, 9.5px);
+            }
+          }
+        ` : css`
+          &:hover {
+          }
+          &:hover:active {
+          }
+        `}
+`;
+const CopyToClipboardIcon = ({
+  copied,
+  small,
+  dark
+}) => /* @__PURE__ */ jsx(IconContainer, { $clipboard: copied, children: /* @__PURE__ */ jsx(
+  CopyToClipboardIcon$1,
+  {
+    style: {
+      transform: small ? "scale(1)" : "translateX(3px) scale(1.5)",
+      opacity: small || copied || dark ? 1 : 0.3
+    }
+  }
+) });
+
+export { CopyToClipboardIcon as default };
+//# sourceMappingURL=CopyToClipboardIcon.js.map

package/build/connectkit/src/components/Common/CopyToClipboard/CopyToClipboardIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyToClipboardIcon.js","sources":["../../../../../../src/components/Common/CopyToClipboard/CopyToClipboardIcon.tsx"],"sourcesContent":["import { motion } from \"framer-motion\";\nimport { css } from \"styled-components\";\nimport styled from \"./../../../styles/styled\";\n\nimport { CopyToClipboardIcon as Icon } from \"../../../assets/icons\";\n\nconst IconContainer = styled(motion.div)<{ $clipboard?: boolean }>`\n  transition: all 220ms cubic-bezier(0.175, 0.885, 0.32, 1.1);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  svg {\n    display: block;\n  }\n  svg,\n  svg path,\n  svg rect {\n    transition: inherit;\n  }\n  svg path:first-child {\n    transform-origin: 50% 50%;\n    fill: var(--bg);\n    stroke: var(--color);\n  }\n  svg rect {\n    transform-origin: 53% 63%;\n    fill: var(--bg);\n    stroke: var(--color);\n  }\n  svg path:last-child {\n    opacity: 0;\n    stroke: var(--bg);\n    transform: translate(11.75px, 10px) rotate(90deg) scale(0.6);\n  }\n  ${(props) =>\n    props.$clipboard\n      ? css`\n          --color: var(--ck-focus-color) !important;\n          --bg: var(--ck-body-background);\n          svg {\n            transition-delay: 0ms;\n            path:first-child {\n              opacity: 0;\n              transform: rotate(-90deg) scale(0.2);\n            }\n            rect {\n              rx: 10px;\n              fill: var(--color);\n              transform: rotate(-90deg) scale(1.45);\n            }\n            path:last-child {\n              transition-delay: 100ms;\n              opacity: 1;\n              transform: translate(7.75px, 9.5px);\n            }\n          }\n        `\n      : css`\n          &:hover {\n          }\n          &:hover:active {\n          }\n        `}\n`;\n\nconst CopyToClipboardIcon = ({\n  copied,\n  small,\n  dark,\n}: {\n  copied?: boolean;\n  small?: boolean;\n  dark?: boolean;\n}) => (\n  <IconContainer $clipboard={copied}>\n    <Icon\n      style={{\n        transform: small ? \"scale(1)\" : \"translateX(3px) scale(1.5)\",\n        opacity: small || copied || dark ? 1 : 0.3,\n      }}\n    />\n  </IconContainer>\n);\nexport default CopyToClipboardIcon;\n"],"names":["Icon"],"mappings":";;;;;;AAMA,MAAM,aAAA,GAAgB,MAAO,CAAA,MAAA,CAAO,GAAG,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA6BnC,EAAA,CAAC,KACD,KAAA,KAAA,CAAM,UACF,GAAA,GAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAqBA,CAAA,GAAA,GAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAKC,CAAA,CAAA;AAAA,CAAA,CAAA;AAGT,MAAM,sBAAsB,CAAC;AAAA,EAC3B,MAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AACF,CAKE,qBAAA,GAAA,CAAC,aAAc,EAAA,EAAA,UAAA,EAAY,MACzB,EAAA,QAAA,kBAAA,GAAA;AAAA,EAACA,qBAAA;AAAA,EAAA;AAAA,IACC,KAAO,EAAA;AAAA,MACL,SAAA,EAAW,QAAQ,UAAa,GAAA,4BAAA;AAAA,MAChC,OAAS,EAAA,KAAA,IAAS,MAAU,IAAA,IAAA,GAAO,CAAI,GAAA,GAAA;AAAA,KACzC;AAAA,GAAA;AACF,CACF,EAAA;;;;"}

package/build/connectkit/src/components/Common/CopyToClipboard/index.js

@@ -0,0 +1,33 @@
+import 'react/jsx-runtime';
+import 'react';
+import { css } from 'styled-components';
+import styled from '../../../styles/styled/index.js';
+import 'framer-motion';
+import 'detect-browser';
+import '../FitText/index.js';
+import '../Spinner/styles.js';
+import '../Button/styles.js';
+import './CopyToClipboardIcon.js';
+
+styled.div`
+  --color: var(--ck-copytoclipboard-stroke);
+  --bg: var(--ck-body-background);
+  transition: all 220ms cubic-bezier(0.175, 0.885, 0.32, 1.1);
+
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 4px;
+  gap: 8px;
+
+  ${(props) => props.$disabled ? css`
+          cursor: not-allowed;
+          opacity: 0.4;
+        ` : css`
+          &:hover {
+            --color: var(--ck-body-color-muted);
+          }
+        `}
+`;
+//# sourceMappingURL=index.js.map

package/build/connectkit/src/components/Common/CopyToClipboard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/Common/CopyToClipboard/index.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { css } from \"styled-components\";\nimport styled from \"./../../../styles/styled\";\n\nimport Button from \"../Button\";\nimport CopyToClipboardIcon from \"./CopyToClipboardIcon\";\n\nconst Container = styled.div<{ $disabled?: boolean }>`\n  --color: var(--ck-copytoclipboard-stroke);\n  --bg: var(--ck-body-background);\n  transition: all 220ms cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-top: 4px;\n  gap: 8px;\n\n  ${(props) =>\n    props.$disabled\n      ? css`\n          cursor: not-allowed;\n          opacity: 0.4;\n        `\n      : css`\n          &:hover {\n            --color: var(--ck-body-color-muted);\n          }\n        `}\n`;\n\nconst CopyToClipboard: React.FC<{\n  string?: string;\n  children?: React.ReactNode;\n  variant?: \"button\" | \"left\";\n}> = ({ string, children, variant }) => {\n  const [clipboard, setClipboard] = useState(false);\n\n  let timeout: any;\n  const onCopy = () => {\n    if (!string) return;\n    const str = string.trim();\n    if (navigator.clipboard) {\n      navigator.clipboard.writeText(str);\n    } else {\n      // Fallback copy to clipboard if necessary\n      /*\n      const el = document.createElement('textarea');\n      el.value = str;\n      document.body.appendChild(el);\n      el.select();\n      document.execCommand('copy');\n      document.body.removeChild(el);\n      */\n    }\n    setClipboard(true);\n    clearTimeout(timeout);\n    timeout = setTimeout(() => setClipboard(false), 1000);\n  };\n\n  if (variant === \"button\")\n    return (\n      <Button\n        disabled={!string}\n        onClick={onCopy}\n        icon={<CopyToClipboardIcon copied={clipboard} />}\n      >\n        {children}\n      </Button>\n    );\n\n  return (\n    <Container onClick={onCopy} $disabled={!string}>\n      <CopyToClipboardIcon copied={clipboard} dark />\n      {children}\n    </Container>\n  );\n};\n\nexport default CopyToClipboard;\n"],"names":[],"mappings":";;;;;;;;;;;AAOkB,MAAO,CAAA,GAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYrB,EAAA,CAAC,KACD,KAAA,KAAA,CAAM,SACF,GAAA,GAAA,CAAA;AAAA;AAAA;AAAA,QAIA,CAAA,GAAA,GAAA,CAAA;AAAA;AAAA;AAAA;AAAA,QAIC,CAAA,CAAA;AAAA"}

package/build/connectkit/src/components/Common/CustomQRCode/QRCode.js

@@ -0,0 +1,128 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import QRCodeUtil from 'qrcode';
+import { useMemo } from 'react';
+
+function generateMatrix(value, errorCorrectionLevel) {
+  const arr = Array.prototype.slice.call(
+    QRCodeUtil.create(value, { errorCorrectionLevel }).modules.data,
+    0
+  );
+  const sqrt = Math.sqrt(arr.length);
+  return arr.reduce(
+    (rows, key, index) => (index % sqrt === 0 ? rows.push([key]) : rows[rows.length - 1].push(key)) && rows,
+    []
+  );
+}
+function QRCode({
+  ecl = "M",
+  size: sizeProp = 200,
+  uri,
+  image,
+  imageBackground = "transparent"
+}) {
+  const size = sizeProp - 10 * 2;
+  const dots = useMemo(() => {
+    const dots2 = [];
+    const matrix = generateMatrix(uri, ecl);
+    const cellSize = size / matrix.length;
+    let qrList = [
+      { x: 0, y: 0 },
+      { x: 1, y: 0 },
+      { x: 0, y: 1 }
+    ];
+    qrList.forEach(({ x, y }) => {
+      const x1 = (matrix.length - 7) * cellSize * x;
+      const y1 = (matrix.length - 7) * cellSize * y;
+      for (let i = 0; i < 3; i++) {
+        dots2.push(
+          /* @__PURE__ */ jsx(
+            "rect",
+            {
+              fill: i % 2 !== 0 ? "var(--ck-qr-background, var(--ck-body-background))" : "var(--ck-qr-dot-color)",
+              rx: (i - 2) * -5 + (i === 0 ? 2 : 3),
+              ry: (i - 2) * -5 + (i === 0 ? 2 : 3),
+              width: cellSize * (7 - i * 2),
+              height: cellSize * (7 - i * 2),
+              x: x1 + cellSize * i,
+              y: y1 + cellSize * i
+            },
+            `${i}-${x}-${y}`
+          )
+        );
+      }
+    });
+    if (image) {
+      const x1 = (matrix.length - 7) * cellSize * 1;
+      const y1 = (matrix.length - 7) * cellSize * 1;
+      dots2.push(
+        /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "rect",
+            {
+              fill: imageBackground,
+              rx: (0 - 2) * -5 + 2,
+              ry: (0 - 2) * -5 + 2,
+              width: cellSize * (7 - 0 * 2),
+              height: cellSize * (7 - 0 * 2),
+              x: x1 + cellSize * 0,
+              y: y1 + cellSize * 0
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "foreignObject",
+            {
+              width: cellSize * (7 - 0 * 2),
+              height: cellSize * (7 - 0 * 2),
+              x: x1 + cellSize * 0,
+              y: y1 + cellSize * 0,
+              children: /* @__PURE__ */ jsx("div", { style: { borderRadius: (0 - 2) * -5 + 2, overflow: "hidden" }, children: image })
+            }
+          )
+        ] })
+      );
+    }
+    const clearR = matrix.length * 0.3;
+    matrix.forEach((row, i) => {
+      row.forEach((_, j) => {
+        if (!matrix[i][j]) return;
+        if (i < 7 && j < 7 || i > matrix.length - 8 && j < 7 || i < 7 && j > matrix.length - 8)
+          return;
+        const id = i - matrix.length / 2 + 0.5;
+        const jd = j - matrix.length / 2 + 0.5;
+        if (id * id + jd * jd < clearR * clearR / 4) return;
+        dots2.push(
+          /* @__PURE__ */ jsx(
+            "circle",
+            {
+              cx: i * cellSize + cellSize / 2,
+              cy: j * cellSize + cellSize / 2,
+              fill: "var(--ck-qr-dot-color)",
+              r: cellSize / 3
+            },
+            `circle-${i}-${j}`
+          )
+        );
+      });
+    });
+    return dots2;
+  }, [ecl, size, uri]);
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      height: size,
+      width: size,
+      viewBox: `0 0 ${size} ${size}`,
+      style: {
+        width: size,
+        height: size
+      },
+      children: [
+        /* @__PURE__ */ jsx("rect", { fill: "transparent", height: size, width: size }),
+        dots
+      ]
+    }
+  );
+}
+
+export { QRCode };
+//# sourceMappingURL=QRCode.js.map

package/build/connectkit/src/components/Common/CustomQRCode/QRCode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QRCode.js","sources":["../../../../../../src/components/Common/CustomQRCode/QRCode.tsx"],"sourcesContent":["import QRCodeUtil from \"qrcode\";\nimport React, { ReactElement, useMemo } from \"react\";\n\nfunction generateMatrix(\n  value: string,\n  errorCorrectionLevel: QRCodeUtil.QRCodeErrorCorrectionLevel,\n): QRCodeUtil.QRCode[][] {\n  const arr = Array.prototype.slice.call(\n    QRCodeUtil.create(value, { errorCorrectionLevel }).modules.data,\n    0,\n  );\n  const sqrt = Math.sqrt(arr.length);\n  return arr.reduce(\n    (rows, key, index) =>\n      (index % sqrt === 0\n        ? rows.push([key])\n        : rows[rows.length - 1].push(key)) && rows,\n    [],\n  );\n}\n\ntype Props = {\n  ecl?: QRCodeUtil.QRCodeErrorCorrectionLevel;\n  size?: number;\n  uri: string;\n  image?: React.ReactNode;\n  imageBackground?: string;\n};\n\nexport function QRCode({\n  ecl = \"M\",\n  size: sizeProp = 200,\n  uri,\n  image,\n  imageBackground = \"transparent\",\n}: Props) {\n  const size = sizeProp - 10 * 2;\n\n  const dots = useMemo(() => {\n    const dots: ReactElement[] = [];\n    const matrix = generateMatrix(uri, ecl);\n    const cellSize = size / matrix.length;\n    let qrList = [\n      { x: 0, y: 0 },\n      { x: 1, y: 0 },\n      { x: 0, y: 1 },\n    ];\n\n    qrList.forEach(({ x, y }) => {\n      const x1 = (matrix.length - 7) * cellSize * x;\n      const y1 = (matrix.length - 7) * cellSize * y;\n      for (let i = 0; i < 3; i++) {\n        dots.push(\n          <rect\n            key={`${i}-${x}-${y}`}\n            fill={\n              i % 2 !== 0\n                ? \"var(--ck-qr-background, var(--ck-body-background))\"\n                : \"var(--ck-qr-dot-color)\"\n            }\n            rx={(i - 2) * -5 + (i === 0 ? 2 : 3)}\n            ry={(i - 2) * -5 + (i === 0 ? 2 : 3)}\n            width={cellSize * (7 - i * 2)}\n            height={cellSize * (7 - i * 2)}\n            x={x1 + cellSize * i}\n            y={y1 + cellSize * i}\n          />,\n        );\n      }\n    });\n\n    if (image) {\n      const x1 = (matrix.length - 7) * cellSize * 1;\n      const y1 = (matrix.length - 7) * cellSize * 1;\n      dots.push(\n        <>\n          <rect\n            fill={imageBackground}\n            rx={(0 - 2) * -5 + 2}\n            ry={(0 - 2) * -5 + 2}\n            width={cellSize * (7 - 0 * 2)}\n            height={cellSize * (7 - 0 * 2)}\n            x={x1 + cellSize * 0}\n            y={y1 + cellSize * 0}\n          />\n          <foreignObject\n            width={cellSize * (7 - 0 * 2)}\n            height={cellSize * (7 - 0 * 2)}\n            x={x1 + cellSize * 0}\n            y={y1 + cellSize * 0}\n          >\n            <div style={{ borderRadius: (0 - 2) * -5 + 2, overflow: \"hidden\" }}>\n              {image}\n            </div>\n          </foreignObject>\n        </>,\n      );\n    }\n\n    const clearR = matrix.length * 0.3;\n\n    matrix.forEach((row: QRCodeUtil.QRCode[], i: number) => {\n      row.forEach((_: any, j: number) => {\n        // Skip if not a dot.\n        if (!matrix[i][j]) return;\n\n        // Do not render dots under position squares\n        if (\n          (i < 7 && j < 7) ||\n          (i > matrix.length - 8 && j < 7) ||\n          (i < 7 && j > matrix.length - 8)\n        )\n          return;\n\n        // // Keep a circle around the logo clear.\n        const id = i - matrix.length / 2 + 0.5;\n        const jd = j - matrix.length / 2 + 0.5;\n        if (id * id + jd * jd < (clearR * clearR) / 4) return;\n\n        dots.push(\n          <circle\n            key={`circle-${i}-${j}`}\n            cx={i * cellSize + cellSize / 2}\n            cy={j * cellSize + cellSize / 2}\n            fill=\"var(--ck-qr-dot-color)\"\n            r={cellSize / 3}\n          />,\n        );\n      });\n    });\n\n    return dots;\n  }, [ecl, size, uri]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <svg\n      height={size}\n      width={size}\n      viewBox={`0 0 ${size} ${size}`}\n      style={{\n        width: size,\n        height: size,\n      }}\n    >\n      <rect fill=\"transparent\" height={size} width={size} />\n      {dots}\n    </svg>\n  );\n}\n"],"names":["dots"],"mappings":"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"}

package/build/connectkit/src/components/Common/CustomQRCode/index.js

@@ -0,0 +1,71 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { QRCodeContainer, QRCodeContent, LogoContainer, LogoIcon, QRPlaceholder } from './styles.js';
+import { AnimatePresence, motion } from 'framer-motion';
+import Tooltip from '../Tooltip/index.js';
+import useWindowSize from '../../../hooks/useWindowSize.js';
+import { QRCode } from './QRCode.js';
+
+function CustomQRCode({
+  value,
+  image,
+  imageBackground,
+  imagePosition = "center",
+  tooltipMessage,
+  contentPadding = 13
+}) {
+  const windowSize = useWindowSize();
+  const Logo = windowSize.width > 920 && tooltipMessage ? /* @__PURE__ */ jsx(Tooltip, { xOffset: 139, yOffset: 5, delay: 0.1, message: tooltipMessage, children: image }) : image;
+  return /* @__PURE__ */ jsx(QRCodeContainer, { children: /* @__PURE__ */ jsxs(QRCodeContent, { style: { inset: contentPadding }, children: [
+    image && /* @__PURE__ */ jsx(LogoContainer, { children: /* @__PURE__ */ jsx(
+      LogoIcon,
+      {
+        style: {
+          background: imagePosition === "center" ? imageBackground : void 0
+        },
+        children: Logo
+      }
+    ) }),
+    /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: value ? /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0, position: "absolute", inset: [0, 0] },
+        transition: {
+          duration: 0.2
+        },
+        children: /* @__PURE__ */ jsx(
+          QRCode,
+          {
+            uri: value,
+            size: 576,
+            ecl: value?.length > 200 ? "L" : "H",
+            image: imagePosition === "bottom right" ? image : void 0,
+            imageBackground
+          }
+        )
+      },
+      value
+    ) : /* @__PURE__ */ jsxs(
+      QRPlaceholder,
+      {
+        initial: { opacity: 0.1 },
+        animate: { opacity: 0.1 },
+        exit: { opacity: 0, position: "absolute", inset: [0, 0] },
+        transition: {
+          duration: 0.2
+        },
+        children: [
+          /* @__PURE__ */ jsx("span", {}),
+          /* @__PURE__ */ jsx("span", {}),
+          /* @__PURE__ */ jsx("span", {}),
+          /* @__PURE__ */ jsx("div", {})
+        ]
+      }
+    ) })
+  ] }) });
+}
+CustomQRCode.displayName = "CustomQRCode";
+
+export { CustomQRCode as default };
+//# sourceMappingURL=index.js.map

package/build/connectkit/src/components/Common/CustomQRCode/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/Common/CustomQRCode/index.tsx"],"sourcesContent":["import {\n  LogoContainer,\n  LogoIcon,\n  QRCodeContainer,\n  QRCodeContent,\n  QRPlaceholder,\n} from \"./styles\";\nimport { CustomQRCodeProps } from \"./types\";\n\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport Tooltip from \"../Tooltip\";\n\nimport useWindowSize from \"../../../hooks/useWindowSize\";\nimport { QRCode } from \"./QRCode\";\n\nfunction CustomQRCode({\n  value,\n  image,\n  imageBackground,\n  imagePosition = \"center\",\n  tooltipMessage,\n  contentPadding = 13,\n}: CustomQRCodeProps) {\n  const windowSize = useWindowSize();\n\n  const Logo =\n    windowSize.width > 920 && tooltipMessage ? (\n      <Tooltip xOffset={139} yOffset={5} delay={0.1} message={tooltipMessage}>\n        {image}\n      </Tooltip>\n    ) : (\n      image\n    );\n\n  return (\n    <QRCodeContainer>\n      <QRCodeContent style={{ inset: contentPadding }}>\n        {image && (\n          <LogoContainer>\n            <LogoIcon\n              style={{\n                background:\n                  imagePosition === \"center\" ? imageBackground : undefined,\n              }}\n            >\n              {Logo}\n            </LogoIcon>\n          </LogoContainer>\n        )}\n\n        <AnimatePresence initial={false}>\n          {value ? (\n            <motion.div\n              key={value}\n              initial={{ opacity: 0 }}\n              animate={{ opacity: 1 }}\n              exit={{ opacity: 0, position: \"absolute\", inset: [0, 0] }}\n              transition={{\n                duration: 0.2,\n              }}\n            >\n              <QRCode\n                uri={value}\n                size={576}\n                ecl={value?.length > 200 ? \"L\" : \"H\"}\n                image={imagePosition === \"bottom right\" ? image : undefined}\n                imageBackground={imageBackground}\n              />\n            </motion.div>\n          ) : (\n            <QRPlaceholder\n              initial={{ opacity: 0.1 }}\n              animate={{ opacity: 0.1 }}\n              exit={{ opacity: 0, position: \"absolute\", inset: [0, 0] }}\n              transition={{\n                duration: 0.2,\n              }}\n            >\n              <span />\n              <span />\n              <span />\n              <div />\n            </QRPlaceholder>\n          )}\n        </AnimatePresence>\n      </QRCodeContent>\n    </QRCodeContainer>\n  );\n}\nCustomQRCode.displayName = \"CustomQRCode\";\n\nexport default CustomQRCode;\n"],"names":[],"mappings":";;;;;;;AAeA,SAAS,YAAa,CAAA;AAAA,EACpB,KAAA;AAAA,EACA,KAAA;AAAA,EACA,eAAA;AAAA,EACA,aAAgB,GAAA,QAAA;AAAA,EAChB,cAAA;AAAA,EACA,cAAiB,GAAA,EAAA;AACnB,CAAsB,EAAA;AACpB,EAAA,MAAM,aAAa,aAAc,EAAA,CAAA;AAEjC,EAAA,MAAM,OACJ,UAAW,CAAA,KAAA,GAAQ,GAAO,IAAA,cAAA,uBACvB,OAAQ,EAAA,EAAA,OAAA,EAAS,GAAK,EAAA,OAAA,EAAS,GAAG,KAAO,EAAA,GAAA,EAAK,OAAS,EAAA,cAAA,EACrD,iBACH,CAEA,GAAA,KAAA,CAAA;AAGJ,EACE,uBAAA,GAAA,CAAC,mBACC,QAAC,kBAAA,IAAA,CAAA,aAAA,EAAA,EAAc,OAAO,EAAE,KAAA,EAAO,gBAC5B,EAAA,QAAA,EAAA;AAAA,IAAA,KAAA,wBACE,aACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,KAAO,EAAA;AAAA,UACL,UAAA,EACE,aAAkB,KAAA,QAAA,GAAW,eAAkB,GAAA,KAAA,CAAA;AAAA,SACnD;AAAA,QAEC,QAAA,EAAA,IAAA;AAAA,OAAA;AAAA,KAEL,EAAA,CAAA;AAAA,oBAGD,GAAA,CAAA,eAAA,EAAA,EAAgB,OAAS,EAAA,KAAA,EACvB,QACC,EAAA,KAAA,mBAAA,GAAA;AAAA,MAAC,MAAO,CAAA,GAAA;AAAA,MAAP;AAAA,QAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAE,EAAA;AAAA,QACtB,OAAA,EAAS,EAAE,OAAA,EAAS,CAAE,EAAA;AAAA,QACtB,IAAA,EAAM,EAAE,OAAA,EAAS,CAAG,EAAA,QAAA,EAAU,YAAY,KAAO,EAAA,CAAC,CAAG,EAAA,CAAC,CAAE,EAAA;AAAA,QACxD,UAAY,EAAA;AAAA,UACV,QAAU,EAAA,GAAA;AAAA,SACZ;AAAA,QAEA,QAAA,kBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,GAAK,EAAA,KAAA;AAAA,YACL,IAAM,EAAA,GAAA;AAAA,YACN,GAAK,EAAA,KAAA,EAAO,MAAS,GAAA,GAAA,GAAM,GAAM,GAAA,GAAA;AAAA,YACjC,KAAA,EAAO,aAAkB,KAAA,cAAA,GAAiB,KAAQ,GAAA,KAAA,CAAA;AAAA,YAClD,eAAA;AAAA,WAAA;AAAA,SACF;AAAA,OAAA;AAAA,MAdK,KAAA;AAAA,KAiBP,mBAAA,IAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,EAAE,OAAA,EAAS,GAAI,EAAA;AAAA,QACxB,OAAA,EAAS,EAAE,OAAA,EAAS,GAAI,EAAA;AAAA,QACxB,IAAA,EAAM,EAAE,OAAA,EAAS,CAAG,EAAA,QAAA,EAAU,YAAY,KAAO,EAAA,CAAC,CAAG,EAAA,CAAC,CAAE,EAAA;AAAA,QACxD,UAAY,EAAA;AAAA,UACV,QAAU,EAAA,GAAA;AAAA,SACZ;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,MAAK,EAAA,EAAA,CAAA;AAAA,8BACL,MAAK,EAAA,EAAA,CAAA;AAAA,8BACL,MAAK,EAAA,EAAA,CAAA;AAAA,8BACL,KAAI,EAAA,EAAA,CAAA;AAAA,SAAA;AAAA,OAAA;AAAA,KAGX,EAAA,CAAA;AAAA,GAAA,EACF,CACF,EAAA,CAAA,CAAA;AAEJ,CAAA;AACA,YAAA,CAAa,WAAc,GAAA,cAAA;;;;"}

package/build/connectkit/src/components/Common/CustomQRCode/styles.js

@@ -0,0 +1,139 @@
+import { motion } from 'framer-motion';
+import { keyframes } from 'styled-components';
+import styled from '../../../styles/styled/index.js';
+
+const QRCodeContainer = styled(motion.div)`
+  z-index: 3;
+  position: relative;
+  overflow: hidden;
+  height: 0;
+  padding-bottom: 100% !important;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 1px 0 2px;
+  border-radius: var(--ck-qr-border-radius, 24px);
+  background: var(--ck-qr-background, transparent);
+  box-shadow: 0 0 0 1px var(--ck-qr-border-color);
+  backface-visibility: hidden;
+  svg {
+    display: block;
+    max-width: 100%;
+    width: 100%;
+    height: auto;
+  }
+`;
+const QRCodeContent = styled(motion.div)`
+  position: absolute;
+  inset: 13px;
+  svg {
+    width: 100% !important;
+    height: auto !important;
+  }
+`;
+const PlaceholderKeyframes = keyframes`
+  0%{ background-position: 100% 0; }
+  100%{ background-position: -100% 0; }
+`;
+const QRPlaceholder = styled(motion.div)`
+  --color: var(--ck-qr-dot-color);
+  --bg: var(--ck-qr-background, var(--ck-body-background));
+
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  > div {
+    z-index: 4;
+    position: relative;
+    width: 28%;
+    height: 28%;
+    border-radius: 20px;
+    background: var(--bg);
+    box-shadow: 0 0 0 7px var(--bg);
+  }
+  > span {
+    z-index: 4;
+    position: absolute;
+    background: var(--color);
+    border-radius: 12px;
+    width: 13.25%;
+    height: 13.25%;
+    box-shadow: 0 0 0 4px var(--bg);
+    &:before {
+      content: "";
+      position: absolute;
+      inset: 9px;
+      border-radius: 3px;
+      box-shadow: 0 0 0 4px var(--bg);
+    }
+    &:nth-child(1) {
+      top: 0;
+      left: 0;
+    }
+    &:nth-child(2) {
+      top: 0;
+      right: 0;
+    }
+    &:nth-child(3) {
+      bottom: 0;
+      left: 0;
+    }
+  }
+  &:before {
+    z-index: 3;
+    content: "";
+    position: absolute;
+    inset: 0;
+    background: repeat;
+    background-size: 1.888% 1.888%;
+    background-image: radial-gradient(var(--color) 41%, transparent 41%);
+  }
+  &:after {
+    z-index: 5;
+    content: "";
+    position: absolute;
+    inset: 0;
+    transform: scale(1.7) rotate(45deg);
+    background-image: linear-gradient(
+      90deg,
+      rgba(255, 255, 255, 0) 50%,
+      rgba(255, 255, 255, 1),
+      rgba(255, 255, 255, 0)
+    );
+    background-size: 200% 100%;
+    animation: ${PlaceholderKeyframes} 1000ms linear infinite both;
+  }
+`;
+const LogoContainer = styled(motion.div)`
+  z-index: 6;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  transform: translateY(50%) scale(0.9999); // Shifting fix
+`;
+const LogoIcon = styled(motion.div)`
+  z-index: 6;
+  position: absolute;
+  left: 50%;
+  overflow: hidden;
+
+  transform: translate(-50%, -50%) scale(0.9999); // Shifting fix
+
+  svg {
+    display: block;
+    position: relative;
+    width: 100%;
+    height: 100%;
+  }
+
+  width: 28%;
+  height: 28%;
+`;
+
+export { LogoContainer, LogoIcon, PlaceholderKeyframes, QRCodeContainer, QRCodeContent, QRPlaceholder };
+//# sourceMappingURL=styles.js.map

package/build/connectkit/src/components/Common/CustomQRCode/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../../../src/components/Common/CustomQRCode/styles.ts"],"sourcesContent":["import { motion } from \"framer-motion\";\nimport { keyframes } from \"styled-components\";\nimport styled from \"./../../../styles/styled\";\n\nexport const QRCodeContainer = styled(motion.div)`\n  z-index: 3;\n  position: relative;\n  overflow: hidden;\n  height: 0;\n  padding-bottom: 100% !important;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 1px 0 2px;\n  border-radius: var(--ck-qr-border-radius, 24px);\n  background: var(--ck-qr-background, transparent);\n  box-shadow: 0 0 0 1px var(--ck-qr-border-color);\n  backface-visibility: hidden;\n  svg {\n    display: block;\n    max-width: 100%;\n    width: 100%;\n    height: auto;\n  }\n`;\nexport const QRCodeContent = styled(motion.div)`\n  position: absolute;\n  inset: 13px;\n  svg {\n    width: 100% !important;\n    height: auto !important;\n  }\n`;\nexport const PlaceholderKeyframes = keyframes`\n  0%{ background-position: 100% 0; }\n  100%{ background-position: -100% 0; }\n`;\nexport const QRPlaceholder = styled(motion.div)`\n  --color: var(--ck-qr-dot-color);\n  --bg: var(--ck-qr-background, var(--ck-body-background));\n\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  > div {\n    z-index: 4;\n    position: relative;\n    width: 28%;\n    height: 28%;\n    border-radius: 20px;\n    background: var(--bg);\n    box-shadow: 0 0 0 7px var(--bg);\n  }\n  > span {\n    z-index: 4;\n    position: absolute;\n    background: var(--color);\n    border-radius: 12px;\n    width: 13.25%;\n    height: 13.25%;\n    box-shadow: 0 0 0 4px var(--bg);\n    &:before {\n      content: \"\";\n      position: absolute;\n      inset: 9px;\n      border-radius: 3px;\n      box-shadow: 0 0 0 4px var(--bg);\n    }\n    &:nth-child(1) {\n      top: 0;\n      left: 0;\n    }\n    &:nth-child(2) {\n      top: 0;\n      right: 0;\n    }\n    &:nth-child(3) {\n      bottom: 0;\n      left: 0;\n    }\n  }\n  &:before {\n    z-index: 3;\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    background: repeat;\n    background-size: 1.888% 1.888%;\n    background-image: radial-gradient(var(--color) 41%, transparent 41%);\n  }\n  &:after {\n    z-index: 5;\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    transform: scale(1.7) rotate(45deg);\n    background-image: linear-gradient(\n      90deg,\n      rgba(255, 255, 255, 0) 50%,\n      rgba(255, 255, 255, 1),\n      rgba(255, 255, 255, 0)\n    );\n    background-size: 200% 100%;\n    animation: ${PlaceholderKeyframes} 1000ms linear infinite both;\n  }\n`;\n\nexport const LogoContainer = styled(motion.div)`\n  z-index: 6;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  transform: translateY(50%) scale(0.9999); // Shifting fix\n`;\nexport const LogoIcon = styled(motion.div)`\n  z-index: 6;\n  position: absolute;\n  left: 50%;\n  overflow: hidden;\n\n  transform: translate(-50%, -50%) scale(0.9999); // Shifting fix\n\n  svg {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  width: 28%;\n  height: 28%;\n`;\n"],"names":[],"mappings":";;;;AAIa,MAAA,eAAA,GAAkB,MAAO,CAAA,MAAA,CAAO,GAAG,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAqBnC,MAAA,aAAA,GAAgB,MAAO,CAAA,MAAA,CAAO,GAAG,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAQvC,MAAM,oBAAuB,GAAA,SAAA,CAAA;AAAA;AAAA;AAAA,EAAA;AAIvB,MAAA,aAAA,GAAgB,MAAO,CAAA,MAAA,CAAO,GAAG,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAAA,EAqE7B,oBAAoB,CAAA;AAAA;AAAA,EAAA;AAIxB,MAAA,aAAA,GAAgB,MAAO,CAAA,MAAA,CAAO,GAAG,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AASjC,MAAA,QAAA,GAAW,MAAO,CAAA,MAAA,CAAO,GAAG,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;"}

package/build/connectkit/src/components/Common/FitText/index.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+import React from 'react';
+import useFitText from '../../../hooks/useFitText.js';
+
+const FitText = ({ children }) => {
+  const [ready, setReady] = React.useState(false);
+  const { fontSize, ref: textRef } = useFitText({
+    logLevel: "none",
+    maxFontSize: 100,
+    minFontSize: 70,
+    onStart: () => setReady(true),
+    onFinish: () => setReady(true)
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: textRef,
+      style: {
+        visibility: ready ? "visible" : "hidden",
+        fontSize: `${fontSize}%`,
+        maxHeight: "100%",
+        maxWidth: "100%",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center"
+      },
+      children
+    }
+  );
+};
+FitText.displayName = "FitText";
+
+export { FitText as default };
+//# sourceMappingURL=index.js.map

package/build/connectkit/src/components/Common/FitText/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/Common/FitText/index.tsx"],"sourcesContent":["import React from \"react\";\nimport useFitText from \"../../../hooks/useFitText\";\n\nconst FitText = ({ children }: { children: React.ReactNode }) => {\n  const [ready, setReady] = React.useState(false);\n  const { fontSize, ref: textRef } = useFitText({\n    logLevel: \"none\",\n    maxFontSize: 100,\n    minFontSize: 70,\n    onStart: () => setReady(true),\n    onFinish: () => setReady(true),\n  });\n  return (\n    <div\n      ref={textRef}\n      style={{\n        visibility: ready ? \"visible\" : \"hidden\",\n        fontSize: `${fontSize}%`,\n        maxHeight: \"100%\",\n        maxWidth: \"100%\",\n        display: \"flex\",\n        justifyContent: \"center\",\n        alignItems: \"center\",\n      }}\n    >\n      {children}\n    </div>\n  );\n};\nFitText.displayName = \"FitText\";\n\nexport default FitText;\n"],"names":[],"mappings":";;;;AAGA,MAAM,OAAU,GAAA,CAAC,EAAE,QAAA,EAA8C,KAAA;AAC/D,EAAA,MAAM,CAAC,KAAO,EAAA,QAAQ,CAAI,GAAA,KAAA,CAAM,SAAS,KAAK,CAAA,CAAA;AAC9C,EAAA,MAAM,EAAE,QAAA,EAAU,GAAK,EAAA,OAAA,KAAY,UAAW,CAAA;AAAA,IAC5C,QAAU,EAAA,MAAA;AAAA,IACV,WAAa,EAAA,GAAA;AAAA,IACb,WAAa,EAAA,EAAA;AAAA,IACb,OAAA,EAAS,MAAM,QAAA,CAAS,IAAI,CAAA;AAAA,IAC5B,QAAA,EAAU,MAAM,QAAA,CAAS,IAAI,CAAA;AAAA,GAC9B,CAAA,CAAA;AACD,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA,OAAA;AAAA,MACL,KAAO,EAAA;AAAA,QACL,UAAA,EAAY,QAAQ,SAAY,GAAA,QAAA;AAAA,QAChC,QAAA,EAAU,GAAG,QAAQ,CAAA,CAAA,CAAA;AAAA,QACrB,SAAW,EAAA,MAAA;AAAA,QACX,QAAU,EAAA,MAAA;AAAA,QACV,OAAS,EAAA,MAAA;AAAA,QACT,cAAgB,EAAA,QAAA;AAAA,QAChB,UAAY,EAAA,QAAA;AAAA,OACd;AAAA,MAEC,QAAA;AAAA,KAAA;AAAA,GACH,CAAA;AAEJ,EAAA;AACA,OAAA,CAAQ,WAAc,GAAA,SAAA;;;;"}