@prototyperco/ui 0.5.0-alpha.0 → 0.5.0

package/dist/components/toast.d.cts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { ToastManagerPromiseOptions } from '@base-ui/react/toast';
+
+declare function Toaster(): react_jsx_runtime.JSX.Element;
+declare function ToastProvider({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+interface ToastOptions {
+    description?: React.ReactNode;
+    action?: {
+        label: string;
+        onClick: () => void;
+    };
+    duration?: number;
+}
+declare function toast(title: string, opts?: ToastOptions): string;
+declare namespace toast {
+    var success: (title: string, opts?: ToastOptions) => string;
+    var error: (title: string, opts?: ToastOptions) => string;
+    var warning: (title: string, opts?: ToastOptions) => string;
+    var info: (title: string, opts?: ToastOptions) => string;
+    var promise: <T>(promise: Promise<T>, opts: ToastManagerPromiseOptions<T, object>) => Promise<T>;
+}
+
+type ToastProviderProps = React.ComponentProps<typeof ToastProvider>;
+
+export { type ToastOptions, ToastProvider, type ToastProviderProps, Toaster, toast };

package/dist/components/toast.d.ts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { ToastManagerPromiseOptions } from '@base-ui/react/toast';
+
+declare function Toaster(): react_jsx_runtime.JSX.Element;
+declare function ToastProvider({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+interface ToastOptions {
+    description?: React.ReactNode;
+    action?: {
+        label: string;
+        onClick: () => void;
+    };
+    duration?: number;
+}
+declare function toast(title: string, opts?: ToastOptions): string;
+declare namespace toast {
+    var success: (title: string, opts?: ToastOptions) => string;
+    var error: (title: string, opts?: ToastOptions) => string;
+    var warning: (title: string, opts?: ToastOptions) => string;
+    var info: (title: string, opts?: ToastOptions) => string;
+    var promise: <T>(promise: Promise<T>, opts: ToastManagerPromiseOptions<T, object>) => Promise<T>;
+}
+
+type ToastProviderProps = React.ComponentProps<typeof ToastProvider>;
+
+export { type ToastOptions, ToastProvider, type ToastProviderProps, Toaster, toast };

package/dist/components/toast.js

@@ -0,0 +1,147 @@
+"use client";
+
+// src/components/toast.tsx
+import { Toast as ToastPrimitive } from "@base-ui/react/toast";
+import {
+  CircleCheckIcon,
+  InfoIcon,
+  TriangleAlertIcon,
+  OctagonXIcon,
+  Loader2Icon
+} from "lucide-react";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/toast.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var toastManager = ToastPrimitive.createToastManager();
+var toastIcons = {
+  success: /* @__PURE__ */ jsx(
+    CircleCheckIcon,
+    {
+      "data-slot": "toast-icon",
+      className: "size-4 shrink-0 text-success"
+    }
+  ),
+  info: /* @__PURE__ */ jsx(InfoIcon, { "data-slot": "toast-icon", className: "size-4 shrink-0 text-info" }),
+  warning: /* @__PURE__ */ jsx(
+    TriangleAlertIcon,
+    {
+      "data-slot": "toast-icon",
+      className: "size-4 shrink-0 text-warning"
+    }
+  ),
+  error: /* @__PURE__ */ jsx(
+    OctagonXIcon,
+    {
+      "data-slot": "toast-icon",
+      className: "size-4 shrink-0 text-destructive"
+    }
+  ),
+  loading: /* @__PURE__ */ jsx(
+    Loader2Icon,
+    {
+      "data-slot": "toast-icon",
+      className: "size-4 shrink-0 text-muted-foreground animate-spin motion-reduce:animate-none"
+    }
+  )
+};
+function ToastItem({ toast: toast2 }) {
+  const icon = toast2.type ? toastIcons[toast2.type] : void 0;
+  return /* @__PURE__ */ jsxs(
+    ToastPrimitive.Root,
+    {
+      "data-slot": "toast",
+      toast: toast2,
+      className: cn(
+        "bg-overlay text-overlay-foreground shadow-overlay flex items-center gap-3 rounded-lg border p-4 text-sm",
+        "transition-[opacity,transform] duration-250 ease-out-fluid",
+        "data-ending-style:opacity-0 data-ending-style:translate-y-2",
+        "data-starting-style:opacity-0 data-starting-style:translate-y-2",
+        "data-[swipe-direction]:translate-x-[var(--toast-swipe-movement-x)] data-[swipe-direction]:translate-y-[var(--toast-swipe-movement-y)]",
+        "motion-reduce:animate-none motion-reduce:transition-none"
+      ),
+      children: [
+        icon,
+        /* @__PURE__ */ jsxs("div", { "data-slot": "toast-content", className: "flex-1 min-w-0", children: [
+          toast2.title && /* @__PURE__ */ jsx(ToastPrimitive.Title, { "data-slot": "toast-title", className: "font-medium", children: toast2.title }),
+          toast2.description && /* @__PURE__ */ jsx(
+            ToastPrimitive.Description,
+            {
+              "data-slot": "toast-description",
+              className: "text-muted-foreground text-sm",
+              children: toast2.description
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          ToastPrimitive.Action,
+          {
+            "data-slot": "toast-action",
+            className: "shrink-0 rounded-md border bg-surface px-2.5 py-1 text-xs font-medium transition-[color,background-color,border-color,box-shadow,opacity] duration-150 ease-smooth hover-only:hover:bg-surface-secondary motion-reduce:transition-none"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ToastPrimitive.Close,
+          {
+            "data-slot": "toast-close",
+            className: "shrink-0 rounded-md p-0.5 text-muted-foreground transition-[color,background-color,border-color,box-shadow,opacity] duration-150 ease-smooth hover-only:hover:text-foreground motion-reduce:transition-none",
+            "aria-label": "Dismiss",
+            children: "\xD7"
+          }
+        )
+      ]
+    }
+  );
+}
+function Toaster() {
+  const { toasts } = ToastPrimitive.useToastManager();
+  return /* @__PURE__ */ jsx(
+    ToastPrimitive.Viewport,
+    {
+      "data-slot": "toaster",
+      className: "fixed bottom-4 right-4 z-[100] flex w-[356px] max-w-[calc(100vw-2rem)] flex-col gap-2",
+      children: toasts.map((t) => /* @__PURE__ */ jsx(ToastItem, { toast: t }, t.id))
+    }
+  );
+}
+function ToastProvider({ children }) {
+  return /* @__PURE__ */ jsxs(ToastPrimitive.Provider, { toastManager, children: [
+    children,
+    /* @__PURE__ */ jsx(Toaster, {})
+  ] });
+}
+function addToast(title, type, opts) {
+  const options = {
+    title,
+    ...type && { type },
+    ...opts?.description && { description: opts.description },
+    ...opts?.duration !== void 0 && { timeout: opts.duration },
+    ...opts?.action && {
+      actionProps: {
+        children: opts.action.label,
+        onClick: opts.action.onClick
+      }
+    }
+  };
+  return toastManager.add(options);
+}
+function toast(title, opts) {
+  return addToast(title, void 0, opts);
+}
+toast.success = (title, opts) => addToast(title, "success", opts);
+toast.error = (title, opts) => addToast(title, "error", opts);
+toast.warning = (title, opts) => addToast(title, "warning", opts);
+toast.info = (title, opts) => addToast(title, "info", opts);
+toast.promise = (promise, opts) => toastManager.promise(promise, opts);
+export {
+  ToastProvider,
+  Toaster,
+  toast
+};
+//# sourceMappingURL=toast.js.map

package/dist/components/toast.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/toast.tsx","../../src/lib/utils.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Toast as ToastPrimitive } from \"@base-ui/react/toast\";\nimport type {\n  ToastObject,\n  ToastManagerAddOptions,\n  ToastManagerPromiseOptions,\n} from \"@base-ui/react/toast\";\nimport {\n  CircleCheckIcon,\n  InfoIcon,\n  TriangleAlertIcon,\n  OctagonXIcon,\n  Loader2Icon,\n} from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\n\n// ── Global manager (imperative API from outside React) ──────────────────────\n\nconst toastManager = ToastPrimitive.createToastManager();\n\n// ── Icons per type ──────────────────────────────────────────────────────────\n\nconst toastIcons: Record<string, React.ReactNode> = {\n  success: (\n    <CircleCheckIcon\n      data-slot=\"toast-icon\"\n      className=\"size-4 shrink-0 text-success\"\n    />\n  ),\n  info: (\n    <InfoIcon data-slot=\"toast-icon\" className=\"size-4 shrink-0 text-info\" />\n  ),\n  warning: (\n    <TriangleAlertIcon\n      data-slot=\"toast-icon\"\n      className=\"size-4 shrink-0 text-warning\"\n    />\n  ),\n  error: (\n    <OctagonXIcon\n      data-slot=\"toast-icon\"\n      className=\"size-4 shrink-0 text-destructive\"\n    />\n  ),\n  loading: (\n    <Loader2Icon\n      data-slot=\"toast-icon\"\n      className=\"size-4 shrink-0 text-muted-foreground animate-spin motion-reduce:animate-none\"\n    />\n  ),\n};\n\n// ── ToastItem (renders a single toast) ──────────────────────────────────────\n\nfunction ToastItem({ toast }: { toast: ToastObject<object> }) {\n  const icon = toast.type ? toastIcons[toast.type] : undefined;\n\n  return (\n    <ToastPrimitive.Root\n      data-slot=\"toast\"\n      toast={toast}\n      className={cn(\n        \"bg-overlay text-overlay-foreground shadow-overlay flex items-center gap-3 rounded-lg border p-4 text-sm\",\n        \"transition-[opacity,transform] duration-250 ease-out-fluid\",\n        \"data-ending-style:opacity-0 data-ending-style:translate-y-2\",\n        \"data-starting-style:opacity-0 data-starting-style:translate-y-2\",\n        \"data-[swipe-direction]:translate-x-[var(--toast-swipe-movement-x)] data-[swipe-direction]:translate-y-[var(--toast-swipe-movement-y)]\",\n        \"motion-reduce:animate-none motion-reduce:transition-none\",\n      )}\n    >\n      {icon}\n      <div data-slot=\"toast-content\" className=\"flex-1 min-w-0\">\n        {toast.title && (\n          <ToastPrimitive.Title data-slot=\"toast-title\" className=\"font-medium\">\n            {toast.title}\n          </ToastPrimitive.Title>\n        )}\n        {toast.description && (\n          <ToastPrimitive.Description\n            data-slot=\"toast-description\"\n            className=\"text-muted-foreground text-sm\"\n          >\n            {toast.description}\n          </ToastPrimitive.Description>\n        )}\n      </div>\n      <ToastPrimitive.Action\n        data-slot=\"toast-action\"\n        className=\"shrink-0 rounded-md border bg-surface px-2.5 py-1 text-xs font-medium transition-[color,background-color,border-color,box-shadow,opacity] duration-150 ease-smooth hover-only:hover:bg-surface-secondary motion-reduce:transition-none\"\n      />\n      <ToastPrimitive.Close\n        data-slot=\"toast-close\"\n        className=\"shrink-0 rounded-md p-0.5 text-muted-foreground transition-[color,background-color,border-color,box-shadow,opacity] duration-150 ease-smooth hover-only:hover:text-foreground motion-reduce:transition-none\"\n        aria-label=\"Dismiss\"\n      >\n        ×\n      </ToastPrimitive.Close>\n    </ToastPrimitive.Root>\n  );\n}\n\n// ── Toaster (viewport + renders toast list) ─────────────────────────────────\n\nfunction Toaster() {\n  const { toasts } = ToastPrimitive.useToastManager();\n\n  return (\n    <ToastPrimitive.Viewport\n      data-slot=\"toaster\"\n      className=\"fixed bottom-4 right-4 z-[100] flex w-[356px] max-w-[calc(100vw-2rem)] flex-col gap-2\"\n    >\n      {toasts.map((t) => (\n        <ToastItem key={t.id} toast={t} />\n      ))}\n    </ToastPrimitive.Viewport>\n  );\n}\n\n// ── ToastProvider (wraps app) ───────────────────────────────────────────────\n\nfunction ToastProvider({ children }: { children: React.ReactNode }) {\n  return (\n    <ToastPrimitive.Provider toastManager={toastManager}>\n      {children}\n      <Toaster />\n    </ToastPrimitive.Provider>\n  );\n}\n\n// ── Imperative API ──────────────────────────────────────────────────────────\n\ninterface ToastOptions {\n  description?: React.ReactNode;\n  action?: { label: string; onClick: () => void };\n  duration?: number;\n}\n\nfunction addToast(title: string, type?: string, opts?: ToastOptions) {\n  const options: ToastManagerAddOptions<object> = {\n    title,\n    ...(type && { type }),\n    ...(opts?.description && { description: opts.description }),\n    ...(opts?.duration !== undefined && { timeout: opts.duration }),\n    ...(opts?.action && {\n      actionProps: {\n        children: opts.action.label,\n        onClick: opts.action.onClick,\n      },\n    }),\n  };\n  return toastManager.add(options);\n}\n\nfunction toast(title: string, opts?: ToastOptions) {\n  return addToast(title, undefined, opts);\n}\n\ntoast.success = (title: string, opts?: ToastOptions) =>\n  addToast(title, \"success\", opts);\n\ntoast.error = (title: string, opts?: ToastOptions) =>\n  addToast(title, \"error\", opts);\n\ntoast.warning = (title: string, opts?: ToastOptions) =>\n  addToast(title, \"warning\", opts);\n\ntoast.info = (title: string, opts?: ToastOptions) =>\n  addToast(title, \"info\", opts);\n\ntoast.promise = <T,>(\n  promise: Promise<T>,\n  opts: ToastManagerPromiseOptions<T, object>,\n) => toastManager.promise(promise, opts);\n\n// ── Exports ─────────────────────────────────────────────────────────────────\n\nexport { ToastProvider, Toaster, toast };\n\nexport type ToastProviderProps = React.ComponentProps<typeof ToastProvider>;\nexport type { ToastOptions };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":"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","names":["toast"]}

package/dist/components/toggle-group.cjs

@@ -0,0 +1,171 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/toggle-group.tsx
+var toggle_group_exports = {};
+__export(toggle_group_exports, {
+  ToggleGroup: () => ToggleGroup,
+  ToggleGroupItem: () => ToggleGroupItem
+});
+module.exports = __toCommonJS(toggle_group_exports);
+var React = __toESM(require("react"), 1);
+var import_toggle2 = require("@base-ui/react/toggle");
+var import_toggle_group = require("@base-ui/react/toggle-group");
+
+// src/lib/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/components/toggle.tsx
+var import_toggle = require("@base-ui/react/toggle");
+var import_class_variance_authority = require("class-variance-authority");
+var import_jsx_runtime = require("react/jsx-runtime");
+var toggleVariants = (0, import_class_variance_authority.cva)(
+  [
+    "inline-flex items-center justify-center rounded-md text-sm font-medium transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth",
+    "motion-safe:active:scale-[0.97]",
+    "motion-reduce:transition-none",
+    "no-highlight",
+    "focus-visible:focus-ring",
+    "disabled:status-disabled",
+    "hover-only:bg-muted hover-only:text-muted-foreground",
+    "aria-pressed:bg-primary-soft aria-pressed:text-primary",
+    "hover-only:aria-pressed:bg-primary-soft-hover hover-only:aria-pressed:text-primary",
+    "[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+    "group/toggle"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline: "border border-field-border bg-transparent shadow-field hover-only:bg-accent hover-only:text-accent-foreground aria-pressed:shadow-none aria-pressed:border-transparent"
+      },
+      size: {
+        default: "h-9 px-3",
+        sm: "h-8 px-2",
+        lg: "h-10 px-3"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+
+// src/components/toggle-group.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var ToggleGroupContext = React.createContext({
+  size: "default",
+  variant: "default",
+  spacing: 0,
+  orientation: "horizontal"
+});
+function ToggleGroup({
+  className,
+  variant,
+  size,
+  spacing = 0,
+  orientation = "horizontal",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_toggle_group.ToggleGroup,
+    {
+      "data-slot": "toggle-group",
+      "data-variant": variant,
+      "data-size": size,
+      "data-spacing": spacing,
+      "data-orientation": orientation,
+      style: { "--gap": spacing },
+      className: cn(
+        /* Base */
+        "group/toggle-group flex w-fit flex-row items-center rounded-md data-vertical:flex-col data-vertical:items-stretch",
+        /* Spaced: gap from CSS var */
+        "gap-[--spacing(var(--gap))]",
+        /* Flush (spacing=0): container treatment à la Base UI */
+        "data-[spacing=0]:gap-px data-[spacing=0]:p-0.5 data-[spacing=0]:bg-surface-secondary",
+        /* Flush + outline: add border & shadow to container */
+        "data-[spacing=0]:data-[variant=outline]:border data-[spacing=0]:data-[variant=outline]:border-field-border data-[spacing=0]:data-[variant=outline]:shadow-field",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        ToggleGroupContext.Provider,
+        {
+          value: { variant, size, spacing, orientation },
+          children
+        }
+      )
+    }
+  );
+}
+function ToggleGroupItem({
+  className,
+  children,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  const context = React.useContext(ToggleGroupContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_toggle2.Toggle,
+    {
+      "data-slot": "toggle-group-item",
+      "data-variant": context.variant || variant,
+      "data-size": context.size || size,
+      "data-spacing": context.spacing,
+      className: cn(
+        /* Flush (spacing=0): strip item chrome, small inner radius */
+        "group-data-[spacing=0]/toggle-group:rounded-sm group-data-[spacing=0]/toggle-group:border-0 group-data-[spacing=0]/toggle-group:shadow-none group-data-[spacing=0]/toggle-group:px-2",
+        /* Flush: disable press scale (items are tightly packed) */
+        "group-data-[spacing=0]/toggle-group:motion-safe:active:!scale-100",
+        "shrink-0 focus:z-10 focus-visible:z-10",
+        toggleVariants({
+          variant: context.variant || variant,
+          size: context.size || size
+        }),
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ToggleGroup,
+  ToggleGroupItem
+});
+//# sourceMappingURL=toggle-group.cjs.map

package/dist/components/toggle-group.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/toggle-group.tsx","../../src/lib/utils.ts","../../src/components/toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport { ToggleGroup as ToggleGroupPrimitive } from \"@base-ui/react/toggle-group\";\nimport { type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\nimport { toggleVariants } from \"./toggle\";\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n    orientation?: \"horizontal\" | \"vertical\";\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 0,\n  orientation: \"horizontal\",\n});\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 0,\n  orientation = \"horizontal\",\n  children,\n  ...props\n}: ToggleGroupPrimitive.Props &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n    orientation?: \"horizontal\" | \"vertical\";\n  }) {\n  return (\n    <ToggleGroupPrimitive\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      data-orientation={orientation}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        /* Base */\n        \"group/toggle-group flex w-fit flex-row items-center rounded-md data-vertical:flex-col data-vertical:items-stretch\",\n        /* Spaced: gap from CSS var */\n        \"gap-[--spacing(var(--gap))]\",\n        /* Flush (spacing=0): container treatment à la Base UI */\n        \"data-[spacing=0]:gap-px data-[spacing=0]:p-0.5 data-[spacing=0]:bg-surface-secondary\",\n        /* Flush + outline: add border & shadow to container */\n        \"data-[spacing=0]:data-[variant=outline]:border data-[spacing=0]:data-[variant=outline]:border-field-border data-[spacing=0]:data-[variant=outline]:shadow-field\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider\n        value={{ variant, size, spacing, orientation }}\n      >\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive>\n  );\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext);\n\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-spacing={context.spacing}\n      className={cn(\n        /* Flush (spacing=0): strip item chrome, small inner radius */\n        \"group-data-[spacing=0]/toggle-group:rounded-sm group-data-[spacing=0]/toggle-group:border-0 group-data-[spacing=0]/toggle-group:shadow-none group-data-[spacing=0]/toggle-group:px-2\",\n        /* Flush: disable press scale (items are tightly packed) */\n        \"group-data-[spacing=0]/toggle-group:motion-safe:active:!scale-100\",\n        \"shrink-0 focus:z-10 focus-visible:z-10\",\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </TogglePrimitive>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n\nexport type ToggleGroupProps = React.ComponentProps<typeof ToggleGroup>;\nexport type ToggleGroupItemProps = React.ComponentProps<typeof ToggleGroupItem>;\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst toggleVariants = cva(\n  [\n    \"inline-flex items-center justify-center rounded-md text-sm font-medium transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth\",\n    \"motion-safe:active:scale-[0.97]\",\n    \"motion-reduce:transition-none\",\n    \"no-highlight\",\n    \"focus-visible:focus-ring\",\n    \"disabled:status-disabled\",\n    \"hover-only:bg-muted hover-only:text-muted-foreground\",\n    \"aria-pressed:bg-primary-soft aria-pressed:text-primary\",\n    \"hover-only:aria-pressed:bg-primary-soft-hover hover-only:aria-pressed:text-primary\",\n    \"[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n    \"group/toggle\",\n  ],\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        outline:\n          \"border border-field-border bg-transparent shadow-field hover-only:bg-accent hover-only:text-accent-foreground aria-pressed:shadow-none aria-pressed:border-transparent\",\n      },\n      size: {\n        default: \"h-9 px-3\",\n        sm: \"h-8 px-2\",\n        lg: \"h-10 px-3\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nfunction Toggle({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Toggle, toggleVariants };\n\nexport type ToggleProps = React.ComponentProps<typeof Toggle>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,YAAuB;AACvB,IAAAA,iBAA0C;AAC1C,0BAAoD;;;ACJpD,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ACHA,oBAA0C;AAC1C,sCAAuC;AA6CnC;AAzCJ,IAAM,qBAAiB;AAAA,EACrB;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,SACE;AAAA,MACJ;AAAA,MACA,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AACF;;;AFiBM,IAAAC,sBAAA;AA9CN,IAAM,qBAA2B,oBAK/B;AAAA,EACA,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,aAAa;AACf,CAAC;AAED,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,cAAc;AAAA,EACd;AAAA,EACA,GAAG;AACL,GAIK;AACH,SACE;AAAA,IAAC,oBAAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,aAAW;AAAA,MACX,gBAAc;AAAA,MACd,oBAAkB;AAAA,MAClB,OAAO,EAAE,SAAS,QAAQ;AAAA,MAC1B,WAAW;AAAA;AAAA,QAET;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,QAAC,mBAAmB;AAAA,QAAnB;AAAA,UACC,OAAO,EAAE,SAAS,MAAM,SAAS,YAAY;AAAA,UAE5C;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,GAAG;AACL,GAAgE;AAC9D,QAAM,UAAgB,iBAAW,kBAAkB;AAEnD,SACE;AAAA,IAAC,eAAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc,QAAQ,WAAW;AAAA,MACjC,aAAW,QAAQ,QAAQ;AAAA,MAC3B,gBAAc,QAAQ;AAAA,MACtB,WAAW;AAAA;AAAA,QAET;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,UACb,SAAS,QAAQ,WAAW;AAAA,UAC5B,MAAM,QAAQ,QAAQ;AAAA,QACxB,CAAC;AAAA,QACD;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":["import_toggle","import_jsx_runtime","ToggleGroupPrimitive","TogglePrimitive"]}

package/dist/components/toggle-group.d.cts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { Toggle } from '@base-ui/react/toggle';
+import { ToggleGroup as ToggleGroup$1 } from '@base-ui/react/toggle-group';
+import { VariantProps } from 'class-variance-authority';
+import { toggleVariants } from './toggle.cjs';
+import 'class-variance-authority/types';
+
+declare function ToggleGroup({ className, variant, size, spacing, orientation, children, ...props }: ToggleGroup$1.Props & VariantProps<typeof toggleVariants> & {
+    spacing?: number;
+    orientation?: "horizontal" | "vertical";
+}): react_jsx_runtime.JSX.Element;
+declare function ToggleGroupItem({ className, children, variant, size, ...props }: Toggle.Props & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
+
+type ToggleGroupProps = React.ComponentProps<typeof ToggleGroup>;
+type ToggleGroupItemProps = React.ComponentProps<typeof ToggleGroupItem>;
+
+export { ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps };

package/dist/components/toggle-group.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { Toggle } from '@base-ui/react/toggle';
+import { ToggleGroup as ToggleGroup$1 } from '@base-ui/react/toggle-group';
+import { VariantProps } from 'class-variance-authority';
+import { toggleVariants } from './toggle.js';
+import 'class-variance-authority/types';
+
+declare function ToggleGroup({ className, variant, size, spacing, orientation, children, ...props }: ToggleGroup$1.Props & VariantProps<typeof toggleVariants> & {
+    spacing?: number;
+    orientation?: "horizontal" | "vertical";
+}): react_jsx_runtime.JSX.Element;
+declare function ToggleGroupItem({ className, children, variant, size, ...props }: Toggle.Props & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
+
+type ToggleGroupProps = React.ComponentProps<typeof ToggleGroup>;
+type ToggleGroupItemProps = React.ComponentProps<typeof ToggleGroupItem>;
+
+export { ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps };

package/dist/components/toggle-group.js

@@ -0,0 +1,136 @@
+"use client";
+
+// src/components/toggle-group.tsx
+import * as React from "react";
+import { Toggle as TogglePrimitive2 } from "@base-ui/react/toggle";
+import { ToggleGroup as ToggleGroupPrimitive } from "@base-ui/react/toggle-group";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/toggle.tsx
+import { Toggle as TogglePrimitive } from "@base-ui/react/toggle";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var toggleVariants = cva(
+  [
+    "inline-flex items-center justify-center rounded-md text-sm font-medium transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth",
+    "motion-safe:active:scale-[0.97]",
+    "motion-reduce:transition-none",
+    "no-highlight",
+    "focus-visible:focus-ring",
+    "disabled:status-disabled",
+    "hover-only:bg-muted hover-only:text-muted-foreground",
+    "aria-pressed:bg-primary-soft aria-pressed:text-primary",
+    "hover-only:aria-pressed:bg-primary-soft-hover hover-only:aria-pressed:text-primary",
+    "[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+    "group/toggle"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline: "border border-field-border bg-transparent shadow-field hover-only:bg-accent hover-only:text-accent-foreground aria-pressed:shadow-none aria-pressed:border-transparent"
+      },
+      size: {
+        default: "h-9 px-3",
+        sm: "h-8 px-2",
+        lg: "h-10 px-3"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+
+// src/components/toggle-group.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var ToggleGroupContext = React.createContext({
+  size: "default",
+  variant: "default",
+  spacing: 0,
+  orientation: "horizontal"
+});
+function ToggleGroup({
+  className,
+  variant,
+  size,
+  spacing = 0,
+  orientation = "horizontal",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    ToggleGroupPrimitive,
+    {
+      "data-slot": "toggle-group",
+      "data-variant": variant,
+      "data-size": size,
+      "data-spacing": spacing,
+      "data-orientation": orientation,
+      style: { "--gap": spacing },
+      className: cn(
+        /* Base */
+        "group/toggle-group flex w-fit flex-row items-center rounded-md data-vertical:flex-col data-vertical:items-stretch",
+        /* Spaced: gap from CSS var */
+        "gap-[--spacing(var(--gap))]",
+        /* Flush (spacing=0): container treatment à la Base UI */
+        "data-[spacing=0]:gap-px data-[spacing=0]:p-0.5 data-[spacing=0]:bg-surface-secondary",
+        /* Flush + outline: add border & shadow to container */
+        "data-[spacing=0]:data-[variant=outline]:border data-[spacing=0]:data-[variant=outline]:border-field-border data-[spacing=0]:data-[variant=outline]:shadow-field",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx2(
+        ToggleGroupContext.Provider,
+        {
+          value: { variant, size, spacing, orientation },
+          children
+        }
+      )
+    }
+  );
+}
+function ToggleGroupItem({
+  className,
+  children,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  const context = React.useContext(ToggleGroupContext);
+  return /* @__PURE__ */ jsx2(
+    TogglePrimitive2,
+    {
+      "data-slot": "toggle-group-item",
+      "data-variant": context.variant || variant,
+      "data-size": context.size || size,
+      "data-spacing": context.spacing,
+      className: cn(
+        /* Flush (spacing=0): strip item chrome, small inner radius */
+        "group-data-[spacing=0]/toggle-group:rounded-sm group-data-[spacing=0]/toggle-group:border-0 group-data-[spacing=0]/toggle-group:shadow-none group-data-[spacing=0]/toggle-group:px-2",
+        /* Flush: disable press scale (items are tightly packed) */
+        "group-data-[spacing=0]/toggle-group:motion-safe:active:!scale-100",
+        "shrink-0 focus:z-10 focus-visible:z-10",
+        toggleVariants({
+          variant: context.variant || variant,
+          size: context.size || size
+        }),
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+export {
+  ToggleGroup,
+  ToggleGroupItem
+};
+//# sourceMappingURL=toggle-group.js.map

package/dist/components/toggle-group.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/toggle-group.tsx","../../src/lib/utils.ts","../../src/components/toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport { ToggleGroup as ToggleGroupPrimitive } from \"@base-ui/react/toggle-group\";\nimport { type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\nimport { toggleVariants } from \"./toggle\";\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n    orientation?: \"horizontal\" | \"vertical\";\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 0,\n  orientation: \"horizontal\",\n});\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 0,\n  orientation = \"horizontal\",\n  children,\n  ...props\n}: ToggleGroupPrimitive.Props &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number;\n    orientation?: \"horizontal\" | \"vertical\";\n  }) {\n  return (\n    <ToggleGroupPrimitive\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      data-orientation={orientation}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        /* Base */\n        \"group/toggle-group flex w-fit flex-row items-center rounded-md data-vertical:flex-col data-vertical:items-stretch\",\n        /* Spaced: gap from CSS var */\n        \"gap-[--spacing(var(--gap))]\",\n        /* Flush (spacing=0): container treatment à la Base UI */\n        \"data-[spacing=0]:gap-px data-[spacing=0]:p-0.5 data-[spacing=0]:bg-surface-secondary\",\n        /* Flush + outline: add border & shadow to container */\n        \"data-[spacing=0]:data-[variant=outline]:border data-[spacing=0]:data-[variant=outline]:border-field-border data-[spacing=0]:data-[variant=outline]:shadow-field\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider\n        value={{ variant, size, spacing, orientation }}\n      >\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive>\n  );\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext);\n\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-spacing={context.spacing}\n      className={cn(\n        /* Flush (spacing=0): strip item chrome, small inner radius */\n        \"group-data-[spacing=0]/toggle-group:rounded-sm group-data-[spacing=0]/toggle-group:border-0 group-data-[spacing=0]/toggle-group:shadow-none group-data-[spacing=0]/toggle-group:px-2\",\n        /* Flush: disable press scale (items are tightly packed) */\n        \"group-data-[spacing=0]/toggle-group:motion-safe:active:!scale-100\",\n        \"shrink-0 focus:z-10 focus-visible:z-10\",\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n        }),\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </TogglePrimitive>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n\nexport type ToggleGroupProps = React.ComponentProps<typeof ToggleGroup>;\nexport type ToggleGroupItemProps = React.ComponentProps<typeof ToggleGroupItem>;\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst toggleVariants = cva(\n  [\n    \"inline-flex items-center justify-center rounded-md text-sm font-medium transform-gpu transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-smooth\",\n    \"motion-safe:active:scale-[0.97]\",\n    \"motion-reduce:transition-none\",\n    \"no-highlight\",\n    \"focus-visible:focus-ring\",\n    \"disabled:status-disabled\",\n    \"hover-only:bg-muted hover-only:text-muted-foreground\",\n    \"aria-pressed:bg-primary-soft aria-pressed:text-primary\",\n    \"hover-only:aria-pressed:bg-primary-soft-hover hover-only:aria-pressed:text-primary\",\n    \"[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n    \"group/toggle\",\n  ],\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        outline:\n          \"border border-field-border bg-transparent shadow-field hover-only:bg-accent hover-only:text-accent-foreground aria-pressed:shadow-none aria-pressed:border-transparent\",\n      },\n      size: {\n        default: \"h-9 px-3\",\n        sm: \"h-8 px-2\",\n        lg: \"h-10 px-3\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nfunction Toggle({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Toggle, toggleVariants };\n\nexport type ToggleProps = React.ComponentProps<typeof Toggle>;\n"],"mappings":";;;AAEA,YAAY,WAAW;AACvB,SAAS,UAAUA,wBAAuB;AAC1C,SAAS,eAAe,4BAA4B;;;ACJpD,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACHA,SAAS,UAAU,uBAAuB;AAC1C,SAAS,WAA8B;AA6CnC;AAzCJ,IAAM,iBAAiB;AAAA,EACrB;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,SACE;AAAA,MACJ;AAAA,MACA,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AACF;;;AFiBM,gBAAAC,YAAA;AA9CN,IAAM,qBAA2B,oBAK/B;AAAA,EACA,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,aAAa;AACf,CAAC;AAED,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,cAAc;AAAA,EACd;AAAA,EACA,GAAG;AACL,GAIK;AACH,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,aAAW;AAAA,MACX,gBAAc;AAAA,MACd,oBAAkB;AAAA,MAClB,OAAO,EAAE,SAAS,QAAQ;AAAA,MAC1B,WAAW;AAAA;AAAA,QAET;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ,0BAAAA;AAAA,QAAC,mBAAmB;AAAA,QAAnB;AAAA,UACC,OAAO,EAAE,SAAS,MAAM,SAAS,YAAY;AAAA,UAE5C;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,GAAG;AACL,GAAgE;AAC9D,QAAM,UAAgB,iBAAW,kBAAkB;AAEnD,SACE,gBAAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,gBAAc,QAAQ,WAAW;AAAA,MACjC,aAAW,QAAQ,QAAQ;AAAA,MAC3B,gBAAc,QAAQ;AAAA,MACtB,WAAW;AAAA;AAAA,QAET;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,UACb,SAAS,QAAQ,WAAW;AAAA,UAC5B,MAAM,QAAQ,QAAQ;AAAA,QACxB,CAAC;AAAA,QACD;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":["TogglePrimitive","jsx","TogglePrimitive"]}