@epilot/zenith-react 0.2.0-next.0 → 0.2.0-next.1

package/dist/components/code-editor/code-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"code-editor.js","sources":["../../../src/components/code-editor/code-editor.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { Button } from \"../button/button\"\nimport { applyIndent } from \"./indent\"\nimport { highlightCode, splitTokenLines } from \"../../lib/code-highlight\"\nimport { useCodeTokenRenderer } from \"../../lib/code-tokens\"\nimport {\n  caretAfterRewrite,\n  gutterDigits,\n  lineIndexAt,\n  severityByLine,\n  visibleDiagnostics,\n  type CodeDiagnostic,\n  type CodeDiagnosticSeverity,\n} from \"../../lib/code-lines\"\n\n/**\n * Compact code editing on a native textarea. Highlighting is decorative; the textarea remains the\n * only focusable, labelled, form-participating control. Formatting and diagnostics are supplied by\n * the caller rather than computed here.\n */\n\n/** How long a formatting outcome stays in the live region. */\nconst FORMAT_FEEDBACK_MS = 2000\n\n/** Shared gutter width for the number cells and textarea padding. */\nconst GUTTER = \"--zenith-code-gutter\"\n\n/**\n * Metrics shared by the textarea and highlight layer. `tabSize` varies per instance and gutter\n * padding intentionally differs between layers.\n */\nconst CODE_METRICS = {\n  ...shorthands.margin(0),\n  ...shorthands.borderWidth(0),\n  ...shorthands.borderStyle(\"none\"),\n  ...shorthands.padding(tokens.spacingElement2),\n  fontFamily: tokens.fontMono,\n  fontSize: tokens.textXs,\n  lineHeight: tokens.leadingXs,\n  letterSpacing: tokens.trackingNormal,\n  fontWeight: tokens.fontWeightNormal,\n  textIndent: 0,\n  boxSizing: \"border-box\",\n  // A classic, space-consuming scrollbar narrows the textarea's content box but not the layer's,\n  // which moves where wrapped lines break. Reserving the gutter on both keeps one content width.\n  // Platforms with overlay scrollbars never had the problem.\n  scrollbarGutter: \"stable\",\n} as const\n\n/** Core-sheet colours used by diagnostic rules and numbers. */\nconst SEVERITY_TOKENS: Record<\n  CodeDiagnosticSeverity,\n  { rule: string; number: string }\n> = {\n  error: { rule: tokens.errorUi, number: tokens.error11 },\n  warning: { rule: tokens.warningUi, number: tokens.warning11 },\n  info: { rule: tokens.infoUi, number: tokens.info11 },\n}\n\nconst useStyles = makeZenithStyles({\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    minWidth: 0,\n    position: \"relative\",\n    backgroundColor: tokens.surfaceField,\n    ...shorthands.borderWidth(tokens.borderWidthField),\n    ...shorthands.borderStyle(\"solid\"),\n    ...shorthands.borderColor(tokens.borderField),\n    borderRadius: tokens.surfaceRadiusField,\n    // Declared before the state rules below so those win by source order, per AGENTS.md rule 2.\n    \"&:focus-within\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"-1px\",\n      outlineColor: tokens.focusRing,\n    },\n    \"&[data-invalid]\": {\n      ...shorthands.borderColor(tokens.errorUi),\n    },\n    \"&[data-disabled]\": {\n      backgroundColor: tokens.grayA3,\n    },\n  },\n  // Repaint the opaque gutter when the surrounding field is disabled.\n  rootDisabledGutter: {\n    [`&[data-disabled] [${SLOT_ATTR}='code-editor-line-number']`]: {\n      backgroundColor: tokens.grayA3,\n    },\n  },\n  // focus-within would keep the overlay visible throughout the editing session.\n  rootFormatReveal: {\n    \"&:hover [data-format-state]\": { opacity: 1 },\n  },\n  // The textarea defines the box; this decorative layer stretches without measurement.\n  highlight: {\n    ...CODE_METRICS,\n    position: \"absolute\",\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    overflowX: \"hidden\",\n    overflowY: \"hidden\",\n    // Paint only: it must never take a click, a caret or a selection away from the control.\n    pointerEvents: \"none\",\n    userSelect: \"none\",\n    color: tokens.grayA12,\n    \"&[data-composing]\": {\n      // Provisional IME text lives in the textarea, so the layer would be showing stale colours\n      // over it. Declared after the base so it wins by source order.\n      opacity: 0,\n    },\n  },\n  /** With a gutter, the left padding moves into the number cell so the cell can pin flush. */\n  highlightGutter: {\n    paddingLeft: 0,\n  },\n  textarea: {\n    ...CODE_METRICS,\n    position: \"relative\",\n    width: \"100%\",\n    minWidth: 0,\n    backgroundColor: \"transparent\",\n    // The glyphs come from the layer beneath; only the caret is painted here.\n    color: \"transparent\",\n    caretColor: tokens.grayA12,\n    overflowX: \"auto\",\n    overflowY: \"auto\",\n    // The root paints the ring for the whole surface; a second one on the control would double it.\n    outlineStyle: \"none\",\n    \"::placeholder\": {\n      color: tokens.grayA8,\n      // Placeholders are the textarea's own paint, so they need a real colour despite the above.\n      WebkitTextFillColor: tokens.grayA8,\n    },\n    \"::selection\": {\n      // An alpha tint, so highlighted glyphs stay legible through the selection band instead of\n      // being covered by it — transparent text under an opaque selection is invisible text.\n      backgroundColor: tokens.accentA5,\n    },\n    \":disabled\": {\n      cursor: \"not-allowed\",\n    },\n    \"&[data-composing]\": {\n      // Reveal what the IME is composing. Without this the author types blind through a CJK\n      // composition, which is the one way this technique can fail outright.\n      color: tokens.grayA12,\n    },\n  },\n  // Keep textarea glyphs aligned with the highlighted rows.\n  textareaGutter: {\n    paddingLeft: `calc(${tokens.spacingElement2} + var(${GUTTER}) + ${tokens.spacingElement3})`,\n  },\n  // Unsupported browsers fall back to the native rows height.\n  autoSize: {\n    fieldSizing: \"content\",\n  },\n  resizeNone: {\n    resize: \"none\",\n  },\n  resizeVertical: {\n    resize: \"vertical\",\n  },\n  resizeHorizontal: {\n    resize: \"horizontal\",\n  },\n  resizeBoth: {\n    resize: \"both\",\n  },\n  noWrap: {\n    whiteSpace: \"pre\",\n    overflowWrap: \"normal\",\n  },\n  wrap: {\n    whiteSpace: \"pre-wrap\",\n    overflowWrap: \"break-word\",\n  },\n  // Width constraints below require a block formatting context.\n  codeRows: {\n    display: \"block\",\n  },\n  // Give the sticky gutter and active-line band the full width of unwrapped code.\n  codeNoWrap: {\n    width: \"max-content\",\n    minWidth: \"100%\",\n  },\n  line: {\n    display: \"flex\",\n    width: \"100%\",\n  },\n  /** The band under the caret's line. See `caretLine` in the component for when it is on. */\n  lineActive: {\n    backgroundImage: `linear-gradient(${tokens.grayA2}, ${tokens.grayA2})`,\n  },\n  lineNumber: {\n    userSelect: \"none\",\n    textAlign: \"right\",\n    flexGrow: 0,\n    flexShrink: 0,\n    color: tokens.grayA8,\n    boxSizing: \"border-box\",\n    width: `calc(var(${GUTTER}) + ${tokens.spacingElement2} + ${tokens.spacingElement3})`,\n    paddingLeft: tokens.spacingElement2,\n    paddingRight: tokens.spacingElement3,\n    // Pinned, so a long line scrolled sideways does not take the numbers with it. Opaque, because\n    // scrolled code passes underneath.\n    position: \"sticky\",\n    left: 0,\n    backgroundColor: tokens.surfaceField,\n  },\n  /** The caret's line number, lifted out of the gutter's grey. */\n  lineNumberActive: {\n    color: tokens.grayA12,\n  },\n  lineContent: {\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"auto\",\n  },\n  lineContentWrap: {\n    overflowWrap: \"break-word\",\n  },\n  // Underline only the text; a line fill would compete with selection and active-line paint.\n  diagnosticError: {\n    textDecorationLine: \"underline\",\n    textDecorationStyle: \"wavy\",\n    textDecorationColor: SEVERITY_TOKENS.error.rule,\n    textDecorationSkipInk: \"none\",\n    textUnderlineOffset: \"0.2em\",\n  },\n  diagnosticWarning: {\n    textDecorationLine: \"underline\",\n    textDecorationStyle: \"wavy\",\n    textDecorationColor: SEVERITY_TOKENS.warning.rule,\n    textDecorationSkipInk: \"none\",\n    textUnderlineOffset: \"0.2em\",\n  },\n  diagnosticInfo: {\n    textDecorationLine: \"underline\",\n    textDecorationStyle: \"wavy\",\n    textDecorationColor: SEVERITY_TOKENS.info.rule,\n    textDecorationSkipInk: \"none\",\n    textUnderlineOffset: \"0.2em\",\n  },\n  numberError: { color: SEVERITY_TOKENS.error.number },\n  numberWarning: { color: SEVERITY_TOKENS.warning.number },\n  numberInfo: { color: SEVERITY_TOKENS.info.number },\n  format: {\n    position: \"absolute\",\n    top: tokens.spacingElement05,\n    right: tokens.spacingElement05,\n    zIndex: 1,\n    backgroundColor: tokens.surfaceField,\n    opacity: 0,\n    transitionProperty: \"opacity\",\n    transitionDuration: \"120ms\",\n    \"@media (prefers-reduced-motion: reduce)\": {\n      transitionDuration: \"0s\",\n    },\n    \"@media (hover: none)\": {\n      opacity: 1,\n    },\n    // After the base, so they win by source order (AGENTS.md rule 2).\n    \"&:focus-visible\": { opacity: 1 },\n    \"&[data-format-state='pending']\": { opacity: 1 },\n  },\n  srOnly: {\n    position: \"absolute\",\n    width: \"1px\",\n    height: \"1px\",\n    ...shorthands.padding(0),\n    ...shorthands.margin(\"-1px\"),\n    overflowX: \"hidden\",\n    overflowY: \"hidden\",\n    clip: \"rect(0, 0, 0, 0)\",\n    whiteSpace: \"nowrap\",\n  },\n})\n\nconst FormatIcon = (props: React.ComponentProps<\"svg\">) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\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    focusable=\"false\"\n    {...props}\n  >\n    <path d=\"M4 5h16\" />\n    <path d=\"M9 10h11\" />\n    <path d=\"M9 15h7\" />\n    <path d=\"M4 20h16\" />\n  </svg>\n)\n\nexport type CodeEditorResize = \"none\" | \"vertical\" | \"horizontal\" | \"both\"\n\nexport type CodeEditorProps = Omit<\n  React.ComponentProps<\"textarea\">,\n  \"value\" | \"defaultValue\" | \"wrap\" | \"children\"\n> & {\n  /** Controlled source text. Omit for an uncontrolled editor. */\n  value?: string\n  /** Initial source text for an uncontrolled editor. Ignored when `value` is passed. */\n  defaultValue?: string\n  /** The next source text, after any edit — typing, paste, Tab indentation, or a format. */\n  onValueChange?: (value: string) => void\n  /** Language grammar used for syntax highlighting. Unknown values fall back to plain text. */\n  language?: string\n  /**\n   * Soft-wrap long lines. Off by default, so a long line scrolls rather than silently folding.\n   *\n   * This replaces the native `wrap` attribute's `\"off\" | \"soft\" | \"hard\"`, whose `\"hard\"` value\n   * rewrites the submitted value with real newlines — never what a code buffer wants.\n   */\n  wrap?: boolean\n  /** Which directions the caller may drag to resize. Defaults to `none` under `autoSize`. */\n  resize?: CodeEditorResize\n  /**\n   * Let Tab and Shift+Tab indent instead of moving focus.\n   *\n   * Off by default, because a textarea that swallows Tab is a keyboard trap. When on, Escape\n   * releases the next Tab to focus movement — the escape hatch every code editor that takes Tab\n   * has to provide — and the release lasts until the next keystroke or refocus.\n   */\n  indentWithTab?: boolean\n  /** Spaces inserted per indent level, and the rendered width of a literal tab. */\n  indentSize?: number\n  /** Marks the control invalid: sets `aria-invalid` and the invalid styling. */\n  invalid?: boolean\n  /**\n   * Render a line-number gutter, and mark the line the caret is on. Off by default: on the four-\n   * line snippets this component is for, numbers are a column of noise that also costs horizontal\n   * space.\n   */\n  showLineNumbers?: boolean\n  /**\n   * Problems the CALLER found, one per line. Nothing here computes them. Rendered as a wavy rule\n   * under the line and a coloured gutter number, and enumerated in a visually hidden list that is\n   * added to the control's `aria-describedby` — so a screen reader gets the text on focus rather\n   * than a colour it cannot see.\n   */\n  diagnostics?: readonly CodeDiagnostic[]\n  /**\n   * Reformat the buffer. The caller supplies the formatter; this component supplies the keystroke,\n   * the caret, and the announcement. Bound to **Shift+Alt+F**, VS Code's \"Format Document\", and to\n   * a quiet button revealed on hover.\n   */\n  onFormat?: (value: string) => string | Promise<string>\n  /** Called when the formatter threw, rejected, or its result had to be discarded. */\n  onFormatError?: (error: unknown) => void\n  /** Accessible name of the format button. */\n  formatLabel?: string\n  /** Announced after the formatter ran. */\n  formattedLabel?: string\n  /** Announced when the formatter failed or its result was discarded. */\n  formatErrorLabel?: string\n  /**\n   * Grow with the content instead of reserving a fixed height.\n   *\n   * `rows` becomes the minimum and `maxRows` the maximum, past which the editor scrolls. Off by\n   * default, and progressive: browsers without CSS `field-sizing` fall back to `rows`, which is\n   * what this component did before the property existed.\n   */\n  autoSize?: boolean\n  /** With `autoSize`, the height past which the editor scrolls instead of growing. */\n  maxRows?: number\n}\n\nexport const CodeEditor = React.forwardRef<\n  HTMLTextAreaElement,\n  CodeEditorProps\n>(function CodeEditor(\n  {\n    value,\n    defaultValue,\n    onValueChange,\n    onChange,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onSelect,\n    onScroll,\n    onCompositionStart,\n    onCompositionEnd,\n    language,\n    wrap = false,\n    resize,\n    indentWithTab = false,\n    indentSize = 2,\n    invalid = false,\n    readOnly = false,\n    disabled = false,\n    showLineNumbers = false,\n    diagnostics,\n    onFormat,\n    onFormatError,\n    formatLabel = \"Format code\",\n    formattedLabel = \"Formatted\",\n    formatErrorLabel = \"Formatting failed\",\n    autoSize = false,\n    maxRows,\n    rows,\n    className,\n    style,\n    spellCheck = false,\n    autoComplete = \"off\",\n    autoCorrect = \"off\",\n    autoCapitalize = \"off\",\n    dir = \"ltr\",\n    ...props\n  },\n  forwardedRef\n) {\n  const styles = useStyles()\n  const reactId = React.useId()\n  const diagnosticsId = `${reactId}-diagnostics`\n\n  const isControlled = value !== undefined\n  const [uncontrolled, setUncontrolled] = React.useState(defaultValue ?? \"\")\n  const current = isControlled ? value : uncontrolled\n\n  const renderTokens = useCodeTokenRenderer()\n  const highlightRef = React.useRef<HTMLPreElement | null>(null)\n\n  const [composing, setComposing] = React.useState(false)\n\n  const innerRef = React.useRef<HTMLTextAreaElement | null>(null)\n  const setRefs = React.useCallback(\n    (el: HTMLTextAreaElement | null) => {\n      innerRef.current = el\n      if (typeof forwardedRef === \"function\") forwardedRef(el)\n      else if (forwardedRef) forwardedRef.current = el\n    },\n    [forwardedRef]\n  )\n\n  // Escape releases the next Tab without triggering a render.\n  const tabReleased = React.useRef(false)\n\n  const commit = React.useCallback(\n    (next: string) => {\n      if (!isControlled) setUncontrolled(next)\n      onValueChange?.(next)\n    },\n    [isControlled, onValueChange]\n  )\n\n  const lineCount = React.useMemo(() => current.split(\"\\n\").length, [current])\n  const severities = React.useMemo(\n    () => severityByLine(diagnostics, lineCount),\n    [diagnostics, lineCount]\n  )\n  const listed = React.useMemo(\n    () => visibleDiagnostics(diagnostics, lineCount),\n    [diagnostics, lineCount]\n  )\n  const rowMode = showLineNumbers || severities.size > 0\n\n  // Null while blurred or range-selected, when an active-line band would be misleading.\n  const [caretLine, setCaretLine] = React.useState<number | null>(null)\n\n  const syncCaretLine = React.useCallback(() => {\n    // Avoid caret state and rerenders when no row affordance is enabled.\n    if (!rowMode) return\n    const el = innerRef.current\n    if (el === null) return\n    if (el.selectionStart !== el.selectionEnd) {\n      setCaretLine(null)\n      return\n    }\n    setCaretLine(lineIndexAt(el.value, el.selectionStart ?? 0))\n  }, [rowMode])\n\n  const handleChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n      commit(event.target.value)\n      onChange?.(event)\n    },\n    [commit, onChange]\n  )\n\n  const handleSelect = React.useCallback(\n    (event: React.SyntheticEvent<HTMLTextAreaElement>) => {\n      syncCaretLine()\n      onSelect?.(event)\n    },\n    [onSelect, syncCaretLine]\n  )\n\n  const handleFocus = React.useCallback(\n    (event: React.FocusEvent<HTMLTextAreaElement>) => {\n      syncCaretLine()\n      onFocus?.(event)\n    },\n    [onFocus, syncCaretLine]\n  )\n\n  // The ref gates calls synchronously; state paints the pending affordance.\n  const formatPending = React.useRef(false)\n  const [formatting, setFormatting] = React.useState(false)\n  const [formatStatus, setFormatStatus] = React.useState(\"\")\n  const formatTimer = React.useRef<ReturnType<typeof setTimeout> | null>(null)\n  React.useEffect(\n    () => () => {\n      if (formatTimer.current !== null) clearTimeout(formatTimer.current)\n    },\n    []\n  )\n\n  const announceFormat = React.useCallback((message: string) => {\n    setFormatStatus(message)\n    if (formatTimer.current !== null) clearTimeout(formatTimer.current)\n    // Clearing lets a repeated identical outcome be announced again.\n    formatTimer.current = setTimeout(() => {\n      formatTimer.current = null\n      setFormatStatus(\"\")\n    }, FORMAT_FEEDBACK_MS)\n  }, [])\n\n  const runFormat = React.useCallback(async () => {\n    if (onFormat === undefined || readOnly || disabled) return\n    const el = innerRef.current\n    if (el === null) return\n    // Do not queue stale work behind an in-flight formatter.\n    if (formatPending.current) return\n\n    const source = el.value\n    formatPending.current = true\n    setFormatting(true)\n\n    let next: string\n    try {\n      next = await onFormat(source)\n    } catch (error) {\n      formatPending.current = false\n      setFormatting(false)\n      announceFormat(formatErrorLabel)\n      onFormatError?.(error ?? new Error(\"Formatting failed\"))\n      return\n    }\n\n    formatPending.current = false\n    setFormatting(false)\n\n    const live = innerRef.current\n    if (live === null) return\n    if (live.value !== source) {\n      // Never overwrite edits made while the formatter was running.\n      announceFormat(formatErrorLabel)\n      onFormatError?.(\n        new Error(\"Formatting discarded: the value changed while formatting\")\n      )\n      return\n    }\n\n    if (next !== source) {\n      const caret = caretAfterRewrite(source, next, live.selectionStart ?? 0)\n      // Place the caret before React reconciles the controlled value.\n      live.value = next\n      live.setSelectionRange(caret, caret)\n      commit(next)\n    }\n    announceFormat(formattedLabel)\n  }, [\n    announceFormat,\n    commit,\n    disabled,\n    formatErrorLabel,\n    formattedLabel,\n    onFormat,\n    onFormatError,\n    readOnly,\n  ])\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n      onKeyDown?.(event)\n      if (event.defaultPrevented) return\n      if (readOnly || disabled) return\n\n      // Shift+Alt+F, matched on `code` rather than `key`: Alt rewrites `key` on macOS layouts, so\n      // the physical key is the only stable identity this chord has.\n      if (\n        onFormat !== undefined &&\n        event.altKey &&\n        event.shiftKey &&\n        !event.ctrlKey &&\n        !event.metaKey &&\n        (event.code === \"KeyF\" || event.key.toLowerCase() === \"f\")\n      ) {\n        event.preventDefault()\n        tabReleased.current = false\n        void runFormat()\n        return\n      }\n\n      if (!indentWithTab) return\n\n      if (event.key === \"Escape\") {\n        // Deliberately NOT prevented: an editor inside a Dialog must still let Escape close it.\n        // The latch is the whole effect.\n        tabReleased.current = true\n        return\n      }\n\n      if (event.key !== \"Tab\") {\n        tabReleased.current = false\n        return\n      }\n      // A released Tab, or any modified Tab, is focus movement. Shift is the one modifier that\n      // still means indentation, because Shift+Tab is outdent.\n      if (tabReleased.current || event.ctrlKey || event.metaKey || event.altKey)\n        return\n\n      const el = event.currentTarget\n      const next = applyIndent(\n        {\n          value: el.value,\n          selectionStart: el.selectionStart ?? 0,\n          selectionEnd: el.selectionEnd ?? 0,\n        },\n        { outdent: event.shiftKey, indentSize }\n      )\n      if (\n        next.value === el.value &&\n        next.selectionStart === el.selectionStart &&\n        next.selectionEnd === el.selectionEnd\n      ) {\n        // Shift+Tab on an already-flush line changes nothing; let it move focus rather than\n        // silently eating the key.\n        return\n      }\n\n      event.preventDefault()\n      // Write the DOM before the state update so the caret lands where the transform said. React\n      // then renders the same string, sees the node already holds it, and leaves the selection\n      // alone — restoring it from an effect would fight the browser for a frame first.\n      el.value = next.value\n      el.setSelectionRange(next.selectionStart, next.selectionEnd)\n      commit(next.value)\n    },\n    [\n      commit,\n      disabled,\n      indentSize,\n      indentWithTab,\n      onFormat,\n      onKeyDown,\n      readOnly,\n      runFormat,\n    ]\n  )\n\n  const handleBlur = React.useCallback(\n    (event: React.FocusEvent<HTMLTextAreaElement>) => {\n      tabReleased.current = false\n      setCaretLine(null)\n      onBlur?.(event)\n    },\n    [onBlur]\n  )\n\n  const handleScroll = React.useCallback(\n    (event: React.UIEvent<HTMLTextAreaElement>) => {\n      const layer = highlightRef.current\n      if (layer !== null) {\n        // Synchronous, deliberately. `scroll` is not cancelable and fires at a high rate, and the\n        // usual advice is to throttle it — but deferring to a frame puts the colours behind the\n        // text for that frame, which is exactly the artefact this sync exists to prevent. Two\n        // property writes are cheaper than the reflow a throttle would be saving.\n        layer.scrollTop = event.currentTarget.scrollTop\n        layer.scrollLeft = event.currentTarget.scrollLeft\n      }\n      onScroll?.(event)\n    },\n    [onScroll]\n  )\n\n  const handleCompositionStart = React.useCallback(\n    (event: React.CompositionEvent<HTMLTextAreaElement>) => {\n      setComposing(true)\n      onCompositionStart?.(event)\n    },\n    [onCompositionStart]\n  )\n\n  const handleCompositionEnd = React.useCallback(\n    (event: React.CompositionEvent<HTMLTextAreaElement>) => {\n      setComposing(false)\n      onCompositionEnd?.(event)\n    },\n    [onCompositionEnd]\n  )\n\n  /**\n   * A `<pre>` does not render a final empty line, so a value ending in a newline would leave the\n   * layer one line short of the textarea and everything below the fold misaligned. The extra space\n   * gives that last line something to occupy.\n   */\n  const highlightSource = rowMode\n    ? current\n    : current.endsWith(\"\\n\")\n      ? `${current} `\n      : current\n\n  // Synchronous tokenization: the server render and the first client render produce the same\n  // markup, so there is nothing for hydration to reconcile.\n  const highlighted = React.useMemo(\n    () => highlightCode(highlightSource, language),\n    [highlightSource, language]\n  )\n\n  const plainLines = React.useMemo(\n    () => (rowMode ? current.split(\"\\n\") : null),\n    [current, rowMode]\n  )\n  const tokenLines = React.useMemo(\n    () =>\n      rowMode && highlighted !== null ? splitTokenLines(highlighted) : null,\n    [highlighted, rowMode]\n  )\n\n  const wrapStyle = wrap ? styles.wrap : styles.noWrap\n\n  const effectiveResize = resize ?? (autoSize ? \"none\" : \"vertical\")\n  const resizeStyle =\n    effectiveResize === \"vertical\"\n      ? styles.resizeVertical\n      : effectiveResize === \"horizontal\"\n        ? styles.resizeHorizontal\n        : effectiveResize === \"both\"\n          ? styles.resizeBoth\n          : styles.resizeNone\n\n  /**\n   * `rows` is ignored under `field-sizing: content`, so it is translated into the floor it means.\n   * The terms are the ones `CODE_METRICS` sets: N line boxes plus the block padding, with the\n   * control's border already at zero and `box-sizing: border-box`.\n   */\n  const autoSizeStyle = autoSize\n    ? {\n        minHeight: `calc(${rows ?? 3} * ${tokens.leadingXs} + ${tokens.spacingElement2} * 2)`,\n        maxHeight:\n          maxRows === undefined\n            ? undefined\n            : `calc(${maxRows} * ${tokens.leadingXs} + ${tokens.spacingElement2} * 2)`,\n      }\n    : undefined\n\n  const rootStyle = showLineNumbers\n    ? ({\n        [GUTTER]: `${gutterDigits(lineCount)}ch`,\n        ...style,\n      } as React.CSSProperties)\n    : style\n\n  const describedBy =\n    listed.length === 0\n      ? props[\"aria-describedby\"]\n      : [props[\"aria-describedby\"], diagnosticsId].filter(Boolean).join(\" \")\n\n  const severityClass = {\n    error: styles.diagnosticError,\n    warning: styles.diagnosticWarning,\n    info: styles.diagnosticInfo,\n  } as const\n  const numberClass = {\n    error: styles.numberError,\n    warning: styles.numberWarning,\n    info: styles.numberInfo,\n  } as const\n\n  return (\n    <div\n      data-slot=\"code-editor\"\n      {...{ [SLOT_ATTR]: \"code-editor\" }}\n      data-language={language}\n      // Value-less boolean attributes, so `&[data-invalid]` and `&[data-disabled]` match the way\n      // Field's do rather than matching the string \"false\".\n      data-invalid={invalid || undefined}\n      data-disabled={disabled || undefined}\n      data-readonly={readOnly || undefined}\n      data-formatting={formatting || undefined}\n      // `className` and `style` address the component, which is this element — the same contract\n      // every other component in the package offers. Everything else in `...props` is a textarea\n      // attribute and lands on the control below.\n      className={mergeClasses(\n        styles.root,\n        showLineNumbers ? styles.rootDisabledGutter : undefined,\n        onFormat === undefined ? undefined : styles.rootFormatReveal,\n        className\n      )}\n      style={rootStyle}\n    >\n      {/*\n        Decoration, and nothing else. `aria-hidden` because it is a duplicate of the textarea's own\n        text and contains nothing focusable — the one case MDN names for it — so a screen reader\n        reads the control once, not twice. `pointer-events: none` keeps clicks, the caret and\n        selection on the control beneath it. CodeMirror marks its own gutter `aria-hidden` for the\n        same reason: a line number is a position, and the position is already in the control.\n      */}\n      <pre\n        ref={highlightRef}\n        aria-hidden=\"true\"\n        data-slot=\"code-editor-highlight\"\n        {...{ [SLOT_ATTR]: \"code-editor-highlight\" }}\n        data-composing={composing || undefined}\n        className={mergeClasses(\n          styles.highlight,\n          showLineNumbers ? styles.highlightGutter : undefined,\n          wrapStyle\n        )}\n        style={{ tabSize: indentSize }}\n      >\n        <code\n          className={mergeClasses(\n            plainLines === null ? undefined : styles.codeRows,\n            plainLines !== null && !wrap ? styles.codeNoWrap : undefined\n          )}\n        >\n          {plainLines === null\n            ? highlighted === null\n              ? highlightSource\n              : renderTokens(highlighted)\n            : plainLines.map((line, index) => {\n                const severity = severities.get(index + 1)\n                const active = caretLine === index\n                return (\n                  <span\n                    key={index}\n                    data-slot=\"code-editor-line\"\n                    {...{ [SLOT_ATTR]: \"code-editor-line\" }}\n                    data-line={index + 1}\n                    data-active={active || undefined}\n                    data-severity={severity}\n                    className={mergeClasses(\n                      styles.line,\n                      active ? styles.lineActive : undefined\n                    )}\n                  >\n                    {showLineNumbers ? (\n                      <span\n                        data-slot=\"code-editor-line-number\"\n                        {...{ [SLOT_ATTR]: \"code-editor-line-number\" }}\n                        className={mergeClasses(\n                          styles.lineNumber,\n                          active ? styles.lineNumberActive : undefined,\n                          severity === undefined\n                            ? undefined\n                            : numberClass[severity]\n                        )}\n                      >\n                        {index + 1}\n                      </span>\n                    ) : null}\n                    <span\n                      data-slot=\"code-editor-line-content\"\n                      {...{ [SLOT_ATTR]: \"code-editor-line-content\" }}\n                      className={mergeClasses(\n                        styles.lineContent,\n                        wrap ? styles.lineContentWrap : undefined\n                      )}\n                    >\n                      {/* The rule goes on this inner span so it ends with the text rather than\n                          running out to the fold; the newline stays outside it. */}\n                      <span\n                        className={\n                          severity === undefined\n                            ? undefined\n                            : severityClass[severity]\n                        }\n                      >\n                        {tokenLines === null\n                          ? line\n                          : renderTokens(tokenLines[index] ?? [])}\n                      </span>\n                      {\"\\n\"}\n                    </span>\n                  </span>\n                )\n              })}\n        </code>\n      </pre>\n\n      <textarea\n        {...props}\n        ref={setRefs}\n        data-slot=\"code-editor-input\"\n        {...{ [SLOT_ATTR]: \"code-editor-input\" }}\n        value={current}\n        rows={rows}\n        onChange={handleChange}\n        onKeyDown={handleKeyDown}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onSelect={handleSelect}\n        onScroll={handleScroll}\n        onCompositionStart={handleCompositionStart}\n        onCompositionEnd={handleCompositionEnd}\n        data-composing={composing || undefined}\n        readOnly={readOnly}\n        disabled={disabled}\n        aria-invalid={invalid || undefined}\n        aria-describedby={describedBy}\n        aria-busy={formatting || undefined}\n        // Code is not prose: a squiggle under every identifier is noise, and an editor that\n        // capitalises `const` or \"corrects\" `-->` corrupts the buffer.\n        spellCheck={spellCheck}\n        autoComplete={autoComplete}\n        autoCorrect={autoCorrect}\n        autoCapitalize={autoCapitalize}\n        // Source is left-to-right even on a right-to-left page; `auto` would flip a buffer that\n        // happens to start with an RTL character in a string literal.\n        dir={dir}\n        wrap={wrap ? \"soft\" : \"off\"}\n        // One indent level, one tab stop: a literal tab in the buffer renders exactly as wide as\n        // the spaces Tab inserts. Dynamic, so it is an inline declaration rather than an atom.\n        style={{ tabSize: indentSize, ...autoSizeStyle }}\n        className={mergeClasses(\n          styles.textarea,\n          showLineNumbers ? styles.textareaGutter : undefined,\n          autoSize ? styles.autoSize : undefined,\n          wrapStyle,\n          resizeStyle\n        )}\n      />\n\n      {onFormat === undefined ? null : (\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"icon-sm\"\n          data-format-state={formatting ? \"pending\" : \"idle\"}\n          aria-label={formatLabel}\n          disabled={disabled || readOnly || formatting}\n          className={styles.format}\n          // Keeps the caret where it is: without this the button takes focus on press and the\n          // editor's selection — which the format is about to restore — is gone before it runs.\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={() => {\n            void runFormat()\n          }}\n        >\n          <FormatIcon />\n        </Button>\n      )}\n\n      {listed.length === 0 ? null : (\n        <ul\n          id={diagnosticsId}\n          data-slot=\"code-editor-diagnostics\"\n          {...{ [SLOT_ATTR]: \"code-editor-diagnostics\" }}\n          className={styles.srOnly}\n        >\n          {listed.map((diagnostic, index) => (\n            <li key={index}>\n              {`${diagnostic.severity ?? \"error\"}, line ${diagnostic.line}${\n                diagnostic.column === undefined\n                  ? \"\"\n                  : `, column ${diagnostic.column}`\n              }: ${diagnostic.message}`}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {onFormat === undefined ? null : (\n        <span\n          role=\"status\"\n          aria-live=\"polite\"\n          data-slot=\"code-editor-format-status\"\n          {...{ [SLOT_ATTR]: \"code-editor-format-status\" }}\n          className={styles.srOnly}\n        >\n          {formatStatus}\n        </span>\n      )}\n    </div>\n  )\n})\n"],"names":["FORMAT_FEEDBACK_MS","GUTTER","CODE_METRICS","shorthands","tokens.spacingElement2","tokens.fontMono","tokens.textXs","tokens.leadingXs","tokens.trackingNormal","tokens.fontWeightNormal","SEVERITY_TOKENS","tokens.errorUi","tokens.error11","tokens.warningUi","tokens.warning11","tokens.infoUi","tokens.info11","useStyles","makeZenithStyles","tokens.surfaceField","tokens.borderWidthField","tokens.borderField","tokens.surfaceRadiusField","tokens.focusRing","tokens.grayA3","SLOT_ATTR","tokens.grayA12","tokens.grayA8","tokens.accentA5","tokens.spacingElement3","tokens.grayA2","tokens.spacingElement05","FormatIcon","props","jsxs","jsx","CodeEditor","React","value","defaultValue","onValueChange","onChange","onKeyDown","onBlur","onFocus","onSelect","onScroll","onCompositionStart","onCompositionEnd","language","wrap","resize","indentWithTab","indentSize","invalid","readOnly","disabled","showLineNumbers","diagnostics","onFormat","onFormatError","formatLabel","formattedLabel","formatErrorLabel","autoSize","maxRows","rows","className","style","spellCheck","autoComplete","autoCorrect","autoCapitalize","dir","forwardedRef","styles","diagnosticsId","isControlled","uncontrolled","setUncontrolled","current","renderTokens","useCodeTokenRenderer","highlightRef","composing","setComposing","innerRef","setRefs","el","tabReleased","commit","next","lineCount","severities","severityByLine","listed","visibleDiagnostics","rowMode","caretLine","setCaretLine","syncCaretLine","lineIndexAt","handleChange","event","handleSelect","handleFocus","formatPending","formatting","setFormatting","formatStatus","setFormatStatus","formatTimer","announceFormat","message","runFormat","source","error","live","caret","caretAfterRewrite","handleKeyDown","applyIndent","handleBlur","handleScroll","layer","handleCompositionStart","handleCompositionEnd","highlightSource","highlighted","highlightCode","plainLines","tokenLines","splitTokenLines","wrapStyle","effectiveResize","resizeStyle","autoSizeStyle","rootStyle","gutterDigits","describedBy","severityClass","numberClass","mergeClasses","line","index","severity","active","Button","diagnostic"],"mappings":"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"}
+{"version":3,"file":"code-editor.js","sources":["../../../src/components/code-editor/code-editor.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport { Button } from \"../button/button\"\nimport { applyIndent } from \"./indent\"\nimport { highlightCode, splitTokenLines } from \"../../lib/code-highlight\"\nimport { useCodeTokenRenderer } from \"../../lib/code-tokens\"\nimport {\n  caretAfterRewrite,\n  gutterDigits,\n  lineIndexAt,\n  severityByLine,\n  visibleDiagnostics,\n  type CodeDiagnostic,\n  type CodeDiagnosticSeverity,\n} from \"../../lib/code-lines\"\n\n/**\n * Compact code editing on a native textarea. Highlighting is decorative; the textarea remains the\n * only focusable, labelled, form-participating control. Formatting and diagnostics are supplied by\n * the caller rather than computed here.\n */\n\n/** How long a formatting outcome stays in the live region. */\nconst FORMAT_FEEDBACK_MS = 2000\n\n/** Shared gutter width for the number cells and textarea padding. */\nconst GUTTER = \"--zenith-code-gutter\"\n\n/**\n * Metrics shared by the textarea and highlight layer. `tabSize` varies per instance and gutter\n * padding intentionally differs between layers.\n */\nconst CODE_METRICS = {\n  ...shorthands.margin(0),\n  ...shorthands.borderWidth(0),\n  ...shorthands.borderStyle(\"none\"),\n  ...shorthands.padding(tokens.spacingElement2),\n  fontFamily: tokens.fontMono,\n  fontSize: tokens.textXs,\n  lineHeight: tokens.leadingXs,\n  letterSpacing: tokens.trackingNormal,\n  fontWeight: tokens.fontWeightNormal,\n  textIndent: 0,\n  boxSizing: \"border-box\",\n  // A classic, space-consuming scrollbar narrows the textarea's content box but not the layer's,\n  // which moves where wrapped lines break. Reserving the gutter on both keeps one content width.\n  // Platforms with overlay scrollbars never had the problem.\n  scrollbarGutter: \"stable\",\n} as const\n\n/** Core-sheet colours used by diagnostic rules and numbers. */\nconst SEVERITY_TOKENS: Record<\n  CodeDiagnosticSeverity,\n  { rule: string; number: string }\n> = {\n  error: { rule: tokens.errorUi, number: tokens.error11 },\n  warning: { rule: tokens.warningUi, number: tokens.warning11 },\n  info: { rule: tokens.infoUi, number: tokens.info11 },\n}\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    display: \"flex\",\n    flexDirection: \"column\",\n    minWidth: 0,\n    position: \"relative\",\n    backgroundColor: tokens.surfaceField,\n    ...shorthands.borderWidth(tokens.borderWidthField),\n    ...shorthands.borderStyle(\"solid\"),\n    ...shorthands.borderColor(tokens.borderField),\n    borderRadius: tokens.surfaceRadiusField,\n    // Declared before the state rules below so those win by source order, per AGENTS.md rule 2.\n    \"&:focus-within\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"-1px\",\n      outlineColor: tokens.focusRing,\n    },\n    \"&[data-invalid]\": {\n      ...shorthands.borderColor(tokens.errorUi),\n    },\n    \"&[data-disabled]\": {\n      backgroundColor: tokens.grayA3,\n    },\n  },\n  // Repaint the opaque gutter when the surrounding field is disabled.\n  rootDisabledGutter: {\n    [`&[data-disabled] [${SLOT_ATTR}='code-editor-line-number']`]: {\n      backgroundColor: tokens.grayA3,\n    },\n  },\n  // focus-within would keep the overlay visible throughout the editing session.\n  rootFormatReveal: {\n    \"&:hover [data-format-state]\": { opacity: 1 },\n  },\n  // The textarea defines the box; this decorative layer stretches without measurement.\n  highlight: {\n    ...CODE_METRICS,\n    position: \"absolute\",\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    overflowX: \"hidden\",\n    overflowY: \"hidden\",\n    // Paint only: it must never take a click, a caret or a selection away from the control.\n    pointerEvents: \"none\",\n    userSelect: \"none\",\n    color: tokens.grayA12,\n    \"&[data-composing]\": {\n      // Provisional IME text lives in the textarea, so the layer would be showing stale colours\n      // over it. Declared after the base so it wins by source order.\n      opacity: 0,\n    },\n  },\n  /** With a gutter, the left padding moves into the number cell so the cell can pin flush. */\n  highlightGutter: {\n    ...boxModel,\n    paddingLeft: 0,\n  },\n  textarea: {\n    ...nativeControl,\n    ...CODE_METRICS,\n    position: \"relative\",\n    width: \"100%\",\n    minWidth: 0,\n    backgroundColor: \"transparent\",\n    // The glyphs come from the layer beneath; only the caret is painted here.\n    color: \"transparent\",\n    caretColor: tokens.grayA12,\n    overflowX: \"auto\",\n    overflowY: \"auto\",\n    // The root paints the ring for the whole surface; a second one on the control would double it.\n    outlineStyle: \"none\",\n    \"::placeholder\": {\n      color: tokens.grayA8,\n      // Placeholders are the textarea's own paint, so they need a real colour despite the above.\n      WebkitTextFillColor: tokens.grayA8,\n    },\n    \"::selection\": {\n      // An alpha tint, so highlighted glyphs stay legible through the selection band instead of\n      // being covered by it — transparent text under an opaque selection is invisible text.\n      backgroundColor: tokens.accentA5,\n    },\n    \":disabled\": {\n      cursor: \"not-allowed\",\n    },\n    \"&[data-composing]\": {\n      // Reveal what the IME is composing. Without this the author types blind through a CJK\n      // composition, which is the one way this technique can fail outright.\n      color: tokens.grayA12,\n    },\n  },\n  // Keep textarea glyphs aligned with the highlighted rows.\n  textareaGutter: {\n    ...boxModel,\n    paddingLeft: `calc(${tokens.spacingElement2} + var(${GUTTER}) + ${tokens.spacingElement3})`,\n  },\n  // Unsupported browsers fall back to the native rows height.\n  autoSize: {\n    fieldSizing: \"content\",\n  },\n  resizeNone: {\n    resize: \"none\",\n  },\n  resizeVertical: {\n    resize: \"vertical\",\n  },\n  resizeHorizontal: {\n    resize: \"horizontal\",\n  },\n  resizeBoth: {\n    resize: \"both\",\n  },\n  noWrap: {\n    whiteSpace: \"pre\",\n    overflowWrap: \"normal\",\n  },\n  wrap: {\n    whiteSpace: \"pre-wrap\",\n    overflowWrap: \"break-word\",\n  },\n  // The UA gives `<code>` its own monospace family and size, so the pre's metrics would not reach\n  // the rows without this.\n  code: {\n    fontFamily: tokens.fontMono,\n    fontSize: \"1em\",\n  },\n  // Width constraints below require a block formatting context.\n  codeRows: {\n    display: \"block\",\n  },\n  // Give the sticky gutter and active-line band the full width of unwrapped code.\n  codeNoWrap: {\n    ...boxModel,\n    width: \"max-content\",\n    minWidth: \"100%\",\n  },\n  line: {\n    ...boxModel,\n    display: \"flex\",\n    width: \"100%\",\n  },\n  /** The band under the caret's line. See `caretLine` in the component for when it is on. */\n  lineActive: {\n    backgroundImage: `linear-gradient(${tokens.grayA2}, ${tokens.grayA2})`,\n  },\n  lineNumber: {\n    userSelect: \"none\",\n    textAlign: \"right\",\n    flexGrow: 0,\n    flexShrink: 0,\n    color: tokens.grayA8,\n    boxSizing: \"border-box\",\n    width: `calc(var(${GUTTER}) + ${tokens.spacingElement2} + ${tokens.spacingElement3})`,\n    paddingLeft: tokens.spacingElement2,\n    paddingRight: tokens.spacingElement3,\n    // Pinned, so a long line scrolled sideways does not take the numbers with it. Opaque, because\n    // scrolled code passes underneath.\n    position: \"sticky\",\n    left: 0,\n    backgroundColor: tokens.surfaceField,\n  },\n  /** The caret's line number, lifted out of the gutter's grey. */\n  lineNumberActive: {\n    color: tokens.grayA12,\n  },\n  lineContent: {\n    ...boxModel,\n    minWidth: 0,\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"auto\",\n  },\n  lineContentWrap: {\n    overflowWrap: \"break-word\",\n  },\n  // Underline only the text; a line fill would compete with selection and active-line paint.\n  diagnosticError: {\n    textDecorationLine: \"underline\",\n    textDecorationStyle: \"wavy\",\n    textDecorationColor: SEVERITY_TOKENS.error.rule,\n    textDecorationSkipInk: \"none\",\n    textUnderlineOffset: \"0.2em\",\n  },\n  diagnosticWarning: {\n    textDecorationLine: \"underline\",\n    textDecorationStyle: \"wavy\",\n    textDecorationColor: SEVERITY_TOKENS.warning.rule,\n    textDecorationSkipInk: \"none\",\n    textUnderlineOffset: \"0.2em\",\n  },\n  diagnosticInfo: {\n    textDecorationLine: \"underline\",\n    textDecorationStyle: \"wavy\",\n    textDecorationColor: SEVERITY_TOKENS.info.rule,\n    textDecorationSkipInk: \"none\",\n    textUnderlineOffset: \"0.2em\",\n  },\n  numberError: { color: SEVERITY_TOKENS.error.number },\n  numberWarning: { color: SEVERITY_TOKENS.warning.number },\n  numberInfo: { color: SEVERITY_TOKENS.info.number },\n  format: {\n    position: \"absolute\",\n    top: tokens.spacingElement05,\n    right: tokens.spacingElement05,\n    zIndex: 1,\n    backgroundColor: tokens.surfaceField,\n    opacity: 0,\n    transitionProperty: \"opacity\",\n    transitionDuration: \"120ms\",\n    \"@media (prefers-reduced-motion: reduce)\": {\n      transitionDuration: \"0s\",\n    },\n    \"@media (hover: none)\": {\n      opacity: 1,\n    },\n    // After the base, so they win by source order (AGENTS.md rule 2).\n    \"&:focus-visible\": { opacity: 1 },\n    \"&[data-format-state='pending']\": { opacity: 1 },\n  },\n  srOnly: {\n    ...boxModel,\n    position: \"absolute\",\n    width: \"1px\",\n    height: \"1px\",\n    ...shorthands.padding(0),\n    ...shorthands.margin(\"-1px\"),\n    overflowX: \"hidden\",\n    overflowY: \"hidden\",\n    clip: \"rect(0, 0, 0, 0)\",\n    whiteSpace: \"nowrap\",\n  },\n})\n\nconst FormatIcon = (props: React.ComponentProps<\"svg\">) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\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    focusable=\"false\"\n    {...props}\n  >\n    <path d=\"M4 5h16\" />\n    <path d=\"M9 10h11\" />\n    <path d=\"M9 15h7\" />\n    <path d=\"M4 20h16\" />\n  </svg>\n)\n\nexport type CodeEditorResize = \"none\" | \"vertical\" | \"horizontal\" | \"both\"\n\nexport type CodeEditorProps = Omit<\n  React.ComponentProps<\"textarea\">,\n  \"value\" | \"defaultValue\" | \"wrap\" | \"children\"\n> & {\n  /** Controlled source text. Omit for an uncontrolled editor. */\n  value?: string\n  /** Initial source text for an uncontrolled editor. Ignored when `value` is passed. */\n  defaultValue?: string\n  /** The next source text, after any edit — typing, paste, Tab indentation, or a format. */\n  onValueChange?: (value: string) => void\n  /** Language grammar used for syntax highlighting. Unknown values fall back to plain text. */\n  language?: string\n  /**\n   * Soft-wrap long lines. Off by default, so a long line scrolls rather than silently folding.\n   *\n   * This replaces the native `wrap` attribute's `\"off\" | \"soft\" | \"hard\"`, whose `\"hard\"` value\n   * rewrites the submitted value with real newlines — never what a code buffer wants.\n   */\n  wrap?: boolean\n  /** Which directions the caller may drag to resize. Defaults to `none` under `autoSize`. */\n  resize?: CodeEditorResize\n  /**\n   * Let Tab and Shift+Tab indent instead of moving focus.\n   *\n   * Off by default, because a textarea that swallows Tab is a keyboard trap. When on, Escape\n   * releases the next Tab to focus movement — the escape hatch every code editor that takes Tab\n   * has to provide — and the release lasts until the next keystroke or refocus.\n   */\n  indentWithTab?: boolean\n  /** Spaces inserted per indent level, and the rendered width of a literal tab. */\n  indentSize?: number\n  /** Marks the control invalid: sets `aria-invalid` and the invalid styling. */\n  invalid?: boolean\n  /**\n   * Render a line-number gutter, and mark the line the caret is on. Off by default: on the four-\n   * line snippets this component is for, numbers are a column of noise that also costs horizontal\n   * space.\n   */\n  showLineNumbers?: boolean\n  /**\n   * Problems the CALLER found, one per line. Nothing here computes them. Rendered as a wavy rule\n   * under the line and a coloured gutter number, and enumerated in a visually hidden list that is\n   * added to the control's `aria-describedby` — so a screen reader gets the text on focus rather\n   * than a colour it cannot see.\n   */\n  diagnostics?: readonly CodeDiagnostic[]\n  /**\n   * Reformat the buffer. The caller supplies the formatter; this component supplies the keystroke,\n   * the caret, and the announcement. Bound to **Shift+Alt+F**, VS Code's \"Format Document\", and to\n   * a quiet button revealed on hover.\n   */\n  onFormat?: (value: string) => string | Promise<string>\n  /** Called when the formatter threw, rejected, or its result had to be discarded. */\n  onFormatError?: (error: unknown) => void\n  /** Accessible name of the format button. */\n  formatLabel?: string\n  /** Announced after the formatter ran. */\n  formattedLabel?: string\n  /** Announced when the formatter failed or its result was discarded. */\n  formatErrorLabel?: string\n  /**\n   * Grow with the content instead of reserving a fixed height.\n   *\n   * `rows` becomes the minimum and `maxRows` the maximum, past which the editor scrolls. Off by\n   * default, and progressive: browsers without CSS `field-sizing` fall back to `rows`, which is\n   * what this component did before the property existed.\n   */\n  autoSize?: boolean\n  /** With `autoSize`, the height past which the editor scrolls instead of growing. */\n  maxRows?: number\n}\n\nexport const CodeEditor = React.forwardRef<\n  HTMLTextAreaElement,\n  CodeEditorProps\n>(function CodeEditor(\n  {\n    value,\n    defaultValue,\n    onValueChange,\n    onChange,\n    onKeyDown,\n    onBlur,\n    onFocus,\n    onSelect,\n    onScroll,\n    onCompositionStart,\n    onCompositionEnd,\n    language,\n    wrap = false,\n    resize,\n    indentWithTab = false,\n    indentSize = 2,\n    invalid = false,\n    readOnly = false,\n    disabled = false,\n    showLineNumbers = false,\n    diagnostics,\n    onFormat,\n    onFormatError,\n    formatLabel = \"Format code\",\n    formattedLabel = \"Formatted\",\n    formatErrorLabel = \"Formatting failed\",\n    autoSize = false,\n    maxRows,\n    rows,\n    className,\n    style,\n    spellCheck = false,\n    autoComplete = \"off\",\n    autoCorrect = \"off\",\n    autoCapitalize = \"off\",\n    dir = \"ltr\",\n    ...props\n  },\n  forwardedRef\n) {\n  const styles = useStyles()\n  const reactId = React.useId()\n  const diagnosticsId = `${reactId}-diagnostics`\n\n  const isControlled = value !== undefined\n  const [uncontrolled, setUncontrolled] = React.useState(defaultValue ?? \"\")\n  const current = isControlled ? value : uncontrolled\n\n  const renderTokens = useCodeTokenRenderer()\n  const highlightRef = React.useRef<HTMLPreElement | null>(null)\n\n  const [composing, setComposing] = React.useState(false)\n\n  const innerRef = React.useRef<HTMLTextAreaElement | null>(null)\n  const setRefs = React.useCallback(\n    (el: HTMLTextAreaElement | null) => {\n      innerRef.current = el\n      if (typeof forwardedRef === \"function\") forwardedRef(el)\n      else if (forwardedRef) forwardedRef.current = el\n    },\n    [forwardedRef]\n  )\n\n  // Escape releases the next Tab without triggering a render.\n  const tabReleased = React.useRef(false)\n\n  const commit = React.useCallback(\n    (next: string) => {\n      if (!isControlled) setUncontrolled(next)\n      onValueChange?.(next)\n    },\n    [isControlled, onValueChange]\n  )\n\n  const lineCount = React.useMemo(() => current.split(\"\\n\").length, [current])\n  const severities = React.useMemo(\n    () => severityByLine(diagnostics, lineCount),\n    [diagnostics, lineCount]\n  )\n  const listed = React.useMemo(\n    () => visibleDiagnostics(diagnostics, lineCount),\n    [diagnostics, lineCount]\n  )\n  const rowMode = showLineNumbers || severities.size > 0\n\n  // Null while blurred or range-selected, when an active-line band would be misleading.\n  const [caretLine, setCaretLine] = React.useState<number | null>(null)\n\n  const syncCaretLine = React.useCallback(() => {\n    // Avoid caret state and rerenders when no row affordance is enabled.\n    if (!rowMode) return\n    const el = innerRef.current\n    if (el === null) return\n    if (el.selectionStart !== el.selectionEnd) {\n      setCaretLine(null)\n      return\n    }\n    setCaretLine(lineIndexAt(el.value, el.selectionStart ?? 0))\n  }, [rowMode])\n\n  const handleChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n      commit(event.target.value)\n      onChange?.(event)\n    },\n    [commit, onChange]\n  )\n\n  const handleSelect = React.useCallback(\n    (event: React.SyntheticEvent<HTMLTextAreaElement>) => {\n      syncCaretLine()\n      onSelect?.(event)\n    },\n    [onSelect, syncCaretLine]\n  )\n\n  const handleFocus = React.useCallback(\n    (event: React.FocusEvent<HTMLTextAreaElement>) => {\n      syncCaretLine()\n      onFocus?.(event)\n    },\n    [onFocus, syncCaretLine]\n  )\n\n  // The ref gates calls synchronously; state paints the pending affordance.\n  const formatPending = React.useRef(false)\n  const [formatting, setFormatting] = React.useState(false)\n  const [formatStatus, setFormatStatus] = React.useState(\"\")\n  const formatTimer = React.useRef<ReturnType<typeof setTimeout> | null>(null)\n  React.useEffect(\n    () => () => {\n      if (formatTimer.current !== null) clearTimeout(formatTimer.current)\n    },\n    []\n  )\n\n  const announceFormat = React.useCallback((message: string) => {\n    setFormatStatus(message)\n    if (formatTimer.current !== null) clearTimeout(formatTimer.current)\n    // Clearing lets a repeated identical outcome be announced again.\n    formatTimer.current = setTimeout(() => {\n      formatTimer.current = null\n      setFormatStatus(\"\")\n    }, FORMAT_FEEDBACK_MS)\n  }, [])\n\n  const runFormat = React.useCallback(async () => {\n    if (onFormat === undefined || readOnly || disabled) return\n    const el = innerRef.current\n    if (el === null) return\n    // Do not queue stale work behind an in-flight formatter.\n    if (formatPending.current) return\n\n    const source = el.value\n    formatPending.current = true\n    setFormatting(true)\n\n    let next: string\n    try {\n      next = await onFormat(source)\n    } catch (error) {\n      formatPending.current = false\n      setFormatting(false)\n      announceFormat(formatErrorLabel)\n      onFormatError?.(error ?? new Error(\"Formatting failed\"))\n      return\n    }\n\n    formatPending.current = false\n    setFormatting(false)\n\n    const live = innerRef.current\n    if (live === null) return\n    if (live.value !== source) {\n      // Never overwrite edits made while the formatter was running.\n      announceFormat(formatErrorLabel)\n      onFormatError?.(\n        new Error(\"Formatting discarded: the value changed while formatting\")\n      )\n      return\n    }\n\n    if (next !== source) {\n      const caret = caretAfterRewrite(source, next, live.selectionStart ?? 0)\n      // Place the caret before React reconciles the controlled value.\n      live.value = next\n      live.setSelectionRange(caret, caret)\n      commit(next)\n    }\n    announceFormat(formattedLabel)\n  }, [\n    announceFormat,\n    commit,\n    disabled,\n    formatErrorLabel,\n    formattedLabel,\n    onFormat,\n    onFormatError,\n    readOnly,\n  ])\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n      onKeyDown?.(event)\n      if (event.defaultPrevented) return\n      if (readOnly || disabled) return\n\n      // Shift+Alt+F, matched on `code` rather than `key`: Alt rewrites `key` on macOS layouts, so\n      // the physical key is the only stable identity this chord has.\n      if (\n        onFormat !== undefined &&\n        event.altKey &&\n        event.shiftKey &&\n        !event.ctrlKey &&\n        !event.metaKey &&\n        (event.code === \"KeyF\" || event.key.toLowerCase() === \"f\")\n      ) {\n        event.preventDefault()\n        tabReleased.current = false\n        void runFormat()\n        return\n      }\n\n      if (!indentWithTab) return\n\n      if (event.key === \"Escape\") {\n        // Deliberately NOT prevented: an editor inside a Dialog must still let Escape close it.\n        // The latch is the whole effect.\n        tabReleased.current = true\n        return\n      }\n\n      if (event.key !== \"Tab\") {\n        tabReleased.current = false\n        return\n      }\n      // A released Tab, or any modified Tab, is focus movement. Shift is the one modifier that\n      // still means indentation, because Shift+Tab is outdent.\n      if (tabReleased.current || event.ctrlKey || event.metaKey || event.altKey)\n        return\n\n      const el = event.currentTarget\n      const next = applyIndent(\n        {\n          value: el.value,\n          selectionStart: el.selectionStart ?? 0,\n          selectionEnd: el.selectionEnd ?? 0,\n        },\n        { outdent: event.shiftKey, indentSize }\n      )\n      if (\n        next.value === el.value &&\n        next.selectionStart === el.selectionStart &&\n        next.selectionEnd === el.selectionEnd\n      ) {\n        // Shift+Tab on an already-flush line changes nothing; let it move focus rather than\n        // silently eating the key.\n        return\n      }\n\n      event.preventDefault()\n      // Write the DOM before the state update so the caret lands where the transform said. React\n      // then renders the same string, sees the node already holds it, and leaves the selection\n      // alone — restoring it from an effect would fight the browser for a frame first.\n      el.value = next.value\n      el.setSelectionRange(next.selectionStart, next.selectionEnd)\n      commit(next.value)\n    },\n    [\n      commit,\n      disabled,\n      indentSize,\n      indentWithTab,\n      onFormat,\n      onKeyDown,\n      readOnly,\n      runFormat,\n    ]\n  )\n\n  const handleBlur = React.useCallback(\n    (event: React.FocusEvent<HTMLTextAreaElement>) => {\n      tabReleased.current = false\n      setCaretLine(null)\n      onBlur?.(event)\n    },\n    [onBlur]\n  )\n\n  const handleScroll = React.useCallback(\n    (event: React.UIEvent<HTMLTextAreaElement>) => {\n      const layer = highlightRef.current\n      if (layer !== null) {\n        // Synchronous, deliberately. `scroll` is not cancelable and fires at a high rate, and the\n        // usual advice is to throttle it — but deferring to a frame puts the colours behind the\n        // text for that frame, which is exactly the artefact this sync exists to prevent. Two\n        // property writes are cheaper than the reflow a throttle would be saving.\n        layer.scrollTop = event.currentTarget.scrollTop\n        layer.scrollLeft = event.currentTarget.scrollLeft\n      }\n      onScroll?.(event)\n    },\n    [onScroll]\n  )\n\n  const handleCompositionStart = React.useCallback(\n    (event: React.CompositionEvent<HTMLTextAreaElement>) => {\n      setComposing(true)\n      onCompositionStart?.(event)\n    },\n    [onCompositionStart]\n  )\n\n  const handleCompositionEnd = React.useCallback(\n    (event: React.CompositionEvent<HTMLTextAreaElement>) => {\n      setComposing(false)\n      onCompositionEnd?.(event)\n    },\n    [onCompositionEnd]\n  )\n\n  /**\n   * A `<pre>` does not render a final empty line, so a value ending in a newline would leave the\n   * layer one line short of the textarea and everything below the fold misaligned. The extra space\n   * gives that last line something to occupy.\n   */\n  const highlightSource = rowMode\n    ? current\n    : current.endsWith(\"\\n\")\n      ? `${current} `\n      : current\n\n  // Synchronous tokenization: the server render and the first client render produce the same\n  // markup, so there is nothing for hydration to reconcile.\n  const highlighted = React.useMemo(\n    () => highlightCode(highlightSource, language),\n    [highlightSource, language]\n  )\n\n  const plainLines = React.useMemo(\n    () => (rowMode ? current.split(\"\\n\") : null),\n    [current, rowMode]\n  )\n  const tokenLines = React.useMemo(\n    () =>\n      rowMode && highlighted !== null ? splitTokenLines(highlighted) : null,\n    [highlighted, rowMode]\n  )\n\n  const wrapStyle = wrap ? styles.wrap : styles.noWrap\n\n  const effectiveResize = resize ?? (autoSize ? \"none\" : \"vertical\")\n  const resizeStyle =\n    effectiveResize === \"vertical\"\n      ? styles.resizeVertical\n      : effectiveResize === \"horizontal\"\n        ? styles.resizeHorizontal\n        : effectiveResize === \"both\"\n          ? styles.resizeBoth\n          : styles.resizeNone\n\n  /**\n   * `rows` is ignored under `field-sizing: content`, so it is translated into the floor it means.\n   * The terms are the ones `CODE_METRICS` sets: N line boxes plus the block padding, with the\n   * control's border already at zero and `box-sizing: border-box`.\n   */\n  const autoSizeStyle = autoSize\n    ? {\n        minHeight: `calc(${rows ?? 3} * ${tokens.leadingXs} + ${tokens.spacingElement2} * 2)`,\n        maxHeight:\n          maxRows === undefined\n            ? undefined\n            : `calc(${maxRows} * ${tokens.leadingXs} + ${tokens.spacingElement2} * 2)`,\n      }\n    : undefined\n\n  const rootStyle = showLineNumbers\n    ? ({\n        [GUTTER]: `${gutterDigits(lineCount)}ch`,\n        ...style,\n      } as React.CSSProperties)\n    : style\n\n  const describedBy =\n    listed.length === 0\n      ? props[\"aria-describedby\"]\n      : [props[\"aria-describedby\"], diagnosticsId].filter(Boolean).join(\" \")\n\n  const severityClass = {\n    error: styles.diagnosticError,\n    warning: styles.diagnosticWarning,\n    info: styles.diagnosticInfo,\n  } as const\n  const numberClass = {\n    error: styles.numberError,\n    warning: styles.numberWarning,\n    info: styles.numberInfo,\n  } as const\n\n  return (\n    <div\n      data-slot=\"code-editor\"\n      {...{ [SLOT_ATTR]: \"code-editor\" }}\n      data-language={language}\n      // Value-less boolean attributes, so `&[data-invalid]` and `&[data-disabled]` match the way\n      // Field's do rather than matching the string \"false\".\n      data-invalid={invalid || undefined}\n      data-disabled={disabled || undefined}\n      data-readonly={readOnly || undefined}\n      data-formatting={formatting || undefined}\n      // `className` and `style` address the component, which is this element — the same contract\n      // every other component in the package offers. Everything else in `...props` is a textarea\n      // attribute and lands on the control below.\n      className={mergeClasses(\n        styles.root,\n        showLineNumbers ? styles.rootDisabledGutter : undefined,\n        onFormat === undefined ? undefined : styles.rootFormatReveal,\n        className\n      )}\n      style={rootStyle}\n    >\n      {/*\n        Decoration, and nothing else. `aria-hidden` because it is a duplicate of the textarea's own\n        text and contains nothing focusable — the one case MDN names for it — so a screen reader\n        reads the control once, not twice. `pointer-events: none` keeps clicks, the caret and\n        selection on the control beneath it. CodeMirror marks its own gutter `aria-hidden` for the\n        same reason: a line number is a position, and the position is already in the control.\n      */}\n      <pre\n        ref={highlightRef}\n        aria-hidden=\"true\"\n        data-slot=\"code-editor-highlight\"\n        {...{ [SLOT_ATTR]: \"code-editor-highlight\" }}\n        data-composing={composing || undefined}\n        className={mergeClasses(\n          styles.highlight,\n          showLineNumbers ? styles.highlightGutter : undefined,\n          wrapStyle\n        )}\n        style={{ tabSize: indentSize }}\n      >\n        <code\n          className={mergeClasses(\n            styles.code,\n            plainLines === null ? undefined : styles.codeRows,\n            plainLines !== null && !wrap ? styles.codeNoWrap : undefined\n          )}\n        >\n          {plainLines === null\n            ? highlighted === null\n              ? highlightSource\n              : renderTokens(highlighted)\n            : plainLines.map((line, index) => {\n                const severity = severities.get(index + 1)\n                const active = caretLine === index\n                return (\n                  <span\n                    key={index}\n                    data-slot=\"code-editor-line\"\n                    {...{ [SLOT_ATTR]: \"code-editor-line\" }}\n                    data-line={index + 1}\n                    data-active={active || undefined}\n                    data-severity={severity}\n                    className={mergeClasses(\n                      styles.line,\n                      active ? styles.lineActive : undefined\n                    )}\n                  >\n                    {showLineNumbers ? (\n                      <span\n                        data-slot=\"code-editor-line-number\"\n                        {...{ [SLOT_ATTR]: \"code-editor-line-number\" }}\n                        className={mergeClasses(\n                          styles.lineNumber,\n                          active ? styles.lineNumberActive : undefined,\n                          severity === undefined\n                            ? undefined\n                            : numberClass[severity]\n                        )}\n                      >\n                        {index + 1}\n                      </span>\n                    ) : null}\n                    <span\n                      data-slot=\"code-editor-line-content\"\n                      {...{ [SLOT_ATTR]: \"code-editor-line-content\" }}\n                      className={mergeClasses(\n                        styles.lineContent,\n                        wrap ? styles.lineContentWrap : undefined\n                      )}\n                    >\n                      {/* The rule goes on this inner span so it ends with the text rather than\n                          running out to the fold; the newline stays outside it. */}\n                      <span\n                        className={\n                          severity === undefined\n                            ? undefined\n                            : severityClass[severity]\n                        }\n                      >\n                        {tokenLines === null\n                          ? line\n                          : renderTokens(tokenLines[index] ?? [])}\n                      </span>\n                      {\"\\n\"}\n                    </span>\n                  </span>\n                )\n              })}\n        </code>\n      </pre>\n\n      <textarea\n        {...props}\n        ref={setRefs}\n        data-slot=\"code-editor-input\"\n        {...{ [SLOT_ATTR]: \"code-editor-input\" }}\n        value={current}\n        rows={rows}\n        onChange={handleChange}\n        onKeyDown={handleKeyDown}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onSelect={handleSelect}\n        onScroll={handleScroll}\n        onCompositionStart={handleCompositionStart}\n        onCompositionEnd={handleCompositionEnd}\n        data-composing={composing || undefined}\n        readOnly={readOnly}\n        disabled={disabled}\n        aria-invalid={invalid || undefined}\n        aria-describedby={describedBy}\n        aria-busy={formatting || undefined}\n        // Code is not prose: a squiggle under every identifier is noise, and an editor that\n        // capitalises `const` or \"corrects\" `-->` corrupts the buffer.\n        spellCheck={spellCheck}\n        autoComplete={autoComplete}\n        autoCorrect={autoCorrect}\n        autoCapitalize={autoCapitalize}\n        // Source is left-to-right even on a right-to-left page; `auto` would flip a buffer that\n        // happens to start with an RTL character in a string literal.\n        dir={dir}\n        wrap={wrap ? \"soft\" : \"off\"}\n        // One indent level, one tab stop: a literal tab in the buffer renders exactly as wide as\n        // the spaces Tab inserts. Dynamic, so it is an inline declaration rather than an atom.\n        style={{ tabSize: indentSize, ...autoSizeStyle }}\n        className={mergeClasses(\n          styles.textarea,\n          showLineNumbers ? styles.textareaGutter : undefined,\n          autoSize ? styles.autoSize : undefined,\n          wrapStyle,\n          resizeStyle\n        )}\n      />\n\n      {onFormat === undefined ? null : (\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"icon-sm\"\n          data-format-state={formatting ? \"pending\" : \"idle\"}\n          aria-label={formatLabel}\n          disabled={disabled || readOnly || formatting}\n          className={styles.format}\n          // Keeps the caret where it is: without this the button takes focus on press and the\n          // editor's selection — which the format is about to restore — is gone before it runs.\n          onMouseDown={(event) => event.preventDefault()}\n          onClick={() => {\n            void runFormat()\n          }}\n        >\n          <FormatIcon />\n        </Button>\n      )}\n\n      {listed.length === 0 ? null : (\n        <ul\n          id={diagnosticsId}\n          data-slot=\"code-editor-diagnostics\"\n          {...{ [SLOT_ATTR]: \"code-editor-diagnostics\" }}\n          className={styles.srOnly}\n        >\n          {listed.map((diagnostic, index) => (\n            <li key={index}>\n              {`${diagnostic.severity ?? \"error\"}, line ${diagnostic.line}${\n                diagnostic.column === undefined\n                  ? \"\"\n                  : `, column ${diagnostic.column}`\n              }: ${diagnostic.message}`}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {onFormat === undefined ? null : (\n        <span\n          role=\"status\"\n          aria-live=\"polite\"\n          data-slot=\"code-editor-format-status\"\n          {...{ [SLOT_ATTR]: \"code-editor-format-status\" }}\n          className={styles.srOnly}\n        >\n          {formatStatus}\n        </span>\n      )}\n    </div>\n  )\n})\n"],"names":["FORMAT_FEEDBACK_MS","GUTTER","CODE_METRICS","shorthands","tokens.spacingElement2","tokens.fontMono","tokens.textXs","tokens.leadingXs","tokens.trackingNormal","tokens.fontWeightNormal","SEVERITY_TOKENS","tokens.errorUi","tokens.error11","tokens.warningUi","tokens.warning11","tokens.infoUi","tokens.info11","useStyles","makeZenithStyles","boxModel","tokens.surfaceField","tokens.borderWidthField","tokens.borderField","tokens.surfaceRadiusField","tokens.focusRing","tokens.grayA3","SLOT_ATTR","tokens.grayA12","nativeControl","tokens.grayA8","tokens.accentA5","tokens.spacingElement3","tokens.grayA2","tokens.spacingElement05","FormatIcon","props","jsxs","jsx","CodeEditor","React","value","defaultValue","onValueChange","onChange","onKeyDown","onBlur","onFocus","onSelect","onScroll","onCompositionStart","onCompositionEnd","language","wrap","resize","indentWithTab","indentSize","invalid","readOnly","disabled","showLineNumbers","diagnostics","onFormat","onFormatError","formatLabel","formattedLabel","formatErrorLabel","autoSize","maxRows","rows","className","style","spellCheck","autoComplete","autoCorrect","autoCapitalize","dir","forwardedRef","styles","diagnosticsId","isControlled","uncontrolled","setUncontrolled","current","renderTokens","useCodeTokenRenderer","highlightRef","composing","setComposing","innerRef","setRefs","el","tabReleased","commit","next","lineCount","severities","severityByLine","listed","visibleDiagnostics","rowMode","caretLine","setCaretLine","syncCaretLine","lineIndexAt","handleChange","event","handleSelect","handleFocus","formatPending","formatting","setFormatting","formatStatus","setFormatStatus","formatTimer","announceFormat","message","runFormat","source","error","live","caret","caretAfterRewrite","handleKeyDown","applyIndent","handleBlur","handleScroll","layer","handleCompositionStart","handleCompositionEnd","highlightSource","highlighted","highlightCode","plainLines","tokenLines","splitTokenLines","wrapStyle","effectiveResize","resizeStyle","autoSizeStyle","rootStyle","gutterDigits","describedBy","severityClass","numberClass","mergeClasses","line","index","severity","active","Button","diagnostic"],"mappings":"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"}

package/dist/components/collapsible-sidebar/collapsible-sidebar.js

@@ -1,25 +1,28 @@
-import { jsx as b, jsxs as L, Fragment as P } from "react/jsx-runtime";
+import { jsx as b, jsxs as P, Fragment as V } from "react/jsx-runtime";
 import * as e from "react";
 import { mergeClasses as m, SLOT_ATTR as x, shorthands as y } from "@epilot/zenith-runtime/v1";
-import { makeZenithStyles as V } from "../../styles/make-styles.js";
-import { spacingGroup2 as M, body as z, spacingElement3 as B, radius2xl as X } from "../../tokens/index.js";
-const D = e.createContext(null);
-function k() {
-  const u = e.useContext(D);
+import { makeZenithStyles as z } from "../../styles/make-styles.js";
+import { nativeControl as B, boxModel as S } from "../../styles/host-reset.js";
+import { spacingGroup2 as D, body as X, spacingElement3 as $, radius2xl as q } from "../../tokens/index.js";
+const F = e.createContext(null);
+function E() {
+  const u = e.useContext(F);
   if (!u)
     throw new Error(
       "CollapsibleSidebar sub-components must be used within CollapsibleSidebar"
     );
   return u;
 }
-const S = V({
+const h = z({
   root: {
+    ...S,
     position: "relative",
     height: "100%",
     display: "flex",
     flexDirection: "column"
   },
   content: {
+    ...S,
     display: "flex",
     flexDirection: "column",
     height: "100%",
@@ -28,14 +31,15 @@ const S = V({
     flexBasis: "0%"
   },
   floating: {
+    ...S,
     position: "absolute",
     top: 0,
     left: 0,
     height: "100%",
     // v1 z-50; floating panel layer above collapsed sidebar.
     zIndex: 50,
-    ...y.borderRadius(X),
-    backgroundColor: z,
+    ...y.borderRadius(q),
+    backgroundColor: X,
     // v1 shadow-[0_4px_20px_rgba(0,0,0,0.15)]; no shadow token exists in this package.
     boxShadow: "0 4px 20px rgba(0, 0, 0, 0.15)",
     display: "flex",
@@ -56,137 +60,139 @@ const S = V({
     transitionProperty: "none"
   },
   condensed: {
+    ...S,
     display: "flex",
     flexDirection: "column",
     alignItems: "center",
-    paddingTop: M,
+    paddingTop: D,
     // v1 gap-3 is 0.75rem; no spacing token for 0.75rem exists in this package.
-    ...y.gap(B),
+    ...y.gap($),
     flexGrow: 1,
     flexShrink: 1,
     flexBasis: "0%"
   },
   toggle: {
+    ...B,
     display: "flex",
     alignItems: "center",
     justifyContent: "flex-end",
-    ...y.padding(M),
+    ...y.padding(D),
     cursor: "pointer",
     backgroundColor: "transparent",
     ...y.border("0")
   }
-}), Z = e.forwardRef(function({
-  collapsed: n,
+}), K = e.forwardRef(function({
+  collapsed: a,
   defaultCollapsed: l = !1,
   onCollapsedChange: o,
   width: i = 264,
   collapsedWidth: r = 64,
   expandOnHover: t = !0,
   hoverDelay: s = 100,
-  className: a,
+  className: n,
   children: c,
   ...g
-}, h) {
-  const v = S(), [C, F] = e.useState(l), T = n !== void 0, p = T ? n : C, [E, R] = e.useState(!1), N = e.useCallback(
+}, v) {
+  const T = h(), [C, j] = e.useState(l), w = a !== void 0, p = w ? a : C, [R, N] = e.useState(!1), M = e.useCallback(
     (f) => {
-      f || R(!0), T || F(f), o == null || o(f);
+      f || N(!0), w || j(f), o == null || o(f);
     },
-    [T, o]
-  ), [I, w] = e.useState(!1), d = e.useRef(void 0), j = e.useCallback(() => {
-    !p || !t || (d.current && clearTimeout(d.current), d.current = setTimeout(() => w(!0), s));
-  }, [p, t, s]), A = e.useCallback(() => {
-    d.current && clearTimeout(d.current), w(!1);
+    [w, o]
+  ), [I, k] = e.useState(!1), d = e.useRef(void 0), A = e.useCallback(() => {
+    !p || !t || (d.current && clearTimeout(d.current), d.current = setTimeout(() => k(!0), s));
+  }, [p, t, s]), G = e.useCallback(() => {
+    d.current && clearTimeout(d.current), k(!1);
   }, []);
   e.useEffect(() => {
-    w(!1);
-    const f = requestAnimationFrame(() => R(!1));
+    k(!1);
+    const f = requestAnimationFrame(() => N(!1));
     return () => cancelAnimationFrame(f);
   }, [p]), e.useEffect(() => () => {
     d.current && clearTimeout(d.current);
   }, []);
-  const G = e.useMemo(
+  const L = e.useMemo(
     () => ({
       collapsed: p,
-      onCollapsedChange: N,
+      onCollapsedChange: M,
       width: i,
       collapsedWidth: r,
       isHovered: I,
       expandOnHover: t,
-      skipTransition: E
+      skipTransition: R
     }),
     [
       p,
-      N,
+      M,
       i,
       r,
       I,
       t,
-      E
+      R
     ]
   );
-  return /* @__PURE__ */ b(D.Provider, { value: G, children: /* @__PURE__ */ b(
+  return /* @__PURE__ */ b(F.Provider, { value: L, children: /* @__PURE__ */ b(
     "div",
     {
-      ref: h,
+      ref: v,
       "data-slot": "collapsible-sidebar",
       [x]: "collapsible-sidebar",
       "data-collapsed": p ? "" : void 0,
-      className: m(v.root, a),
-      onMouseEnter: j,
-      onMouseLeave: A,
+      className: m(T.root, n),
+      onMouseEnter: A,
+      onMouseLeave: G,
       ...g,
       children: c
     }
   ) });
-}), _ = e.forwardRef(function({ className: n, floatingClassName: l, children: o, style: i, ...r }, t) {
-  const s = S(), { collapsed: a, width: c, isHovered: g, expandOnHover: h, skipTransition: v } = k(), C = typeof c == "number" ? `${c}px` : c;
-  return /* @__PURE__ */ L(P, { children: [
-    !a && /* @__PURE__ */ b(
+}), Q = e.forwardRef(function({ className: a, floatingClassName: l, children: o, style: i, ...r }, t) {
+  const s = h(), { collapsed: n, width: c, isHovered: g, expandOnHover: v, skipTransition: T } = E(), C = typeof c == "number" ? `${c}px` : c;
+  return /* @__PURE__ */ P(V, { children: [
+    !n && /* @__PURE__ */ b(
       "aside",
       {
         ref: t,
         "data-slot": "collapsible-sidebar-content",
         [x]: "collapsible-sidebar-content",
-        className: m(s.content, n),
+        className: m(s.content, a),
         style: { width: C, ...i },
         ...r,
         children: o
       }
     ),
-    h && /* @__PURE__ */ b(
+    v && /* @__PURE__ */ b(
       "div",
       {
         "data-slot": "collapsible-sidebar-floating",
         [x]: "collapsible-sidebar-floating",
-        "data-visible": a && g ? "" : void 0,
+        "data-visible": n && g ? "" : void 0,
         className: m(
           s.floating,
-          v && s.transitionNone,
+          T && s.transitionNone,
           l
         ),
         style: { width: C },
-        children: a && g && o
+        children: n && g && o
       }
     )
   ] });
-}), J = e.forwardRef(function({ className: n, children: l, style: o, ...i }, r) {
-  const t = S(), { collapsed: s, collapsedWidth: a } = k();
+}), U = e.forwardRef(function({ className: a, children: l, style: o, ...i }, r) {
+  const t = h(), { collapsed: s, collapsedWidth: n } = E();
   if (!s) return null;
-  const c = typeof a == "number" ? `${a}px` : a;
+  const c = typeof n == "number" ? `${n}px` : n;
   return /* @__PURE__ */ b(
     "div",
     {
       ref: r,
       "data-slot": "collapsible-sidebar-condensed",
       [x]: "collapsible-sidebar-condensed",
-      className: m(t.condensed, n),
+      className: m(t.condensed, a),
       style: { width: c, ...o },
       ...i,
       children: l
     }
   );
-}), K = e.forwardRef(function({ className: n, children: l, ...o }, i) {
-  const r = S(), { collapsed: t, onCollapsedChange: s } = k();
+}), Y = e.forwardRef(function({ className: a, children: l, ...o }, i) {
+  const r = h(), { collapsed: t, onCollapsedChange: s } = E();
   return /* @__PURE__ */ b(
     "button",
     {
@@ -197,7 +203,7 @@ const S = V({
       type: "button",
       "aria-expanded": !t,
       "aria-label": t ? "Expand sidebar" : "Collapse sidebar",
-      className: m(r.toggle, n),
+      className: m(r.toggle, a),
       onClick: () => s(!t),
       ...o,
       children: typeof l == "function" ? l({ collapsed: t }) : l
@@ -205,10 +211,10 @@ const S = V({
   );
 });
 export {
-  Z as CollapsibleSidebar,
-  J as CollapsibleSidebarCondensed,
-  _ as CollapsibleSidebarContent,
-  K as CollapsibleSidebarToggle,
-  k as useCollapsibleSidebar
+  K as CollapsibleSidebar,
+  U as CollapsibleSidebarCondensed,
+  Q as CollapsibleSidebarContent,
+  Y as CollapsibleSidebarToggle,
+  E as useCollapsibleSidebar
 };
 //# sourceMappingURL=collapsible-sidebar.js.map

package/dist/components/collapsible-sidebar/collapsible-sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible-sidebar.js","sources":["../../../src/components/collapsible-sidebar/collapsible-sidebar.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\n// --- Context ---\n\nexport interface CollapsibleSidebarContextValue {\n  collapsed: boolean\n  onCollapsedChange: (collapsed: boolean) => void\n  width: number | string\n  collapsedWidth: number | string\n  isHovered: boolean\n  expandOnHover: boolean\n  skipTransition: boolean\n}\n\nconst CollapsibleSidebarContext =\n  React.createContext<CollapsibleSidebarContextValue | null>(null)\n\nexport function useCollapsibleSidebar() {\n  const ctx = React.useContext(CollapsibleSidebarContext)\n\n  if (!ctx) {\n    throw new Error(\n      \"CollapsibleSidebar sub-components must be used within CollapsibleSidebar\"\n    )\n  }\n\n  return ctx\n}\n\n// --- Styles ---\n\nconst useStyles = makeZenithStyles({\n  root: {\n    position: \"relative\",\n    height: \"100%\",\n    display: \"flex\",\n    flexDirection: \"column\",\n  },\n  content: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    height: \"100%\",\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n  floating: {\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    height: \"100%\",\n    // v1 z-50; floating panel layer above collapsed sidebar.\n    zIndex: 50,\n    ...shorthands.borderRadius(tokens.radius2xl),\n    backgroundColor: tokens.body,\n    // v1 shadow-[0_4px_20px_rgba(0,0,0,0.15)]; no shadow token exists in this package.\n    boxShadow: \"0 4px 20px rgba(0, 0, 0, 0.15)\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    opacity: 0,\n    transform: \"translateX(-50%)\",\n    pointerEvents: \"none\",\n    transitionProperty: \"all\",\n    transitionDuration: \"200ms\",\n    transitionTimingFunction: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n    \"&[data-visible]\": {\n      opacity: 1,\n      transform: \"translateX(0)\",\n      pointerEvents: \"auto\",\n    },\n  },\n  transitionNone: {\n    transitionProperty: \"none\",\n  },\n  condensed: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    paddingTop: tokens.spacingGroup2,\n    // v1 gap-3 is 0.75rem; no spacing token for 0.75rem exists in this package.\n    ...shorthands.gap(tokens.spacingElement3),\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n  toggle: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"flex-end\",\n    ...shorthands.padding(tokens.spacingGroup2),\n    cursor: \"pointer\",\n    backgroundColor: \"transparent\",\n    ...shorthands.border(\"0\"),\n  },\n})\n\n// --- CollapsibleSidebar (root) ---\n\nexport type CollapsibleSidebarProps = React.ComponentProps<\"div\"> & {\n  collapsed?: boolean\n  defaultCollapsed?: boolean\n  onCollapsedChange?: (collapsed: boolean) => void\n  width?: number | string\n  collapsedWidth?: number | string\n  expandOnHover?: boolean\n  hoverDelay?: number\n}\n\nexport const CollapsibleSidebar = React.forwardRef<\n  HTMLDivElement,\n  CollapsibleSidebarProps\n>(function CollapsibleSidebar(\n  {\n    collapsed: controlledCollapsed,\n    defaultCollapsed = false,\n    onCollapsedChange,\n    width = 264,\n    collapsedWidth = 64,\n    expandOnHover = true,\n    hoverDelay = 100,\n    className,\n    children,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n\n  const [internalCollapsed, setInternalCollapsed] =\n    React.useState(defaultCollapsed)\n  const isControlled = controlledCollapsed !== undefined\n  const collapsed = isControlled ? controlledCollapsed : internalCollapsed\n\n  // Skip floating panel transition when expanding (to avoid overlap with inline panel)\n  const [skipTransition, setSkipTransition] = React.useState(false)\n\n  const handleCollapsedChange = React.useCallback(\n    (value: boolean) => {\n      if (!value) setSkipTransition(true)\n      if (!isControlled) setInternalCollapsed(value)\n      onCollapsedChange?.(value)\n    },\n    [isControlled, onCollapsedChange]\n  )\n\n  // Hover state for floating panel\n  const [isHovered, setIsHovered] = React.useState(false)\n  const hoverTimeoutRef = React.useRef<ReturnType<typeof setTimeout>>(undefined)\n\n  const handleMouseEnter = React.useCallback(() => {\n    if (!collapsed || !expandOnHover) return\n    if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current)\n    hoverTimeoutRef.current = setTimeout(() => setIsHovered(true), hoverDelay)\n  }, [collapsed, expandOnHover, hoverDelay])\n\n  const handleMouseLeave = React.useCallback(() => {\n    if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current)\n    setIsHovered(false)\n  }, [])\n\n  // Reset hover when collapse state changes\n  React.useEffect(() => {\n    setIsHovered(false)\n    // Reset skipTransition after the render so future hover exits animate normally\n    const raf = requestAnimationFrame(() => setSkipTransition(false))\n    return () => cancelAnimationFrame(raf)\n  }, [collapsed])\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current)\n    }\n  }, [])\n\n  const contextValue = React.useMemo(\n    () => ({\n      collapsed,\n      onCollapsedChange: handleCollapsedChange,\n      width,\n      collapsedWidth,\n      isHovered,\n      expandOnHover,\n      skipTransition,\n    }),\n    [\n      collapsed,\n      handleCollapsedChange,\n      width,\n      collapsedWidth,\n      isHovered,\n      expandOnHover,\n      skipTransition,\n    ]\n  )\n\n  return (\n    <CollapsibleSidebarContext.Provider value={contextValue}>\n      <div\n        ref={ref}\n        data-slot=\"collapsible-sidebar\"\n        {...{ [SLOT_ATTR]: \"collapsible-sidebar\" }}\n        data-collapsed={collapsed ? \"\" : undefined}\n        className={mergeClasses(styles.root, className)}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        {...props}\n      >\n        {children}\n      </div>\n    </CollapsibleSidebarContext.Provider>\n  )\n})\n\n// --- CollapsibleSidebarContent ---\n\nexport type CollapsibleSidebarContentProps = React.ComponentProps<\"aside\"> & {\n  floatingClassName?: string\n}\n\nexport const CollapsibleSidebarContent = React.forwardRef<\n  HTMLElement,\n  CollapsibleSidebarContentProps\n>(function CollapsibleSidebarContent(\n  { className, floatingClassName, children, style, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const { collapsed, width, isHovered, expandOnHover, skipTransition } =\n    useCollapsibleSidebar()\n\n  const widthValue = typeof width === \"number\" ? `${width}px` : width\n\n  return (\n    <>\n      {/* Inline panel: only rendered when expanded */}\n      {!collapsed && (\n        <aside\n          ref={ref}\n          data-slot=\"collapsible-sidebar-content\"\n          {...{ [SLOT_ATTR]: \"collapsible-sidebar-content\" }}\n          className={mergeClasses(styles.content, className)}\n          style={{ width: widthValue, ...style }}\n          {...props}\n        >\n          {children}\n        </aside>\n      )}\n\n      {/* Floating panel: visible on hover when collapsed (only if expandOnHover is enabled) */}\n      {expandOnHover && (\n        <div\n          data-slot=\"collapsible-sidebar-floating\"\n          {...{ [SLOT_ATTR]: \"collapsible-sidebar-floating\" }}\n          data-visible={collapsed && isHovered ? \"\" : undefined}\n          className={mergeClasses(\n            styles.floating,\n            skipTransition && styles.transitionNone,\n            floatingClassName\n          )}\n          style={{ width: widthValue }}\n        >\n          {collapsed && isHovered && children}\n        </div>\n      )}\n    </>\n  )\n})\n\n// --- CollapsibleSidebarCondensed ---\n\nexport type CollapsibleSidebarCondensedProps = React.ComponentProps<\"div\">\n\nexport const CollapsibleSidebarCondensed = React.forwardRef<\n  HTMLDivElement,\n  CollapsibleSidebarCondensedProps\n>(function CollapsibleSidebarCondensed(\n  { className, children, style, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const { collapsed, collapsedWidth } = useCollapsibleSidebar()\n\n  if (!collapsed) return null\n\n  const collapsedWidthValue =\n    typeof collapsedWidth === \"number\" ? `${collapsedWidth}px` : collapsedWidth\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"collapsible-sidebar-condensed\"\n      {...{ [SLOT_ATTR]: \"collapsible-sidebar-condensed\" }}\n      className={mergeClasses(styles.condensed, className)}\n      style={{ width: collapsedWidthValue, ...style }}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n})\n\n// --- CollapsibleSidebarToggle ---\n\nexport type CollapsibleSidebarToggleProps = Omit<\n  React.ComponentProps<\"button\">,\n  \"onClick\" | \"children\"\n> & {\n  children?:\n    React.ReactNode | ((props: { collapsed: boolean }) => React.ReactNode)\n}\n\nexport const CollapsibleSidebarToggle = React.forwardRef<\n  HTMLButtonElement,\n  CollapsibleSidebarToggleProps\n>(function CollapsibleSidebarToggle({ className, children, ...props }, ref) {\n  const styles = useStyles()\n  const { collapsed, onCollapsedChange } = useCollapsibleSidebar()\n\n  return (\n    <button\n      ref={ref}\n      data-slot=\"collapsible-sidebar-toggle\"\n      {...{ [SLOT_ATTR]: \"collapsible-sidebar-toggle\" }}\n      data-collapsed={collapsed ? \"\" : undefined}\n      type=\"button\"\n      aria-expanded={!collapsed}\n      aria-label={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n      className={mergeClasses(styles.toggle, className)}\n      onClick={() => onCollapsedChange(!collapsed)}\n      {...props}\n    >\n      {typeof children === \"function\" ? children({ collapsed }) : children}\n    </button>\n  )\n})\n"],"names":["CollapsibleSidebarContext","React","useCollapsibleSidebar","ctx","useStyles","makeZenithStyles","shorthands","tokens.radius2xl","tokens.body","tokens.spacingGroup2","tokens.spacingElement3","CollapsibleSidebar","controlledCollapsed","defaultCollapsed","onCollapsedChange","width","collapsedWidth","expandOnHover","hoverDelay","className","children","props","ref","styles","internalCollapsed","setInternalCollapsed","isControlled","collapsed","skipTransition","setSkipTransition","handleCollapsedChange","value","isHovered","setIsHovered","hoverTimeoutRef","handleMouseEnter","handleMouseLeave","raf","contextValue","jsx","SLOT_ATTR","mergeClasses","CollapsibleSidebarContent","floatingClassName","style","widthValue","jsxs","Fragment","CollapsibleSidebarCondensed","collapsedWidthValue","CollapsibleSidebarToggle"],"mappings":"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"}
+{"version":3,"file":"collapsible-sidebar.js","sources":["../../../src/components/collapsible-sidebar/collapsible-sidebar.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\n\n// --- Context ---\n\nexport interface CollapsibleSidebarContextValue {\n  collapsed: boolean\n  onCollapsedChange: (collapsed: boolean) => void\n  width: number | string\n  collapsedWidth: number | string\n  isHovered: boolean\n  expandOnHover: boolean\n  skipTransition: boolean\n}\n\nconst CollapsibleSidebarContext =\n  React.createContext<CollapsibleSidebarContextValue | null>(null)\n\nexport function useCollapsibleSidebar() {\n  const ctx = React.useContext(CollapsibleSidebarContext)\n\n  if (!ctx) {\n    throw new Error(\n      \"CollapsibleSidebar sub-components must be used within CollapsibleSidebar\"\n    )\n  }\n\n  return ctx\n}\n\n// --- Styles ---\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    position: \"relative\",\n    height: \"100%\",\n    display: \"flex\",\n    flexDirection: \"column\",\n  },\n  content: {\n    ...boxModel,\n    display: \"flex\",\n    flexDirection: \"column\",\n    height: \"100%\",\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n  floating: {\n    ...boxModel,\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    height: \"100%\",\n    // v1 z-50; floating panel layer above collapsed sidebar.\n    zIndex: 50,\n    ...shorthands.borderRadius(tokens.radius2xl),\n    backgroundColor: tokens.body,\n    // v1 shadow-[0_4px_20px_rgba(0,0,0,0.15)]; no shadow token exists in this package.\n    boxShadow: \"0 4px 20px rgba(0, 0, 0, 0.15)\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    opacity: 0,\n    transform: \"translateX(-50%)\",\n    pointerEvents: \"none\",\n    transitionProperty: \"all\",\n    transitionDuration: \"200ms\",\n    transitionTimingFunction: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n    \"&[data-visible]\": {\n      opacity: 1,\n      transform: \"translateX(0)\",\n      pointerEvents: \"auto\",\n    },\n  },\n  transitionNone: {\n    transitionProperty: \"none\",\n  },\n  condensed: {\n    ...boxModel,\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    paddingTop: tokens.spacingGroup2,\n    // v1 gap-3 is 0.75rem; no spacing token for 0.75rem exists in this package.\n    ...shorthands.gap(tokens.spacingElement3),\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n  toggle: {\n    ...nativeControl,\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"flex-end\",\n    ...shorthands.padding(tokens.spacingGroup2),\n    cursor: \"pointer\",\n    backgroundColor: \"transparent\",\n    ...shorthands.border(\"0\"),\n  },\n})\n\n// --- CollapsibleSidebar (root) ---\n\nexport type CollapsibleSidebarProps = React.ComponentProps<\"div\"> & {\n  collapsed?: boolean\n  defaultCollapsed?: boolean\n  onCollapsedChange?: (collapsed: boolean) => void\n  width?: number | string\n  collapsedWidth?: number | string\n  expandOnHover?: boolean\n  hoverDelay?: number\n}\n\nexport const CollapsibleSidebar = React.forwardRef<\n  HTMLDivElement,\n  CollapsibleSidebarProps\n>(function CollapsibleSidebar(\n  {\n    collapsed: controlledCollapsed,\n    defaultCollapsed = false,\n    onCollapsedChange,\n    width = 264,\n    collapsedWidth = 64,\n    expandOnHover = true,\n    hoverDelay = 100,\n    className,\n    children,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n\n  const [internalCollapsed, setInternalCollapsed] =\n    React.useState(defaultCollapsed)\n  const isControlled = controlledCollapsed !== undefined\n  const collapsed = isControlled ? controlledCollapsed : internalCollapsed\n\n  // Skip floating panel transition when expanding (to avoid overlap with inline panel)\n  const [skipTransition, setSkipTransition] = React.useState(false)\n\n  const handleCollapsedChange = React.useCallback(\n    (value: boolean) => {\n      if (!value) setSkipTransition(true)\n      if (!isControlled) setInternalCollapsed(value)\n      onCollapsedChange?.(value)\n    },\n    [isControlled, onCollapsedChange]\n  )\n\n  // Hover state for floating panel\n  const [isHovered, setIsHovered] = React.useState(false)\n  const hoverTimeoutRef = React.useRef<ReturnType<typeof setTimeout>>(undefined)\n\n  const handleMouseEnter = React.useCallback(() => {\n    if (!collapsed || !expandOnHover) return\n    if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current)\n    hoverTimeoutRef.current = setTimeout(() => setIsHovered(true), hoverDelay)\n  }, [collapsed, expandOnHover, hoverDelay])\n\n  const handleMouseLeave = React.useCallback(() => {\n    if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current)\n    setIsHovered(false)\n  }, [])\n\n  // Reset hover when collapse state changes\n  React.useEffect(() => {\n    setIsHovered(false)\n    // Reset skipTransition after the render so future hover exits animate normally\n    const raf = requestAnimationFrame(() => setSkipTransition(false))\n    return () => cancelAnimationFrame(raf)\n  }, [collapsed])\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current)\n    }\n  }, [])\n\n  const contextValue = React.useMemo(\n    () => ({\n      collapsed,\n      onCollapsedChange: handleCollapsedChange,\n      width,\n      collapsedWidth,\n      isHovered,\n      expandOnHover,\n      skipTransition,\n    }),\n    [\n      collapsed,\n      handleCollapsedChange,\n      width,\n      collapsedWidth,\n      isHovered,\n      expandOnHover,\n      skipTransition,\n    ]\n  )\n\n  return (\n    <CollapsibleSidebarContext.Provider value={contextValue}>\n      <div\n        ref={ref}\n        data-slot=\"collapsible-sidebar\"\n        {...{ [SLOT_ATTR]: \"collapsible-sidebar\" }}\n        data-collapsed={collapsed ? \"\" : undefined}\n        className={mergeClasses(styles.root, className)}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        {...props}\n      >\n        {children}\n      </div>\n    </CollapsibleSidebarContext.Provider>\n  )\n})\n\n// --- CollapsibleSidebarContent ---\n\nexport type CollapsibleSidebarContentProps = React.ComponentProps<\"aside\"> & {\n  floatingClassName?: string\n}\n\nexport const CollapsibleSidebarContent = React.forwardRef<\n  HTMLElement,\n  CollapsibleSidebarContentProps\n>(function CollapsibleSidebarContent(\n  { className, floatingClassName, children, style, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const { collapsed, width, isHovered, expandOnHover, skipTransition } =\n    useCollapsibleSidebar()\n\n  const widthValue = typeof width === \"number\" ? `${width}px` : width\n\n  return (\n    <>\n      {/* Inline panel: only rendered when expanded */}\n      {!collapsed && (\n        <aside\n          ref={ref}\n          data-slot=\"collapsible-sidebar-content\"\n          {...{ [SLOT_ATTR]: \"collapsible-sidebar-content\" }}\n          className={mergeClasses(styles.content, className)}\n          style={{ width: widthValue, ...style }}\n          {...props}\n        >\n          {children}\n        </aside>\n      )}\n\n      {/* Floating panel: visible on hover when collapsed (only if expandOnHover is enabled) */}\n      {expandOnHover && (\n        <div\n          data-slot=\"collapsible-sidebar-floating\"\n          {...{ [SLOT_ATTR]: \"collapsible-sidebar-floating\" }}\n          data-visible={collapsed && isHovered ? \"\" : undefined}\n          className={mergeClasses(\n            styles.floating,\n            skipTransition && styles.transitionNone,\n            floatingClassName\n          )}\n          style={{ width: widthValue }}\n        >\n          {collapsed && isHovered && children}\n        </div>\n      )}\n    </>\n  )\n})\n\n// --- CollapsibleSidebarCondensed ---\n\nexport type CollapsibleSidebarCondensedProps = React.ComponentProps<\"div\">\n\nexport const CollapsibleSidebarCondensed = React.forwardRef<\n  HTMLDivElement,\n  CollapsibleSidebarCondensedProps\n>(function CollapsibleSidebarCondensed(\n  { className, children, style, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const { collapsed, collapsedWidth } = useCollapsibleSidebar()\n\n  if (!collapsed) return null\n\n  const collapsedWidthValue =\n    typeof collapsedWidth === \"number\" ? `${collapsedWidth}px` : collapsedWidth\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"collapsible-sidebar-condensed\"\n      {...{ [SLOT_ATTR]: \"collapsible-sidebar-condensed\" }}\n      className={mergeClasses(styles.condensed, className)}\n      style={{ width: collapsedWidthValue, ...style }}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n})\n\n// --- CollapsibleSidebarToggle ---\n\nexport type CollapsibleSidebarToggleProps = Omit<\n  React.ComponentProps<\"button\">,\n  \"onClick\" | \"children\"\n> & {\n  children?:\n    React.ReactNode | ((props: { collapsed: boolean }) => React.ReactNode)\n}\n\nexport const CollapsibleSidebarToggle = React.forwardRef<\n  HTMLButtonElement,\n  CollapsibleSidebarToggleProps\n>(function CollapsibleSidebarToggle({ className, children, ...props }, ref) {\n  const styles = useStyles()\n  const { collapsed, onCollapsedChange } = useCollapsibleSidebar()\n\n  return (\n    <button\n      ref={ref}\n      data-slot=\"collapsible-sidebar-toggle\"\n      {...{ [SLOT_ATTR]: \"collapsible-sidebar-toggle\" }}\n      data-collapsed={collapsed ? \"\" : undefined}\n      type=\"button\"\n      aria-expanded={!collapsed}\n      aria-label={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n      className={mergeClasses(styles.toggle, className)}\n      onClick={() => onCollapsedChange(!collapsed)}\n      {...props}\n    >\n      {typeof children === \"function\" ? children({ collapsed }) : children}\n    </button>\n  )\n})\n"],"names":["CollapsibleSidebarContext","React","useCollapsibleSidebar","ctx","useStyles","makeZenithStyles","boxModel","shorthands","tokens.radius2xl","tokens.body","tokens.spacingGroup2","tokens.spacingElement3","nativeControl","CollapsibleSidebar","controlledCollapsed","defaultCollapsed","onCollapsedChange","width","collapsedWidth","expandOnHover","hoverDelay","className","children","props","ref","styles","internalCollapsed","setInternalCollapsed","isControlled","collapsed","skipTransition","setSkipTransition","handleCollapsedChange","value","isHovered","setIsHovered","hoverTimeoutRef","handleMouseEnter","handleMouseLeave","raf","contextValue","jsx","SLOT_ATTR","mergeClasses","CollapsibleSidebarContent","floatingClassName","style","widthValue","jsxs","Fragment","CollapsibleSidebarCondensed","collapsedWidthValue","CollapsibleSidebarToggle"],"mappings":"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"}