@hansenexus/hud 0.1.0 → 0.2.0

package/chunk-xjn0896g.js

@@ -1,574 +0,0 @@
-import {
-  HudUnlockPanel,
-  useHudUnlock
-} from "./chunk-msqkkqw7.js";
-import {
-  DevDrawer,
-  DevDrawerProvider,
-  cancelGrab,
-  completeGrab,
-  getGrabberState,
-  subscribeGrabber,
-  useDevDrawer
-} from "./chunk-82nm9wcg.js";
-import {
-  getVitalsSnapshot
-} from "./chunk-ghxh8926.js";
-import {
-  captureBuffer
-} from "./chunk-24vrg16w.js";
-import {
-  hudRequiresUnlock,
-  resolveHudAccess
-} from "./chunk-r06bpmy6.js";
-import {
-  HudProvider,
-  useHud
-} from "./chunk-wspz08q7.js";
-import {
-  isHudVisible,
-  resolveHudEnv
-} from "./chunk-babjpqkb.js";
-import {
-  HUD_BUNDLE_MARKER
-} from "./chunk-v086j53b.js";
-
-// ../review-kit/rail/rail-store.ts
-var tools = [];
-var insetPx = 0;
-var listeners = new Set;
-function emit() {
-  tools = [...tools];
-  for (const listener of listeners)
-    listener();
-}
-function subscribeRail(listener) {
-  listeners.add(listener);
-  return () => listeners.delete(listener);
-}
-function getRailTools() {
-  return tools;
-}
-function registerRailTool(tool) {
-  const index = tools.findIndex((t) => t.id === tool.id);
-  if (index === -1)
-    tools.push(tool);
-  else
-    tools[index] = tool;
-  tools.sort((a, b) => (a.order ?? 100) - (b.order ?? 100));
-  emit();
-}
-function unregisterRailTool(id) {
-  tools = tools.filter((t) => t.id !== id);
-  emit();
-}
-function getRailInset() {
-  return insetPx;
-}
-var host = null;
-function claimRailHost(token) {
-  if (host === null)
-    host = token;
-  return host === token;
-}
-function releaseRailHost(token) {
-  if (host === token)
-    host = null;
-}
-// ../review-kit/rail/tool-rail.tsx
-import { useEffect as useEffect2, useId, useRef, useSyncExternalStore } from "react";
-import { createPortal as createPortal2 } from "react-dom";
-
-// ../review-kit/picker/element-picker.tsx
-import { useEffect, useState } from "react";
-import { createPortal } from "react-dom";
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-"use client";
-var OVERLAY_MARKER = "data-hn-overlay";
-var OVERLAY_Z_INDEX = 2147483000;
-function ElementPicker({
-  active,
-  chromeSelector,
-  onPick,
-  onCancel,
-  hint = "Element wählen · Esc bricht ab",
-  accent = "#fbbf24",
-  accentText = "#3a2a00"
-}) {
-  const [highlight, setHighlight] = useState(null);
-  useEffect(() => {
-    if (!active) {
-      setHighlight(null);
-      return;
-    }
-    const exclude = chromeSelector ? `[${OVERLAY_MARKER}],${chromeSelector}` : `[${OVERLAY_MARKER}]`;
-    document.body.style.cursor = "crosshair";
-    function targetFrom(event) {
-      const el = event.target;
-      if (!(el instanceof Element))
-        return null;
-      if (el.closest(exclude))
-        return null;
-      return el;
-    }
-    function onMove(event) {
-      const el = targetFrom(event);
-      if (!el) {
-        setHighlight(null);
-        return;
-      }
-      const r = el.getBoundingClientRect();
-      setHighlight({
-        left: r.left,
-        top: r.top,
-        width: r.width,
-        height: r.height,
-        label: el.tagName.toLowerCase()
-      });
-    }
-    function onClick(event) {
-      const el = targetFrom(event);
-      if (!el)
-        return;
-      event.preventDefault();
-      event.stopPropagation();
-      onPick(el, { clientX: event.clientX, clientY: event.clientY });
-    }
-    function onKey(event) {
-      if (event.key === "Escape")
-        onCancel();
-    }
-    document.addEventListener("mousemove", onMove, true);
-    document.addEventListener("click", onClick, true);
-    document.addEventListener("keydown", onKey, true);
-    return () => {
-      document.body.style.cursor = "";
-      document.removeEventListener("mousemove", onMove, true);
-      document.removeEventListener("click", onClick, true);
-      document.removeEventListener("keydown", onKey, true);
-    };
-  }, [active, chromeSelector, onPick, onCancel]);
-  if (!active || typeof document === "undefined")
-    return null;
-  const marker = { [OVERLAY_MARKER]: "" };
-  return createPortal(/* @__PURE__ */ jsxs("div", {
-    ...marker,
-    style: { position: "fixed", inset: 0, zIndex: OVERLAY_Z_INDEX, pointerEvents: "none" },
-    children: [
-      /* @__PURE__ */ jsx("div", {
-        style: {
-          position: "fixed",
-          top: 0,
-          left: "50%",
-          transform: "translateX(-50%)",
-          background: accent,
-          color: accentText,
-          font: "700 11px ui-monospace, monospace",
-          padding: "3px 12px",
-          borderRadius: "0 0 6px 6px"
-        },
-        children: hint
-      }),
-      highlight && /* @__PURE__ */ jsxs(Fragment, {
-        children: [
-          /* @__PURE__ */ jsx("div", {
-            style: {
-              position: "fixed",
-              left: highlight.left - 2,
-              top: highlight.top - 2,
-              width: highlight.width + 4,
-              height: highlight.height + 4,
-              border: `1.5px solid ${accent}`,
-              background: "rgba(251,191,36,.08)",
-              borderRadius: 3
-            }
-          }),
-          /* @__PURE__ */ jsx("div", {
-            style: {
-              position: "fixed",
-              left: highlight.left - 2,
-              top: Math.max(highlight.top - 20, 0),
-              background: accent,
-              color: accentText,
-              font: "700 10px ui-monospace, monospace",
-              padding: "1px 6px",
-              borderRadius: 3
-            },
-            children: highlight.label
-          })
-        ]
-      })
-    ]
-  }), document.body);
-}
-
-// ../review-kit/rail/tool-rail.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-"use client";
-function ToolRail() {
-  const token = useRef(Symbol("rail-host"));
-  const id = useId();
-  const tools2 = useSyncExternalStore(subscribeRail, getRailTools, getRailTools);
-  const inset = useSyncExternalStore(subscribeRail, getRailInset, getRailInset);
-  const isHost = claimRailHost(token.current);
-  useEffect2(() => {
-    const claimed = token.current;
-    return () => releaseRailHost(claimed);
-  }, []);
-  if (!isHost || tools2.length === 0 || typeof document === "undefined")
-    return null;
-  const marker = { [OVERLAY_MARKER]: "" };
-  return createPortal2(/* @__PURE__ */ jsx2("div", {
-    ...marker,
-    style: {
-      position: "fixed",
-      right: inset,
-      top: "50%",
-      transform: "translateY(-50%)",
-      zIndex: OVERLAY_Z_INDEX + 100,
-      display: "flex",
-      flexDirection: "column",
-      gap: 4,
-      transition: "right 180ms ease",
-      pointerEvents: "auto"
-    },
-    children: tools2.map((tool) => /* @__PURE__ */ jsx2(RailTab, {
-      tool
-    }, `${id}-${tool.id}`))
-  }), document.body);
-}
-function RailTab({ tool }) {
-  const accent = tool.accent ?? "#111827";
-  return /* @__PURE__ */ jsxs2("button", {
-    onClick: tool.onClick,
-    style: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      gap: 6,
-      padding: "14px 9px",
-      borderRadius: "8px 0 0 8px",
-      border: "none",
-      borderRight: tool.active ? "3px solid #fff" : "none",
-      background: accent,
-      color: "#fff",
-      font: "600 12px ui-sans-serif, system-ui, sans-serif",
-      letterSpacing: ".02em",
-      cursor: "pointer",
-      writingMode: "vertical-rl",
-      boxShadow: "0 2px 10px rgba(0,0,0,.3)",
-      opacity: tool.active ? 1 : 0.92
-    },
-    title: tool.label,
-    type: "button",
-    children: [
-      tool.label,
-      tool.badge !== undefined && tool.badge !== "" && /* @__PURE__ */ jsx2("span", {
-        style: {
-          display: "inline-flex",
-          alignItems: "center",
-          justifyContent: "center",
-          minWidth: 16,
-          height: 16,
-          padding: "0 4px",
-          borderRadius: 8,
-          background: "rgba(255,255,255,.22)",
-          font: "700 10px ui-monospace, monospace",
-          writingMode: "horizontal-tb"
-        },
-        children: tool.badge
-      })
-    ]
-  });
-}
-// hud.tsx
-import { Lock } from "lucide-react";
-import { useEffect as useEffect3, useMemo } from "react";
-
-// capture.ts
-var installed = false;
-var restorers = [];
-var MAX_TEXT = 300;
-function toText(args) {
-  return args.map((arg) => {
-    if (typeof arg === "string")
-      return arg;
-    if (arg instanceof Error)
-      return `${arg.name}: ${arg.message}`;
-    try {
-      return JSON.stringify(arg);
-    } catch {
-      return String(arg);
-    }
-  }).join(" ").slice(0, MAX_TEXT);
-}
-function isHudInternal(url, input, init) {
-  if (url.includes("/api/hud/") || url.includes("/api/otel/vitals"))
-    return true;
-  try {
-    if (new Headers(init?.headers).has("x-hud-internal"))
-      return true;
-    if (input instanceof Request && input.headers.has("x-hud-internal"))
-      return true;
-  } catch {}
-  return false;
-}
-function patchConsole() {
-  const kinds = ["log", "warn", "error"];
-  for (const kind of kinds) {
-    const original = console[kind].bind(console);
-    console[kind] = (...args) => {
-      captureBuffer.push({ kind, text: toText(args) });
-      original(...args);
-    };
-    restorers.push(() => {
-      console[kind] = original;
-    });
-  }
-}
-function patchFetch() {
-  const originalFetch = window.fetch;
-  const callOriginal = originalFetch.bind(window);
-  const patched = async (input, init) => {
-    const url = typeof input === "string" ? input : input instanceof URL ? input.href : input.url;
-    const method = init?.method ?? (input instanceof Request ? input.method : "GET");
-    if (isHudInternal(url, input, init))
-      return callOriginal(input, init);
-    const started = performance.now();
-    try {
-      const response = await callOriginal(input, init);
-      captureBuffer.push({
-        kind: "fetch",
-        text: `${method.toUpperCase()} ${url}`.slice(0, MAX_TEXT),
-        status: response.status,
-        durationMs: Math.round(performance.now() - started)
-      });
-      return response;
-    } catch (error) {
-      captureBuffer.push({
-        kind: "fetch",
-        text: `${method.toUpperCase()} ${url} — ${toText([error])}`.slice(0, MAX_TEXT),
-        status: 0,
-        durationMs: Math.round(performance.now() - started)
-      });
-      throw error;
-    }
-  };
-  window.fetch = Object.assign(patched, originalFetch);
-  restorers.push(() => {
-    window.fetch = originalFetch;
-  });
-}
-function observeLongTasks() {
-  if (typeof PerformanceObserver === "undefined")
-    return;
-  try {
-    const observer = new PerformanceObserver((list) => {
-      for (const entry of list.getEntries()) {
-        captureBuffer.push({
-          kind: "longtask",
-          text: `long task ${Math.round(entry.duration)} ms`,
-          durationMs: Math.round(entry.duration)
-        });
-      }
-    });
-    observer.observe({ type: "longtask", buffered: true });
-    restorers.push(() => observer.disconnect());
-  } catch {}
-}
-function installCapture() {
-  if (installed || typeof window === "undefined")
-    return;
-  installed = true;
-  patchConsole();
-  patchFetch();
-  observeLongTasks();
-}
-function uninstallCapture() {
-  if (!installed)
-    return;
-  while (restorers.length > 0)
-    restorers.pop()?.();
-  installed = false;
-}
-// grabber/element-grabber.tsx
-import { useCallback, useSyncExternalStore as useSyncExternalStore2 } from "react";
-
-// ../review-kit/anchor/selector.ts
-function buildAnchorSelector(el, root) {
-  const segments = [];
-  let node = el;
-  while (node && node !== root) {
-    const tag = node.tagName.toLowerCase();
-    const parent = node.parentElement;
-    if (!parent)
-      break;
-    const siblings = [...parent.children].filter((c) => c.tagName === node?.tagName);
-    const index = siblings.indexOf(node) + 1;
-    segments.unshift(siblings.length > 1 ? `${tag}:nth-of-type(${index})` : tag);
-    node = parent;
-  }
-  return segments.join(" > ");
-}
-function anchorLabelFor(el) {
-  const text = (el.textContent ?? "").trim().replace(/\s+/g, " ");
-  const tag = el.tagName.toLowerCase();
-  return text ? `${tag} “${text.slice(0, 32)}${text.length > 32 ? "…" : ""}”` : tag;
-}
-// grabber/payload.ts
-function buildAnchor(el) {
-  const r = el.getBoundingClientRect();
-  const pct = (part, whole) => whole > 0 ? Number((part / whole * 100).toFixed(1)) : 0;
-  return {
-    selector: buildAnchorSelector(el, document.body),
-    label: anchorLabelFor(el),
-    x: pct(r.left, window.innerWidth),
-    y: pct(r.top, window.innerHeight),
-    width: pct(r.width, window.innerWidth),
-    height: pct(r.height, window.innerHeight)
-  };
-}
-function matchComponentHints(hints, route, label, max = 5) {
-  if (!hints?.length)
-    return [];
-  const tokens = `${route} ${label}`.toLowerCase().split(/[^a-z0-9]+/).filter((t) => t.length > 2);
-  if (tokens.length === 0)
-    return hints.slice(0, max);
-  return hints.map((hint) => {
-    const haystack = `${hint.name} ${hint.path}`.toLowerCase();
-    const score = tokens.reduce((n, token) => haystack.includes(token) ? n + 1 : n, 0);
-    return { hint, score };
-  }).filter((h) => h.score > 0).sort((a, b) => b.score - a.score).slice(0, max).map((h) => h.hint);
-}
-function buildDispatchPayload(input) {
-  const route = window.location.pathname;
-  const recentErrors = captureBuffer.getSnapshot().filter((entry) => entry.kind === "error" || entry.kind === "warn").slice(-5).map((entry) => `[${entry.kind}] ${entry.text.slice(0, 200)}`);
-  return {
-    app: input.config.appSlug,
-    env: input.env,
-    route,
-    anchor: input.anchor,
-    componentHints: matchComponentHints(input.config.componentHints, route, input.anchor.label),
-    recentErrors,
-    vitals: input.vitals,
-    grabbedAt: new Date().toISOString()
-  };
-}
-
-// grabber/element-grabber.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-"use client";
-function GrabberController() {
-  const { config, env } = useHud();
-  const { openDrawer, setActiveTab } = useDevDrawer();
-  const grabber = useSyncExternalStore2(subscribeGrabber, getGrabberState, getGrabberState);
-  const onPick = useCallback((el, _point) => {
-    completeGrab(buildDispatchPayload({ config, env, anchor: buildAnchor(el), vitals: getVitalsSnapshot() }));
-    setActiveTab("dispatch");
-    openDrawer();
-  }, [config, env, openDrawer, setActiveTab]);
-  return /* @__PURE__ */ jsx3(ElementPicker, {
-    active: grabber.mode === "grabbing",
-    chromeSelector: HUD_CHROME_SELECTOR,
-    onPick,
-    onCancel: cancelGrab,
-    hint: "grab active — click an element · Esc cancels"
-  });
-}
-var HUD_CHROME_SELECTOR = "[data-hud-chrome]";
-
-// hud.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-"use client";
-var ENV_BADGE = {
-  development: "DEV",
-  preview: "PREVIEW",
-  staging: "STAGING",
-  production: "PROD · READ-ONLY",
-  disabled: "OFF"
-};
-function Hud({ config, panels }) {
-  const env = resolveHudEnv();
-  if (!isHudVisible(env))
-    return null;
-  return /* @__PURE__ */ jsx4(DevDrawerProvider, {
-    config: {
-      storageKey: config.storageKey ?? `${config.appSlug}-hud`,
-      shortcutKey: config.shortcutKey === undefined ? "h" : config.shortcutKey,
-      defaultHeight: 38,
-      minHeight: 25,
-      maxHeight: 75
-    },
-    children: /* @__PURE__ */ jsx4(HudProvider, {
-      config,
-      env,
-      panels,
-      children: /* @__PURE__ */ jsx4(HudChrome, {})
-    })
-  });
-}
-function HudChrome() {
-  const { config, env, name, panels } = useHud();
-  const { isOpen, toggleDrawer } = useDevDrawer();
-  const access = resolveHudAccess(env);
-  const apiBase = config.apiBase ?? "/api/hud";
-  const { state: unlockState, error: unlockError, unlock } = useHudUnlock(apiBase, access);
-  const locked = hudRequiresUnlock(access) && unlockState !== "unlocked";
-  useEffect3(() => {
-    installCapture();
-  }, []);
-  const tabs = useMemo(() => {
-    if (locked) {
-      return [
-        {
-          id: "unlock",
-          label: "Locked",
-          icon: Lock,
-          content: /* @__PURE__ */ jsx4(HudUnlockPanel, {
-            env,
-            state: unlockState,
-            error: unlockError,
-            onUnlock: unlock
-          })
-        }
-      ];
-    }
-    return panels.map((panel) => ({
-      id: panel.id,
-      label: panel.label,
-      icon: panel.icon,
-      content: panel.content
-    }));
-  }, [locked, env, unlockState, unlockError, unlock, panels]);
-  useEffect3(() => {
-    if (config.showFab === false)
-      return;
-    registerRailTool({
-      id: "hud",
-      label: "hud",
-      accent: "#0369a1",
-      order: 20,
-      active: isOpen,
-      onClick: toggleDrawer
-    });
-    return () => unregisterRailTool("hud");
-  }, [config.showFab, isOpen, toggleDrawer]);
-  if (tabs.length === 0)
-    return null;
-  return /* @__PURE__ */ jsxs3("div", {
-    "data-hud-chrome": true,
-    "data-hud-marker": HUD_BUNDLE_MARKER,
-    style: { display: "contents" },
-    children: [
-      /* @__PURE__ */ jsx4(ToolRail, {}),
-      /* @__PURE__ */ jsx4(DevDrawer, {
-        tabs,
-        title: name,
-        badgeLabel: ENV_BADGE[env]
-      }),
-      !locked && /* @__PURE__ */ jsx4(GrabberController, {})
-    ]
-  });
-}
-
-export { installCapture, uninstallCapture, buildAnchorSelector, buildAnchor, matchComponentHints, buildDispatchPayload, Hud };

package/chunk-xztw0xyt.js

@@ -1,113 +0,0 @@
-// ../ui/lib/utils.ts
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// ../ui/components/badge.tsx
-import { Slot } from "@radix-ui/react-slot";
-import { cva } from "class-variance-authority";
-import { jsx } from "react/jsx-runtime";
-var badgeVariants = cva("inline-flex items-center justify-center rounded-full border border-transparent px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden", {
-  variants: {
-    variant: {
-      default: "bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
-      secondary: "bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
-      destructive: "bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-      outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-      ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-      link: "text-primary underline-offset-4 [a&]:hover:underline",
-      success: "bg-emerald-500/15 text-emerald-700 border-emerald-500/20 dark:text-emerald-300 dark:bg-emerald-400/15 dark:border-emerald-400/25 [a&]:hover:bg-emerald-500/25",
-      warning: "bg-amber-500/15 text-amber-700 border-amber-500/20 dark:text-amber-300 dark:bg-amber-400/15 dark:border-amber-400/25 [a&]:hover:bg-amber-500/25",
-      info: "bg-blue-500/15 text-blue-700 border-blue-500/20 dark:text-blue-300 dark:bg-blue-400/15 dark:border-blue-400/25 [a&]:hover:bg-blue-500/25",
-      muted: "bg-muted text-muted-foreground border-transparent [a&]:hover:bg-muted/80"
-    }
-  },
-  defaultVariants: {
-    variant: "default"
-  }
-});
-function Badge({
-  className,
-  variant = "default",
-  asChild = false,
-  ...props
-}) {
-  const Comp = asChild ? Slot : "span";
-  return /* @__PURE__ */ jsx(Comp, {
-    "data-slot": "badge",
-    "data-variant": variant,
-    className: cn(badgeVariants({ variant }), className),
-    ...props
-  });
-}
-
-// ../ui/components/button.tsx
-import { Slot as Slot2 } from "@radix-ui/react-slot";
-import { cva as cva2 } from "class-variance-authority";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var buttonVariants = cva2("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
-  variants: {
-    variant: {
-      default: "bg-primary text-primary-foreground hover:bg-primary/90",
-      destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-      outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-      secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-      ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-      link: "text-primary underline-offset-4 hover:underline"
-    },
-    size: {
-      default: "h-9 px-4 py-2 has-[>svg]:px-3",
-      xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
-      sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-      lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-      icon: "size-9",
-      "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
-      "icon-sm": "size-8",
-      "icon-lg": "size-10"
-    }
-  },
-  defaultVariants: {
-    variant: "default",
-    size: "default"
-  }
-});
-function Button({
-  className,
-  variant = "default",
-  size = "default",
-  asChild = false,
-  ...props
-}) {
-  const Comp = asChild ? Slot2 : "button";
-  return /* @__PURE__ */ jsx2(Comp, {
-    "data-slot": "button",
-    "data-variant": variant,
-    "data-size": size,
-    className: cn(buttonVariants({ variant, size, className })),
-    ...props
-  });
-}
-
-// ../ui/components/switch.tsx
-import * as SwitchPrimitive from "@radix-ui/react-switch";
-import { jsx as jsx3 } from "react/jsx-runtime";
-"use client";
-function Switch({
-  className,
-  size = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx3(SwitchPrimitive.Root, {
-    "data-slot": "switch",
-    "data-size": size,
-    className: cn("peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 group/switch inline-flex shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-[1.15rem] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6", className),
-    ...props,
-    children: /* @__PURE__ */ jsx3(SwitchPrimitive.Thumb, {
-      "data-slot": "switch-thumb",
-      className: cn("bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block rounded-full ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0")
-    })
-  });
-}
-export { cn, Badge, Button, Switch };