@refraction-ui/react 0.19.1 → 0.20.0

package/dist/react-tabs.js

@@ -0,0 +1,230 @@
+import {
+  Keys,
+  cn,
+  cva,
+  devWarn,
+  generateId
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-tabs/dist/index.js
+import * as React from "react";
+
+// ../tabs/dist/index.js
+function createTabs(props = {}) {
+  const {
+    value: controlledValue,
+    defaultValue = "",
+    onValueChange,
+    orientation = "horizontal"
+  } = props;
+  let uncontrolledValue = controlledValue ?? defaultValue;
+  const idPrefix = generateId("rfr-tabs");
+  function getActiveValue() {
+    if (controlledValue !== void 0) return controlledValue;
+    return uncontrolledValue;
+  }
+  function select(value) {
+    uncontrolledValue = value;
+    onValueChange?.(value);
+  }
+  function getTabId(value) {
+    return `${idPrefix}-tab-${value}`;
+  }
+  function getPanelId(value) {
+    return `${idPrefix}-panel-${value}`;
+  }
+  function getTabProps(value) {
+    const isSelected = getActiveValue() === value;
+    return {
+      role: "tab",
+      "aria-selected": isSelected,
+      "aria-controls": getPanelId(value),
+      tabIndex: isSelected ? 0 : -1,
+      id: getTabId(value),
+      "data-state": isSelected ? "active" : "inactive"
+    };
+  }
+  function getPanelProps(value) {
+    const isSelected = getActiveValue() === value;
+    return {
+      role: "tabpanel",
+      "aria-labelledby": getTabId(value),
+      id: getPanelId(value),
+      hidden: !isSelected || void 0,
+      tabIndex: 0,
+      "data-state": isSelected ? "active" : "inactive"
+    };
+  }
+  const listProps = {
+    role: "tablist",
+    "aria-orientation": orientation
+  };
+  const keyboardHandlers = orientation === "horizontal" ? {
+    [Keys.ArrowLeft]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.ArrowRight]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.Home]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.End]: (e) => {
+      e.preventDefault();
+    }
+  } : {
+    [Keys.ArrowUp]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.ArrowDown]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.Home]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.End]: (e) => {
+      e.preventDefault();
+    }
+  };
+  return {
+    state: { activeValue: getActiveValue() },
+    listProps,
+    getTabProps,
+    getPanelProps,
+    select,
+    keyboardHandlers,
+    idPrefix
+  };
+}
+var tabsListVariants = cva({
+  base: "inline-flex max-w-full overflow-x-auto items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground"
+});
+var tabsTriggerVariants = cva({
+  base: "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow"
+});
+
+// ../react-tabs/dist/index.js
+var TabsContext = React.createContext(null);
+function useTabsContext() {
+  const ctx = React.useContext(TabsContext);
+  if (!ctx) {
+    devWarn(
+      "react-tabs/context-outside-provider",
+      "Tabs compound components (TabsList/TabsTrigger/TabsContent) must be rendered inside a <Tabs>. The missing TabsContext makes this throw."
+    );
+    throw new Error("Tabs compound components must be used within <Tabs>");
+  }
+  return ctx;
+}
+var Tabs = React.forwardRef(
+  function Tabs2({ value: controlledValue, defaultValue = "", onValueChange, orientation = "horizontal", className, children, ...props }, ref) {
+    const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue);
+    const isControlled = controlledValue !== void 0;
+    const value = isControlled ? controlledValue : uncontrolledValue;
+    const handleValueChange = React.useCallback(
+      (next) => {
+        if (!isControlled) {
+          setUncontrolledValue(next);
+        }
+        onValueChange?.(next);
+      },
+      [isControlled, onValueChange]
+    );
+    const apiRef = React.useRef(null);
+    if (apiRef.current === null) {
+      apiRef.current = createTabs({ value, orientation });
+    }
+    const api = apiRef.current;
+    const ctx = React.useMemo(
+      () => ({
+        value,
+        onValueChange: handleValueChange,
+        orientation,
+        idPrefix: api.idPrefix
+      }),
+      [value, handleValueChange, orientation, api.idPrefix]
+    );
+    return React.createElement(
+      "div",
+      { ref, className, "data-orientation": orientation, ...props },
+      React.createElement(TabsContext.Provider, { value: ctx }, children)
+    );
+  }
+);
+var TabsList = React.forwardRef(
+  function TabsList2({ className, ...props }, ref) {
+    const { orientation } = useTabsContext();
+    return React.createElement("div", {
+      ref,
+      role: "tablist",
+      "aria-orientation": orientation,
+      className: cn(tabsListVariants(), className),
+      ...props
+    });
+  }
+);
+var TabsTrigger = React.forwardRef(
+  function TabsTrigger2({ value, className, onClick, onKeyDown, children, ...props }, ref) {
+    const { value: activeValue, onValueChange, orientation, idPrefix } = useTabsContext();
+    const isSelected = activeValue === value;
+    const tabId = `${idPrefix}-tab-${value}`;
+    const panelId = `${idPrefix}-panel-${value}`;
+    const handleClick = (e) => {
+      onValueChange(value);
+      onClick?.(e);
+    };
+    const handleKeyDown = (e) => {
+      onKeyDown?.(e);
+    };
+    return React.createElement(
+      "button",
+      {
+        ref,
+        type: "button",
+        role: "tab",
+        "aria-selected": isSelected,
+        "aria-controls": panelId,
+        tabIndex: isSelected ? 0 : -1,
+        id: tabId,
+        "data-state": isSelected ? "active" : "inactive",
+        className: cn(tabsTriggerVariants(), className),
+        onClick: handleClick,
+        onKeyDown: handleKeyDown,
+        ...props
+      },
+      children
+    );
+  }
+);
+var TabsContent = React.forwardRef(
+  function TabsContent2({ value, className, children, ...props }, ref) {
+    const { value: activeValue, idPrefix } = useTabsContext();
+    const isSelected = activeValue === value;
+    const tabId = `${idPrefix}-tab-${value}`;
+    const panelId = `${idPrefix}-panel-${value}`;
+    if (!isSelected) return null;
+    return React.createElement(
+      "div",
+      {
+        ref,
+        role: "tabpanel",
+        "aria-labelledby": tabId,
+        id: panelId,
+        tabIndex: 0,
+        "data-state": "active",
+        className,
+        ...props
+      },
+      children
+    );
+  }
+);
+export {
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+  tabsListVariants,
+  tabsTriggerVariants
+};
+//# sourceMappingURL=react-tabs.js.map

package/dist/react-tabs.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../tabs/src/tabs.ts", "../../tabs/src/tabs.styles.ts", "../../react-tabs/src/tabs.tsx"],
+  "sourcesContent": ["import type { AccessibilityProps, KeyboardHandlerMap } from '@refraction-ui/shared'\nimport { Keys, generateId } from '@refraction-ui/shared'\n\nexport interface TabsProps {\n  /** The active tab value (controlled) */\n  value?: string\n  /** The default active tab value (uncontrolled) */\n  defaultValue?: string\n  /** Callback when active tab changes */\n  onValueChange?: (value: string) => void\n  /** Orientation of the tab list */\n  orientation?: 'horizontal' | 'vertical'\n}\n\nexport interface TabsState {\n  activeValue: string\n}\n\nexport interface TabsAPI {\n  /** Current tabs state */\n  state: TabsState\n  /** ARIA attributes for the tab list */\n  listProps: Partial<AccessibilityProps> & Record<string, unknown>\n  /** Factory for individual tab trigger props */\n  getTabProps(value: string): Partial<AccessibilityProps> & Record<string, unknown>\n  /** Factory for individual tab panel props */\n  getPanelProps(value: string): Partial<AccessibilityProps> & Record<string, unknown>\n  /** Select a tab by value */\n  select(value: string): void\n  /** Keyboard handlers for the tab list */\n  keyboardHandlers: KeyboardHandlerMap\n  /** Generated ID prefix for aria linking */\n  idPrefix: string\n}\n\nexport function createTabs(props: TabsProps = {}): TabsAPI {\n  const {\n    value: controlledValue,\n    defaultValue = '',\n    onValueChange,\n    orientation = 'horizontal',\n  } = props\n\n  let uncontrolledValue = controlledValue ?? defaultValue\n  const idPrefix = generateId('rfr-tabs')\n\n  function getActiveValue(): string {\n    if (controlledValue !== undefined) return controlledValue\n    return uncontrolledValue\n  }\n\n  function select(value: string): void {\n    uncontrolledValue = value\n    onValueChange?.(value)\n  }\n\n  function getTabId(value: string): string {\n    return `${idPrefix}-tab-${value}`\n  }\n\n  function getPanelId(value: string): string {\n    return `${idPrefix}-panel-${value}`\n  }\n\n  function getTabProps(value: string): Partial<AccessibilityProps> & Record<string, unknown> {\n    const isSelected = getActiveValue() === value\n    return {\n      role: 'tab',\n      'aria-selected': isSelected,\n      'aria-controls': getPanelId(value),\n      tabIndex: isSelected ? 0 : -1,\n      id: getTabId(value),\n      'data-state': isSelected ? 'active' : 'inactive',\n    }\n  }\n\n  function getPanelProps(value: string): Partial<AccessibilityProps> & Record<string, unknown> {\n    const isSelected = getActiveValue() === value\n    return {\n      role: 'tabpanel',\n      'aria-labelledby': getTabId(value),\n      id: getPanelId(value),\n      hidden: !isSelected || undefined,\n      tabIndex: 0,\n      'data-state': isSelected ? 'active' : 'inactive',\n    }\n  }\n\n  const listProps: Partial<AccessibilityProps> & Record<string, unknown> = {\n    role: 'tablist',\n    'aria-orientation': orientation,\n  }\n\n  const keyboardHandlers: KeyboardHandlerMap = orientation === 'horizontal'\n    ? {\n        [Keys.ArrowLeft]: (e) => {\n          e.preventDefault()\n        },\n        [Keys.ArrowRight]: (e) => {\n          e.preventDefault()\n        },\n        [Keys.Home]: (e) => {\n          e.preventDefault()\n        },\n        [Keys.End]: (e) => {\n          e.preventDefault()\n        },\n      }\n    : {\n        [Keys.ArrowUp]: (e) => {\n          e.preventDefault()\n        },\n        [Keys.ArrowDown]: (e) => {\n          e.preventDefault()\n        },\n        [Keys.Home]: (e) => {\n          e.preventDefault()\n        },\n        [Keys.End]: (e) => {\n          e.preventDefault()\n        },\n      }\n\n  return {\n    state: { activeValue: getActiveValue() },\n    listProps,\n    getTabProps,\n    getPanelProps,\n    select,\n    keyboardHandlers,\n    idPrefix,\n  }\n}\n", "import { cva } from '@refraction-ui/shared'\n\nexport const tabsListVariants = cva({\n  base: 'inline-flex max-w-full overflow-x-auto items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground',\n})\n\nexport const tabsTriggerVariants = cva({\n  base: 'inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow',\n})\n", "import * as React from 'react'\nimport {\n  createTabs,\n  tabsListVariants,\n  tabsTriggerVariants,\n  type TabsProps as CoreTabsProps,\n} from '@refraction-ui/tabs'\nimport { cn, createKeyboardHandler, Keys, devWarn } from '@refraction-ui/shared'\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\ninterface TabsContextValue {\n  value: string\n  onValueChange: (value: string) => void\n  orientation: 'horizontal' | 'vertical'\n  idPrefix: string\n}\n\nconst TabsContext = React.createContext<TabsContextValue | null>(null)\n\nfunction useTabsContext(): TabsContextValue {\n  const ctx = React.useContext(TabsContext)\n  if (!ctx) {\n    devWarn(\n      'react-tabs/context-outside-provider',\n      'Tabs compound components (TabsList/TabsTrigger/TabsContent) must be rendered inside a <Tabs>. The missing TabsContext makes this throw.',\n    )\n    throw new Error('Tabs compound components must be used within <Tabs>')\n  }\n  return ctx\n}\n\n// ---------------------------------------------------------------------------\n// Tabs (root provider)\n// ---------------------------------------------------------------------------\n\nexport interface TabsProps extends React.HTMLAttributes<HTMLDivElement> {\n  value?: string\n  defaultValue?: string\n  onValueChange?: (value: string) => void\n  orientation?: 'horizontal' | 'vertical'\n  className?: string\n  children?: React.ReactNode\n}\n\nexport const Tabs = React.forwardRef<HTMLDivElement, TabsProps>(\n  function Tabs({ value: controlledValue, defaultValue = '', onValueChange, orientation = 'horizontal', className, children, ...props }: TabsProps, ref) {\n  const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue)\n  const isControlled = controlledValue !== undefined\n  const value = isControlled ? controlledValue : uncontrolledValue\n\n  const handleValueChange = React.useCallback(\n    (next: string) => {\n      if (!isControlled) {\n        setUncontrolledValue(next)\n      }\n      onValueChange?.(next)\n    },\n    [isControlled, onValueChange],\n  )\n\n  // Use the headless core to get stable IDs\n  const apiRef = React.useRef<ReturnType<typeof createTabs> | null>(null)\n  if (apiRef.current === null) {\n    apiRef.current = createTabs({ value, orientation })\n  }\n  const api = apiRef.current\n\n  const ctx = React.useMemo<TabsContextValue>(\n    () => ({\n      value,\n      onValueChange: handleValueChange,\n      orientation,\n      idPrefix: api.idPrefix,\n    }),\n    [value, handleValueChange, orientation, api.idPrefix],\n  )\n\n  return React.createElement(\n    'div',\n    { ref, className, 'data-orientation': orientation, ...props },\n    React.createElement(TabsContext.Provider, { value: ctx }, children),\n  )\n  },\n)\n\n// ---------------------------------------------------------------------------\n// TabsList\n// ---------------------------------------------------------------------------\n\nexport interface TabsListProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const TabsList = React.forwardRef<HTMLDivElement, TabsListProps>(\n  function TabsList({ className, ...props }, ref) {\n    const { orientation } = useTabsContext()\n\n    return React.createElement('div', {\n      ref,\n      role: 'tablist',\n      'aria-orientation': orientation,\n      className: cn(tabsListVariants(), className),\n      ...props,\n    })\n  },\n)\n\n// ---------------------------------------------------------------------------\n// TabsTrigger\n// ---------------------------------------------------------------------------\n\nexport interface TabsTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  value: string\n}\n\nexport const TabsTrigger = React.forwardRef<HTMLButtonElement, TabsTriggerProps>(\n  function TabsTrigger({ value, className, onClick, onKeyDown, children, ...props }, ref) {\n    const { value: activeValue, onValueChange, orientation, idPrefix } = useTabsContext()\n\n    const isSelected = activeValue === value\n    const tabId = `${idPrefix}-tab-${value}`\n    const panelId = `${idPrefix}-panel-${value}`\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onValueChange(value)\n      onClick?.(e)\n    }\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n      // Navigation keys are handled at the list level by convention,\n      // but we expose them here for convenience in SSR-only scenarios\n      onKeyDown?.(e)\n    }\n\n    return React.createElement(\n      'button',\n      {\n        ref,\n        type: 'button',\n        role: 'tab',\n        'aria-selected': isSelected,\n        'aria-controls': panelId,\n        tabIndex: isSelected ? 0 : -1,\n        id: tabId,\n        'data-state': isSelected ? 'active' : 'inactive',\n        className: cn(tabsTriggerVariants(), className),\n        onClick: handleClick,\n        onKeyDown: handleKeyDown,\n        ...props,\n      },\n      children,\n    )\n  },\n)\n\n// ---------------------------------------------------------------------------\n// TabsContent\n// ---------------------------------------------------------------------------\n\nexport interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {\n  value: string\n}\n\nexport const TabsContent = React.forwardRef<HTMLDivElement, TabsContentProps>(\n  function TabsContent({ value, className, children, ...props }, ref) {\n    const { value: activeValue, idPrefix } = useTabsContext()\n\n    const isSelected = activeValue === value\n    const tabId = `${idPrefix}-tab-${value}`\n    const panelId = `${idPrefix}-panel-${value}`\n\n    if (!isSelected) return null\n\n    return React.createElement(\n      'div',\n      {\n        ref,\n        role: 'tabpanel',\n        'aria-labelledby': tabId,\n        id: panelId,\n        tabIndex: 0,\n        'data-state': 'active',\n        className,\n        ...props,\n      },\n      children,\n    )\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["Tabs", "TabsList", "TabsTrigger", "TabsContent"]
+}

package/dist/react-terminal.js

@@ -0,0 +1,101 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-terminal/dist/index.js
+import * as React from "react";
+
+// ../terminal/dist/index.js
+function createTerminal(options = {}) {
+  const ariaProps = {
+    role: "log",
+    "aria-live": "polite"
+  };
+  if (options.label) {
+    ariaProps["aria-label"] = options.label;
+  }
+  const dataAttributes = {
+    "data-component": "terminal"
+  };
+  return { ariaProps, dataAttributes };
+}
+var terminalVariants = cva({
+  base: [
+    "relative rounded-lg border border-border bg-card font-mono text-sm",
+    "overflow-y-auto overflow-x-auto",
+    "p-4 space-y-0.5"
+  ].join(" "),
+  variants: {
+    maxHeight: {
+      sm: "max-h-48",
+      md: "max-h-80",
+      lg: "max-h-[32rem]",
+      none: ""
+    }
+  },
+  defaultVariants: {
+    maxHeight: "md"
+  }
+});
+var terminalLineVariants = cva({
+  base: "block whitespace-pre-wrap break-all leading-relaxed",
+  variants: {
+    kind: {
+      /** The user-typed command: full foreground, bold weight. */
+      command: "text-foreground font-semibold",
+      /** Normal program output. */
+      stdout: "text-foreground",
+      /** Error / stderr output — uses the destructive semantic token. */
+      stderr: "text-destructive",
+      /** Informational summary lines — muted, visually de-emphasised. */
+      info: "text-muted-foreground",
+      /**
+       * Success / passing lines — green-family.
+       * Maps to `text-emerald-500` via the Tailwind semantic alias used
+       * across the design system; downstream themes can override this token.
+       */
+      success: "text-emerald-500 dark:text-emerald-400"
+    }
+  },
+  defaultVariants: {
+    kind: "stdout"
+  }
+});
+var terminalPromptClass = "select-none mr-2 text-muted-foreground";
+
+// ../react-terminal/dist/index.js
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+var Terminal = React.forwardRef(
+  function Terminal2({
+    lines,
+    promptSymbol = "$",
+    maxHeight = "md",
+    className,
+    "aria-label": ariaLabel,
+    ...props
+  }, ref) {
+    const api = createTerminal({ label: ariaLabel });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(terminalVariants({ maxHeight }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: lines.map((line, index) => {
+          const key = line.id ?? index;
+          return /* @__PURE__ */ jsx("span", { className: terminalLineVariants({ kind: line.kind }), children: line.kind === "command" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: terminalPromptClass, children: promptSymbol }),
+            line.text
+          ] }) : line.text }, key);
+        })
+      }
+    );
+  }
+);
+export {
+  Terminal
+};
+//# sourceMappingURL=react-terminal.js.map

package/dist/react-terminal.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../terminal/src/terminal.ts", "../../terminal/src/terminal.styles.ts", "../../react-terminal/src/terminal.tsx"],
+  "sourcesContent": ["/** The semantic kind of a terminal output line. */\nexport type TerminalLineKind = 'command' | 'stdout' | 'stderr' | 'info' | 'success'\n\n/** A single line displayed in the terminal output panel. */\nexport interface TerminalLine {\n  /** Optional stable key for list rendering. */\n  id?: string\n  /** Semantic kind — drives styling and screen-reader announcements. */\n  kind: TerminalLineKind\n  /** Text content of the line. */\n  text: string\n}\n\nexport interface TerminalAPI {\n  /**\n   * ARIA attributes to spread on the terminal container element.\n   * - `role=\"log\"` semantics: assistive technologies announce appended content.\n   * - `aria-live=\"polite\"` so new output does not interrupt the user mid-action.\n   */\n  ariaProps: {\n    role: 'log'\n    'aria-live': 'polite'\n    'aria-label'?: string\n  }\n  /** Data attributes for styling hooks. */\n  dataAttributes: Record<string, string>\n}\n\n/**\n * Build the prompt string shown before a command line.\n *\n * @param promptSymbol - The shell prompt character(s), e.g. `'$'` or `'❯'`.\n * @param command - The command text that follows the prompt.\n * @returns The formatted prompt string, e.g. `'$ python solution.py'`.\n */\nexport function formatPrompt(promptSymbol: string, command: string): string {\n  return `${promptSymbol} ${command}`\n}\n\n/**\n * Build the framework-agnostic ARIA and data props for a terminal output panel.\n *\n * Returns `role=\"log\"` (live region semantics for streaming output) plus data\n * attributes; adapters spread these onto their scroll container.\n */\nexport function createTerminal(options: { label?: string } = {}): TerminalAPI {\n  const ariaProps: TerminalAPI['ariaProps'] = {\n    role: 'log',\n    'aria-live': 'polite',\n  }\n  if (options.label) {\n    ariaProps['aria-label'] = options.label\n  }\n\n  const dataAttributes: Record<string, string> = {\n    'data-component': 'terminal',\n  }\n\n  return { ariaProps, dataAttributes }\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/**\n * The outer scroll container — a dark monospaced surface that houses all\n * terminal lines. Uses semantic card tokens so it inherits the active theme.\n */\nexport const terminalVariants = cva({\n  base: [\n    'relative rounded-lg border border-border bg-card font-mono text-sm',\n    'overflow-y-auto overflow-x-auto',\n    'p-4 space-y-0.5',\n  ].join(' '),\n  variants: {\n    maxHeight: {\n      sm: 'max-h-48',\n      md: 'max-h-80',\n      lg: 'max-h-[32rem]',\n      none: '',\n    },\n  },\n  defaultVariants: {\n    maxHeight: 'md',\n  },\n})\n\n/**\n * A single terminal line. The `kind` variant maps each semantic category to\n * the appropriate semantic token class — no raw color values inline.\n */\nexport const terminalLineVariants = cva({\n  base: 'block whitespace-pre-wrap break-all leading-relaxed',\n  variants: {\n    kind: {\n      /** The user-typed command: full foreground, bold weight. */\n      command: 'text-foreground font-semibold',\n      /** Normal program output. */\n      stdout: 'text-foreground',\n      /** Error / stderr output — uses the destructive semantic token. */\n      stderr: 'text-destructive',\n      /** Informational summary lines — muted, visually de-emphasised. */\n      info: 'text-muted-foreground',\n      /**\n       * Success / passing lines — green-family.\n       * Maps to `text-emerald-500` via the Tailwind semantic alias used\n       * across the design system; downstream themes can override this token.\n       */\n      success: 'text-emerald-500 dark:text-emerald-400',\n    },\n  },\n  defaultVariants: {\n    kind: 'stdout',\n  },\n})\n\n/** The prompt symbol (`$`, `❯`, …) preceding a command line. */\nexport const terminalPromptClass = 'select-none mr-2 text-muted-foreground'\n", "import * as React from 'react'\nimport {\n  createTerminal,\n  terminalVariants,\n  terminalLineVariants,\n  terminalPromptClass,\n  type TerminalLine,\n} from '@refraction-ui/terminal'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { TerminalLine, TerminalLineKind } from '@refraction-ui/terminal'\n\n/** Height cap for the scrollable terminal surface. */\nexport type TerminalMaxHeight = 'sm' | 'md' | 'lg' | 'none'\n\nexport interface TerminalProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Lines to render in order. Each line's `kind` determines its styling. */\n  lines: TerminalLine[]\n  /**\n   * Prompt symbol prepended to `command` lines.\n   * @default '$'\n   */\n  promptSymbol?: string\n  /**\n   * Maximum height of the scroll region before it becomes scrollable.\n   * @default 'md'\n   */\n  maxHeight?: TerminalMaxHeight\n  /** Accessible label for the live region (e.g. `'Run output'`). */\n  'aria-label'?: string\n}\n\n/**\n * Terminal — a read-only output console panel.\n *\n * Renders a monospaced scroll region (`role=\"log\"`, `aria-live=\"polite\"`) with\n * each line styled by its semantic kind:\n * - `command` — foreground bold, prefixed with the prompt symbol\n * - `stdout`  — foreground\n * - `stderr`  — destructive (error token)\n * - `info`    — muted-foreground\n * - `success` — emerald / success token\n *\n * This is a presentational component — it has no internal state and does not\n * handle keyboard input (v1). Pass new lines from the parent to stream output.\n */\nexport const Terminal = React.forwardRef<HTMLDivElement, TerminalProps>(\n  function Terminal(\n    {\n      lines,\n      promptSymbol = '$',\n      maxHeight = 'md',\n      className,\n      'aria-label': ariaLabel,\n      ...props\n    },\n    ref,\n  ) {\n    const api = createTerminal({ label: ariaLabel })\n\n    return (\n      <div\n        ref={ref}\n        className={cn(terminalVariants({ maxHeight }), className)}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      >\n        {lines.map((line, index) => {\n          const key = line.id ?? index\n          return (\n            <span key={key} className={terminalLineVariants({ kind: line.kind })}>\n              {line.kind === 'command' ? (\n                <>\n                  <span className={terminalPromptClass}>{promptSymbol}</span>\n                  {line.text}\n                </>\n              ) : (\n                line.text\n              )}\n            </span>\n          )\n        })}\n      </div>\n    )\n  },\n)\n"],
+  "mappings": ";;;;;;;;;AA6CO,SAAS,eAAe,UAA8B,CAAA,GAAiB;AAC5E,QAAM,YAAsC;IAC1C,MAAM;IACN,aAAa;EAAA;AAEf,MAAI,QAAQ,OAAO;AACjB,cAAU,YAAY,IAAI,QAAQ;EACpC;AAEA,QAAM,iBAAyC;IAC7C,kBAAkB;EAAA;AAGpB,SAAO,EAAE,WAAW,eAAA;AACtB;ACrDO,IAAM,mBAAmB,IAAI;EAClC,MAAM;IACJ;IACA;IACA;EAAA,EACA,KAAK,GAAG;EACV,UAAU;IACR,WAAW;MACT,IAAI;MACJ,IAAI;MACJ,IAAI;MACJ,MAAM;IAAA;EACR;EAEF,iBAAiB;IACf,WAAW;EAAA;AAEf,CAAC;AAMM,IAAM,uBAAuB,IAAI;EACtC,MAAM;EACN,UAAU;IACR,MAAM;;MAEJ,SAAS;;MAET,QAAQ;;MAER,QAAQ;;MAER,MAAM;;;;;;MAMN,SAAS;IAAA;EACX;EAEF,iBAAiB;IACf,MAAM;EAAA;AAEV,CAAC;AAGM,IAAM,sBAAsB;;;;ACT5B,IAAM,WAAiB;EAC5B,SAASA,UACP;IACE;IACA,eAAe;IACf,YAAY;IACZ;IACA,cAAc;IACd,GAAG;EAAA,GAEL,KACA;AACA,UAAM,MAAM,eAAe,EAAE,OAAO,UAAA,CAAW;AAE/C,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,iBAAiB,EAAE,UAAA,CAAW,GAAG,SAAS;QACvD,GAAG,IAAI;QACP,GAAG,IAAI;QACP,GAAG;QAEH,UAAA,MAAM,IAAI,CAAC,MAAM,UAAU;AAC1B,gBAAM,MAAM,KAAK,MAAM;AACvB,iBACE,oBAAC,QAAA,EAAe,WAAW,qBAAqB,EAAE,MAAM,KAAK,KAAA,CAAM,GAChE,UAAA,KAAK,SAAS,YACb,qBAAA,UAAA,EACE,UAAA;YAAA,oBAAC,QAAA,EAAK,WAAW,qBAAsB,UAAA,aAAA,CAAa;YACnD,KAAK;UAAA,EAAA,CACR,IAEA,KAAK,KAAA,GAPE,GASX;QAEJ,CAAC;MAAA;IAAA;EAGP;AACF;",
+  "names": ["Terminal"]
+}

package/dist/react-test-results.js

@@ -0,0 +1,158 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-test-results/dist/index.js
+import * as React from "react";
+
+// ../test-results/dist/index.js
+function summarizeTests(results) {
+  let passed = 0;
+  let failed = 0;
+  let skipped = 0;
+  for (const r of results) {
+    if (r.status === "pass") passed++;
+    else if (r.status === "fail") failed++;
+    else skipped++;
+  }
+  return {
+    total: results.length,
+    passed,
+    failed,
+    skipped,
+    allPassed: failed === 0 && skipped === 0 && results.length > 0
+  };
+}
+function createTestResults() {
+  const ariaProps = {
+    role: "list"
+  };
+  const dataAttributes = {
+    "data-component": "test-results"
+  };
+  return { ariaProps, dataAttributes };
+}
+var testResultsContainerVariants = cva({
+  base: "flex flex-col gap-3 w-full",
+  variants: {},
+  defaultVariants: {}
+});
+var testResultsSummaryVariants = cva({
+  base: [
+    "flex items-center gap-2 rounded-md px-3 py-2 text-sm font-medium",
+    "border"
+  ].join(" "),
+  variants: {
+    outcome: {
+      pass: "border-success/30 bg-success/10 text-success",
+      fail: "border-destructive/30 bg-destructive/10 text-destructive",
+      skip: "border-muted/30 bg-muted/10 text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    outcome: "pass"
+  }
+});
+var testRowVariants = cva({
+  base: [
+    "flex flex-col gap-1.5 rounded-md border px-3 py-2.5 text-sm"
+  ].join(" "),
+  variants: {
+    status: {
+      pass: "border-success/20 bg-success/5",
+      fail: "border-destructive/20 bg-destructive/5",
+      skip: "border-muted/20 bg-muted/5"
+    }
+  },
+  defaultVariants: {
+    status: "pass"
+  }
+});
+var testStatusBadgeVariants = cva({
+  base: "inline-flex items-center rounded px-1.5 py-0.5 text-xs font-semibold uppercase tracking-wide",
+  variants: {
+    status: {
+      pass: "bg-success/20 text-success",
+      fail: "bg-destructive/20 text-destructive",
+      skip: "bg-muted text-muted-foreground"
+    }
+  },
+  defaultVariants: {
+    status: "pass"
+  }
+});
+var testNameClass = "font-medium text-foreground";
+var testDurationClass = "text-xs text-muted-foreground";
+var testDiffBlockVariants = cva({
+  base: [
+    "rounded border-l-2 bg-muted/30 px-3 py-2 font-mono text-xs text-foreground"
+  ].join(" "),
+  variants: {
+    side: {
+      expected: "border-l-success text-success",
+      actual: "border-l-destructive text-destructive"
+    }
+  },
+  defaultVariants: {
+    side: "actual"
+  }
+});
+var testMessageClass = "text-xs text-muted-foreground italic";
+
+// ../react-test-results/dist/index.js
+import { jsxs, jsx } from "react/jsx-runtime";
+var TestResults = React.forwardRef(
+  function TestResults2({ results, showSummary = true, className, ...props }, ref) {
+    const summary = React.useMemo(() => summarizeTests(results), [results]);
+    const { ariaProps, dataAttributes } = createTestResults();
+    const summaryOutcome = summary.failed > 0 ? "fail" : summary.skipped > 0 ? "skip" : "pass";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(testResultsContainerVariants(), className),
+        ...dataAttributes,
+        ...props,
+        children: [
+          showSummary && results.length > 0 && /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: testResultsSummaryVariants({ outcome: summaryOutcome }),
+              "aria-live": "polite",
+              children: [
+                /* @__PURE__ */ jsx("span", { children: `${summary.passed}/${summary.total} passed` }),
+                summary.failed > 0 && /* @__PURE__ */ jsx("span", { children: `\xB7 ${summary.failed} failed` }),
+                summary.skipped > 0 && /* @__PURE__ */ jsx("span", { children: `\xB7 ${summary.skipped} skipped` })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("ul", { ...ariaProps, className: "flex flex-col gap-2", children: results.map((result) => /* @__PURE__ */ jsxs("li", { role: "listitem", className: testRowVariants({ status: result.status }), children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+                /* @__PURE__ */ jsx("span", { className: testStatusBadgeVariants({ status: result.status }), children: result.status }),
+                /* @__PURE__ */ jsx("span", { className: cn(testNameClass, "truncate"), children: result.name })
+              ] }),
+              result.durationMs !== void 0 && /* @__PURE__ */ jsx("span", { className: testDurationClass, children: `${result.durationMs} ms` })
+            ] }),
+            result.status === "fail" && result.expected !== void 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 mt-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: testDiffBlockVariants({ side: "expected" }), children: [
+                /* @__PURE__ */ jsx("span", { className: "opacity-60 mr-1 select-none", children: "expected" }),
+                result.expected
+              ] }),
+              result.actual !== void 0 && /* @__PURE__ */ jsxs("div", { className: testDiffBlockVariants({ side: "actual" }), children: [
+                /* @__PURE__ */ jsx("span", { className: "opacity-60 mr-1 select-none", children: "actual" }),
+                result.actual
+              ] })
+            ] }),
+            result.message && /* @__PURE__ */ jsx("p", { className: testMessageClass, children: result.message })
+          ] }, result.id)) })
+        ]
+      }
+    );
+  }
+);
+export {
+  TestResults
+};
+//# sourceMappingURL=react-test-results.js.map

package/dist/react-test-results.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../test-results/src/test-results.ts", "../../test-results/src/test-results.styles.ts", "../../react-test-results/src/test-results.tsx"],
+  "sourcesContent": ["import type { AccessibilityProps } from '@refraction-ui/shared'\n\n/** The execution status of a single test case. */\nexport type TestStatus = 'pass' | 'fail' | 'skip'\n\n/** Data for a single test case result. */\nexport interface TestResultData {\n  /** Unique identifier for the test. */\n  id: string\n  /** Human-readable test name. */\n  name: string\n  /** Execution status. */\n  status: TestStatus\n  /** How long the test took to run, in milliseconds. */\n  durationMs?: number\n  /** Expected value (shown in diff when the test fails). */\n  expected?: string\n  /** Actual value received (shown in diff when the test fails). */\n  actual?: string\n  /** Optional message — error message on failure, skip reason, etc. */\n  message?: string\n}\n\n/** Aggregate counts derived from a list of test results. */\nexport interface TestSummary {\n  total: number\n  passed: number\n  failed: number\n  skipped: number\n  /** True when every test passed (failed === 0 and skipped === 0). */\n  allPassed: boolean\n}\n\nexport interface TestResultsAPI {\n  /** ARIA attributes to spread on the list container (`role=\"list\"`). */\n  ariaProps: Partial<AccessibilityProps>\n  /** Data attributes for styling hooks. */\n  dataAttributes: Record<string, string>\n}\n\n/**\n * Compute aggregate summary counts from a list of {@link TestResultData}.\n *\n * Pure function — no side effects, safe to call during SSR.\n */\nexport function summarizeTests(results: TestResultData[]): TestSummary {\n  let passed = 0\n  let failed = 0\n  let skipped = 0\n\n  for (const r of results) {\n    if (r.status === 'pass') passed++\n    else if (r.status === 'fail') failed++\n    else skipped++\n  }\n\n  return {\n    total: results.length,\n    passed,\n    failed,\n    skipped,\n    allPassed: failed === 0 && skipped === 0 && results.length > 0,\n  }\n}\n\n/**\n * Build the framework-agnostic container props for a test results list.\n *\n * Returns `role=\"list\"` plus data attributes that adapters spread onto their\n * container element. The adapter is responsible for rendering individual items\n * with `role=\"listitem\"`.\n */\nexport function createTestResults(): TestResultsAPI {\n  const ariaProps: Partial<AccessibilityProps> = {\n    role: 'list',\n  }\n\n  const dataAttributes: Record<string, string> = {\n    'data-component': 'test-results',\n  }\n\n  return { ariaProps, dataAttributes }\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/** Outer container that wraps the summary bar and the test row list. */\nexport const testResultsContainerVariants = cva({\n  base: 'flex flex-col gap-3 w-full',\n  variants: {},\n  defaultVariants: {},\n})\n\n/**\n * Summary bar (\"2 / 3 passed\").\n *\n * The `outcome` variant maps to a semantic color token so the bar turns green\n * when everything passes, red when there are failures.\n */\nexport const testResultsSummaryVariants = cva({\n  base: [\n    'flex items-center gap-2 rounded-md px-3 py-2 text-sm font-medium',\n    'border',\n  ].join(' '),\n  variants: {\n    outcome: {\n      pass: 'border-success/30 bg-success/10 text-success',\n      fail: 'border-destructive/30 bg-destructive/10 text-destructive',\n      skip: 'border-muted/30 bg-muted/10 text-muted-foreground',\n    },\n  },\n  defaultVariants: {\n    outcome: 'pass',\n  },\n})\n\n/** A single test row in the list. */\nexport const testRowVariants = cva({\n  base: [\n    'flex flex-col gap-1.5 rounded-md border px-3 py-2.5 text-sm',\n  ].join(' '),\n  variants: {\n    status: {\n      pass: 'border-success/20 bg-success/5',\n      fail: 'border-destructive/20 bg-destructive/5',\n      skip: 'border-muted/20 bg-muted/5',\n    },\n  },\n  defaultVariants: {\n    status: 'pass',\n  },\n})\n\n/** Status icon / badge inside a test row (the PASS / FAIL / SKIP pill). */\nexport const testStatusBadgeVariants = cva({\n  base: 'inline-flex items-center rounded px-1.5 py-0.5 text-xs font-semibold uppercase tracking-wide',\n  variants: {\n    status: {\n      pass: 'bg-success/20 text-success',\n      fail: 'bg-destructive/20 text-destructive',\n      skip: 'bg-muted text-muted-foreground',\n    },\n  },\n  defaultVariants: {\n    status: 'pass',\n  },\n})\n\n/** Test name text inside a row. */\nexport const testNameClass = 'font-medium text-foreground'\n\n/** Duration text (\"12 ms\") inside a row. */\nexport const testDurationClass = 'text-xs text-muted-foreground'\n\n/**\n * Expected / actual diff block shown beneath a failing test row.\n *\n * The `side` variant sets the left-border accent color to distinguish the two\n * sides of the diff.\n */\nexport const testDiffBlockVariants = cva({\n  base: [\n    'rounded border-l-2 bg-muted/30 px-3 py-2 font-mono text-xs text-foreground',\n  ].join(' '),\n  variants: {\n    side: {\n      expected: 'border-l-success text-success',\n      actual: 'border-l-destructive text-destructive',\n    },\n  },\n  defaultVariants: {\n    side: 'actual',\n  },\n})\n\n/** Error / skip message text beneath a test row. */\nexport const testMessageClass = 'text-xs text-muted-foreground italic'\n", "import * as React from 'react'\nimport {\n  summarizeTests,\n  createTestResults,\n  testResultsContainerVariants,\n  testResultsSummaryVariants,\n  testRowVariants,\n  testStatusBadgeVariants,\n  testNameClass,\n  testDurationClass,\n  testDiffBlockVariants,\n  testMessageClass,\n  type TestResultData,\n  type TestStatus,\n} from '@refraction-ui/test-results'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { TestResultData, TestStatus }\n\nexport interface TestResultsProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'results'> {\n  /** Array of test case results to display. */\n  results: TestResultData[]\n  /** When true, renders a summary bar showing \"{passed}/{total} passed\". */\n  showSummary?: boolean\n}\n\n/**\n * TestResults — displays a list of test case results with pass/fail/skip\n * status, optional expected/actual diff for failures, and an optional summary\n * bar.\n *\n * Renders `role=\"list\"` on the container; each row has `role=\"listitem\"`.\n * Logic and styles come from the headless `@refraction-ui/test-results` core.\n */\nexport const TestResults = React.forwardRef<HTMLDivElement, TestResultsProps>(\n  function TestResults({ results, showSummary = true, className, ...props }, ref) {\n    const summary = React.useMemo(() => summarizeTests(results), [results])\n    const { ariaProps, dataAttributes } = createTestResults()\n\n    const summaryOutcome = summary.failed > 0 ? 'fail' : summary.skipped > 0 ? 'skip' : 'pass'\n\n    return (\n      <div\n        ref={ref}\n        className={cn(testResultsContainerVariants(), className)}\n        {...dataAttributes}\n        {...props}\n      >\n        {showSummary && results.length > 0 && (\n          <div\n            className={testResultsSummaryVariants({ outcome: summaryOutcome })}\n            aria-live=\"polite\"\n          >\n            <span>{`${summary.passed}/${summary.total} passed`}</span>\n            {summary.failed > 0 && <span>{`· ${summary.failed} failed`}</span>}\n            {summary.skipped > 0 && (\n              <span>{`· ${summary.skipped} skipped`}</span>\n            )}\n          </div>\n        )}\n\n        <ul {...ariaProps} className=\"flex flex-col gap-2\">\n          {results.map((result) => (\n            <li key={result.id} role=\"listitem\" className={testRowVariants({ status: result.status })}>\n              <div className=\"flex items-center justify-between gap-2\">\n                <div className=\"flex items-center gap-2 min-w-0\">\n                  <span className={testStatusBadgeVariants({ status: result.status })}>\n                    {result.status}\n                  </span>\n                  <span className={cn(testNameClass, 'truncate')}>{result.name}</span>\n                </div>\n                {result.durationMs !== undefined && (\n                  <span className={testDurationClass}>{`${result.durationMs} ms`}</span>\n                )}\n              </div>\n\n              {result.status === 'fail' && result.expected !== undefined && (\n                <div className=\"flex flex-col gap-1 mt-1\">\n                  <div className={testDiffBlockVariants({ side: 'expected' })}>\n                    <span className=\"opacity-60 mr-1 select-none\">expected</span>\n                    {result.expected}\n                  </div>\n                  {result.actual !== undefined && (\n                    <div className={testDiffBlockVariants({ side: 'actual' })}>\n                      <span className=\"opacity-60 mr-1 select-none\">actual</span>\n                      {result.actual}\n                    </div>\n                  )}\n                </div>\n              )}\n\n              {result.message && (\n                <p className={testMessageClass}>{result.message}</p>\n              )}\n            </li>\n          ))}\n        </ul>\n      </div>\n    )\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["TestResults"]
+}

package/dist/react-textarea.js

@@ -0,0 +1,89 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-textarea/dist/index.js
+import * as React from "react";
+
+// ../textarea/dist/index.js
+function createTextarea(props = {}) {
+  const {
+    disabled = false,
+    readOnly = false,
+    required = false,
+    "aria-invalid": ariaInvalid
+  } = props;
+  const ariaProps = {};
+  if (disabled) {
+    ariaProps["aria-disabled"] = true;
+  }
+  if (ariaInvalid) {
+    ariaProps["aria-invalid"] = true;
+  }
+  if (required) {
+    ariaProps["aria-required"] = true;
+  }
+  const dataAttributes = {};
+  if (disabled) {
+    dataAttributes["data-disabled"] = "";
+  }
+  if (readOnly) {
+    dataAttributes["data-readonly"] = "";
+  }
+  if (ariaInvalid) {
+    dataAttributes["data-invalid"] = "";
+  }
+  return {
+    ariaProps,
+    dataAttributes
+  };
+}
+var textareaVariants = cva({
+  base: "flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+  variants: {
+    size: {
+      sm: "min-h-[40px] text-xs",
+      default: "min-h-[60px]",
+      lg: "min-h-[80px] text-base"
+    }
+  },
+  defaultVariants: {
+    size: "default"
+  }
+});
+
+// ../react-textarea/dist/index.js
+import { jsx } from "react/jsx-runtime";
+var Textarea = React.forwardRef(
+  function Textarea2({ size, className, disabled, readOnly, required, rows, maxRows, "aria-invalid": ariaInvalid, ...props }, ref) {
+    const api = createTextarea({
+      disabled,
+      readOnly,
+      required,
+      rows,
+      maxRows,
+      "aria-invalid": ariaInvalid === true ? true : void 0
+    });
+    const classes = cn(textareaVariants({ size }), className);
+    return /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref,
+        className: classes,
+        disabled,
+        readOnly,
+        required,
+        rows,
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props
+      }
+    );
+  }
+);
+export {
+  Textarea,
+  textareaVariants
+};
+//# sourceMappingURL=react-textarea.js.map