@refraction-ui/react 0.19.1 → 0.20.0

package/dist/chunk-F7B64KT3.js

@@ -0,0 +1,187 @@
+import {
+  ShortcutHint,
+  useShortcut
+} from "./chunk-WK2IIUFO.js";
+import {
+  Keys,
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-button/dist/index.js
+import * as React from "react";
+
+// ../button/dist/index.js
+var BUTTON_VARIANT_ALIASES = {
+  primary: "default"
+};
+function resolveButtonVariant(variant) {
+  if (!variant) return variant;
+  return BUTTON_VARIANT_ALIASES[variant] ?? variant;
+}
+function createButton(props = {}) {
+  const { disabled = false, loading = false } = props;
+  const isInteractive = !disabled && !loading;
+  const ariaProps = {};
+  if (disabled) {
+    ariaProps["aria-disabled"] = true;
+  }
+  if (loading) {
+    ariaProps["aria-disabled"] = true;
+    ariaProps["aria-label"] = ariaProps["aria-label"] ?? void 0;
+  }
+  const dataAttributes = {};
+  if (loading) {
+    dataAttributes["data-loading"] = "";
+  }
+  if (disabled) {
+    dataAttributes["data-disabled"] = "";
+  }
+  const keyboardHandlers = {};
+  if (!isInteractive) {
+    keyboardHandlers[Keys.Enter] = (e) => e.preventDefault();
+    keyboardHandlers[Keys.Space] = (e) => e.preventDefault();
+  }
+  return {
+    ariaProps,
+    keyboardHandlers,
+    isInteractive,
+    dataAttributes
+  };
+}
+function getButtonType(props) {
+  return props.type ?? "button";
+}
+var buttonTokens = {
+  name: "button",
+  tokens: {
+    bg: { variable: "--rfr-button-bg", fallback: "hsl(var(--primary))" },
+    fg: { variable: "--rfr-button-fg", fallback: "hsl(var(--primary-foreground))" },
+    border: { variable: "--rfr-button-border", fallback: "hsl(var(--border))" },
+    radius: { variable: "--rfr-button-radius", fallback: "var(--radius)" },
+    ring: { variable: "--rfr-button-ring", fallback: "hsl(var(--ring))" }
+  }
+};
+var buttonVariants = cva({
+  base: "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+  variants: {
+    variant: {
+      default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+      // Alias for `default` — see resolveButtonVariant + issue #201. Same classes
+      // so styling stays identical even if a consumer reaches into `buttonVariants`
+      // directly without going through resolveButtonVariant.
+      primary: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+      destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+      outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+      secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+      ghost: "hover:bg-accent hover:text-accent-foreground",
+      link: "text-primary underline-offset-4 hover:underline"
+    },
+    size: {
+      xs: "h-7 rounded px-2 text-xs",
+      sm: "h-8 rounded-md px-3 text-xs",
+      default: "h-9 px-4 py-2",
+      lg: "h-10 rounded-md px-8",
+      icon: "h-9 w-9"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+
+// ../react-button/dist/index.js
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+var Button = React.forwardRef(
+  function Button2({ variant, size, loading, asChild, className, disabled, children, shortcut, action, ...props }, ref) {
+    const resolvedVariant = resolveButtonVariant(variant);
+    const api = createButton({ variant: resolvedVariant, size, disabled, loading, asChild, type: props.type });
+    const classes = cn(buttonVariants({ variant: resolvedVariant, size }), className);
+    const internalRef = React.useRef(null);
+    const mergedRef = React.useCallback(
+      (node) => {
+        internalRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      [ref]
+    );
+    useShortcut({
+      shortcut,
+      action,
+      enabled: !disabled && !loading && (!!shortcut || !!action),
+      onTrigger: () => {
+        internalRef.current?.click();
+      }
+    });
+    if (asChild && React.isValidElement(children)) {
+      return React.cloneElement(children, {
+        ref: mergedRef,
+        className: cn(classes, children.props.className, "relative"),
+        type: getButtonType({ type: props.type }),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: /* @__PURE__ */ jsxs(Fragment, { children: [
+          (shortcut || action) && /* @__PURE__ */ jsx(ShortcutHint, { shortcut, action, className: "right-4" }),
+          children.props.children
+        ] })
+      });
+    }
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref: mergedRef,
+        type: getButtonType({ type: props.type }),
+        className: cn(classes, "relative"),
+        disabled: disabled || loading,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          (shortcut || action) && /* @__PURE__ */ jsx(ShortcutHint, { shortcut, action, className: "right-4" }),
+          loading && /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              className: "animate-spin h-4 w-4",
+              xmlns: "http://www.w3.org/2000/svg",
+              fill: "none",
+              viewBox: "0 0 24 24",
+              "aria-hidden": "true",
+              children: [
+                /* @__PURE__ */ jsx(
+                  "circle",
+                  {
+                    className: "opacity-25",
+                    cx: "12",
+                    cy: "12",
+                    r: "10",
+                    stroke: "currentColor",
+                    strokeWidth: "4"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    className: "opacity-75",
+                    fill: "currentColor",
+                    d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+                  }
+                )
+              ]
+            }
+          ),
+          children
+        ]
+      }
+    );
+  }
+);
+
+export {
+  buttonTokens,
+  buttonVariants,
+  Button
+};
+//# sourceMappingURL=chunk-F7B64KT3.js.map

package/dist/chunk-F7B64KT3.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../button/src/button.ts", "../../button/src/button.styles.ts", "../../react-button/src/button.tsx"],
+  "sourcesContent": ["import type { AccessibilityProps, KeyboardHandlerMap } from '@refraction-ui/shared'\nimport { Keys } from '@refraction-ui/shared'\n\n/**\n * `primary` is an alias of `default` — included so the universal React-ecosystem\n * muscle-memory (`<Button variant=\"primary\">`) renders as the most-emphasized\n * button instead of falling through to the unstyled base. See issue #201.\n */\nexport type ButtonVariant =\n  | 'default'\n  | 'primary'\n  | 'destructive'\n  | 'outline'\n  | 'secondary'\n  | 'ghost'\n  | 'link'\n\n/** Variants that map to the same visual style as `default`. */\nexport const BUTTON_VARIANT_ALIASES: Partial<Record<ButtonVariant, ButtonVariant>> = {\n  primary: 'default',\n}\n\n/** Resolve an alias to its canonical variant. Pass-through for unknown/undefined. */\nexport function resolveButtonVariant(variant: ButtonVariant | undefined): ButtonVariant | undefined {\n  if (!variant) return variant\n  return BUTTON_VARIANT_ALIASES[variant] ?? variant\n}\nexport type ButtonSize = 'xs' | 'sm' | 'default' | 'lg' | 'icon'\n\nexport interface ButtonProps {\n  variant?: ButtonVariant\n  size?: ButtonSize\n  disabled?: boolean\n  loading?: boolean\n  asChild?: boolean\n  type?: 'button' | 'submit' | 'reset'\n}\n\nexport interface ButtonAPI {\n  /** ARIA attributes to spread on the element */\n  ariaProps: Partial<AccessibilityProps>\n  /** Keyboard handlers to attach */\n  keyboardHandlers: KeyboardHandlerMap\n  /** Whether interaction should be blocked */\n  isInteractive: boolean\n  /** Data attributes for CSS styling hooks */\n  dataAttributes: Record<string, string>\n}\n\nexport function createButton(props: ButtonProps = {}): ButtonAPI {\n  const { disabled = false, loading = false } = props\n  const isInteractive = !disabled && !loading\n\n  const ariaProps: Partial<AccessibilityProps> = {}\n  if (disabled) {\n    ariaProps['aria-disabled'] = true\n  }\n  if (loading) {\n    ariaProps['aria-disabled'] = true\n    ariaProps['aria-label'] = ariaProps['aria-label'] ?? undefined\n  }\n\n  const dataAttributes: Record<string, string> = {}\n  if (loading) {\n    dataAttributes['data-loading'] = ''\n  }\n  if (disabled) {\n    dataAttributes['data-disabled'] = ''\n  }\n\n  const keyboardHandlers: KeyboardHandlerMap = {}\n  if (!isInteractive) {\n    keyboardHandlers[Keys.Enter] = (e) => e.preventDefault()\n    keyboardHandlers[Keys.Space] = (e) => e.preventDefault()\n  }\n\n  return {\n    ariaProps,\n    keyboardHandlers,\n    isInteractive,\n    dataAttributes,\n  }\n}\n\nexport function getButtonType(props: ButtonProps): string {\n  return props.type ?? 'button'\n}\n", "import { cva } from '@refraction-ui/shared'\nimport type { TokenContract } from '@refraction-ui/shared'\n\nexport const buttonTokens: TokenContract = {\n  name: 'button',\n  tokens: {\n    bg: { variable: '--rfr-button-bg', fallback: 'hsl(var(--primary))' },\n    fg: { variable: '--rfr-button-fg', fallback: 'hsl(var(--primary-foreground))' },\n    border: { variable: '--rfr-button-border', fallback: 'hsl(var(--border))' },\n    radius: { variable: '--rfr-button-radius', fallback: 'var(--radius)' },\n    ring: { variable: '--rfr-button-ring', fallback: 'hsl(var(--ring))' },\n  },\n}\n\nexport const buttonVariants = cva({\n  base: 'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0',\n  variants: {\n    variant: {\n      default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',\n      // Alias for `default` — see resolveButtonVariant + issue #201. Same classes\n      // so styling stays identical even if a consumer reaches into `buttonVariants`\n      // directly without going through resolveButtonVariant.\n      primary: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',\n      destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',\n      outline: 'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',\n      secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',\n      ghost: 'hover:bg-accent hover:text-accent-foreground',\n      link: 'text-primary underline-offset-4 hover:underline',\n    },\n    size: {\n      xs: 'h-7 rounded px-2 text-xs',\n      sm: 'h-8 rounded-md px-3 text-xs',\n      default: 'h-9 px-4 py-2',\n      lg: 'h-10 rounded-md px-8',\n      icon: 'h-9 w-9',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: 'default',\n  },\n})\n", "import * as React from 'react'\nimport {\n  createButton,\n  buttonVariants,\n  getButtonType,\n  resolveButtonVariant,\n  type ButtonVariant,\n  type ButtonSize,\n} from '@refraction-ui/button'\nimport { useShortcut, ShortcutHint } from '@refraction-ui/react-keyboard-shortcut'\nimport { cn } from '@refraction-ui/shared'\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: ButtonVariant\n  size?: ButtonSize\n  loading?: boolean\n  asChild?: boolean\n  shortcut?: string\n  action?: string\n}\n\n/**\n * Button component — renders a styled button with variant and size support.\n *\n * Uses the headless @refraction-ui/button core for state, ARIA, and keyboard handling.\n * Styling via Tailwind utility classes (no external CSS-in-JS).\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button({ variant, size, loading, asChild, className, disabled, children, shortcut, action, ...props }, ref) {\n    // `primary` is an ecosystem-muscle-memory alias for `default` — resolve it\n    // here so styling, aria, and data attributes all see the canonical variant.\n    // See issue #201.\n    const resolvedVariant = resolveButtonVariant(variant)\n    const api = createButton({ variant: resolvedVariant, size, disabled, loading, asChild, type: props.type })\n    const classes = cn(buttonVariants({ variant: resolvedVariant, size }), className)\n    \n    const internalRef = React.useRef<HTMLButtonElement>(null)\n    const mergedRef = React.useCallback(\n      (node: HTMLButtonElement | null) => {\n        internalRef.current = node\n        if (typeof ref === 'function') ref(node)\n        else if (ref) ref.current = node\n      },\n      [ref]\n    )\n\n    useShortcut({\n      shortcut,\n      action,\n      enabled: !disabled && !loading && (!!shortcut || !!action),\n      onTrigger: () => {\n        internalRef.current?.click()\n      },\n    })\n\n    // When asChild, render the child element directly with button props merged in.\n    // This allows <Button asChild><a href=\"/\">Link</a></Button>\n    if (asChild && React.isValidElement(children)) {\n      return React.cloneElement(children as React.ReactElement<Record<string, unknown>>, {\n        ref: mergedRef,\n        className: cn(classes, (children.props as Record<string, unknown>).className as string, 'relative'),\n        type: getButtonType({ type: props.type }),\n        ...api.ariaProps,\n        ...api.dataAttributes,\n        ...props,\n        children: (\n          <>\n            {(shortcut || action) && <ShortcutHint shortcut={shortcut} action={action} className=\"right-4\" />}\n            {(children.props as Record<string, unknown>).children}\n          </>\n        )\n      })\n    }\n\n    return (\n      <button\n        ref={mergedRef}\n        type={getButtonType({ type: props.type }) as 'button' | 'submit' | 'reset'}\n        className={cn(classes, 'relative')}\n        disabled={disabled || loading}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      >\n        {(shortcut || action) && <ShortcutHint shortcut={shortcut} action={action} className=\"right-4\" />}\n        {loading && (\n          <svg\n            className=\"animate-spin h-4 w-4\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            aria-hidden=\"true\"\n          >\n            <circle\n              className=\"opacity-25\"\n              cx=\"12\"\n              cy=\"12\"\n              r=\"10\"\n              stroke=\"currentColor\"\n              strokeWidth=\"4\"\n            />\n            <path\n              className=\"opacity-75\"\n              fill=\"currentColor\"\n              d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n            />\n          </svg>\n        )}\n        {children}\n      </button>\n    )\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["Button"]
+}

package/dist/chunk-FD37DFCC.js

@@ -0,0 +1,77 @@
+// ../accordion/dist/index.js
+function isItemOpen(state, itemValue) {
+  return state.type === "single" ? state.value === itemValue : Array.isArray(state.value) && state.value.includes(itemValue);
+}
+function valueEquals(a, b) {
+  if (Array.isArray(a) && Array.isArray(b)) {
+    return a.length === b.length && a.every((v, i) => v === b[i]);
+  }
+  return a === b;
+}
+function createAccordion(config = {}) {
+  let type = config.type ?? "single";
+  let collapsible = config.collapsible ?? false;
+  let onValueChange = config.onValueChange;
+  let uncontrolledValue = config.defaultValue ?? (type === "multiple" ? [] : "");
+  let controlledValue = config.value;
+  const listeners = /* @__PURE__ */ new Set();
+  let snapshot = buildSnapshot();
+  function currentValue() {
+    return controlledValue !== void 0 ? controlledValue : uncontrolledValue;
+  }
+  function buildSnapshot() {
+    return { type, collapsible, value: currentValue() };
+  }
+  function emit() {
+    snapshot = buildSnapshot();
+    for (const l of listeners) l();
+  }
+  const api = {
+    getState() {
+      return snapshot;
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    toggleItem(itemValue) {
+      const value = currentValue();
+      let next;
+      if (type === "single") {
+        next = value === itemValue && collapsible ? "" : itemValue;
+      } else {
+        const arrValue = Array.isArray(value) ? value : [];
+        next = arrValue.includes(itemValue) ? arrValue.filter((v) => v !== itemValue) : [...arrValue, itemValue];
+      }
+      if (controlledValue === void 0) {
+        if (valueEquals(uncontrolledValue, next)) return;
+        uncontrolledValue = next;
+      }
+      onValueChange?.(next);
+      emit();
+    },
+    isOpen(itemValue) {
+      return isItemOpen(snapshot, itemValue);
+    },
+    setValue(value) {
+      if (controlledValue !== void 0 && valueEquals(controlledValue, value)) return;
+      controlledValue = value;
+      emit();
+    },
+    setOptions(options) {
+      const prevType = type;
+      const prevCollapsible = collapsible;
+      if (options.type !== void 0) type = options.type;
+      if (options.collapsible !== void 0) collapsible = options.collapsible;
+      if (options.onValueChange !== void 0) onValueChange = options.onValueChange;
+      if (type !== prevType || collapsible !== prevCollapsible) emit();
+    }
+  };
+  return api;
+}
+
+export {
+  isItemOpen,
+  createAccordion
+};
+//# sourceMappingURL=chunk-FD37DFCC.js.map

package/dist/chunk-FD37DFCC.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../accordion/src/accordion.ts"],
+  "sourcesContent": ["/**\n * @refraction-ui/accordion — headless accordion (disclosure) state machine.\n *\n * Owns the *behavior* of an accordion: which item(s) are open, the single vs\n * multiple expansion modes, and the collapsible toggle rule. It has NO UI\n * opinion — React/Astro adapters subscribe to the store and render the parts.\n */\n\n/** Expansion mode: one item open at a time, or any number. */\nexport type AccordionType = 'single' | 'multiple'\n\n/** Open item id (`single`) or ids (`multiple`). */\nexport type AccordionValue = string | string[]\n\n/** Options for {@link createAccordion}. */\nexport interface AccordionConfig {\n  /** Expansion mode (default `'single'`). */\n  type?: AccordionType\n  /** When `type=\"single\"`, allows the open item to be toggled fully closed. */\n  collapsible?: boolean\n  /** Controlled open item(s). Pair with `onValueChange`. */\n  value?: AccordionValue\n  /** Uncontrolled initial open item(s). */\n  defaultValue?: AccordionValue\n  /** Called whenever the open item(s) change. */\n  onValueChange?: (value: AccordionValue) => void\n}\n\n/** Snapshot of the store. Returned by `getState()`; treat as immutable. */\nexport interface AccordionState {\n  type: AccordionType\n  collapsible: boolean\n  /** Current open item id (`single`) or ids (`multiple`). */\n  value: AccordionValue\n}\n\n/** The framework-agnostic store. React/Astro adapters wrap this. */\nexport interface AccordionAPI {\n  /** Current immutable snapshot */\n  getState(): AccordionState\n  /** Subscribe to changes; returns an unsubscribe fn (suits useSyncExternalStore) */\n  subscribe(listener: () => void): () => void\n  /** Toggle an item open/closed per the type/collapsible rules */\n  toggleItem(itemValue: string): void\n  /** Whether an item is currently open */\n  isOpen(itemValue: string): boolean\n  /** Sync a controlled value into the store (adapters call when the prop changes) */\n  setValue(value: AccordionValue): void\n  /** Update options after creation (adapters keep props in sync) */\n  setOptions(options: {\n    type?: AccordionType\n    collapsible?: boolean\n    onValueChange?: (value: AccordionValue) => void\n  }): void\n}\n\n/** Pure open-state check shared by every adapter. */\nexport function isItemOpen(state: AccordionState, itemValue: string): boolean {\n  return state.type === 'single'\n    ? state.value === itemValue\n    : Array.isArray(state.value) && state.value.includes(itemValue)\n}\n\n/** Shallow value equality (arrays compared item-by-item, order-sensitive). */\nfunction valueEquals(a: AccordionValue, b: AccordionValue): boolean {\n  if (Array.isArray(a) && Array.isArray(b)) {\n    return a.length === b.length && a.every((v, i) => v === b[i])\n  }\n  return a === b\n}\n\n/**\n * createAccordion — headless accordion store.\n *\n * Supports controlled (`value`) and uncontrolled (`defaultValue`) usage.\n * `single` mode holds one open item id (`''` when all closed); `multiple`\n * holds an array of open ids. In `single` mode, re-toggling the open item\n * closes it only when `collapsible` is set.\n */\nexport function createAccordion(config: AccordionConfig = {}): AccordionAPI {\n  let type: AccordionType = config.type ?? 'single'\n  let collapsible: boolean = config.collapsible ?? false\n  let onValueChange = config.onValueChange\n\n  let uncontrolledValue: AccordionValue =\n    config.defaultValue ?? (type === 'multiple' ? [] : '')\n  let controlledValue: AccordionValue | undefined = config.value\n\n  const listeners = new Set<() => void>()\n  let snapshot: AccordionState = buildSnapshot()\n\n  function currentValue(): AccordionValue {\n    return controlledValue !== undefined ? controlledValue : uncontrolledValue\n  }\n\n  function buildSnapshot(): AccordionState {\n    return { type, collapsible, value: currentValue() }\n  }\n\n  function emit(): void {\n    snapshot = buildSnapshot()\n    for (const l of listeners) l()\n  }\n\n  const api: AccordionAPI = {\n    getState() {\n      return snapshot\n    },\n\n    subscribe(listener) {\n      listeners.add(listener)\n      return () => listeners.delete(listener)\n    },\n\n    toggleItem(itemValue) {\n      const value = currentValue()\n      let next: AccordionValue\n      if (type === 'single') {\n        next = value === itemValue && collapsible ? '' : itemValue\n      } else {\n        const arrValue = Array.isArray(value) ? value : []\n        next = arrValue.includes(itemValue)\n          ? arrValue.filter((v) => v !== itemValue)\n          : [...arrValue, itemValue]\n      }\n      if (controlledValue === undefined) {\n        if (valueEquals(uncontrolledValue, next)) return\n        uncontrolledValue = next\n      }\n      onValueChange?.(next)\n      emit()\n    },\n\n    isOpen(itemValue) {\n      return isItemOpen(snapshot, itemValue)\n    },\n\n    setValue(value) {\n      if (controlledValue !== undefined && valueEquals(controlledValue, value)) return\n      controlledValue = value\n      emit()\n    },\n\n    setOptions(options) {\n      const prevType = type\n      const prevCollapsible = collapsible\n      if (options.type !== undefined) type = options.type\n      if (options.collapsible !== undefined) collapsible = options.collapsible\n      if (options.onValueChange !== undefined) onValueChange = options.onValueChange\n      if (type !== prevType || collapsible !== prevCollapsible) emit()\n    },\n  }\n\n  return api\n}\n"],
+  "mappings": ";AAyDO,SAAS,WAAW,OAAuB,WAA4B;AAC5E,SAAO,MAAM,SAAS,WAClB,MAAM,UAAU,YAChB,MAAM,QAAQ,MAAM,KAAK,KAAK,MAAM,MAAM,SAAS,SAAS;AAClE;AAGA,SAAS,YAAY,GAAmB,GAA4B;AAClE,MAAI,MAAM,QAAQ,CAAC,KAAK,MAAM,QAAQ,CAAC,GAAG;AACxC,WAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,CAAC,GAAG,MAAM,MAAM,EAAE,CAAC,CAAC;EAC9D;AACA,SAAO,MAAM;AACf;AAUO,SAAS,gBAAgB,SAA0B,CAAA,GAAkB;AAC1E,MAAI,OAAsB,OAAO,QAAQ;AACzC,MAAI,cAAuB,OAAO,eAAe;AACjD,MAAI,gBAAgB,OAAO;AAE3B,MAAI,oBACF,OAAO,iBAAiB,SAAS,aAAa,CAAA,IAAK;AACrD,MAAI,kBAA8C,OAAO;AAEzD,QAAM,YAAA,oBAAgB,IAAA;AACtB,MAAI,WAA2B,cAAA;AAE/B,WAAS,eAA+B;AACtC,WAAO,oBAAoB,SAAY,kBAAkB;EAC3D;AAEA,WAAS,gBAAgC;AACvC,WAAO,EAAE,MAAM,aAAa,OAAO,aAAA,EAAa;EAClD;AAEA,WAAS,OAAa;AACpB,eAAW,cAAA;AACX,eAAW,KAAK,UAAW,GAAA;EAC7B;AAEA,QAAM,MAAoB;IACxB,WAAW;AACT,aAAO;IACT;IAEA,UAAU,UAAU;AAClB,gBAAU,IAAI,QAAQ;AACtB,aAAO,MAAM,UAAU,OAAO,QAAQ;IACxC;IAEA,WAAW,WAAW;AACpB,YAAM,QAAQ,aAAA;AACd,UAAI;AACJ,UAAI,SAAS,UAAU;AACrB,eAAO,UAAU,aAAa,cAAc,KAAK;MACnD,OAAO;AACL,cAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,QAAQ,CAAA;AAChD,eAAO,SAAS,SAAS,SAAS,IAC9B,SAAS,OAAO,CAAC,MAAM,MAAM,SAAS,IACtC,CAAC,GAAG,UAAU,SAAS;MAC7B;AACA,UAAI,oBAAoB,QAAW;AACjC,YAAI,YAAY,mBAAmB,IAAI,EAAG;AAC1C,4BAAoB;MACtB;AACA,sBAAgB,IAAI;AACpB,WAAA;IACF;IAEA,OAAO,WAAW;AAChB,aAAO,WAAW,UAAU,SAAS;IACvC;IAEA,SAAS,OAAO;AACd,UAAI,oBAAoB,UAAa,YAAY,iBAAiB,KAAK,EAAG;AAC1E,wBAAkB;AAClB,WAAA;IACF;IAEA,WAAW,SAAS;AAClB,YAAM,WAAW;AACjB,YAAM,kBAAkB;AACxB,UAAI,QAAQ,SAAS,OAAW,QAAO,QAAQ;AAC/C,UAAI,QAAQ,gBAAgB,OAAW,eAAc,QAAQ;AAC7D,UAAI,QAAQ,kBAAkB,OAAW,iBAAgB,QAAQ;AACjE,UAAI,SAAS,YAAY,gBAAgB,gBAAiB,MAAA;IAC5D;EAAA;AAGF,SAAO;AACT;",
+  "names": []
+}

package/dist/chunk-H54FLNAF.js

@@ -0,0 +1,132 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-video-tile/dist/index.js
+import * as React from "react";
+
+// ../video-tile/dist/index.js
+function createVideoTile(props = {}) {
+  const { speaking = false, pinned = false } = props;
+  return {
+    dataAttributes: {
+      "data-speaking": speaking ? "true" : "false",
+      "data-pinned": pinned ? "true" : "false"
+    },
+    ariaProps: {
+      role: "group"
+    }
+  };
+}
+function getInitials(name) {
+  const words = name.trim().split(/\s+/).filter(Boolean);
+  return words.slice(0, 2).map((w) => w[0].toUpperCase()).join("");
+}
+var videoTileVariants = cva({
+  base: [
+    "relative aspect-video overflow-hidden rounded-lg bg-muted",
+    "transition-shadow duration-200"
+  ].join(" "),
+  variants: {
+    speaking: {
+      "true": "ring-2 ring-emerald-500 dark:ring-emerald-400 ring-offset-2 ring-offset-background",
+      "false": ""
+    },
+    pinned: {
+      "true": "ring-2 ring-primary ring-offset-2 ring-offset-background",
+      "false": ""
+    }
+  },
+  defaultVariants: {
+    speaking: "false",
+    pinned: "false"
+  }
+});
+var videoTileNameChipClass = "absolute bottom-2 left-2 flex items-center gap-1.5 rounded-md bg-background/70 px-2 py-0.5 text-xs font-medium text-foreground backdrop-blur-sm";
+var videoTileMicIconClass = "text-destructive";
+var videoTileAvatarFallbackClass = "absolute inset-0 flex items-center justify-center";
+var videoTileAvatarCircleClass = "flex size-16 items-center justify-center rounded-full bg-card text-foreground text-xl font-semibold select-none";
+var videoTileReactionBadgeClass = "absolute right-2 top-2 flex items-center justify-center rounded-full bg-background/70 px-1.5 py-0.5 text-sm backdrop-blur-sm";
+
+// ../react-video-tile/dist/index.js
+import { jsxs, jsx } from "react/jsx-runtime";
+var VideoTile = React.forwardRef(
+  function VideoTile2({
+    name,
+    micState = "on",
+    speaking = false,
+    pinned = false,
+    avatarUrl,
+    mediaSlot,
+    reaction,
+    className,
+    ...props
+  }, ref) {
+    const api = createVideoTile({ speaking, pinned });
+    const initials = getInitials(name);
+    const isMuted = micState === "muted";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          videoTileVariants({
+            speaking: speaking ? "true" : "false",
+            pinned: pinned ? "true" : "false"
+          }),
+          className
+        ),
+        "aria-label": name,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          mediaSlot != null ? /* @__PURE__ */ jsx("div", { className: "absolute inset-0 h-full w-full object-cover", children: mediaSlot }) : (
+            /* Avatar fallback */
+            /* @__PURE__ */ jsx("div", { className: videoTileAvatarFallbackClass, children: avatarUrl ? /* @__PURE__ */ jsx(
+              "img",
+              {
+                src: avatarUrl,
+                alt: name,
+                className: videoTileAvatarCircleClass
+              }
+            ) : /* @__PURE__ */ jsx("div", { className: videoTileAvatarCircleClass, "aria-hidden": "true", children: initials }) })
+          ),
+          reaction != null && /* @__PURE__ */ jsx("div", { className: videoTileReactionBadgeClass, "aria-hidden": "true", children: reaction }),
+          /* @__PURE__ */ jsxs("div", { className: videoTileNameChipClass, children: [
+            /* @__PURE__ */ jsx("span", { children: `${name}${isMuted ? "" : ""}` }),
+            isMuted && /* @__PURE__ */ jsx("span", { className: videoTileMicIconClass, "aria-label": "Microphone muted", children: /* @__PURE__ */ jsxs(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "12",
+                height: "12",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                "aria-hidden": "true",
+                children: [
+                  /* @__PURE__ */ jsx("line", { x1: "2", y1: "2", x2: "22", y2: "22" }),
+                  /* @__PURE__ */ jsx("path", { d: "M18.89 13.23A7.12 7.12 0 0 0 19 12v-2" }),
+                  /* @__PURE__ */ jsx("path", { d: "M5 10v2a7 7 0 0 0 12 5" }),
+                  /* @__PURE__ */ jsx("path", { d: "M15 9.34V5a3 3 0 0 0-5.68-1.33" }),
+                  /* @__PURE__ */ jsx("path", { d: "M9 9v3a3 3 0 0 0 5.12 2.12" }),
+                  /* @__PURE__ */ jsx("line", { x1: "12", y1: "19", x2: "12", y2: "22" })
+                ]
+              }
+            ) })
+          ] })
+        ]
+      }
+    );
+  }
+);
+
+export {
+  VideoTile
+};
+//# sourceMappingURL=chunk-H54FLNAF.js.map

package/dist/chunk-H54FLNAF.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../video-tile/src/video-tile.ts", "../../video-tile/src/video-tile.styles.ts", "../../react-video-tile/src/video-tile.tsx"],
+  "sourcesContent": ["/** Microphone state for a video participant. */\nexport type VideoTileMicState = 'on' | 'muted'\n\n/** Data describing a video meeting participant tile. */\nexport interface VideoTileData {\n  /** Unique participant identifier. */\n  id: string\n  /** Display name shown in the name chip. */\n  name: string\n  /** Current microphone state. Defaults to 'on'. */\n  micState?: VideoTileMicState\n  /** Whether the participant is currently speaking (active audio). */\n  speaking?: boolean\n  /** Whether the tile is pinned in the grid. */\n  pinned?: boolean\n}\n\nexport interface VideoTileHeadlessProps {\n  /** Whether the participant is actively speaking. */\n  speaking?: boolean\n  /** Whether the tile is pinned in the grid. */\n  pinned?: boolean\n}\n\nexport interface VideoTileAPI {\n  /** Data attributes for styling hooks — spread onto the tile container. */\n  dataAttributes: {\n    'data-speaking': string\n    'data-pinned': string\n  }\n  /** ARIA props — spread onto the tile container. */\n  ariaProps: {\n    role: 'group'\n  }\n}\n\n/**\n * Derive framework-agnostic data attributes and ARIA props for a VideoTile.\n *\n * Adapters spread `dataAttributes` and `ariaProps` onto the tile container so\n * CSS selectors and assistive technology can reflect the current participant\n * state without coupling to a specific framework.\n */\nexport function createVideoTile(props: VideoTileHeadlessProps = {}): VideoTileAPI {\n  const { speaking = false, pinned = false } = props\n\n  return {\n    dataAttributes: {\n      'data-speaking': speaking ? 'true' : 'false',\n      'data-pinned': pinned ? 'true' : 'false',\n    },\n    ariaProps: {\n      role: 'group',\n    },\n  }\n}\n\n/**\n * Derive up to two uppercase initials from a display name.\n *\n * Splits on whitespace and takes the first character of the first two words.\n * Single-word names produce a single initial.\n *\n * @example\n * getInitials('Maya Goldberg') // 'MG'\n * getInitials('Alice')         // 'A'\n */\nexport function getInitials(name: string): string {\n  const words = name.trim().split(/\\s+/).filter(Boolean)\n  return words\n    .slice(0, 2)\n    .map((w) => w[0].toUpperCase())\n    .join('')\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/**\n * Root tile container — aspect-video, rounded corners, clipped media.\n *\n * `speaking` variant adds a visible ring to indicate active audio.\n * `pinned` variant adds a stronger ring to mark a pinned participant.\n *\n * cva boolean-like variants use string values ('true'/'false') per the\n * refraction-ui convention — callers must pass strings, not raw booleans.\n */\nexport const videoTileVariants = cva({\n  base: [\n    'relative aspect-video overflow-hidden rounded-lg bg-muted',\n    'transition-shadow duration-200',\n  ].join(' '),\n  variants: {\n    speaking: {\n      'true': 'ring-2 ring-emerald-500 dark:ring-emerald-400 ring-offset-2 ring-offset-background',\n      'false': '',\n    },\n    pinned: {\n      'true': 'ring-2 ring-primary ring-offset-2 ring-offset-background',\n      'false': '',\n    },\n  },\n  defaultVariants: {\n    speaking: 'false',\n    pinned: 'false',\n  },\n})\n\n/**\n * Name chip anchored to the bottom-left of the tile.\n * Semi-transparent bg keeps it legible over any media content.\n */\nexport const videoTileNameChipClass =\n  'absolute bottom-2 left-2 flex items-center gap-1.5 rounded-md bg-background/70 px-2 py-0.5 text-xs font-medium text-foreground backdrop-blur-sm'\n\n/**\n * Mic-muted icon container — sits inside the name chip at the trailing edge.\n */\nexport const videoTileMicIconClass = 'text-destructive'\n\n/**\n * Avatar fallback circle — centred in the tile when no media stream is available.\n */\nexport const videoTileAvatarFallbackClass =\n  'absolute inset-0 flex items-center justify-center'\n\n/** Inner circle with initials. */\nexport const videoTileAvatarCircleClass =\n  'flex size-16 items-center justify-center rounded-full bg-card text-foreground text-xl font-semibold select-none'\n\n/**\n * Reaction badge slot — anchored to the top-right corner.\n */\nexport const videoTileReactionBadgeClass =\n  'absolute right-2 top-2 flex items-center justify-center rounded-full bg-background/70 px-1.5 py-0.5 text-sm backdrop-blur-sm'\n", "import * as React from 'react'\nimport {\n  createVideoTile,\n  getInitials,\n  videoTileVariants,\n  videoTileNameChipClass,\n  videoTileMicIconClass,\n  videoTileAvatarFallbackClass,\n  videoTileAvatarCircleClass,\n  videoTileReactionBadgeClass,\n  type VideoTileMicState,\n  type VideoTileData,\n} from '@refraction-ui/video-tile'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { VideoTileMicState, VideoTileData }\n\nexport interface VideoTileProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'content' | 'color'> {\n  /** Participant display name — shown in the name chip and used for initials. */\n  name: string\n  /** Current microphone state. Defaults to 'on'. */\n  micState?: VideoTileMicState\n  /** Whether the participant is actively speaking. Adds an emerald ring. */\n  speaking?: boolean\n  /** Whether the tile is pinned in the grid. Adds a primary ring. */\n  pinned?: boolean\n  /** URL of the participant's avatar image, used in the fallback circle. */\n  avatarUrl?: string\n  /**\n   * Media slot — pass a `<video>` element (or any ReactNode) to render as the\n   * tile's background media layer. When omitted, an avatar fallback is shown.\n   */\n  mediaSlot?: React.ReactNode\n  /** Optional emoji/reaction badge rendered at the top-right of the tile. */\n  reaction?: React.ReactNode\n}\n\n/**\n * VideoTile — a single participant tile for a video meeting grid.\n *\n * Renders a `role=\"group\"` container with an aspect-video aspect ratio.\n * If a `mediaSlot` is provided it fills the tile; otherwise an avatar fallback\n * with initials is centred on a muted background.\n *\n * Overlays:\n * - Name chip (bottom-left) with optional mic-muted indicator\n * - Speaking ring (emerald) when `speaking` is true\n * - Pinned ring (primary) when `pinned` is true\n * - Reaction badge (top-right) when `reaction` is provided\n *\n * Logic and styles come from the headless `@refraction-ui/video-tile` core.\n */\nexport const VideoTile = React.forwardRef<HTMLDivElement, VideoTileProps>(\n  function VideoTile(\n    {\n      name,\n      micState = 'on',\n      speaking = false,\n      pinned = false,\n      avatarUrl,\n      mediaSlot,\n      reaction,\n      className,\n      ...props\n    },\n    ref,\n  ) {\n    const api = createVideoTile({ speaking, pinned })\n    const initials = getInitials(name)\n    const isMuted = micState === 'muted'\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          videoTileVariants({\n            speaking: speaking ? 'true' : 'false',\n            pinned: pinned ? 'true' : 'false',\n          }),\n          className,\n        )}\n        aria-label={name}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      >\n        {/* Media layer */}\n        {mediaSlot != null ? (\n          <div className=\"absolute inset-0 h-full w-full object-cover\">\n            {mediaSlot}\n          </div>\n        ) : (\n          /* Avatar fallback */\n          <div className={videoTileAvatarFallbackClass}>\n            {avatarUrl ? (\n              <img\n                src={avatarUrl}\n                alt={name}\n                className={videoTileAvatarCircleClass}\n              />\n            ) : (\n              <div className={videoTileAvatarCircleClass} aria-hidden=\"true\">\n                {initials}\n              </div>\n            )}\n          </div>\n        )}\n\n        {/* Reaction badge (top-right) */}\n        {reaction != null && (\n          <div className={videoTileReactionBadgeClass} aria-hidden=\"true\">\n            {reaction}\n          </div>\n        )}\n\n        {/* Name chip (bottom-left) */}\n        <div className={videoTileNameChipClass}>\n          <span>{`${name}${isMuted ? '' : ''}`}</span>\n          {isMuted && (\n            <span className={videoTileMicIconClass} aria-label=\"Microphone muted\">\n              {/* Inline SVG mic-off icon — no external icon dep */}\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                aria-hidden=\"true\"\n              >\n                <line x1=\"2\" y1=\"2\" x2=\"22\" y2=\"22\" />\n                <path d=\"M18.89 13.23A7.12 7.12 0 0 0 19 12v-2\" />\n                <path d=\"M5 10v2a7 7 0 0 0 12 5\" />\n                <path d=\"M15 9.34V5a3 3 0 0 0-5.68-1.33\" />\n                <path d=\"M9 9v3a3 3 0 0 0 5.12 2.12\" />\n                <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"22\" />\n              </svg>\n            </span>\n          )}\n        </div>\n      </div>\n    )\n  },\n)\n"],
+  "mappings": ";;;;;;;;;AA2CO,SAAS,gBAAgB,QAAgC,CAAA,GAAkB;AAChF,QAAM,EAAE,WAAW,OAAO,SAAS,MAAA,IAAU;AAE7C,SAAO;IACL,gBAAgB;MACd,iBAAiB,WAAW,SAAS;MACrC,eAAe,SAAS,SAAS;IAAA;IAEnC,WAAW;MACT,MAAM;IAAA;EACR;AAEJ;AAYO,SAAS,YAAY,MAAsB;AAChD,QAAM,QAAQ,KAAK,KAAA,EAAO,MAAM,KAAK,EAAE,OAAO,OAAO;AACrD,SAAO,MACJ,MAAM,GAAG,CAAC,EACV,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,YAAA,CAAa,EAC7B,KAAK,EAAE;AACZ;AC9DO,IAAM,oBAAoB,IAAI;EACnC,MAAM;IACJ;IACA;EAAA,EACA,KAAK,GAAG;EACV,UAAU;IACR,UAAU;MACR,QAAQ;MACR,SAAS;IAAA;IAEX,QAAQ;MACN,QAAQ;MACR,SAAS;IAAA;EACX;EAEF,iBAAiB;IACf,UAAU;IACV,QAAQ;EAAA;AAEZ,CAAC;AAMM,IAAM,yBACX;AAKK,IAAM,wBAAwB;AAK9B,IAAM,+BACX;AAGK,IAAM,6BACX;AAKK,IAAM,8BACX;;;;ACLK,IAAM,YAAkB;EAC7B,SAASA,WACP;IACE;IACA,WAAW;IACX,WAAW;IACX,SAAS;IACT;IACA;IACA;IACA;IACA,GAAG;EAAA,GAEL,KACA;AACA,UAAM,MAAM,gBAAgB,EAAE,UAAU,OAAA,CAAQ;AAChD,UAAM,WAAW,YAAY,IAAI;AACjC,UAAM,UAAU,aAAa;AAE7B,WACE;MAAC;MAAA;QACC;QACA,WAAW;UACT,kBAAkB;YAChB,UAAU,WAAW,SAAS;YAC9B,QAAQ,SAAS,SAAS;UAAA,CAC3B;UACD;QAAA;QAEF,cAAY;QACX,GAAG,IAAI;QACP,GAAG,IAAI;QACP,GAAG;QAGH,UAAA;UAAA,aAAa,OACZ,oBAAC,OAAA,EAAI,WAAU,+CACZ,UAAA,UAAA,CACH;;YAGA,oBAAC,OAAA,EAAI,WAAW,8BACb,UAAA,YACC;cAAC;cAAA;gBACC,KAAK;gBACL,KAAK;gBACL,WAAW;cAAA;YAAA,IACb,oBAEC,OAAA,EAAI,WAAW,4BAA4B,eAAY,QACrD,UAAA,SAAA,CACH,EAAA,CAEJ;;UAID,YAAY,QACX,oBAAC,OAAA,EAAI,WAAW,6BAA6B,eAAY,QACtD,UAAA,SAAA,CACH;UAIF,qBAAC,OAAA,EAAI,WAAW,wBACd,UAAA;YAAA,oBAAC,QAAA,EAAM,UAAA,GAAG,IAAI,GAAG,UAAU,KAAK,EAAE,GAAA,CAAG;YACpC,WACC,oBAAC,QAAA,EAAK,WAAW,uBAAuB,cAAW,oBAEjD,UAAA;cAAC;cAAA;gBACC,OAAM;gBACN,OAAM;gBACN,QAAO;gBACP,SAAQ;gBACR,MAAK;gBACL,QAAO;gBACP,aAAY;gBACZ,eAAc;gBACd,gBAAe;gBACf,eAAY;gBAEZ,UAAA;kBAAA,oBAAC,QAAA,EAAK,IAAG,KAAI,IAAG,KAAI,IAAG,MAAK,IAAG,KAAA,CAAK;kBACpC,oBAAC,QAAA,EAAK,GAAE,wCAAA,CAAwC;kBAChD,oBAAC,QAAA,EAAK,GAAE,yBAAA,CAAyB;kBACjC,oBAAC,QAAA,EAAK,GAAE,iCAAA,CAAiC;kBACzC,oBAAC,QAAA,EAAK,GAAE,6BAAA,CAA6B;kBACrC,oBAAC,QAAA,EAAK,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,IAAG,KAAA,CAAK;gBAAA;cAAA;YAAA,EACxC,CACF;UAAA,EAAA,CAEJ;QAAA;MAAA;IAAA;EAGN;AACF;",
+  "names": ["VideoTile"]
+}