@refraction-ui/react 0.19.1 → 0.20.0

package/dist/react-dropdown-menu.js

@@ -0,0 +1,292 @@
+import {
+  Keys,
+  cn,
+  createKeyboardHandler,
+  createMachine,
+  cva,
+  devWarn,
+  generateId
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-dropdown-menu/dist/index.js
+import * as React from "react";
+import * as ReactDOM from "react-dom";
+
+// ../dropdown-menu/dist/index.js
+function createDropdownMenu(props = {}) {
+  const { open: controlledOpen, defaultOpen = false, onOpenChange } = props;
+  const machine = createMachine({
+    initial: controlledOpen ?? defaultOpen ? "open" : "closed",
+    states: {
+      closed: { on: { OPEN: "open" } },
+      open: { on: { CLOSE: "closed" } }
+    }
+  });
+  const contentId = generateId("rfr-dropdown-menu");
+  function isOpen() {
+    if (controlledOpen !== void 0) return controlledOpen;
+    return machine.matches("open");
+  }
+  function openMenu() {
+    machine.send("OPEN");
+    onOpenChange?.(true);
+  }
+  function closeMenu() {
+    machine.send("CLOSE");
+    onOpenChange?.(false);
+  }
+  function toggleMenu() {
+    if (isOpen()) {
+      closeMenu();
+    } else {
+      openMenu();
+    }
+  }
+  function getItemProps(item) {
+    return {
+      role: "menuitem",
+      tabIndex: item.disabled ? -1 : 0,
+      "data-disabled": item.disabled ? "" : void 0,
+      "aria-disabled": item.disabled || void 0
+    };
+  }
+  const keyboardHandlers = {
+    [Keys.Escape]: (e) => {
+      e.preventDefault();
+      closeMenu();
+    },
+    [Keys.ArrowDown]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.ArrowUp]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.Enter]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.Home]: (e) => {
+      e.preventDefault();
+    },
+    [Keys.End]: (e) => {
+      e.preventDefault();
+    }
+  };
+  const triggerProps = {
+    "aria-expanded": isOpen(),
+    "aria-controls": contentId,
+    "aria-haspopup": "menu"
+  };
+  const contentProps = {
+    role: "menu",
+    id: contentId,
+    "data-state": isOpen() ? "open" : "closed"
+  };
+  return {
+    state: { open: isOpen() },
+    triggerProps,
+    contentProps,
+    getItemProps,
+    open: openMenu,
+    close: closeMenu,
+    toggle: toggleMenu,
+    keyboardHandlers,
+    ids: {
+      content: contentId
+    }
+  };
+}
+var menuContentVariants = cva({
+  base: "z-50 rounded-md border bg-popover shadow-md"
+});
+var menuItemVariants = cva({
+  base: "relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
+});
+
+// ../react-dropdown-menu/dist/index.js
+var DropdownMenuContext = React.createContext(null);
+function useDropdownMenuContext() {
+  const ctx = React.useContext(DropdownMenuContext);
+  if (!ctx) {
+    devWarn(
+      "react-dropdown-menu/context-outside-provider",
+      "DropdownMenu compound components (DropdownMenuTrigger/DropdownMenuContent/DropdownMenuItem/etc.) must be rendered inside a <DropdownMenu>. The missing DropdownMenuContext makes this throw."
+    );
+    throw new Error("DropdownMenu compound components must be used within <DropdownMenu>");
+  }
+  return ctx;
+}
+function DropdownMenu({
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  children
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);
+  const isControlled = controlledOpen !== void 0;
+  const open = isControlled ? controlledOpen : uncontrolledOpen;
+  const handleOpenChange = React.useCallback(
+    (next) => {
+      if (!isControlled) {
+        setUncontrolledOpen(next);
+      }
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const apiRef = React.useRef(null);
+  if (apiRef.current === null) {
+    apiRef.current = createDropdownMenu({ open });
+  }
+  const api = apiRef.current;
+  const ctx = React.useMemo(
+    () => ({
+      open,
+      onOpenChange: handleOpenChange,
+      contentId: api.ids.content
+    }),
+    [open, handleOpenChange, api.ids.content]
+  );
+  return React.createElement(DropdownMenuContext.Provider, { value: ctx }, children);
+}
+var DropdownMenuTrigger = React.forwardRef(
+  function DropdownMenuTrigger2({ asChild = false, onClick, children, ...props }, ref) {
+    const { open, onOpenChange, contentId } = useDropdownMenuContext();
+    const handleClick = (e) => {
+      onOpenChange(!open);
+      onClick?.(e);
+    };
+    const triggerProps = {
+      type: "button",
+      "aria-expanded": open,
+      "aria-controls": contentId,
+      "aria-haspopup": "menu",
+      onClick: handleClick,
+      ...props
+    };
+    if (asChild) {
+      if (!React.isValidElement(children)) {
+        devWarn(
+          "dropdown-menu-trigger-asChild-child",
+          "DropdownMenuTrigger: `asChild` expects a single React element child; rendering nothing."
+        );
+        return null;
+      }
+      const child = children;
+      const childOnClick = child.props.onClick;
+      const childRef = child.ref;
+      const mergedProps = {
+        ...triggerProps,
+        onClick: (e) => {
+          childOnClick?.(e);
+          if (!e.defaultPrevented) handleClick(e);
+        },
+        ref: (node) => {
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+          if (typeof childRef === "function") childRef(node);
+          else if (childRef) childRef.current = node;
+        }
+      };
+      return React.cloneElement(child, mergedProps);
+    }
+    return React.createElement("button", { ref, ...triggerProps }, children);
+  }
+);
+var DropdownMenuContent = React.forwardRef(
+  function DropdownMenuContent2({ className, children, onKeyDown, ...props }, ref) {
+    const { open, onOpenChange, contentId } = useDropdownMenuContext();
+    const handleKeyDown = (e) => {
+      const handler = createKeyboardHandler({
+        Escape: (ev) => {
+          ev.preventDefault();
+          onOpenChange(false);
+        }
+      });
+      handler(e.nativeEvent);
+      onKeyDown?.(e);
+    };
+    if (!open) return null;
+    const content = React.createElement(
+      "div",
+      {
+        ref,
+        role: "menu",
+        id: contentId,
+        "data-state": open ? "open" : "closed",
+        className: cn(menuContentVariants(), className),
+        onKeyDown: handleKeyDown,
+        tabIndex: -1,
+        ...props
+      },
+      children
+    );
+    if (typeof document !== "undefined") {
+      return ReactDOM.createPortal(content, document.body);
+    }
+    return content;
+  }
+);
+var DropdownMenuItem = React.forwardRef(
+  function DropdownMenuItem2({ className, disabled, onSelect, onClick, children, ...props }, ref) {
+    const { onOpenChange } = useDropdownMenuContext();
+    const handleClick = (e) => {
+      if (disabled) return;
+      onSelect?.();
+      onOpenChange(false);
+      onClick?.(e);
+    };
+    const handleKeyDown = (e) => {
+      if (disabled) return;
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        onSelect?.();
+        onOpenChange(false);
+      }
+    };
+    return React.createElement(
+      "div",
+      {
+        ref,
+        role: "menuitem",
+        tabIndex: disabled ? -1 : 0,
+        "data-disabled": disabled ? "" : void 0,
+        "aria-disabled": disabled || void 0,
+        className: cn(menuItemVariants(), className),
+        onClick: handleClick,
+        onKeyDown: handleKeyDown,
+        ...props
+      },
+      children
+    );
+  }
+);
+var DropdownMenuSeparator = React.forwardRef(
+  function DropdownMenuSeparator2({ className, ...props }, ref) {
+    return React.createElement("div", {
+      ref,
+      role: "separator",
+      className: cn("-mx-1 my-1 h-px bg-muted", className),
+      ...props
+    });
+  }
+);
+var DropdownMenuLabel = React.forwardRef(
+  function DropdownMenuLabel2({ className, ...props }, ref) {
+    return React.createElement("div", {
+      ref,
+      className: cn("px-2 py-1.5 text-sm font-semibold", className),
+      ...props
+    });
+  }
+);
+export {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+  menuContentVariants,
+  menuItemVariants
+};
+//# sourceMappingURL=react-dropdown-menu.js.map

package/dist/react-dropdown-menu.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../dropdown-menu/src/dropdown-menu.ts", "../../dropdown-menu/src/dropdown-menu.styles.ts", "../../react-dropdown-menu/src/dropdown-menu.tsx"],
+  "sourcesContent": ["import type { AccessibilityProps, KeyboardHandlerMap } from '@refraction-ui/shared'\nimport { createMachine, Keys, generateId } from '@refraction-ui/shared'\n\nexport interface DropdownMenuProps {\n  /** Whether the menu is open (controlled) */\n  open?: boolean\n  /** Whether the menu starts open (uncontrolled) */\n  defaultOpen?: boolean\n  /** Callback when open state changes */\n  onOpenChange?: (open: boolean) => void\n}\n\nexport interface MenuItemProps {\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Callback when the item is selected */\n  onSelect?: () => void\n}\n\nexport interface DropdownMenuState {\n  open: boolean\n}\n\nexport interface DropdownMenuAPI {\n  /** Current menu state */\n  state: DropdownMenuState\n  /** ARIA attributes for the trigger button */\n  triggerProps: Partial<AccessibilityProps> & Record<string, unknown>\n  /** ARIA attributes for the menu content */\n  contentProps: Partial<AccessibilityProps> & Record<string, unknown>\n  /** Factory for menu item props */\n  getItemProps(item: MenuItemProps): Partial<AccessibilityProps> & Record<string, unknown>\n  /** Open the menu */\n  open(): void\n  /** Close the menu */\n  close(): void\n  /** Toggle the menu */\n  toggle(): void\n  /** Keyboard handlers for the menu */\n  keyboardHandlers: KeyboardHandlerMap\n  /** Generated IDs for aria linking */\n  ids: {\n    content: string\n  }\n}\n\nexport function createDropdownMenu(props: DropdownMenuProps = {}): DropdownMenuAPI {\n  const { open: controlledOpen, defaultOpen = false, onOpenChange } = props\n\n  const machine = createMachine<'open' | 'closed', 'OPEN' | 'CLOSE'>({\n    initial: controlledOpen ?? defaultOpen ? 'open' : 'closed',\n    states: {\n      closed: { on: { OPEN: 'open' } },\n      open: { on: { CLOSE: 'closed' } },\n    },\n  })\n\n  const contentId = generateId('rfr-dropdown-menu')\n\n  function isOpen(): boolean {\n    if (controlledOpen !== undefined) return controlledOpen\n    return machine.matches('open')\n  }\n\n  function openMenu(): void {\n    machine.send('OPEN')\n    onOpenChange?.(true)\n  }\n\n  function closeMenu(): void {\n    machine.send('CLOSE')\n    onOpenChange?.(false)\n  }\n\n  function toggleMenu(): void {\n    if (isOpen()) {\n      closeMenu()\n    } else {\n      openMenu()\n    }\n  }\n\n  function getItemProps(item: MenuItemProps): Partial<AccessibilityProps> & Record<string, unknown> {\n    return {\n      role: 'menuitem',\n      tabIndex: item.disabled ? -1 : 0,\n      'data-disabled': item.disabled ? '' : undefined,\n      'aria-disabled': item.disabled || undefined,\n    }\n  }\n\n  const keyboardHandlers: KeyboardHandlerMap = {\n    [Keys.Escape]: (e: KeyboardEvent) => {\n      e.preventDefault()\n      closeMenu()\n    },\n    [Keys.ArrowDown]: (e: KeyboardEvent) => {\n      e.preventDefault()\n    },\n    [Keys.ArrowUp]: (e: KeyboardEvent) => {\n      e.preventDefault()\n    },\n    [Keys.Enter]: (e: KeyboardEvent) => {\n      e.preventDefault()\n    },\n    [Keys.Home]: (e: KeyboardEvent) => {\n      e.preventDefault()\n    },\n    [Keys.End]: (e: KeyboardEvent) => {\n      e.preventDefault()\n    },\n  }\n\n  const triggerProps: Partial<AccessibilityProps> & Record<string, unknown> = {\n    'aria-expanded': isOpen(),\n    'aria-controls': contentId,\n    'aria-haspopup': 'menu',\n  }\n\n  const contentProps: Partial<AccessibilityProps> & Record<string, unknown> = {\n    role: 'menu',\n    id: contentId,\n    'data-state': isOpen() ? 'open' : 'closed',\n  }\n\n  return {\n    state: { open: isOpen() },\n    triggerProps,\n    contentProps,\n    getItemProps,\n    open: openMenu,\n    close: closeMenu,\n    toggle: toggleMenu,\n    keyboardHandlers,\n    ids: {\n      content: contentId,\n    },\n  }\n}\n", "import { cva } from '@refraction-ui/shared'\n\nexport const menuContentVariants = cva({\n  base: 'z-50 rounded-md border bg-popover shadow-md',\n})\n\nexport const menuItemVariants = cva({\n  base: 'relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n})\n", "import * as React from 'react'\nimport * as ReactDOM from 'react-dom'\nimport {\n  createDropdownMenu,\n  menuContentVariants,\n  menuItemVariants,\n  type DropdownMenuProps as CoreDropdownMenuProps,\n  type MenuItemProps as CoreMenuItemProps,\n} from '@refraction-ui/dropdown-menu'\nimport { cn, createKeyboardHandler, devWarn } from '@refraction-ui/shared'\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\ninterface DropdownMenuContextValue {\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  contentId: string\n}\n\nconst DropdownMenuContext = React.createContext<DropdownMenuContextValue | null>(null)\n\nfunction useDropdownMenuContext(): DropdownMenuContextValue {\n  const ctx = React.useContext(DropdownMenuContext)\n  if (!ctx) {\n    devWarn(\n      'react-dropdown-menu/context-outside-provider',\n      'DropdownMenu compound components (DropdownMenuTrigger/DropdownMenuContent/DropdownMenuItem/etc.) must be rendered inside a <DropdownMenu>. The missing DropdownMenuContext makes this throw.',\n    )\n    throw new Error('DropdownMenu compound components must be used within <DropdownMenu>')\n  }\n  return ctx\n}\n\n// ---------------------------------------------------------------------------\n// DropdownMenu (root provider)\n// ---------------------------------------------------------------------------\n\nexport interface DropdownMenuProps {\n  open?: boolean\n  defaultOpen?: boolean\n  onOpenChange?: (open: boolean) => void\n  children?: React.ReactNode\n}\n\nexport function DropdownMenu({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  children,\n}: DropdownMenuProps) {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen)\n  const isControlled = controlledOpen !== undefined\n  const open = isControlled ? controlledOpen : uncontrolledOpen\n\n  const handleOpenChange = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) {\n        setUncontrolledOpen(next)\n      }\n      onOpenChange?.(next)\n    },\n    [isControlled, onOpenChange],\n  )\n\n  // Use the headless core to get stable IDs\n  const apiRef = React.useRef<ReturnType<typeof createDropdownMenu> | null>(null)\n  if (apiRef.current === null) {\n    apiRef.current = createDropdownMenu({ open })\n  }\n  const api = apiRef.current\n\n  const ctx = React.useMemo<DropdownMenuContextValue>(\n    () => ({\n      open,\n      onOpenChange: handleOpenChange,\n      contentId: api.ids.content,\n    }),\n    [open, handleOpenChange, api.ids.content],\n  )\n\n  return React.createElement(DropdownMenuContext.Provider, { value: ctx }, children)\n}\n\n// ---------------------------------------------------------------------------\n// DropdownMenuTrigger\n// ---------------------------------------------------------------------------\n\nexport interface DropdownMenuTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Merge the trigger's props/behavior onto the child element instead of\n   * rendering a `<button>` around it (Radix-style `asChild`). Use it with\n   * styled triggers like `<Button>` — otherwise you'd nest a button in a\n   * button (invalid HTML and a hydration error). */\n  asChild?: boolean\n}\n\nexport const DropdownMenuTrigger = React.forwardRef<HTMLButtonElement, DropdownMenuTriggerProps>(\n  function DropdownMenuTrigger({ asChild = false, onClick, children, ...props }, ref) {\n    const { open, onOpenChange, contentId } = useDropdownMenuContext()\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onOpenChange(!open)\n      onClick?.(e)\n    }\n\n    const triggerProps = {\n      type: 'button' as const,\n      'aria-expanded': open,\n      'aria-controls': contentId,\n      'aria-haspopup': 'menu' as const,\n      onClick: handleClick,\n      ...props,\n    }\n\n    if (asChild) {\n      if (!React.isValidElement(children)) {\n        devWarn(\n          'dropdown-menu-trigger-asChild-child',\n          'DropdownMenuTrigger: `asChild` expects a single React element child; rendering nothing.',\n        )\n        return null\n      }\n      const child = children as React.ReactElement<\n        Record<string, unknown>\n      > & { ref?: React.Ref<HTMLButtonElement> }\n      const childOnClick = child.props.onClick as\n        | ((e: React.MouseEvent<HTMLButtonElement>) => void)\n        | undefined\n      const childRef = child.ref\n      const mergedProps = {\n        ...triggerProps,\n        onClick: (e: React.MouseEvent<HTMLButtonElement>) => {\n          childOnClick?.(e)\n          if (!e.defaultPrevented) handleClick(e)\n        },\n        ref: (node: HTMLButtonElement | null) => {\n          if (typeof ref === 'function') ref(node)\n          else if (ref) ref.current = node\n          if (typeof childRef === 'function') childRef(node)\n          else if (childRef) childRef.current = node\n        },\n      }\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      return React.cloneElement(child, mergedProps as any)\n    }\n\n    return React.createElement('button', { ref, ...triggerProps }, children)\n  },\n)\n\n// ---------------------------------------------------------------------------\n// DropdownMenuContent\n// ---------------------------------------------------------------------------\n\nexport interface DropdownMenuContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DropdownMenuContent = React.forwardRef<HTMLDivElement, DropdownMenuContentProps>(\n  function DropdownMenuContent({ className, children, onKeyDown, ...props }, ref) {\n    const { open, onOpenChange, contentId } = useDropdownMenuContext()\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n      const handler = createKeyboardHandler({\n        Escape: (ev) => {\n          ev.preventDefault()\n          onOpenChange(false)\n        },\n      })\n      handler(e.nativeEvent)\n      onKeyDown?.(e)\n    }\n\n    if (!open) return null\n\n    const content = React.createElement(\n      'div',\n      {\n        ref,\n        role: 'menu',\n        id: contentId,\n        'data-state': open ? 'open' : 'closed',\n        className: cn(menuContentVariants(), className),\n        onKeyDown: handleKeyDown,\n        tabIndex: -1,\n        ...props,\n      },\n      children,\n    )\n\n    // Render via portal if document is available (client-side)\n    if (typeof document !== 'undefined') {\n      return ReactDOM.createPortal(content, document.body)\n    }\n\n    // SSR fallback: render inline\n    return content\n  },\n)\n\n// ---------------------------------------------------------------------------\n// DropdownMenuItem\n// ---------------------------------------------------------------------------\n\nexport interface DropdownMenuItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {\n  disabled?: boolean\n  onSelect?: () => void\n}\n\nexport const DropdownMenuItem = React.forwardRef<HTMLDivElement, DropdownMenuItemProps>(\n  function DropdownMenuItem({ className, disabled, onSelect, onClick, children, ...props }, ref) {\n    const { onOpenChange } = useDropdownMenuContext()\n\n    const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\n      if (disabled) return\n      onSelect?.()\n      onOpenChange(false)\n      onClick?.(e)\n    }\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n      if (disabled) return\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault()\n        onSelect?.()\n        onOpenChange(false)\n      }\n    }\n\n    return React.createElement(\n      'div',\n      {\n        ref,\n        role: 'menuitem',\n        tabIndex: disabled ? -1 : 0,\n        'data-disabled': disabled ? '' : undefined,\n        'aria-disabled': disabled || undefined,\n        className: cn(menuItemVariants(), className),\n        onClick: handleClick,\n        onKeyDown: handleKeyDown,\n        ...props,\n      },\n      children,\n    )\n  },\n)\n\n// ---------------------------------------------------------------------------\n// DropdownMenuSeparator\n// ---------------------------------------------------------------------------\n\nexport interface DropdownMenuSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DropdownMenuSeparator = React.forwardRef<HTMLDivElement, DropdownMenuSeparatorProps>(\n  function DropdownMenuSeparator({ className, ...props }, ref) {\n    return React.createElement('div', {\n      ref,\n      role: 'separator',\n      className: cn('-mx-1 my-1 h-px bg-muted', className),\n      ...props,\n    })\n  },\n)\n\n// ---------------------------------------------------------------------------\n// DropdownMenuLabel\n// ---------------------------------------------------------------------------\n\nexport interface DropdownMenuLabelProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DropdownMenuLabel = React.forwardRef<HTMLDivElement, DropdownMenuLabelProps>(\n  function DropdownMenuLabel({ className, ...props }, ref) {\n    return React.createElement('div', {\n      ref,\n      className: cn('px-2 py-1.5 text-sm font-semibold', className),\n      ...props,\n    })\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["DropdownMenuTrigger", "DropdownMenuContent", "DropdownMenuItem", "DropdownMenuSeparator", "DropdownMenuLabel"]
+}

package/dist/react-editor-status-bar.js

@@ -0,0 +1,148 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-editor-status-bar/dist/index.js
+import * as React from "react";
+
+// ../editor-status-bar/dist/index.js
+function formatCursorPosition(line, col) {
+  return `Ln ${line}, Col ${col}`;
+}
+function partitionSegments(segments) {
+  const left = [];
+  const right = [];
+  for (const seg of segments) {
+    if (seg.align === "right") {
+      right.push(seg);
+    } else {
+      left.push(seg);
+    }
+  }
+  return { left, right };
+}
+function createEditorStatusBar() {
+  const ariaProps = {
+    role: "status",
+    "aria-live": "polite"
+  };
+  const dataAttributes = {
+    "data-component": "editor-status-bar"
+  };
+  return { ariaProps, dataAttributes };
+}
+var editorStatusBarVariants = cva({
+  base: [
+    "flex items-center justify-between",
+    "w-full h-6 px-2 gap-4",
+    "text-xs font-mono",
+    "bg-muted text-muted-foreground",
+    "border-t border-border",
+    "select-none"
+  ].join(" "),
+  variants: {},
+  defaultVariants: {}
+});
+var statusBarGroupClass = "flex items-center gap-3 overflow-hidden";
+var statusBarSegmentVariants = cva({
+  base: "inline-flex items-center whitespace-nowrap truncate leading-none",
+  variants: {
+    tone: {
+      default: "text-muted-foreground",
+      muted: "text-muted-foreground/60",
+      accent: "text-primary"
+    }
+  },
+  defaultVariants: {
+    tone: "default"
+  }
+});
+
+// ../react-editor-status-bar/dist/index.js
+import { jsxs, jsx } from "react/jsx-runtime";
+function buildSegmentsFromConvenienceProps(props) {
+  const segs = [];
+  if (props.line !== void 0 && props.col !== void 0) {
+    segs.push({
+      id: "cursor",
+      label: formatCursorPosition(props.line, props.col),
+      align: "left",
+      tone: "default"
+    });
+  }
+  if (props.indentation) {
+    segs.push({ id: "indentation", label: props.indentation, align: "left", tone: "muted" });
+  }
+  if (props.language) {
+    segs.push({ id: "language", label: props.language, align: "right", tone: "accent" });
+  }
+  if (props.encoding) {
+    segs.push({ id: "encoding", label: props.encoding, align: "right", tone: "muted" });
+  }
+  if (props.eol) {
+    segs.push({ id: "eol", label: props.eol, align: "right", tone: "muted" });
+  }
+  if (props.status) {
+    segs.push({ id: "status", label: props.status, align: "right", tone: "muted" });
+  }
+  return segs;
+}
+var EditorStatusBar = React.forwardRef(
+  function EditorStatusBar2({
+    segments: segmentsProp,
+    line,
+    col,
+    indentation,
+    language,
+    encoding,
+    eol,
+    status,
+    className,
+    ...props
+  }, ref) {
+    const segments = segmentsProp ?? buildSegmentsFromConvenienceProps({
+      line,
+      col,
+      indentation,
+      language,
+      encoding,
+      eol,
+      status
+    });
+    const { left, right } = partitionSegments(segments);
+    const api = createEditorStatusBar();
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(editorStatusBarVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: statusBarGroupClass, children: left.map((seg) => /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: statusBarSegmentVariants({ tone: seg.tone ?? "default" }),
+              children: seg.label
+            },
+            seg.id
+          )) }),
+          /* @__PURE__ */ jsx("div", { className: statusBarGroupClass, children: right.map((seg) => /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: statusBarSegmentVariants({ tone: seg.tone ?? "default" }),
+              children: seg.label
+            },
+            seg.id
+          )) })
+        ]
+      }
+    );
+  }
+);
+export {
+  EditorStatusBar
+};
+//# sourceMappingURL=react-editor-status-bar.js.map

package/dist/react-editor-status-bar.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../editor-status-bar/src/editor-status-bar.ts", "../../editor-status-bar/src/editor-status-bar.styles.ts", "../../react-editor-status-bar/src/editor-status-bar.tsx"],
+  "sourcesContent": ["import type { AccessibilityProps } from '@refraction-ui/shared'\n\n/** Horizontal alignment of a segment within the bar. */\nexport type StatusSegmentAlign = 'left' | 'right'\n\n/** Visual tone / emphasis of a segment. */\nexport type StatusSegmentTone = 'default' | 'muted' | 'accent'\n\n/** A single labelled item rendered in the status bar. */\nexport interface StatusSegment {\n  /** Unique identifier for the segment. */\n  id: string\n  /** Text displayed in the segment. */\n  label: string\n  /** Which side of the bar this segment lives on. Defaults to `'left'`. */\n  align?: StatusSegmentAlign\n  /** Visual tone. Defaults to `'default'`. */\n  tone?: StatusSegmentTone\n}\n\n/** Return value of {@link createEditorStatusBar}. */\nexport interface EditorStatusBarAPI {\n  /** ARIA attributes to spread on the bar element. */\n  ariaProps: Partial<AccessibilityProps>\n  /** Data attributes for styling hooks. */\n  dataAttributes: Record<string, string>\n}\n\n/**\n * Format a cursor position as the canonical IDE string \"Ln {line}, Col {col}\".\n *\n * @example\n * formatCursorPosition(17, 1) // → 'Ln 17, Col 1'\n */\nexport function formatCursorPosition(line: number, col: number): string {\n  return `Ln ${line}, Col ${col}`\n}\n\n/**\n * Partition a flat list of segments into left- and right-aligned groups,\n * preserving insertion order within each group.\n */\nexport function partitionSegments(segments: StatusSegment[]): {\n  left: StatusSegment[]\n  right: StatusSegment[]\n} {\n  const left: StatusSegment[] = []\n  const right: StatusSegment[] = []\n  for (const seg of segments) {\n    if (seg.align === 'right') {\n      right.push(seg)\n    } else {\n      left.push(seg)\n    }\n  }\n  return { left, right }\n}\n\n/**\n * Build the framework-agnostic ARIA and data attributes for the status bar\n * container.\n *\n * The bar uses `role=\"status\"` with `aria-live=\"polite\"` so screen readers\n * announce updates (e.g. cursor position changes) without interrupting the\n * user's current focus.\n */\nexport function createEditorStatusBar(): EditorStatusBarAPI {\n  const ariaProps: Partial<AccessibilityProps> = {\n    role: 'status',\n    'aria-live': 'polite',\n  }\n\n  const dataAttributes: Record<string, string> = {\n    'data-component': 'editor-status-bar',\n  }\n\n  return { ariaProps, dataAttributes }\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/**\n * The outer bar — a thin, full-width strip that sits at the bottom of an IDE\n * pane. Uses a monospace font stack so numeric values (line, col) don't shift\n * width as they update.\n */\nexport const editorStatusBarVariants = cva({\n  base: [\n    'flex items-center justify-between',\n    'w-full h-6 px-2 gap-4',\n    'text-xs font-mono',\n    'bg-muted text-muted-foreground',\n    'border-t border-border',\n    'select-none',\n  ].join(' '),\n  variants: {},\n  defaultVariants: {},\n})\n\n/** The left or right group that holds a cluster of segments. */\nexport const statusBarGroupClass = 'flex items-center gap-3 overflow-hidden'\n\n/**\n * A single segment pill. The `tone` variant maps to semantic token classes so\n * adapters never inline colour values.\n */\nexport const statusBarSegmentVariants = cva({\n  base: 'inline-flex items-center whitespace-nowrap truncate leading-none',\n  variants: {\n    tone: {\n      default: 'text-muted-foreground',\n      muted: 'text-muted-foreground/60',\n      accent: 'text-primary',\n    },\n  },\n  defaultVariants: {\n    tone: 'default',\n  },\n})\n", "import * as React from 'react'\nimport {\n  createEditorStatusBar,\n  formatCursorPosition,\n  partitionSegments,\n  editorStatusBarVariants,\n  statusBarGroupClass,\n  statusBarSegmentVariants,\n  type StatusSegment,\n  type StatusSegmentTone,\n} from '@refraction-ui/editor-status-bar'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { StatusSegment, StatusSegmentTone }\n\n/** Convenience props that map to common IDE status-bar segments. */\nexport interface EditorStatusBarConvenienceProps {\n  /** Current line number (1-indexed). */\n  line?: number\n  /** Current column number (1-indexed). */\n  col?: number\n  /** Indentation descriptor, e.g. `'Spaces: 4'` or `'Tab Size: 2'`. */\n  indentation?: string\n  /** Language / runtime label, e.g. `'Python 3.11.4'`. */\n  language?: string\n  /** File encoding, e.g. `'UTF-8'`. */\n  encoding?: string\n  /** End-of-line sequence, e.g. `'LF'` or `'CRLF'`. */\n  eol?: string\n  /** Persistence status label, e.g. `'Auto-saved'` or `'Unsaved changes'`. */\n  status?: string\n}\n\nexport interface EditorStatusBarProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    EditorStatusBarConvenienceProps {\n  /**\n   * Explicit list of segments. When provided, the convenience props (`line`,\n   * `col`, `language`, etc.) are ignored and you have full control over which\n   * segments appear and where.\n   */\n  segments?: StatusSegment[]\n}\n\n/**\n * Build the default segment list from convenience props.\n *\n * Left group: cursor position (if line/col given), indentation.\n * Right group: language, encoding, eol, status.\n */\nfunction buildSegmentsFromConvenienceProps(\n  props: EditorStatusBarConvenienceProps,\n): StatusSegment[] {\n  const segs: StatusSegment[] = []\n\n  if (props.line !== undefined && props.col !== undefined) {\n    segs.push({\n      id: 'cursor',\n      label: formatCursorPosition(props.line, props.col),\n      align: 'left',\n      tone: 'default',\n    })\n  }\n\n  if (props.indentation) {\n    segs.push({ id: 'indentation', label: props.indentation, align: 'left', tone: 'muted' })\n  }\n\n  if (props.language) {\n    segs.push({ id: 'language', label: props.language, align: 'right', tone: 'accent' })\n  }\n\n  if (props.encoding) {\n    segs.push({ id: 'encoding', label: props.encoding, align: 'right', tone: 'muted' })\n  }\n\n  if (props.eol) {\n    segs.push({ id: 'eol', label: props.eol, align: 'right', tone: 'muted' })\n  }\n\n  if (props.status) {\n    segs.push({ id: 'status', label: props.status, align: 'right', tone: 'muted' })\n  }\n\n  return segs\n}\n\n/**\n * EditorStatusBar — an IDE-style bottom bar.\n *\n * Accepts either an explicit `segments` array for full control, or the\n * convenience props (`line`, `col`, `language`, `encoding`, `indentation`,\n * `eol`, `status`) which are assembled into a standard left/right layout\n * automatically.\n *\n * Uses `role=\"status\"` with `aria-live=\"polite\"` so cursor-position updates\n * are announced to screen readers without interrupting flow.\n */\nexport const EditorStatusBar = React.forwardRef<\n  HTMLDivElement,\n  EditorStatusBarProps\n>(\n  function EditorStatusBar(\n    {\n      segments: segmentsProp,\n      line,\n      col,\n      indentation,\n      language,\n      encoding,\n      eol,\n      status,\n      className,\n      ...props\n    },\n    ref,\n  ) {\n    const segments = segmentsProp ?? buildSegmentsFromConvenienceProps({\n      line,\n      col,\n      indentation,\n      language,\n      encoding,\n      eol,\n      status,\n    })\n\n    const { left, right } = partitionSegments(segments)\n    const api = createEditorStatusBar()\n\n    return (\n      <div\n        ref={ref}\n        className={cn(editorStatusBarVariants(), className)}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      >\n        <div className={statusBarGroupClass}>\n          {left.map((seg) => (\n            <span\n              key={seg.id}\n              className={statusBarSegmentVariants({ tone: seg.tone ?? 'default' })}\n            >\n              {seg.label}\n            </span>\n          ))}\n        </div>\n        <div className={statusBarGroupClass}>\n          {right.map((seg) => (\n            <span\n              key={seg.id}\n              className={statusBarSegmentVariants({ tone: seg.tone ?? 'default' })}\n            >\n              {seg.label}\n            </span>\n          ))}\n        </div>\n      </div>\n    )\n  },\n)\n"],
+  "mappings": "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",
+  "names": ["EditorStatusBar"]
+}

package/dist/react-editor-tabs.js

@@ -0,0 +1,159 @@
+import {
+  cn,
+  cva
+} from "./chunk-ZF3OHCGV.js";
+
+// ../react-editor-tabs/dist/index.js
+import * as React from "react";
+
+// ../editor-tabs/dist/index.js
+function createEditorTabs(props = {}) {
+  const { activeId } = props;
+  const ariaProps = {
+    role: "tablist"
+  };
+  const dataAttributes = {};
+  if (activeId !== void 0) {
+    dataAttributes["data-active-id"] = activeId;
+  }
+  return { ariaProps, dataAttributes };
+}
+function getNextTabIndex(currentIndex, key, count) {
+  if (count <= 0) return currentIndex;
+  switch (key) {
+    case "ArrowRight":
+      return (currentIndex + 1) % count;
+    case "ArrowLeft":
+      return (currentIndex - 1 + count) % count;
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return currentIndex;
+  }
+}
+var editorTabsVariants = cva({
+  base: "inline-flex items-end gap-0 border-b border-border bg-muted/40 overflow-x-auto",
+  variants: {},
+  defaultVariants: {}
+});
+var editorTabVariants = cva({
+  base: [
+    "group inline-flex items-center gap-1.5 px-3 py-2 text-sm font-medium",
+    "border-b-2 transition-colors select-none whitespace-nowrap",
+    "focus-visible:outline-none focus-visible:ring-2",
+    "focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background"
+  ].join(" "),
+  variants: {
+    state: {
+      active: [
+        "border-primary text-foreground bg-background",
+        "border-t border-l border-r border-border border-b-background -mb-px"
+      ].join(" "),
+      inactive: [
+        "border-transparent text-muted-foreground",
+        "hover:text-foreground hover:bg-background/60"
+      ].join(" ")
+    }
+  },
+  defaultVariants: {
+    state: "inactive"
+  }
+});
+var editorTabDirtyDotClass = "size-1.5 rounded-full bg-amber-400 shrink-0";
+var editorTabCloseButtonClass = [
+  "ml-1 inline-flex items-center justify-center rounded-sm size-4 shrink-0",
+  "text-muted-foreground opacity-0 transition-opacity",
+  "group-hover:opacity-100 focus-visible:opacity-100",
+  "hover:bg-accent hover:text-foreground",
+  "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+].join(" ");
+var editorTabIconClass = "shrink-0 text-[0.85em] leading-none";
+
+// ../react-editor-tabs/dist/index.js
+import { jsx, jsxs } from "react/jsx-runtime";
+var EditorTabs = React.forwardRef(
+  function EditorTabs2({ tabs, activeId, onSelect, onClose, className, ...props }, ref) {
+    const tabRefs = React.useRef([]);
+    const activeIndex = tabs.findIndex((t) => t.id === activeId);
+    const tabbableIndex = activeIndex === -1 ? 0 : activeIndex;
+    const handleKeyDown = (event, index) => {
+      const next = getNextTabIndex(index, event.key, tabs.length);
+      if (next !== index) {
+        event.preventDefault();
+        onSelect(tabs[next].id);
+        tabRefs.current[next]?.focus();
+      }
+    };
+    const api = createEditorTabs({ activeId });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(editorTabsVariants(), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children: tabs.map((tab, index) => {
+          const isActive = tab.id === activeId;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              ref: (node) => {
+                tabRefs.current[index] = node;
+              },
+              type: "button",
+              role: "tab",
+              "aria-selected": isActive,
+              "aria-controls": `tabpanel-${tab.id}`,
+              id: `tab-${tab.id}`,
+              tabIndex: index === tabbableIndex ? 0 : -1,
+              "data-state": isActive ? "active" : "inactive",
+              className: editorTabVariants({ state: isActive ? "active" : "inactive" }),
+              onClick: () => onSelect(tab.id),
+              onKeyDown: (e) => handleKeyDown(e, index),
+              children: [
+                tab.icon && /* @__PURE__ */ jsx("span", { className: editorTabIconClass, "aria-hidden": "true", children: tab.icon }),
+                /* @__PURE__ */ jsx("span", { children: tab.label }),
+                tab.dirty && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: editorTabDirtyDotClass,
+                    "aria-label": "unsaved changes",
+                    role: "status"
+                  }
+                ),
+                tab.closable && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    role: "button",
+                    "aria-label": `Close ${tab.label}`,
+                    tabIndex: -1,
+                    className: editorTabCloseButtonClass,
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      onClose?.(tab.id);
+                    },
+                    onKeyDown: (e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.stopPropagation();
+                        onClose?.(tab.id);
+                      }
+                    },
+                    children: "\xD7"
+                  }
+                )
+              ]
+            },
+            tab.id
+          );
+        })
+      }
+    );
+  }
+);
+export {
+  EditorTabs
+};
+//# sourceMappingURL=react-editor-tabs.js.map