@snowztech/ui 0.1.0 → 0.3.0

package/dist/client.cjs

@@ -25,6 +25,7 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 // src/theme-toggle.tsx
+var cx = (...parts) => parts.filter(Boolean).join(" ");
 function ThemeToggle({
   size = 12,
   storageKey = "theme",
@@ -46,108 +47,49 @@ function ThemeToggle({
     if (next === "light") document.documentElement.setAttribute("data-theme", "light");
     else document.documentElement.removeAttribute("data-theme");
   };
-  const filled = theme === "dark";
   return /* @__PURE__ */ jsxRuntime.jsx(
     "button",
     {
       type: "button",
       onClick: toggle,
-      "aria-label": `switch to ${filled ? "light" : "dark"} mode`,
-      className,
+      "aria-label": `switch to ${theme === "dark" ? "light" : "dark"} mode`,
+      className: cx("sn-theme-toggle", className),
       style: {
-        appearance: "none",
-        border: "none",
-        background: "transparent",
-        padding: 6,
-        cursor: "pointer",
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
+        ["--sn-theme-toggle-size"]: `${size}px`,
         opacity: mounted ? 1 : 0,
-        transition: "opacity 200ms",
         ...style
       },
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        "span",
-        {
-          style: {
-            display: "inline-block",
-            width: size,
-            height: size,
-            borderRadius: "50%",
-            border: `1px solid var(--sn-fg-muted)`,
-            background: filled ? "var(--sn-fg)" : "transparent",
-            transition: "background 160ms ease"
-          }
-        }
-      )
+      children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sn-theme-toggle__indicator" })
     }
   );
 }
-var Icon = ({
-  size = 16,
-  stroke = 1.5,
-  color = "currentColor",
-  style,
-  children
-}) => /* @__PURE__ */ jsxRuntime.jsx(
-  "svg",
-  {
-    width: size,
-    height: size,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: color,
-    strokeWidth: stroke,
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    style: { display: "inline-block", verticalAlign: "middle", ...style },
-    "aria-hidden": "true",
-    children
-  }
-);
-var CheckIcon = (p) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { ...p, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m4 12 5 5L20 6" }) });
+var cx2 = (...parts) => parts.filter(Boolean).join(" ");
 function CopyButton({ value, size = 14, className, style }) {
   const [copied, setCopied] = React__namespace.useState(false);
   const onCopy = async () => {
     try {
       await navigator.clipboard.writeText(value);
       setCopied(true);
-      setTimeout(() => setCopied(false), 1200);
+      window.setTimeout(() => setCopied(false), 1200);
     } catch {
     }
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
       type: "button",
       onClick: onCopy,
       "aria-label": copied ? "copied" : "copy",
-      className,
-      style: {
-        appearance: "none",
-        border: "1px solid transparent",
-        background: "transparent",
-        color: copied ? "var(--sn-success)" : "var(--sn-fg-muted)",
-        padding: 6,
-        cursor: "pointer",
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        borderRadius: "var(--sn-r-xs)",
-        transition: "color 120ms ease, border-color 120ms ease",
-        ...style
-      },
-      onMouseEnter: (e) => {
-        if (!copied) e.currentTarget.style.color = "var(--sn-fg)";
-      },
-      onMouseLeave: (e) => {
-        if (!copied) e.currentTarget.style.color = "var(--sn-fg-muted)";
-      },
-      children: copied ? /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { size }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "11", height: "11", rx: "1.5" }),
-        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 15V5a1 1 0 0 1 1-1h10" })
-      ] })
+      "data-copied": copied || void 0,
+      className: cx2("sn-copy-btn", className),
+      style,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "sn-copy-btn__idle", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "11", height: "11", rx: "1.5" }),
+          /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 15V5a1 1 0 0 1 1-1h10" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "sn-copy-btn__copied", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m4 12 5 5L20 6" }) })
+      ]
     }
   );
 }

package/dist/client.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/theme-toggle.tsx","../src/icons.tsx","../src/copy-button.tsx"],"names":["React","jsx","React2","jsxs"],"mappings":"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","file":"client.cjs","sourcesContent":["import * as React from \"react\";\n\nexport type Theme = \"light\" | \"dark\";\n\nexport interface ThemeToggleProps {\n  size?: number;\n  storageKey?: string;\n  defaultTheme?: Theme;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function ThemeToggle({\n  size = 12,\n  storageKey = \"theme\",\n  defaultTheme = \"dark\",\n  className,\n  style,\n}: ThemeToggleProps) {\n  const [theme, setTheme] = React.useState<Theme>(defaultTheme);\n  const [mounted, setMounted] = React.useState(false);\n\n  React.useEffect(() => {\n    const stored = (localStorage.getItem(storageKey) as Theme | null) ?? defaultTheme;\n    setTheme(stored);\n    setMounted(true);\n  }, [storageKey, defaultTheme]);\n\n  const toggle = () => {\n    const next: Theme = theme === \"dark\" ? \"light\" : \"dark\";\n    setTheme(next);\n    localStorage.setItem(storageKey, next);\n    if (next === \"light\") document.documentElement.setAttribute(\"data-theme\", \"light\");\n    else document.documentElement.removeAttribute(\"data-theme\");\n  };\n\n  const filled = theme === \"dark\";\n\n  return (\n    <button\n      type=\"button\"\n      onClick={toggle}\n      aria-label={`switch to ${filled ? \"light\" : \"dark\"} mode`}\n      className={className}\n      style={{\n        appearance: \"none\",\n        border: \"none\",\n        background: \"transparent\",\n        padding: 6,\n        cursor: \"pointer\",\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        opacity: mounted ? 1 : 0,\n        transition: \"opacity 200ms\",\n        ...style,\n      }}\n    >\n      <span\n        style={{\n          display: \"inline-block\",\n          width: size,\n          height: size,\n          borderRadius: \"50%\",\n          border: `1px solid var(--sn-fg-muted)`,\n          background: filled ? \"var(--sn-fg)\" : \"transparent\",\n          transition: \"background 160ms ease\",\n        }}\n      />\n    </button>\n  );\n}\n","import * as React from \"react\";\n\nexport interface IconProps {\n  size?: number;\n  stroke?: number;\n  color?: string;\n  style?: React.CSSProperties;\n  children?: React.ReactNode;\n}\n\nexport const Icon = ({\n  size = 16,\n  stroke = 1.5,\n  color = \"currentColor\",\n  style,\n  children,\n}: IconProps) => (\n  <svg\n    width={size}\n    height={size}\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke={color}\n    strokeWidth={stroke}\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    style={{ display: \"inline-block\", verticalAlign: \"middle\", ...style }}\n    aria-hidden=\"true\"\n  >\n    {children}\n  </svg>\n);\n\ntype P = Omit<IconProps, \"children\">;\n\nexport const SearchIcon = (p: P) => <Icon {...p}><circle cx=\"11\" cy=\"11\" r=\"6\" /><path d=\"m20 20-3.5-3.5\" /></Icon>;\nexport const TerminalIcon = (p: P) => <Icon {...p}><path d=\"m5 8 4 4-4 4\" /><path d=\"M13 16h6\" /><rect x=\"2.5\" y=\"4\" width=\"19\" height=\"16\" rx=\"1.5\" /></Icon>;\nexport const CodeIcon = (p: P) => <Icon {...p}><path d=\"m8 7-5 5 5 5\" /><path d=\"m16 7 5 5-5 5\" /><path d=\"m14 4-4 16\" /></Icon>;\nexport const GitIcon = (p: P) => <Icon {...p}><circle cx=\"6\" cy=\"6\" r=\"2.5\" /><circle cx=\"18\" cy=\"18\" r=\"2.5\" /><circle cx=\"6\" cy=\"18\" r=\"2.5\" /><path d=\"M6 8.5v7\" /><path d=\"M8.5 6h6.5a2.5 2.5 0 0 1 2.5 2.5v7\" /></Icon>;\nexport const PlusIcon = (p: P) => <Icon {...p}><path d=\"M12 5v14\" /><path d=\"M5 12h14\" /></Icon>;\nexport const MinusIcon = (p: P) => <Icon {...p}><path d=\"M5 12h14\" /></Icon>;\nexport const CheckIcon = (p: P) => <Icon {...p}><path d=\"m4 12 5 5L20 6\" /></Icon>;\nexport const XIcon = (p: P) => <Icon {...p}><path d=\"M6 6 18 18\" /><path d=\"m18 6-12 12\" /></Icon>;\nexport const ChevronDownIcon = (p: P) => <Icon {...p}><path d=\"m6 9 6 6 6-6\" /></Icon>;\nexport const ChevronRightIcon = (p: P) => <Icon {...p}><path d=\"m9 6 6 6-6 6\" /></Icon>;\nexport const ChevronLeftIcon = (p: P) => <Icon {...p}><path d=\"m15 6-6 6 6 6\" /></Icon>;\nexport const ArrowRightIcon = (p: P) => <Icon {...p}><path d=\"M5 12h14\" /><path d=\"m13 6 6 6-6 6\" /></Icon>;\nexport const ArrowUpRightIcon = (p: P) => <Icon {...p}><path d=\"M7 17 17 7\" /><path d=\"M8 7h9v9\" /></Icon>;\nexport const ExternalLinkIcon = (p: P) => <Icon {...p}><path d=\"M14 4h6v6\" /><path d=\"M20 4 10 14\" /><path d=\"M19 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h5\" /></Icon>;\nexport const SettingsIcon = (p: P) => <Icon {...p}><circle cx=\"12\" cy=\"12\" r=\"3\" /><path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09a1.65 1.65 0 0 0-1-1.51 1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09a1.65 1.65 0 0 0 1.51-1 1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33h0a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51h0a1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82h0a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\" /></Icon>;\nexport const UserIcon = (p: P) => <Icon {...p}><circle cx=\"12\" cy=\"8\" r=\"4\" /><path d=\"M4 21v-1a6 6 0 0 1 6-6h4a6 6 0 0 1 6 6v1\" /></Icon>;\nexport const FolderIcon = (p: P) => <Icon {...p}><path d=\"M3 6.5A1.5 1.5 0 0 1 4.5 5h4l2 2.5h9A1.5 1.5 0 0 1 21 9v9.5A1.5 1.5 0 0 1 19.5 20h-15A1.5 1.5 0 0 1 3 18.5z\" /></Icon>;\nexport const FileIcon = (p: P) => <Icon {...p}><path d=\"M14 3H6a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V8z\" /><path d=\"M14 3v5h5\" /></Icon>;\nexport const BellIcon = (p: P) => <Icon {...p}><path d=\"M6 9a6 6 0 1 1 12 0v4l1.5 3h-15L6 13z\" /><path d=\"M10 19a2 2 0 0 0 4 0\" /></Icon>;\nexport const ActivityIcon = (p: P) => <Icon {...p}><path d=\"M3 12h4l3-8 4 16 3-8h4\" /></Icon>;\nexport const PulseIcon = (p: P) => <Icon {...p}><path d=\"M3 12h3l2-4 4 8 2-4h7\" /></Icon>;\nexport const CubeIcon = (p: P) => <Icon {...p}><path d=\"m12 2 9 5v10l-9 5-9-5V7z\" /><path d=\"m3 7 9 5 9-5\" /><path d=\"M12 22V12\" /></Icon>;\nexport const LayersIcon = (p: P) => <Icon {...p}><path d=\"m12 3 9 5-9 5-9-5z\" /><path d=\"m3 13 9 5 9-5\" /><path d=\"m3 18 9 5 9-5\" /></Icon>;\nexport const DatabaseIcon = (p: P) => <Icon {...p}><ellipse cx=\"12\" cy=\"5\" rx=\"8\" ry=\"3\" /><path d=\"M4 5v6c0 1.7 3.6 3 8 3s8-1.3 8-3V5\" /><path d=\"M4 11v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6\" /></Icon>;\nexport const CloudIcon = (p: P) => <Icon {...p}><path d=\"M7 18a5 5 0 1 1 1-9.9A6 6 0 0 1 19.5 11 4 4 0 0 1 18 18z\" /></Icon>;\nexport const SunIcon = (p: P) => <Icon {...p}><circle cx=\"12\" cy=\"12\" r=\"4\" /><path d=\"M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4\" /></Icon>;\nexport const MoonIcon = (p: P) => <Icon {...p}><path d=\"M20 14a8 8 0 1 1-9.9-9.9 7 7 0 0 0 9.9 9.9z\" /></Icon>;\nexport const GithubIcon = (p: P) => <Icon {...p}><path d=\"M9 19c-4 1-4-2-6-2.5M15 22v-4a3 3 0 0 0-1-2.5c3 0 6-2 6-5.5a5 5 0 0 0-1.4-3.5 4.7 4.7 0 0 0-.1-3.5s-1.1-.4-3.5 1.3a12 12 0 0 0-6 0C6.6 1.6 5.5 2 5.5 2a4.7 4.7 0 0 0-.1 3.5A5 5 0 0 0 4 9c0 3.5 3 5.5 6 5.5a3 3 0 0 0-1 2.5v4\" /></Icon>;\nexport const MailIcon = (p: P) => <Icon {...p}><rect x=\"3\" y=\"5\" width=\"18\" height=\"14\" rx=\"1.5\" /><path d=\"m3.5 6.5 8.5 7 8.5-7\" /></Icon>;\nexport const EyeIcon = (p: P) => <Icon {...p}><path d=\"M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z\" /><circle cx=\"12\" cy=\"12\" r=\"3\" /></Icon>;\nexport const LockIcon = (p: P) => <Icon {...p}><rect x=\"4\" y=\"11\" width=\"16\" height=\"10\" rx=\"1.5\" /><path d=\"M8 11V7a4 4 0 0 1 8 0v4\" /></Icon>;\nexport const BoltIcon = (p: P) => <Icon {...p}><path d=\"M13 2 4 14h7l-2 8 9-12h-7z\" /></Icon>;\nexport const StarIcon = (p: P) => <Icon {...p}><path d=\"m12 3 2.7 6 6.3.6-4.7 4.4 1.4 6.5L12 17l-5.7 3.5 1.4-6.5L3 9.6l6.3-.6z\" /></Icon>;\nexport const HeartIcon = (p: P) => <Icon {...p}><path d=\"M12 20s-7-4.5-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.5-7 10-7 10z\" /></Icon>;\nexport const TrashIcon = (p: P) => <Icon {...p}><path d=\"M3 6h18\" /><path d=\"M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2\" /><path d=\"M5 6v14a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V6\" /><path d=\"M10 11v6M14 11v6\" /></Icon>;\nexport const EditIcon = (p: P) => <Icon {...p}><path d=\"M11 4H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-6\" /><path d=\"m18.5 2.5 3 3L12 15l-4 1 1-4z\" /></Icon>;\nexport const FilterIcon = (p: P) => <Icon {...p}><path d=\"M3 5h18l-7 9v6l-4-2v-4z\" /></Icon>;\nexport const MenuIcon = (p: P) => <Icon {...p}><path d=\"M4 7h16M4 12h16M4 17h16\" /></Icon>;\nexport const GridIcon = (p: P) => <Icon {...p}><rect x=\"3\" y=\"3\" width=\"7\" height=\"7\" rx=\"1\" /><rect x=\"14\" y=\"3\" width=\"7\" height=\"7\" rx=\"1\" /><rect x=\"3\" y=\"14\" width=\"7\" height=\"7\" rx=\"1\" /><rect x=\"14\" y=\"14\" width=\"7\" height=\"7\" rx=\"1\" /></Icon>;\nexport const InboxIcon = (p: P) => <Icon {...p}><path d=\"M3 13h5l1.5 2.5h5L16 13h5\" /><path d=\"M5 4h14l2 9v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-6z\" /></Icon>;\nexport const CalendarIcon = (p: P) => <Icon {...p}><rect x=\"3\" y=\"5\" width=\"18\" height=\"16\" rx=\"1.5\" /><path d=\"M3 10h18M8 3v4M16 3v4\" /></Icon>;\nexport const ClockIcon = (p: P) => <Icon {...p}><circle cx=\"12\" cy=\"12\" r=\"9\" /><path d=\"M12 7v5l3 2\" /></Icon>;\nexport const InfoIcon = (p: P) => <Icon {...p}><circle cx=\"12\" cy=\"12\" r=\"9\" /><path d=\"M12 11v6\" /><circle cx=\"12\" cy=\"8\" r=\"0.5\" fill=\"currentColor\" /></Icon>;\nexport const WarningIcon = (p: P) => <Icon {...p}><path d=\"M11 3 2 19a1 1 0 0 0 .9 1.5h18.2A1 1 0 0 0 22 19L13 3a1 1 0 0 0-2 0z\" /><path d=\"M12 9v5\" /><circle cx=\"12\" cy=\"17\" r=\"0.5\" fill=\"currentColor\" /></Icon>;\nexport const ZapIcon = (p: P) => <Icon {...p}><path d=\"M13 2 4 14h7l-2 8 9-12h-7z\" /></Icon>;\nexport const DiscordIcon = (p: P) => <Icon {...p}><path d=\"M19 6s-2.5-2-5-2l-.3.5c2.3.5 3.3 1.5 3.3 1.5s-2-1-4-1c-1 0-2 .1-3 .3-1-.2-2-.3-3-.3-2 0-4 1-4 1S4 5 6.3 4.5L6 4C3.5 4 1 6 1 6s-2.5 4-2 11c1.5 2 3.5 2 3.5 2L4 17c-1-.5-2-1.5-2-1.5 2 1.5 4 2 4 2l1-2.5s4 1.5 6 1.5 6-1.5 6-1.5l1 2.5s2-.5 4-2c0 0-1 1-2 1.5l1.5 2s2 0 3.5-2c.5-7-2-11-2-11z\" /><circle cx=\"9\" cy=\"11.5\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\" /><circle cx=\"15\" cy=\"11.5\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\" /></Icon>;\n","import * as React from \"react\";\nimport { CheckIcon } from \"./icons\";\n\nexport interface CopyButtonProps {\n  value: string;\n  size?: number;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function CopyButton({ value, size = 14, className, style }: CopyButtonProps) {\n  const [copied, setCopied] = React.useState(false);\n\n  const onCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 1200);\n    } catch {\n      // ignored\n    }\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onCopy}\n      aria-label={copied ? \"copied\" : \"copy\"}\n      className={className}\n      style={{\n        appearance: \"none\",\n        border: \"1px solid transparent\",\n        background: \"transparent\",\n        color: copied ? \"var(--sn-success)\" : \"var(--sn-fg-muted)\",\n        padding: 6,\n        cursor: \"pointer\",\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        borderRadius: \"var(--sn-r-xs)\",\n        transition: \"color 120ms ease, border-color 120ms ease\",\n        ...style,\n      }}\n      onMouseEnter={(e) => {\n        if (!copied) e.currentTarget.style.color = \"var(--sn-fg)\";\n      }}\n      onMouseLeave={(e) => {\n        if (!copied) e.currentTarget.style.color = \"var(--sn-fg-muted)\";\n      }}\n    >\n      {copied ? (\n        <CheckIcon size={size} />\n      ) : (\n        <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n          <rect x=\"9\" y=\"9\" width=\"11\" height=\"11\" rx=\"1.5\" />\n          <path d=\"M5 15V5a1 1 0 0 1 1-1h10\" />\n        </svg>\n      )}\n    </button>\n  );\n}\n"]}
+{"version":3,"sources":["../src/theme-toggle.tsx","../src/copy-button.tsx"],"names":["React","jsx","cx","React2","jsxs"],"mappings":"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","file":"client.cjs","sourcesContent":["import * as React from \"react\";\n\nconst cx = (...parts: Array<string | undefined | false>) => parts.filter(Boolean).join(\" \");\n\nexport type Theme = \"light\" | \"dark\";\n\nexport interface ThemeToggleProps {\n  size?: number;\n  storageKey?: string;\n  defaultTheme?: Theme;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function ThemeToggle({\n  size = 12,\n  storageKey = \"theme\",\n  defaultTheme = \"dark\",\n  className,\n  style,\n}: ThemeToggleProps) {\n  const [theme, setTheme] = React.useState<Theme>(defaultTheme);\n  const [mounted, setMounted] = React.useState(false);\n\n  React.useEffect(() => {\n    const stored = (localStorage.getItem(storageKey) as Theme | null) ?? defaultTheme;\n    setTheme(stored);\n    setMounted(true);\n  }, [storageKey, defaultTheme]);\n\n  const toggle = () => {\n    const next: Theme = theme === \"dark\" ? \"light\" : \"dark\";\n    setTheme(next);\n    localStorage.setItem(storageKey, next);\n    if (next === \"light\") document.documentElement.setAttribute(\"data-theme\", \"light\");\n    else document.documentElement.removeAttribute(\"data-theme\");\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={toggle}\n      aria-label={`switch to ${theme === \"dark\" ? \"light\" : \"dark\"} mode`}\n      className={cx(\"sn-theme-toggle\", className)}\n      style={{\n        [\"--sn-theme-toggle-size\" as string]: `${size}px`,\n        opacity: mounted ? 1 : 0,\n        ...style,\n      }}\n    >\n      <span className=\"sn-theme-toggle__indicator\" />\n    </button>\n  );\n}\n","import * as React from \"react\";\n\nconst cx = (...parts: Array<string | undefined | false>) => parts.filter(Boolean).join(\" \");\n\nexport interface CopyButtonProps {\n  value: string;\n  size?: number;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function CopyButton({ value, size = 14, className, style }: CopyButtonProps) {\n  const [copied, setCopied] = React.useState(false);\n\n  const onCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setCopied(true);\n      window.setTimeout(() => setCopied(false), 1200);\n    } catch {\n      // ignored\n    }\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onCopy}\n      aria-label={copied ? \"copied\" : \"copy\"}\n      data-copied={copied || undefined}\n      className={cx(\"sn-copy-btn\", className)}\n      style={style}\n    >\n      <svg className=\"sn-copy-btn__idle\" width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n        <rect x=\"9\" y=\"9\" width=\"11\" height=\"11\" rx=\"1.5\" />\n        <path d=\"M5 15V5a1 1 0 0 1 1-1h10\" />\n      </svg>\n      <svg className=\"sn-copy-btn__copied\" width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"m4 12 5 5L20 6\" />\n      </svg>\n    </button>\n  );\n}\n"]}

package/dist/client.js

@@ -1,8 +1,9 @@
 "use client";
-import { CheckIcon } from './chunk-XYNFF4B5.js';
 import * as React from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+// src/theme-toggle.tsx
+var cx = (...parts) => parts.filter(Boolean).join(" ");
 function ThemeToggle({
   size = 12,
   storageKey = "theme",
@@ -24,85 +25,49 @@ function ThemeToggle({
     if (next === "light") document.documentElement.setAttribute("data-theme", "light");
     else document.documentElement.removeAttribute("data-theme");
   };
-  const filled = theme === "dark";
   return /* @__PURE__ */ jsx(
     "button",
     {
       type: "button",
       onClick: toggle,
-      "aria-label": `switch to ${filled ? "light" : "dark"} mode`,
-      className,
+      "aria-label": `switch to ${theme === "dark" ? "light" : "dark"} mode`,
+      className: cx("sn-theme-toggle", className),
       style: {
-        appearance: "none",
-        border: "none",
-        background: "transparent",
-        padding: 6,
-        cursor: "pointer",
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
+        ["--sn-theme-toggle-size"]: `${size}px`,
         opacity: mounted ? 1 : 0,
-        transition: "opacity 200ms",
         ...style
       },
-      children: /* @__PURE__ */ jsx(
-        "span",
-        {
-          style: {
-            display: "inline-block",
-            width: size,
-            height: size,
-            borderRadius: "50%",
-            border: `1px solid var(--sn-fg-muted)`,
-            background: filled ? "var(--sn-fg)" : "transparent",
-            transition: "background 160ms ease"
-          }
-        }
-      )
+      children: /* @__PURE__ */ jsx("span", { className: "sn-theme-toggle__indicator" })
     }
   );
 }
+var cx2 = (...parts) => parts.filter(Boolean).join(" ");
 function CopyButton({ value, size = 14, className, style }) {
   const [copied, setCopied] = React.useState(false);
   const onCopy = async () => {
     try {
       await navigator.clipboard.writeText(value);
       setCopied(true);
-      setTimeout(() => setCopied(false), 1200);
+      window.setTimeout(() => setCopied(false), 1200);
     } catch {
     }
   };
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     "button",
     {
       type: "button",
       onClick: onCopy,
       "aria-label": copied ? "copied" : "copy",
-      className,
-      style: {
-        appearance: "none",
-        border: "1px solid transparent",
-        background: "transparent",
-        color: copied ? "var(--sn-success)" : "var(--sn-fg-muted)",
-        padding: 6,
-        cursor: "pointer",
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        borderRadius: "var(--sn-r-xs)",
-        transition: "color 120ms ease, border-color 120ms ease",
-        ...style
-      },
-      onMouseEnter: (e) => {
-        if (!copied) e.currentTarget.style.color = "var(--sn-fg)";
-      },
-      onMouseLeave: (e) => {
-        if (!copied) e.currentTarget.style.color = "var(--sn-fg-muted)";
-      },
-      children: copied ? /* @__PURE__ */ jsx(CheckIcon, { size }) : /* @__PURE__ */ jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
-        /* @__PURE__ */ jsx("rect", { x: "9", y: "9", width: "11", height: "11", rx: "1.5" }),
-        /* @__PURE__ */ jsx("path", { d: "M5 15V5a1 1 0 0 1 1-1h10" })
-      ] })
+      "data-copied": copied || void 0,
+      className: cx2("sn-copy-btn", className),
+      style,
+      children: [
+        /* @__PURE__ */ jsxs("svg", { className: "sn-copy-btn__idle", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsx("rect", { x: "9", y: "9", width: "11", height: "11", rx: "1.5" }),
+          /* @__PURE__ */ jsx("path", { d: "M5 15V5a1 1 0 0 1 1-1h10" })
+        ] }),
+        /* @__PURE__ */ jsx("svg", { className: "sn-copy-btn__copied", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "m4 12 5 5L20 6" }) })
+      ]
     }
   );
 }

package/dist/client.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/theme-toggle.tsx","../src/copy-button.tsx"],"names":["React2","jsx"],"mappings":"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","file":"client.js","sourcesContent":["import * as React from \"react\";\n\nexport type Theme = \"light\" | \"dark\";\n\nexport interface ThemeToggleProps {\n  size?: number;\n  storageKey?: string;\n  defaultTheme?: Theme;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function ThemeToggle({\n  size = 12,\n  storageKey = \"theme\",\n  defaultTheme = \"dark\",\n  className,\n  style,\n}: ThemeToggleProps) {\n  const [theme, setTheme] = React.useState<Theme>(defaultTheme);\n  const [mounted, setMounted] = React.useState(false);\n\n  React.useEffect(() => {\n    const stored = (localStorage.getItem(storageKey) as Theme | null) ?? defaultTheme;\n    setTheme(stored);\n    setMounted(true);\n  }, [storageKey, defaultTheme]);\n\n  const toggle = () => {\n    const next: Theme = theme === \"dark\" ? \"light\" : \"dark\";\n    setTheme(next);\n    localStorage.setItem(storageKey, next);\n    if (next === \"light\") document.documentElement.setAttribute(\"data-theme\", \"light\");\n    else document.documentElement.removeAttribute(\"data-theme\");\n  };\n\n  const filled = theme === \"dark\";\n\n  return (\n    <button\n      type=\"button\"\n      onClick={toggle}\n      aria-label={`switch to ${filled ? \"light\" : \"dark\"} mode`}\n      className={className}\n      style={{\n        appearance: \"none\",\n        border: \"none\",\n        background: \"transparent\",\n        padding: 6,\n        cursor: \"pointer\",\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        opacity: mounted ? 1 : 0,\n        transition: \"opacity 200ms\",\n        ...style,\n      }}\n    >\n      <span\n        style={{\n          display: \"inline-block\",\n          width: size,\n          height: size,\n          borderRadius: \"50%\",\n          border: `1px solid var(--sn-fg-muted)`,\n          background: filled ? \"var(--sn-fg)\" : \"transparent\",\n          transition: \"background 160ms ease\",\n        }}\n      />\n    </button>\n  );\n}\n","import * as React from \"react\";\nimport { CheckIcon } from \"./icons\";\n\nexport interface CopyButtonProps {\n  value: string;\n  size?: number;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function CopyButton({ value, size = 14, className, style }: CopyButtonProps) {\n  const [copied, setCopied] = React.useState(false);\n\n  const onCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 1200);\n    } catch {\n      // ignored\n    }\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onCopy}\n      aria-label={copied ? \"copied\" : \"copy\"}\n      className={className}\n      style={{\n        appearance: \"none\",\n        border: \"1px solid transparent\",\n        background: \"transparent\",\n        color: copied ? \"var(--sn-success)\" : \"var(--sn-fg-muted)\",\n        padding: 6,\n        cursor: \"pointer\",\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        borderRadius: \"var(--sn-r-xs)\",\n        transition: \"color 120ms ease, border-color 120ms ease\",\n        ...style,\n      }}\n      onMouseEnter={(e) => {\n        if (!copied) e.currentTarget.style.color = \"var(--sn-fg)\";\n      }}\n      onMouseLeave={(e) => {\n        if (!copied) e.currentTarget.style.color = \"var(--sn-fg-muted)\";\n      }}\n    >\n      {copied ? (\n        <CheckIcon size={size} />\n      ) : (\n        <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n          <rect x=\"9\" y=\"9\" width=\"11\" height=\"11\" rx=\"1.5\" />\n          <path d=\"M5 15V5a1 1 0 0 1 1-1h10\" />\n        </svg>\n      )}\n    </button>\n  );\n}\n"]}
+{"version":3,"sources":["../src/theme-toggle.tsx","../src/copy-button.tsx"],"names":["cx","React2","jsx"],"mappings":"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","file":"client.js","sourcesContent":["import * as React from \"react\";\n\nconst cx = (...parts: Array<string | undefined | false>) => parts.filter(Boolean).join(\" \");\n\nexport type Theme = \"light\" | \"dark\";\n\nexport interface ThemeToggleProps {\n  size?: number;\n  storageKey?: string;\n  defaultTheme?: Theme;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function ThemeToggle({\n  size = 12,\n  storageKey = \"theme\",\n  defaultTheme = \"dark\",\n  className,\n  style,\n}: ThemeToggleProps) {\n  const [theme, setTheme] = React.useState<Theme>(defaultTheme);\n  const [mounted, setMounted] = React.useState(false);\n\n  React.useEffect(() => {\n    const stored = (localStorage.getItem(storageKey) as Theme | null) ?? defaultTheme;\n    setTheme(stored);\n    setMounted(true);\n  }, [storageKey, defaultTheme]);\n\n  const toggle = () => {\n    const next: Theme = theme === \"dark\" ? \"light\" : \"dark\";\n    setTheme(next);\n    localStorage.setItem(storageKey, next);\n    if (next === \"light\") document.documentElement.setAttribute(\"data-theme\", \"light\");\n    else document.documentElement.removeAttribute(\"data-theme\");\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={toggle}\n      aria-label={`switch to ${theme === \"dark\" ? \"light\" : \"dark\"} mode`}\n      className={cx(\"sn-theme-toggle\", className)}\n      style={{\n        [\"--sn-theme-toggle-size\" as string]: `${size}px`,\n        opacity: mounted ? 1 : 0,\n        ...style,\n      }}\n    >\n      <span className=\"sn-theme-toggle__indicator\" />\n    </button>\n  );\n}\n","import * as React from \"react\";\n\nconst cx = (...parts: Array<string | undefined | false>) => parts.filter(Boolean).join(\" \");\n\nexport interface CopyButtonProps {\n  value: string;\n  size?: number;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function CopyButton({ value, size = 14, className, style }: CopyButtonProps) {\n  const [copied, setCopied] = React.useState(false);\n\n  const onCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setCopied(true);\n      window.setTimeout(() => setCopied(false), 1200);\n    } catch {\n      // ignored\n    }\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onCopy}\n      aria-label={copied ? \"copied\" : \"copy\"}\n      data-copied={copied || undefined}\n      className={cx(\"sn-copy-btn\", className)}\n      style={style}\n    >\n      <svg className=\"sn-copy-btn__idle\" width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n        <rect x=\"9\" y=\"9\" width=\"11\" height=\"11\" rx=\"1.5\" />\n        <path d=\"M5 15V5a1 1 0 0 1 1-1h10\" />\n      </svg>\n      <svg className=\"sn-copy-btn__copied\" width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"m4 12 5 5L20 6\" />\n      </svg>\n    </button>\n  );\n}\n"]}