@mastra/playground-ui 66.0.1-alpha.0 → 66.1.0-alpha.1

package/dist/{CodeEditor-DaJm0o69.cjs → CodeEditor-CJ9jC9lu.cjs}

@@ -6,8 +6,8 @@ const require_primitives_form_element = require("./primitives/form-element.cjs.j
 const require_Button = require("./Button-YQRflC47.cjs");
 const require_field_control_aria = require("./field-control-aria-Dw0_ObOU.cjs");
 const require_toast_api = require("./toast-api-Bv87KHu_.cjs");
-const require_highlight = require("./highlight-D0VoR2qO.cjs");
 const require_copy_button = require("./copy-button-BYEFKNpo.cjs");
+const require_highlight = require("./highlight-D0VoR2qO.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
@@ -512,4 +512,4 @@ Object.defineProperty(exports, "variableHighlight", {
 	}
 });
 
-//# sourceMappingURL=CodeEditor-DaJm0o69.cjs.map
+//# sourceMappingURL=CodeEditor-CJ9jC9lu.cjs.map

package/dist/{CodeEditor-DaJm0o69.cjs.map → CodeEditor-CJ9jC9lu.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor-DaJm0o69.cjs","names":["LanguageSupport","StreamLanguage","LanguageDescription","EditorView","foldGutter","autocompletion","Decoration","MatchDecorator","ViewPlugin","EditorView","syntaxHighlighting","syntaxHighlighter","useMemo","cva","cn","inputSurfaceAndFocusWithinStyle","fieldErrorRimWithin","Prec","forwardRef","useFieldControlAria","formatJSON","jsonLanguage","markdown","markdownLanguage","EditorState","Button","Braces","CopyButton","CodeMirror"],"sources":["../src/ds/components/CodeEditor/code-languages.ts","../src/ds/components/CodeEditor/fold-gutter-extension.ts","../src/ds/components/CodeEditor/schema-to-variables.ts","../src/ds/components/CodeEditor/variable-autocomplete-extension.ts","../src/ds/components/CodeEditor/variable-highlight-extension.ts","../src/ds/components/CodeEditor/code-editor.tsx"],"sourcesContent":["import { LanguageDescription, LanguageSupport, StreamLanguage } from '@codemirror/language';\n\nfunction legacy(parser: Parameters<typeof StreamLanguage.define>[0]) {\n  return new LanguageSupport(StreamLanguage.define(parser));\n}\n\n/**\n * A minimal subset of CodeMirror language descriptions used for fenced code\n * blocks inside markdown. Mirrors the relevant entries from\n * `@codemirror/language-data` but only the languages we actually support, so\n * bundlers don't have to emit a chunk for every known language.\n */\nexport const codeLanguages = [\n  LanguageDescription.of({\n    name: 'JavaScript',\n    alias: ['ecmascript', 'js', 'node'],\n    extensions: ['js', 'mjs', 'cjs'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSON',\n    alias: ['json5'],\n    extensions: ['json', 'map'],\n    load() {\n      return import('@codemirror/lang-json').then(m => m.json());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSX',\n    extensions: ['jsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Markdown',\n    extensions: ['md', 'markdown', 'mkd'],\n    load() {\n      return import('@codemirror/lang-markdown').then(m => m.markdown());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TSX',\n    extensions: ['tsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true, typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TypeScript',\n    alias: ['ts'],\n    extensions: ['ts', 'mts', 'cts'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Shell',\n    alias: ['bash', 'sh', 'zsh'],\n    extensions: ['sh', 'ksh', 'bash'],\n    filename: /^PKGBUILD$/,\n    load() {\n      return import('@codemirror/legacy-modes/mode/shell').then(m => legacy(m.shell));\n    },\n  }),\n];\n","import { foldGutter } from '@codemirror/language';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\n\nconst foldTheme = EditorView.theme({\n  '.cm-foldGutter .cm-gutterElement': {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: '0 4px',\n  },\n  '.cm-fold-marker': {\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '12px',\n    height: '12px',\n    boxSizing: 'border-box',\n    border: '1px solid var(--border)',\n    borderRadius: '2px',\n    color: 'var(--muted-foreground)',\n    fontSize: 'var(--text-caption)',\n    lineHeight: '1',\n    cursor: 'pointer',\n    userSelect: 'none',\n  },\n  '.cm-fold-marker:hover': {\n    background: 'var(--fill-hover)',\n    color: 'var(--foreground)',\n  },\n  '.cm-foldPlaceholder': {\n    background: 'var(--fill-hover)',\n    border: '1px solid var(--border)',\n    color: 'var(--muted-foreground)',\n    borderRadius: '2px',\n    padding: '0 4px',\n    margin: '0 2px',\n  },\n});\n\n/** Fold gutter with a square −/+ toggle next to each foldable line, styled with design tokens. */\nexport const codeFoldGutter: Extension = [\n  foldGutter({\n    markerDOM: open => {\n      const marker = document.createElement('span');\n      marker.className = 'cm-fold-marker';\n      marker.dataset.state = open ? 'open' : 'closed';\n      marker.title = open ? 'Fold' : 'Unfold';\n      marker.textContent = open ? '−' : '+';\n      return marker;\n    },\n  }),\n  foldTheme,\n];\n","import type { JsonSchema, JsonSchemaProperty } from '@/lib/json-schema';\n\n/**\n * Represents a variable completion option derived from a schema\n */\nexport interface VariableCompletion {\n  /** The dot-notation path (e.g., \"user.name\") */\n  path: string;\n  /** Display label for the autocomplete */\n  label: string;\n  /** Description from the schema, if available */\n  description?: string;\n  /** The type of the property */\n  type?: string;\n}\n\n/**\n * Flattens a JSON Schema into a list of variable completions for autocomplete.\n * Recursively extracts property paths using dot-notation.\n *\n * @param schema - The JSON Schema to flatten\n * @param maxDepth - Maximum recursion depth (default: 5)\n * @returns Array of variable completions\n *\n * @example\n * ```ts\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: {\n *       type: 'object',\n *       properties: {\n *         name: { type: 'string' },\n *         email: { type: 'string' }\n *       }\n *     }\n *   }\n * };\n *\n * flattenSchemaToVariables(schema);\n * // Returns:\n * // [\n * //   { path: 'user', label: 'user', type: 'object' },\n * //   { path: 'user.name', label: 'user.name', type: 'string' },\n * //   { path: 'user.email', label: 'user.email', type: 'string' }\n * // ]\n * ```\n */\nexport function flattenSchemaToVariables(schema: JsonSchema | undefined, maxDepth = 5): VariableCompletion[] {\n  if (!schema?.properties) {\n    return [];\n  }\n\n  const results: VariableCompletion[] = [];\n\n  function processProperty(property: JsonSchemaProperty, path: string, depth: number): void {\n    if (depth > maxDepth) {\n      return;\n    }\n\n    const type = Array.isArray(property.type) ? property.type.join(' | ') : property.type;\n\n    results.push({\n      path,\n      label: path,\n      description: property.description ?? property.title,\n      type,\n    });\n\n    // Recurse into nested object properties\n    if (property.properties) {\n      for (const [key, nestedProperty] of Object.entries(property.properties)) {\n        processProperty(nestedProperty, `${path}.${key}`, depth + 1);\n      }\n    }\n\n    // Handle array items if they have properties (array of objects)\n    if (property.items?.properties) {\n      // Add a placeholder for array item access (e.g., items[0].name)\n      for (const [key, itemProperty] of Object.entries(property.items.properties)) {\n        processProperty(itemProperty, `${path}[].${key}`, depth + 1);\n      }\n    }\n  }\n\n  for (const [key, property] of Object.entries(schema.properties)) {\n    processProperty(property, key, 1);\n  }\n\n  return results;\n}\n","import { autocompletion } from '@codemirror/autocomplete';\nimport type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';\nimport type { Extension } from '@codemirror/state';\nimport { flattenSchemaToVariables } from './schema-to-variables';\nimport type { VariableCompletion } from './schema-to-variables';\nimport type { JsonSchema } from '@/lib/json-schema';\n\n/**\n * Creates a CodeMirror autocomplete extension for {{variable}} placeholders.\n * Triggers when the user types `{{` and shows suggestions derived from the schema.\n *\n * @param schema - JSON Schema to derive variable suggestions from\n * @returns CodeMirror Extension that provides variable autocomplete\n *\n * @example\n * ```tsx\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: { type: 'object', properties: { name: { type: 'string' } } }\n *   }\n * };\n *\n * <CodeMirror extensions={[createVariableAutocomplete(schema)]} />\n * // Typing \"{{\" will show: user, user.name\n * ```\n */\nexport function createVariableAutocomplete(schema: JsonSchema | undefined): Extension {\n  const variables = flattenSchemaToVariables(schema);\n\n  return autocompletion({\n    override: [createVariableCompletionSource(variables)],\n    defaultKeymap: true,\n    closeOnBlur: true,\n    icons: false,\n  });\n}\n\n/**\n * Creates a completion source function for CodeMirror's autocompletion.\n */\nexport function createVariableCompletionSource(\n  variables: VariableCompletion[],\n): (context: CompletionContext) => CompletionResult | null {\n  return (context: CompletionContext): CompletionResult | null => {\n    // Look for {{ pattern before cursor\n    const beforeCursor = context.state.sliceDoc(Math.max(0, context.pos - 50), context.pos);\n    const match = beforeCursor.match(/\\{\\{([a-zA-Z0-9_.\\[\\]]*)?$/);\n\n    if (!match) {\n      return null;\n    }\n\n    // The text after {{ that we're matching against\n    const prefix = match[1] ?? '';\n    const startPos = context.pos - prefix.length;\n\n    // Filter variables based on what the user has typed\n    const filteredVariables = prefix\n      ? variables.filter(v => v.path.toLowerCase().startsWith(prefix.toLowerCase()))\n      : variables;\n\n    if (filteredVariables.length === 0) {\n      return null;\n    }\n\n    const completions: Completion[] = filteredVariables.map(variable => ({\n      label: variable.path,\n      displayLabel: variable.path,\n      detail: variable.type,\n      info: variable.description,\n      apply: (view, completion, from, to) => {\n        // Inside an existing placeholder, replace the rest of the identifier and reuse its closing }}\n        const rest = view.state.sliceDoc(to);\n        const identifierEnd = to + (rest.match(/^[a-zA-Z0-9_.\\[\\]]*/)?.[0].length ?? 0);\n        const hasClosingBraces = view.state.sliceDoc(identifierEnd, identifierEnd + 2) === '}}';\n        const end = hasClosingBraces ? identifierEnd : to;\n\n        const insertText = hasClosingBraces ? completion.label : `${completion.label}}}`;\n\n        view.dispatch({\n          changes: { from, to: end, insert: insertText },\n          selection: { anchor: from + insertText.length },\n        });\n      },\n    }));\n\n    return {\n      from: startPos,\n      options: completions,\n      validFor: /^[a-zA-Z0-9_.\\[\\]]*$/,\n    };\n  };\n}\n","import type { DecorationSet, EditorView, ViewUpdate } from '@codemirror/view';\nimport { Decoration, MatchDecorator, ViewPlugin } from '@codemirror/view';\n\n/**\n * Regex pattern to match variable placeholders like {{variableName}} or {{user.name}}\n * Matches: {{ followed by a valid identifier path (with optional dot notation), then }}\n */\nexport const VARIABLE_PATTERN = /\\{\\{([a-zA-Z_][a-zA-Z0-9_]*(?:\\.[a-zA-Z_][a-zA-Z0-9_]*)*)\\}\\}/g;\n\nconst variableDecoration = Decoration.mark({\n  class: 'cm-variable-highlight',\n});\n\nconst variableMatcher = new MatchDecorator({\n  regexp: VARIABLE_PATTERN,\n  decoration: () => variableDecoration,\n});\n\nconst variableHighlightPlugin = ViewPlugin.fromClass(\n  class {\n    decorations: DecorationSet;\n\n    constructor(view: EditorView) {\n      this.decorations = variableMatcher.createDeco(view);\n    }\n\n    update(update: ViewUpdate) {\n      this.decorations = variableMatcher.updateDeco(update, this.decorations);\n    }\n  },\n  {\n    decorations: v => v.decorations,\n  },\n);\n\n/**\n * CodeMirror extension that highlights {{variableName}} patterns\n * with orange color and semibold weight\n */\nexport const variableHighlight = variableHighlightPlugin;\n","import { jsonLanguage } from '@codemirror/lang-json';\nimport { markdown, markdownLanguage } from '@codemirror/lang-markdown';\nimport { syntaxHighlighting } from '@codemirror/language';\nimport { EditorState, Prec } from '@codemirror/state';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\nimport CodeMirror from '@uiw/react-codemirror';\nimport type { ReactCodeMirrorRef } from '@uiw/react-codemirror';\nimport { cva } from 'class-variance-authority';\nimport type { VariantProps } from 'class-variance-authority';\nimport { Braces } from 'lucide-react';\nimport { forwardRef, useMemo } from 'react';\nimport type { HTMLAttributes } from 'react';\nimport { codeLanguages } from './code-languages';\nimport { codeFoldGutter } from './fold-gutter-extension';\nimport { syntaxHighlighter } from './highlight';\nimport { createVariableAutocomplete } from './variable-autocomplete-extension';\nimport { variableHighlight } from './variable-highlight-extension';\nimport { Button } from '@/ds/components/Button';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { useFieldControlAria } from '@/ds/components/Field/field-control-aria';\nimport { fieldErrorRimWithin, inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { formatJSON } from '@/lib/formatting';\nimport type { JsonSchema } from '@/lib/json-schema';\nimport { toast } from '@/lib/toast';\nimport { cn } from '@/lib/utils';\n\nexport type CodeEditorLanguage = 'json' | 'markdown';\ntype CodeEditorFont = 'body' | 'mono';\n\n/**\n * The single CodeMirror theme for every editor. Chrome and syntax colors come\n * from CSS variables that flip under `.dark`, and syntax roles use the same\n * `syntaxHighlighter` as the read-only `<Code>` viewer, so editors and viewers\n * look identical in both modes.\n */\nfunction buildCodemirrorTheme(font: CodeEditorFont): Extension {\n  const editorTheme = EditorView.theme({\n    '&': {\n      backgroundColor: 'transparent',\n      color: 'var(--foreground)',\n      fontSize: 'var(--text-body-sm)',\n    },\n    '&.cm-editor .cm-scroller': {\n      fontFamily: `var(--font-${font})`,\n    },\n    '.cm-gutters': {\n      backgroundColor: 'transparent',\n      color: 'var(--placeholder)',\n      borderRight: 'none',\n    },\n    '.cm-content': {\n      color: 'var(--foreground)',\n      caretColor: 'var(--foreground)',\n    },\n    '.cm-activeLine': {\n      backgroundColor: 'transparent',\n    },\n    '.cm-lineNumbers .cm-gutterElement': {\n      color: 'var(--placeholder)',\n    },\n    '.cm-activeLineGutter': {\n      backgroundColor: 'transparent',\n      color: 'var(--muted-foreground)',\n    },\n    '.cm-cursor, .cm-dropCursor': {\n      borderLeftColor: 'var(--foreground)',\n    },\n    '&.cm-focused .cm-selectionBackground, & .cm-line::selection, & .cm-selectionLayer .cm-selectionBackground, .cm-content ::selection':\n      {\n        background: 'var(--info-edge) !important',\n      },\n    '.cm-tooltip-autocomplete': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      borderRadius: '6px',\n      boxShadow: 'var(--elevation-overlay)',\n    },\n    '.cm-tooltip-autocomplete > ul': {\n      fontFamily: 'var(--font-mono)',\n    },\n    '.cm-completionLabel': {\n      color: 'var(--foreground)',\n    },\n    '.cm-completionDetail': {\n      color: 'var(--muted-foreground)',\n      fontSize: 'var(--text-caption)',\n      marginLeft: 'auto',\n      paddingLeft: '12px',\n    },\n    '.cm-completionInfo': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      color: 'var(--muted-foreground)',\n      padding: '8px 12px',\n    },\n    '.cm-completionIcon': {\n      display: 'none',\n    },\n    'ul.cm-completionList li[aria-selected]': {\n      backgroundColor: 'var(--fill-hover)',\n      color: 'var(--foreground)',\n    },\n    '.cm-line .cm-variable-highlight': {\n      color: 'var(--warning-foreground) !important',\n      fontWeight: '500',\n    },\n  });\n\n  return [editorTheme, syntaxHighlighting(syntaxHighlighter)];\n}\n\n// eslint-disable-next-line react-refresh/only-export-components -- shared hook intentionally co-located with the editor it themes\nexport const useCodemirrorTheme = (font: CodeEditorFont = 'mono'): Extension => {\n  return useMemo(() => buildCodemirrorTheme(font), [font]);\n};\n\nconst codeEditorVariants = cva(\n  cn(\n    'relative overflow-hidden font-mono outline-hidden focus-within:outline-hidden focus:outline-hidden',\n    'transition-colors duration-normal ease-out-custom',\n  ),\n  {\n    variants: {\n      variant: {\n        default: cn(inputSurfaceAndFocusWithinStyle, 'rounded-md p-1', fieldErrorRimWithin),\n        embedded: 'rounded-none border-none bg-transparent p-0',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nconst editorFocusAttributes = Prec.highest(\n  EditorView.editorAttributes.of({\n    style: 'outline: none',\n  }),\n);\n\nconst editorFocusTheme = Prec.highest(\n  EditorView.theme({\n    '&': {\n      outline: 'none',\n    },\n    '&.cm-focused': {\n      outline: 'none',\n    },\n    '.cm-scroller': {\n      outline: 'none',\n    },\n    '.cm-content': {\n      outline: 'none',\n    },\n    '.cm-content:focus': {\n      outline: 'none',\n    },\n  }),\n);\n\nconst editorFocusExtensions: Extension[] = [editorFocusAttributes, editorFocusTheme];\n\ntype CodeEditorContentAttributes = {\n  'aria-label': string;\n  id?: string;\n  'aria-labelledby'?: string;\n  'aria-describedby'?: string;\n  'aria-invalid'?: string;\n};\n\nexport type CodeEditorProps = {\n  /** Prose editors can opt into the body face; code stays monospace by default. */\n  font?: CodeEditorFont;\n  data?: Record<string, unknown> | Array<Record<string, unknown>>;\n  value?: string;\n  onChange?: (value: string) => void;\n  showCopyButton?: boolean;\n  /** Offers a button that rewrites the JSON with Prettier. Needs `onChange`; ignored for markdown or read-only editors. */\n  showFormatButton?: boolean;\n  className?: string;\n  highlightVariables?: boolean;\n  language?: CodeEditorLanguage;\n  placeholder?: string;\n  /** JSON Schema to enable variable autocomplete for {{variable}} placeholders (markdown only) */\n  schema?: JsonSchema;\n  autoFocus?: boolean;\n  /** Show line numbers in the gutter (default: true) */\n  lineNumbers?: boolean;\n  /** Wrap long lines within the editor viewport (default: true) */\n  lineWrapping?: boolean;\n  /** When false, makes the editor read-only */\n  editable?: boolean;\n  /** Extra CodeMirror extensions, added after the built-in ones. Memoize them to avoid reconfiguring on every render. */\n  extensions?: Extension[];\n} & VariantProps<typeof codeEditorVariants> &\n  Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeEditor = forwardRef<ReactCodeMirrorRef, CodeEditorProps>(\n  (\n    {\n      data,\n      value,\n      onChange,\n      showCopyButton = true,\n      showFormatButton = false,\n      className,\n      language = 'json',\n      font = 'mono',\n      highlightVariables = false,\n      placeholder,\n      schema,\n      autoFocus,\n      lineNumbers = true,\n      lineWrapping = true,\n      editable,\n      extensions: extraExtensions,\n      variant,\n      id,\n      'aria-label': ariaLabelProp,\n      'aria-labelledby': ariaLabelledByProp,\n      'aria-describedby': ariaDescribedByProp,\n      'aria-invalid': ariaInvalidProp,\n      ...props\n    },\n    ref,\n  ) => {\n    const fieldAria = useFieldControlAria({ 'aria-label': ariaLabelProp });\n    const ariaLabel = ariaLabelProp ?? 'Code editor';\n    const controlId = id ?? fieldAria.id;\n    const ariaLabelledBy = ariaLabelledByProp ?? fieldAria['aria-labelledby'];\n    const ariaDescribedBy = ariaDescribedByProp ?? fieldAria['aria-describedby'];\n    const ariaInvalid = ariaInvalidProp ?? fieldAria['aria-invalid'];\n    const theme = useCodemirrorTheme(font);\n    const formattedCode = data ? JSON.stringify(data, null, 2) : (value ?? '');\n    const canFormat = showFormatButton && language === 'json' && editable !== false && Boolean(onChange);\n\n    const handleFormat = async () => {\n      try {\n        onChange?.((await formatJSON(formattedCode)).trimEnd());\n      } catch {\n        toast.error('Can’t format: the JSON is invalid');\n      }\n    };\n\n    const extensions = useMemo(() => {\n      const contentAttributes: CodeEditorContentAttributes = { 'aria-label': ariaLabel };\n      if (controlId) contentAttributes.id = controlId;\n      if (ariaLabelledBy) contentAttributes['aria-labelledby'] = ariaLabelledBy;\n      if (ariaDescribedBy) contentAttributes['aria-describedby'] = ariaDescribedBy;\n      if (ariaInvalid !== undefined) contentAttributes['aria-invalid'] = String(ariaInvalid);\n\n      const exts: Extension[] = [\n        ...editorFocusExtensions,\n        EditorView.contentAttributes.of(contentAttributes),\n        codeFoldGutter,\n      ];\n\n      if (lineWrapping) {\n        exts.push(EditorView.lineWrapping);\n      }\n\n      if (language === 'json') {\n        exts.push(jsonLanguage);\n      } else if (language === 'markdown') {\n        exts.push(markdown({ base: markdownLanguage, codeLanguages }));\n      }\n\n      if (highlightVariables && language === 'markdown') {\n        exts.push(variableHighlight);\n      }\n\n      if (schema && language === 'markdown') {\n        exts.push(createVariableAutocomplete(schema));\n      }\n\n      if (editable === false) {\n        exts.push(EditorState.readOnly.of(true));\n      }\n\n      if (extraExtensions) {\n        exts.push(...extraExtensions);\n      }\n\n      return exts;\n    }, [\n      extraExtensions,\n      language,\n      highlightVariables,\n      schema,\n      editable,\n      lineWrapping,\n      controlId,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      ariaInvalid,\n    ]);\n\n    return (\n      <div className={cn(codeEditorVariants({ variant }), className)} {...props}>\n        {(showCopyButton || canFormat) && (\n          <div className=\"absolute top-2 right-2 z-20 flex gap-1\">\n            {canFormat && (\n              <Button\n                type=\"button\"\n                size=\"icon-sm\"\n                tooltip=\"Format JSON\"\n                aria-label=\"Format JSON\"\n                onClick={handleFormat}\n              >\n                <Braces />\n              </Button>\n            )}\n            {showCopyButton && <CopyButton content={formattedCode} />}\n          </div>\n        )}\n        <CodeMirror\n          ref={ref}\n          value={formattedCode}\n          theme={theme}\n          extensions={extensions}\n          onChange={onChange}\n          editable={editable}\n          aria-label={ariaLabel}\n          placeholder={placeholder}\n          height=\"100%\"\n          style={{ height: '100%' }}\n          autoFocus={autoFocus}\n          basicSetup={{ lineNumbers, foldGutter: false }}\n        />\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"CodeEditor-CJ9jC9lu.cjs","names":["LanguageSupport","StreamLanguage","LanguageDescription","EditorView","foldGutter","autocompletion","Decoration","MatchDecorator","ViewPlugin","EditorView","syntaxHighlighting","syntaxHighlighter","useMemo","cva","cn","inputSurfaceAndFocusWithinStyle","fieldErrorRimWithin","Prec","forwardRef","useFieldControlAria","formatJSON","jsonLanguage","markdown","markdownLanguage","EditorState","Button","Braces","CopyButton","CodeMirror"],"sources":["../src/ds/components/CodeEditor/code-languages.ts","../src/ds/components/CodeEditor/fold-gutter-extension.ts","../src/ds/components/CodeEditor/schema-to-variables.ts","../src/ds/components/CodeEditor/variable-autocomplete-extension.ts","../src/ds/components/CodeEditor/variable-highlight-extension.ts","../src/ds/components/CodeEditor/code-editor.tsx"],"sourcesContent":["import { LanguageDescription, LanguageSupport, StreamLanguage } from '@codemirror/language';\n\nfunction legacy(parser: Parameters<typeof StreamLanguage.define>[0]) {\n  return new LanguageSupport(StreamLanguage.define(parser));\n}\n\n/**\n * A minimal subset of CodeMirror language descriptions used for fenced code\n * blocks inside markdown. Mirrors the relevant entries from\n * `@codemirror/language-data` but only the languages we actually support, so\n * bundlers don't have to emit a chunk for every known language.\n */\nexport const codeLanguages = [\n  LanguageDescription.of({\n    name: 'JavaScript',\n    alias: ['ecmascript', 'js', 'node'],\n    extensions: ['js', 'mjs', 'cjs'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSON',\n    alias: ['json5'],\n    extensions: ['json', 'map'],\n    load() {\n      return import('@codemirror/lang-json').then(m => m.json());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSX',\n    extensions: ['jsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Markdown',\n    extensions: ['md', 'markdown', 'mkd'],\n    load() {\n      return import('@codemirror/lang-markdown').then(m => m.markdown());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TSX',\n    extensions: ['tsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true, typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TypeScript',\n    alias: ['ts'],\n    extensions: ['ts', 'mts', 'cts'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Shell',\n    alias: ['bash', 'sh', 'zsh'],\n    extensions: ['sh', 'ksh', 'bash'],\n    filename: /^PKGBUILD$/,\n    load() {\n      return import('@codemirror/legacy-modes/mode/shell').then(m => legacy(m.shell));\n    },\n  }),\n];\n","import { foldGutter } from '@codemirror/language';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\n\nconst foldTheme = EditorView.theme({\n  '.cm-foldGutter .cm-gutterElement': {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: '0 4px',\n  },\n  '.cm-fold-marker': {\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '12px',\n    height: '12px',\n    boxSizing: 'border-box',\n    border: '1px solid var(--border)',\n    borderRadius: '2px',\n    color: 'var(--muted-foreground)',\n    fontSize: 'var(--text-caption)',\n    lineHeight: '1',\n    cursor: 'pointer',\n    userSelect: 'none',\n  },\n  '.cm-fold-marker:hover': {\n    background: 'var(--fill-hover)',\n    color: 'var(--foreground)',\n  },\n  '.cm-foldPlaceholder': {\n    background: 'var(--fill-hover)',\n    border: '1px solid var(--border)',\n    color: 'var(--muted-foreground)',\n    borderRadius: '2px',\n    padding: '0 4px',\n    margin: '0 2px',\n  },\n});\n\n/** Fold gutter with a square −/+ toggle next to each foldable line, styled with design tokens. */\nexport const codeFoldGutter: Extension = [\n  foldGutter({\n    markerDOM: open => {\n      const marker = document.createElement('span');\n      marker.className = 'cm-fold-marker';\n      marker.dataset.state = open ? 'open' : 'closed';\n      marker.title = open ? 'Fold' : 'Unfold';\n      marker.textContent = open ? '−' : '+';\n      return marker;\n    },\n  }),\n  foldTheme,\n];\n","import type { JsonSchema, JsonSchemaProperty } from '@/lib/json-schema';\n\n/**\n * Represents a variable completion option derived from a schema\n */\nexport interface VariableCompletion {\n  /** The dot-notation path (e.g., \"user.name\") */\n  path: string;\n  /** Display label for the autocomplete */\n  label: string;\n  /** Description from the schema, if available */\n  description?: string;\n  /** The type of the property */\n  type?: string;\n}\n\n/**\n * Flattens a JSON Schema into a list of variable completions for autocomplete.\n * Recursively extracts property paths using dot-notation.\n *\n * @param schema - The JSON Schema to flatten\n * @param maxDepth - Maximum recursion depth (default: 5)\n * @returns Array of variable completions\n *\n * @example\n * ```ts\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: {\n *       type: 'object',\n *       properties: {\n *         name: { type: 'string' },\n *         email: { type: 'string' }\n *       }\n *     }\n *   }\n * };\n *\n * flattenSchemaToVariables(schema);\n * // Returns:\n * // [\n * //   { path: 'user', label: 'user', type: 'object' },\n * //   { path: 'user.name', label: 'user.name', type: 'string' },\n * //   { path: 'user.email', label: 'user.email', type: 'string' }\n * // ]\n * ```\n */\nexport function flattenSchemaToVariables(schema: JsonSchema | undefined, maxDepth = 5): VariableCompletion[] {\n  if (!schema?.properties) {\n    return [];\n  }\n\n  const results: VariableCompletion[] = [];\n\n  function processProperty(property: JsonSchemaProperty, path: string, depth: number): void {\n    if (depth > maxDepth) {\n      return;\n    }\n\n    const type = Array.isArray(property.type) ? property.type.join(' | ') : property.type;\n\n    results.push({\n      path,\n      label: path,\n      description: property.description ?? property.title,\n      type,\n    });\n\n    // Recurse into nested object properties\n    if (property.properties) {\n      for (const [key, nestedProperty] of Object.entries(property.properties)) {\n        processProperty(nestedProperty, `${path}.${key}`, depth + 1);\n      }\n    }\n\n    // Handle array items if they have properties (array of objects)\n    if (property.items?.properties) {\n      // Add a placeholder for array item access (e.g., items[0].name)\n      for (const [key, itemProperty] of Object.entries(property.items.properties)) {\n        processProperty(itemProperty, `${path}[].${key}`, depth + 1);\n      }\n    }\n  }\n\n  for (const [key, property] of Object.entries(schema.properties)) {\n    processProperty(property, key, 1);\n  }\n\n  return results;\n}\n","import { autocompletion } from '@codemirror/autocomplete';\nimport type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';\nimport type { Extension } from '@codemirror/state';\nimport { flattenSchemaToVariables } from './schema-to-variables';\nimport type { VariableCompletion } from './schema-to-variables';\nimport type { JsonSchema } from '@/lib/json-schema';\n\n/**\n * Creates a CodeMirror autocomplete extension for {{variable}} placeholders.\n * Triggers when the user types `{{` and shows suggestions derived from the schema.\n *\n * @param schema - JSON Schema to derive variable suggestions from\n * @returns CodeMirror Extension that provides variable autocomplete\n *\n * @example\n * ```tsx\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: { type: 'object', properties: { name: { type: 'string' } } }\n *   }\n * };\n *\n * <CodeMirror extensions={[createVariableAutocomplete(schema)]} />\n * // Typing \"{{\" will show: user, user.name\n * ```\n */\nexport function createVariableAutocomplete(schema: JsonSchema | undefined): Extension {\n  const variables = flattenSchemaToVariables(schema);\n\n  return autocompletion({\n    override: [createVariableCompletionSource(variables)],\n    defaultKeymap: true,\n    closeOnBlur: true,\n    icons: false,\n  });\n}\n\n/**\n * Creates a completion source function for CodeMirror's autocompletion.\n */\nexport function createVariableCompletionSource(\n  variables: VariableCompletion[],\n): (context: CompletionContext) => CompletionResult | null {\n  return (context: CompletionContext): CompletionResult | null => {\n    // Look for {{ pattern before cursor\n    const beforeCursor = context.state.sliceDoc(Math.max(0, context.pos - 50), context.pos);\n    const match = beforeCursor.match(/\\{\\{([a-zA-Z0-9_.\\[\\]]*)?$/);\n\n    if (!match) {\n      return null;\n    }\n\n    // The text after {{ that we're matching against\n    const prefix = match[1] ?? '';\n    const startPos = context.pos - prefix.length;\n\n    // Filter variables based on what the user has typed\n    const filteredVariables = prefix\n      ? variables.filter(v => v.path.toLowerCase().startsWith(prefix.toLowerCase()))\n      : variables;\n\n    if (filteredVariables.length === 0) {\n      return null;\n    }\n\n    const completions: Completion[] = filteredVariables.map(variable => ({\n      label: variable.path,\n      displayLabel: variable.path,\n      detail: variable.type,\n      info: variable.description,\n      apply: (view, completion, from, to) => {\n        // Inside an existing placeholder, replace the rest of the identifier and reuse its closing }}\n        const rest = view.state.sliceDoc(to);\n        const identifierEnd = to + (rest.match(/^[a-zA-Z0-9_.\\[\\]]*/)?.[0].length ?? 0);\n        const hasClosingBraces = view.state.sliceDoc(identifierEnd, identifierEnd + 2) === '}}';\n        const end = hasClosingBraces ? identifierEnd : to;\n\n        const insertText = hasClosingBraces ? completion.label : `${completion.label}}}`;\n\n        view.dispatch({\n          changes: { from, to: end, insert: insertText },\n          selection: { anchor: from + insertText.length },\n        });\n      },\n    }));\n\n    return {\n      from: startPos,\n      options: completions,\n      validFor: /^[a-zA-Z0-9_.\\[\\]]*$/,\n    };\n  };\n}\n","import type { DecorationSet, EditorView, ViewUpdate } from '@codemirror/view';\nimport { Decoration, MatchDecorator, ViewPlugin } from '@codemirror/view';\n\n/**\n * Regex pattern to match variable placeholders like {{variableName}} or {{user.name}}\n * Matches: {{ followed by a valid identifier path (with optional dot notation), then }}\n */\nexport const VARIABLE_PATTERN = /\\{\\{([a-zA-Z_][a-zA-Z0-9_]*(?:\\.[a-zA-Z_][a-zA-Z0-9_]*)*)\\}\\}/g;\n\nconst variableDecoration = Decoration.mark({\n  class: 'cm-variable-highlight',\n});\n\nconst variableMatcher = new MatchDecorator({\n  regexp: VARIABLE_PATTERN,\n  decoration: () => variableDecoration,\n});\n\nconst variableHighlightPlugin = ViewPlugin.fromClass(\n  class {\n    decorations: DecorationSet;\n\n    constructor(view: EditorView) {\n      this.decorations = variableMatcher.createDeco(view);\n    }\n\n    update(update: ViewUpdate) {\n      this.decorations = variableMatcher.updateDeco(update, this.decorations);\n    }\n  },\n  {\n    decorations: v => v.decorations,\n  },\n);\n\n/**\n * CodeMirror extension that highlights {{variableName}} patterns\n * with orange color and semibold weight\n */\nexport const variableHighlight = variableHighlightPlugin;\n","import { jsonLanguage } from '@codemirror/lang-json';\nimport { markdown, markdownLanguage } from '@codemirror/lang-markdown';\nimport { syntaxHighlighting } from '@codemirror/language';\nimport { EditorState, Prec } from '@codemirror/state';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\nimport CodeMirror from '@uiw/react-codemirror';\nimport type { ReactCodeMirrorRef } from '@uiw/react-codemirror';\nimport { cva } from 'class-variance-authority';\nimport type { VariantProps } from 'class-variance-authority';\nimport { Braces } from 'lucide-react';\nimport { forwardRef, useMemo } from 'react';\nimport type { HTMLAttributes } from 'react';\nimport { codeLanguages } from './code-languages';\nimport { codeFoldGutter } from './fold-gutter-extension';\nimport { syntaxHighlighter } from './highlight';\nimport { createVariableAutocomplete } from './variable-autocomplete-extension';\nimport { variableHighlight } from './variable-highlight-extension';\nimport { Button } from '@/ds/components/Button';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { useFieldControlAria } from '@/ds/components/Field/field-control-aria';\nimport { fieldErrorRimWithin, inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { formatJSON } from '@/lib/formatting';\nimport type { JsonSchema } from '@/lib/json-schema';\nimport { toast } from '@/lib/toast';\nimport { cn } from '@/lib/utils';\n\nexport type CodeEditorLanguage = 'json' | 'markdown';\ntype CodeEditorFont = 'body' | 'mono';\n\n/**\n * The single CodeMirror theme for every editor. Chrome and syntax colors come\n * from CSS variables that flip under `.dark`, and syntax roles use the same\n * `syntaxHighlighter` as the read-only `<Code>` viewer, so editors and viewers\n * look identical in both modes.\n */\nfunction buildCodemirrorTheme(font: CodeEditorFont): Extension {\n  const editorTheme = EditorView.theme({\n    '&': {\n      backgroundColor: 'transparent',\n      color: 'var(--foreground)',\n      fontSize: 'var(--text-body-sm)',\n    },\n    '&.cm-editor .cm-scroller': {\n      fontFamily: `var(--font-${font})`,\n    },\n    '.cm-gutters': {\n      backgroundColor: 'transparent',\n      color: 'var(--placeholder)',\n      borderRight: 'none',\n    },\n    '.cm-content': {\n      color: 'var(--foreground)',\n      caretColor: 'var(--foreground)',\n    },\n    '.cm-activeLine': {\n      backgroundColor: 'transparent',\n    },\n    '.cm-lineNumbers .cm-gutterElement': {\n      color: 'var(--placeholder)',\n    },\n    '.cm-activeLineGutter': {\n      backgroundColor: 'transparent',\n      color: 'var(--muted-foreground)',\n    },\n    '.cm-cursor, .cm-dropCursor': {\n      borderLeftColor: 'var(--foreground)',\n    },\n    '&.cm-focused .cm-selectionBackground, & .cm-line::selection, & .cm-selectionLayer .cm-selectionBackground, .cm-content ::selection':\n      {\n        background: 'var(--info-edge) !important',\n      },\n    '.cm-tooltip-autocomplete': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      borderRadius: '6px',\n      boxShadow: 'var(--elevation-overlay)',\n    },\n    '.cm-tooltip-autocomplete > ul': {\n      fontFamily: 'var(--font-mono)',\n    },\n    '.cm-completionLabel': {\n      color: 'var(--foreground)',\n    },\n    '.cm-completionDetail': {\n      color: 'var(--muted-foreground)',\n      fontSize: 'var(--text-caption)',\n      marginLeft: 'auto',\n      paddingLeft: '12px',\n    },\n    '.cm-completionInfo': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      color: 'var(--muted-foreground)',\n      padding: '8px 12px',\n    },\n    '.cm-completionIcon': {\n      display: 'none',\n    },\n    'ul.cm-completionList li[aria-selected]': {\n      backgroundColor: 'var(--fill-hover)',\n      color: 'var(--foreground)',\n    },\n    '.cm-line .cm-variable-highlight': {\n      color: 'var(--warning-foreground) !important',\n      fontWeight: '500',\n    },\n  });\n\n  return [editorTheme, syntaxHighlighting(syntaxHighlighter)];\n}\n\n// eslint-disable-next-line react-refresh/only-export-components -- shared hook intentionally co-located with the editor it themes\nexport const useCodemirrorTheme = (font: CodeEditorFont = 'mono'): Extension => {\n  return useMemo(() => buildCodemirrorTheme(font), [font]);\n};\n\nconst codeEditorVariants = cva(\n  cn(\n    'relative overflow-hidden font-mono outline-hidden focus-within:outline-hidden focus:outline-hidden',\n    'transition-colors duration-normal ease-out-custom',\n  ),\n  {\n    variants: {\n      variant: {\n        default: cn(inputSurfaceAndFocusWithinStyle, 'rounded-md p-1', fieldErrorRimWithin),\n        embedded: 'rounded-none border-none bg-transparent p-0',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nconst editorFocusAttributes = Prec.highest(\n  EditorView.editorAttributes.of({\n    style: 'outline: none',\n  }),\n);\n\nconst editorFocusTheme = Prec.highest(\n  EditorView.theme({\n    '&': {\n      outline: 'none',\n    },\n    '&.cm-focused': {\n      outline: 'none',\n    },\n    '.cm-scroller': {\n      outline: 'none',\n    },\n    '.cm-content': {\n      outline: 'none',\n    },\n    '.cm-content:focus': {\n      outline: 'none',\n    },\n  }),\n);\n\nconst editorFocusExtensions: Extension[] = [editorFocusAttributes, editorFocusTheme];\n\ntype CodeEditorContentAttributes = {\n  'aria-label': string;\n  id?: string;\n  'aria-labelledby'?: string;\n  'aria-describedby'?: string;\n  'aria-invalid'?: string;\n};\n\nexport type CodeEditorProps = {\n  /** Prose editors can opt into the body face; code stays monospace by default. */\n  font?: CodeEditorFont;\n  data?: Record<string, unknown> | Array<Record<string, unknown>>;\n  value?: string;\n  onChange?: (value: string) => void;\n  showCopyButton?: boolean;\n  /** Offers a button that rewrites the JSON with Prettier. Needs `onChange`; ignored for markdown or read-only editors. */\n  showFormatButton?: boolean;\n  className?: string;\n  highlightVariables?: boolean;\n  language?: CodeEditorLanguage;\n  placeholder?: string;\n  /** JSON Schema to enable variable autocomplete for {{variable}} placeholders (markdown only) */\n  schema?: JsonSchema;\n  autoFocus?: boolean;\n  /** Show line numbers in the gutter (default: true) */\n  lineNumbers?: boolean;\n  /** Wrap long lines within the editor viewport (default: true) */\n  lineWrapping?: boolean;\n  /** When false, makes the editor read-only */\n  editable?: boolean;\n  /** Extra CodeMirror extensions, added after the built-in ones. Memoize them to avoid reconfiguring on every render. */\n  extensions?: Extension[];\n} & VariantProps<typeof codeEditorVariants> &\n  Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeEditor = forwardRef<ReactCodeMirrorRef, CodeEditorProps>(\n  (\n    {\n      data,\n      value,\n      onChange,\n      showCopyButton = true,\n      showFormatButton = false,\n      className,\n      language = 'json',\n      font = 'mono',\n      highlightVariables = false,\n      placeholder,\n      schema,\n      autoFocus,\n      lineNumbers = true,\n      lineWrapping = true,\n      editable,\n      extensions: extraExtensions,\n      variant,\n      id,\n      'aria-label': ariaLabelProp,\n      'aria-labelledby': ariaLabelledByProp,\n      'aria-describedby': ariaDescribedByProp,\n      'aria-invalid': ariaInvalidProp,\n      ...props\n    },\n    ref,\n  ) => {\n    const fieldAria = useFieldControlAria({ 'aria-label': ariaLabelProp });\n    const ariaLabel = ariaLabelProp ?? 'Code editor';\n    const controlId = id ?? fieldAria.id;\n    const ariaLabelledBy = ariaLabelledByProp ?? fieldAria['aria-labelledby'];\n    const ariaDescribedBy = ariaDescribedByProp ?? fieldAria['aria-describedby'];\n    const ariaInvalid = ariaInvalidProp ?? fieldAria['aria-invalid'];\n    const theme = useCodemirrorTheme(font);\n    const formattedCode = data ? JSON.stringify(data, null, 2) : (value ?? '');\n    const canFormat = showFormatButton && language === 'json' && editable !== false && Boolean(onChange);\n\n    const handleFormat = async () => {\n      try {\n        onChange?.((await formatJSON(formattedCode)).trimEnd());\n      } catch {\n        toast.error('Can’t format: the JSON is invalid');\n      }\n    };\n\n    const extensions = useMemo(() => {\n      const contentAttributes: CodeEditorContentAttributes = { 'aria-label': ariaLabel };\n      if (controlId) contentAttributes.id = controlId;\n      if (ariaLabelledBy) contentAttributes['aria-labelledby'] = ariaLabelledBy;\n      if (ariaDescribedBy) contentAttributes['aria-describedby'] = ariaDescribedBy;\n      if (ariaInvalid !== undefined) contentAttributes['aria-invalid'] = String(ariaInvalid);\n\n      const exts: Extension[] = [\n        ...editorFocusExtensions,\n        EditorView.contentAttributes.of(contentAttributes),\n        codeFoldGutter,\n      ];\n\n      if (lineWrapping) {\n        exts.push(EditorView.lineWrapping);\n      }\n\n      if (language === 'json') {\n        exts.push(jsonLanguage);\n      } else if (language === 'markdown') {\n        exts.push(markdown({ base: markdownLanguage, codeLanguages }));\n      }\n\n      if (highlightVariables && language === 'markdown') {\n        exts.push(variableHighlight);\n      }\n\n      if (schema && language === 'markdown') {\n        exts.push(createVariableAutocomplete(schema));\n      }\n\n      if (editable === false) {\n        exts.push(EditorState.readOnly.of(true));\n      }\n\n      if (extraExtensions) {\n        exts.push(...extraExtensions);\n      }\n\n      return exts;\n    }, [\n      extraExtensions,\n      language,\n      highlightVariables,\n      schema,\n      editable,\n      lineWrapping,\n      controlId,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      ariaInvalid,\n    ]);\n\n    return (\n      <div className={cn(codeEditorVariants({ variant }), className)} {...props}>\n        {(showCopyButton || canFormat) && (\n          <div className=\"absolute top-2 right-2 z-20 flex gap-1\">\n            {canFormat && (\n              <Button\n                type=\"button\"\n                size=\"icon-sm\"\n                tooltip=\"Format JSON\"\n                aria-label=\"Format JSON\"\n                onClick={handleFormat}\n              >\n                <Braces />\n              </Button>\n            )}\n            {showCopyButton && <CopyButton content={formattedCode} />}\n          </div>\n        )}\n        <CodeMirror\n          ref={ref}\n          value={formattedCode}\n          theme={theme}\n          extensions={extensions}\n          onChange={onChange}\n          editable={editable}\n          aria-label={ariaLabel}\n          placeholder={placeholder}\n          height=\"100%\"\n          style={{ height: '100%' }}\n          autoFocus={autoFocus}\n          basicSetup={{ lineNumbers, foldGutter: false }}\n        />\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/{CodeEditor-CZC9DMKA.js → CodeEditor-CPVxj7WS.js}

@@ -5,8 +5,8 @@ import { fieldErrorRimWithin, inputSurfaceAndFocusWithinStyle } from "./primitiv
 import { t as Button } from "./Button-Bw1e3ONi.js";
 import { i as useFieldControlAria } from "./field-control-aria-BaRSUUMR.js";
 import { t as toast } from "./toast-api-WhxnAT9F.js";
-import { r as syntaxHighlighter } from "./highlight-DF-vd68d.js";
 import { t as CopyButton } from "./copy-button-CF-X4iDj.js";
+import { r as syntaxHighlighter } from "./highlight-DF-vd68d.js";
 import { forwardRef, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Braces } from "lucide-react";
@@ -463,4 +463,4 @@ var CodeEditor = forwardRef(({ data, value, onChange, showCopyButton = true, sho
 });
 export { createVariableAutocomplete as a, codeLanguages as c, variableHighlight as i, useCodemirrorTheme as n, flattenSchemaToVariables as o, VARIABLE_PATTERN as r, codeFoldGutter as s, CodeEditor as t };
 
-//# sourceMappingURL=CodeEditor-CZC9DMKA.js.map
+//# sourceMappingURL=CodeEditor-CPVxj7WS.js.map

package/dist/{CodeEditor-CZC9DMKA.js.map → CodeEditor-CPVxj7WS.js.map}

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor-CZC9DMKA.js","names":[],"sources":["../src/ds/components/CodeEditor/code-languages.ts","../src/ds/components/CodeEditor/fold-gutter-extension.ts","../src/ds/components/CodeEditor/schema-to-variables.ts","../src/ds/components/CodeEditor/variable-autocomplete-extension.ts","../src/ds/components/CodeEditor/variable-highlight-extension.ts","../src/ds/components/CodeEditor/code-editor.tsx"],"sourcesContent":["import { LanguageDescription, LanguageSupport, StreamLanguage } from '@codemirror/language';\n\nfunction legacy(parser: Parameters<typeof StreamLanguage.define>[0]) {\n  return new LanguageSupport(StreamLanguage.define(parser));\n}\n\n/**\n * A minimal subset of CodeMirror language descriptions used for fenced code\n * blocks inside markdown. Mirrors the relevant entries from\n * `@codemirror/language-data` but only the languages we actually support, so\n * bundlers don't have to emit a chunk for every known language.\n */\nexport const codeLanguages = [\n  LanguageDescription.of({\n    name: 'JavaScript',\n    alias: ['ecmascript', 'js', 'node'],\n    extensions: ['js', 'mjs', 'cjs'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSON',\n    alias: ['json5'],\n    extensions: ['json', 'map'],\n    load() {\n      return import('@codemirror/lang-json').then(m => m.json());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSX',\n    extensions: ['jsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Markdown',\n    extensions: ['md', 'markdown', 'mkd'],\n    load() {\n      return import('@codemirror/lang-markdown').then(m => m.markdown());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TSX',\n    extensions: ['tsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true, typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TypeScript',\n    alias: ['ts'],\n    extensions: ['ts', 'mts', 'cts'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Shell',\n    alias: ['bash', 'sh', 'zsh'],\n    extensions: ['sh', 'ksh', 'bash'],\n    filename: /^PKGBUILD$/,\n    load() {\n      return import('@codemirror/legacy-modes/mode/shell').then(m => legacy(m.shell));\n    },\n  }),\n];\n","import { foldGutter } from '@codemirror/language';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\n\nconst foldTheme = EditorView.theme({\n  '.cm-foldGutter .cm-gutterElement': {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: '0 4px',\n  },\n  '.cm-fold-marker': {\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '12px',\n    height: '12px',\n    boxSizing: 'border-box',\n    border: '1px solid var(--border)',\n    borderRadius: '2px',\n    color: 'var(--muted-foreground)',\n    fontSize: 'var(--text-caption)',\n    lineHeight: '1',\n    cursor: 'pointer',\n    userSelect: 'none',\n  },\n  '.cm-fold-marker:hover': {\n    background: 'var(--fill-hover)',\n    color: 'var(--foreground)',\n  },\n  '.cm-foldPlaceholder': {\n    background: 'var(--fill-hover)',\n    border: '1px solid var(--border)',\n    color: 'var(--muted-foreground)',\n    borderRadius: '2px',\n    padding: '0 4px',\n    margin: '0 2px',\n  },\n});\n\n/** Fold gutter with a square −/+ toggle next to each foldable line, styled with design tokens. */\nexport const codeFoldGutter: Extension = [\n  foldGutter({\n    markerDOM: open => {\n      const marker = document.createElement('span');\n      marker.className = 'cm-fold-marker';\n      marker.dataset.state = open ? 'open' : 'closed';\n      marker.title = open ? 'Fold' : 'Unfold';\n      marker.textContent = open ? '−' : '+';\n      return marker;\n    },\n  }),\n  foldTheme,\n];\n","import type { JsonSchema, JsonSchemaProperty } from '@/lib/json-schema';\n\n/**\n * Represents a variable completion option derived from a schema\n */\nexport interface VariableCompletion {\n  /** The dot-notation path (e.g., \"user.name\") */\n  path: string;\n  /** Display label for the autocomplete */\n  label: string;\n  /** Description from the schema, if available */\n  description?: string;\n  /** The type of the property */\n  type?: string;\n}\n\n/**\n * Flattens a JSON Schema into a list of variable completions for autocomplete.\n * Recursively extracts property paths using dot-notation.\n *\n * @param schema - The JSON Schema to flatten\n * @param maxDepth - Maximum recursion depth (default: 5)\n * @returns Array of variable completions\n *\n * @example\n * ```ts\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: {\n *       type: 'object',\n *       properties: {\n *         name: { type: 'string' },\n *         email: { type: 'string' }\n *       }\n *     }\n *   }\n * };\n *\n * flattenSchemaToVariables(schema);\n * // Returns:\n * // [\n * //   { path: 'user', label: 'user', type: 'object' },\n * //   { path: 'user.name', label: 'user.name', type: 'string' },\n * //   { path: 'user.email', label: 'user.email', type: 'string' }\n * // ]\n * ```\n */\nexport function flattenSchemaToVariables(schema: JsonSchema | undefined, maxDepth = 5): VariableCompletion[] {\n  if (!schema?.properties) {\n    return [];\n  }\n\n  const results: VariableCompletion[] = [];\n\n  function processProperty(property: JsonSchemaProperty, path: string, depth: number): void {\n    if (depth > maxDepth) {\n      return;\n    }\n\n    const type = Array.isArray(property.type) ? property.type.join(' | ') : property.type;\n\n    results.push({\n      path,\n      label: path,\n      description: property.description ?? property.title,\n      type,\n    });\n\n    // Recurse into nested object properties\n    if (property.properties) {\n      for (const [key, nestedProperty] of Object.entries(property.properties)) {\n        processProperty(nestedProperty, `${path}.${key}`, depth + 1);\n      }\n    }\n\n    // Handle array items if they have properties (array of objects)\n    if (property.items?.properties) {\n      // Add a placeholder for array item access (e.g., items[0].name)\n      for (const [key, itemProperty] of Object.entries(property.items.properties)) {\n        processProperty(itemProperty, `${path}[].${key}`, depth + 1);\n      }\n    }\n  }\n\n  for (const [key, property] of Object.entries(schema.properties)) {\n    processProperty(property, key, 1);\n  }\n\n  return results;\n}\n","import { autocompletion } from '@codemirror/autocomplete';\nimport type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';\nimport type { Extension } from '@codemirror/state';\nimport { flattenSchemaToVariables } from './schema-to-variables';\nimport type { VariableCompletion } from './schema-to-variables';\nimport type { JsonSchema } from '@/lib/json-schema';\n\n/**\n * Creates a CodeMirror autocomplete extension for {{variable}} placeholders.\n * Triggers when the user types `{{` and shows suggestions derived from the schema.\n *\n * @param schema - JSON Schema to derive variable suggestions from\n * @returns CodeMirror Extension that provides variable autocomplete\n *\n * @example\n * ```tsx\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: { type: 'object', properties: { name: { type: 'string' } } }\n *   }\n * };\n *\n * <CodeMirror extensions={[createVariableAutocomplete(schema)]} />\n * // Typing \"{{\" will show: user, user.name\n * ```\n */\nexport function createVariableAutocomplete(schema: JsonSchema | undefined): Extension {\n  const variables = flattenSchemaToVariables(schema);\n\n  return autocompletion({\n    override: [createVariableCompletionSource(variables)],\n    defaultKeymap: true,\n    closeOnBlur: true,\n    icons: false,\n  });\n}\n\n/**\n * Creates a completion source function for CodeMirror's autocompletion.\n */\nexport function createVariableCompletionSource(\n  variables: VariableCompletion[],\n): (context: CompletionContext) => CompletionResult | null {\n  return (context: CompletionContext): CompletionResult | null => {\n    // Look for {{ pattern before cursor\n    const beforeCursor = context.state.sliceDoc(Math.max(0, context.pos - 50), context.pos);\n    const match = beforeCursor.match(/\\{\\{([a-zA-Z0-9_.\\[\\]]*)?$/);\n\n    if (!match) {\n      return null;\n    }\n\n    // The text after {{ that we're matching against\n    const prefix = match[1] ?? '';\n    const startPos = context.pos - prefix.length;\n\n    // Filter variables based on what the user has typed\n    const filteredVariables = prefix\n      ? variables.filter(v => v.path.toLowerCase().startsWith(prefix.toLowerCase()))\n      : variables;\n\n    if (filteredVariables.length === 0) {\n      return null;\n    }\n\n    const completions: Completion[] = filteredVariables.map(variable => ({\n      label: variable.path,\n      displayLabel: variable.path,\n      detail: variable.type,\n      info: variable.description,\n      apply: (view, completion, from, to) => {\n        // Inside an existing placeholder, replace the rest of the identifier and reuse its closing }}\n        const rest = view.state.sliceDoc(to);\n        const identifierEnd = to + (rest.match(/^[a-zA-Z0-9_.\\[\\]]*/)?.[0].length ?? 0);\n        const hasClosingBraces = view.state.sliceDoc(identifierEnd, identifierEnd + 2) === '}}';\n        const end = hasClosingBraces ? identifierEnd : to;\n\n        const insertText = hasClosingBraces ? completion.label : `${completion.label}}}`;\n\n        view.dispatch({\n          changes: { from, to: end, insert: insertText },\n          selection: { anchor: from + insertText.length },\n        });\n      },\n    }));\n\n    return {\n      from: startPos,\n      options: completions,\n      validFor: /^[a-zA-Z0-9_.\\[\\]]*$/,\n    };\n  };\n}\n","import type { DecorationSet, EditorView, ViewUpdate } from '@codemirror/view';\nimport { Decoration, MatchDecorator, ViewPlugin } from '@codemirror/view';\n\n/**\n * Regex pattern to match variable placeholders like {{variableName}} or {{user.name}}\n * Matches: {{ followed by a valid identifier path (with optional dot notation), then }}\n */\nexport const VARIABLE_PATTERN = /\\{\\{([a-zA-Z_][a-zA-Z0-9_]*(?:\\.[a-zA-Z_][a-zA-Z0-9_]*)*)\\}\\}/g;\n\nconst variableDecoration = Decoration.mark({\n  class: 'cm-variable-highlight',\n});\n\nconst variableMatcher = new MatchDecorator({\n  regexp: VARIABLE_PATTERN,\n  decoration: () => variableDecoration,\n});\n\nconst variableHighlightPlugin = ViewPlugin.fromClass(\n  class {\n    decorations: DecorationSet;\n\n    constructor(view: EditorView) {\n      this.decorations = variableMatcher.createDeco(view);\n    }\n\n    update(update: ViewUpdate) {\n      this.decorations = variableMatcher.updateDeco(update, this.decorations);\n    }\n  },\n  {\n    decorations: v => v.decorations,\n  },\n);\n\n/**\n * CodeMirror extension that highlights {{variableName}} patterns\n * with orange color and semibold weight\n */\nexport const variableHighlight = variableHighlightPlugin;\n","import { jsonLanguage } from '@codemirror/lang-json';\nimport { markdown, markdownLanguage } from '@codemirror/lang-markdown';\nimport { syntaxHighlighting } from '@codemirror/language';\nimport { EditorState, Prec } from '@codemirror/state';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\nimport CodeMirror from '@uiw/react-codemirror';\nimport type { ReactCodeMirrorRef } from '@uiw/react-codemirror';\nimport { cva } from 'class-variance-authority';\nimport type { VariantProps } from 'class-variance-authority';\nimport { Braces } from 'lucide-react';\nimport { forwardRef, useMemo } from 'react';\nimport type { HTMLAttributes } from 'react';\nimport { codeLanguages } from './code-languages';\nimport { codeFoldGutter } from './fold-gutter-extension';\nimport { syntaxHighlighter } from './highlight';\nimport { createVariableAutocomplete } from './variable-autocomplete-extension';\nimport { variableHighlight } from './variable-highlight-extension';\nimport { Button } from '@/ds/components/Button';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { useFieldControlAria } from '@/ds/components/Field/field-control-aria';\nimport { fieldErrorRimWithin, inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { formatJSON } from '@/lib/formatting';\nimport type { JsonSchema } from '@/lib/json-schema';\nimport { toast } from '@/lib/toast';\nimport { cn } from '@/lib/utils';\n\nexport type CodeEditorLanguage = 'json' | 'markdown';\ntype CodeEditorFont = 'body' | 'mono';\n\n/**\n * The single CodeMirror theme for every editor. Chrome and syntax colors come\n * from CSS variables that flip under `.dark`, and syntax roles use the same\n * `syntaxHighlighter` as the read-only `<Code>` viewer, so editors and viewers\n * look identical in both modes.\n */\nfunction buildCodemirrorTheme(font: CodeEditorFont): Extension {\n  const editorTheme = EditorView.theme({\n    '&': {\n      backgroundColor: 'transparent',\n      color: 'var(--foreground)',\n      fontSize: 'var(--text-body-sm)',\n    },\n    '&.cm-editor .cm-scroller': {\n      fontFamily: `var(--font-${font})`,\n    },\n    '.cm-gutters': {\n      backgroundColor: 'transparent',\n      color: 'var(--placeholder)',\n      borderRight: 'none',\n    },\n    '.cm-content': {\n      color: 'var(--foreground)',\n      caretColor: 'var(--foreground)',\n    },\n    '.cm-activeLine': {\n      backgroundColor: 'transparent',\n    },\n    '.cm-lineNumbers .cm-gutterElement': {\n      color: 'var(--placeholder)',\n    },\n    '.cm-activeLineGutter': {\n      backgroundColor: 'transparent',\n      color: 'var(--muted-foreground)',\n    },\n    '.cm-cursor, .cm-dropCursor': {\n      borderLeftColor: 'var(--foreground)',\n    },\n    '&.cm-focused .cm-selectionBackground, & .cm-line::selection, & .cm-selectionLayer .cm-selectionBackground, .cm-content ::selection':\n      {\n        background: 'var(--info-edge) !important',\n      },\n    '.cm-tooltip-autocomplete': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      borderRadius: '6px',\n      boxShadow: 'var(--elevation-overlay)',\n    },\n    '.cm-tooltip-autocomplete > ul': {\n      fontFamily: 'var(--font-mono)',\n    },\n    '.cm-completionLabel': {\n      color: 'var(--foreground)',\n    },\n    '.cm-completionDetail': {\n      color: 'var(--muted-foreground)',\n      fontSize: 'var(--text-caption)',\n      marginLeft: 'auto',\n      paddingLeft: '12px',\n    },\n    '.cm-completionInfo': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      color: 'var(--muted-foreground)',\n      padding: '8px 12px',\n    },\n    '.cm-completionIcon': {\n      display: 'none',\n    },\n    'ul.cm-completionList li[aria-selected]': {\n      backgroundColor: 'var(--fill-hover)',\n      color: 'var(--foreground)',\n    },\n    '.cm-line .cm-variable-highlight': {\n      color: 'var(--warning-foreground) !important',\n      fontWeight: '500',\n    },\n  });\n\n  return [editorTheme, syntaxHighlighting(syntaxHighlighter)];\n}\n\n// eslint-disable-next-line react-refresh/only-export-components -- shared hook intentionally co-located with the editor it themes\nexport const useCodemirrorTheme = (font: CodeEditorFont = 'mono'): Extension => {\n  return useMemo(() => buildCodemirrorTheme(font), [font]);\n};\n\nconst codeEditorVariants = cva(\n  cn(\n    'relative overflow-hidden font-mono outline-hidden focus-within:outline-hidden focus:outline-hidden',\n    'transition-colors duration-normal ease-out-custom',\n  ),\n  {\n    variants: {\n      variant: {\n        default: cn(inputSurfaceAndFocusWithinStyle, 'rounded-md p-1', fieldErrorRimWithin),\n        embedded: 'rounded-none border-none bg-transparent p-0',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nconst editorFocusAttributes = Prec.highest(\n  EditorView.editorAttributes.of({\n    style: 'outline: none',\n  }),\n);\n\nconst editorFocusTheme = Prec.highest(\n  EditorView.theme({\n    '&': {\n      outline: 'none',\n    },\n    '&.cm-focused': {\n      outline: 'none',\n    },\n    '.cm-scroller': {\n      outline: 'none',\n    },\n    '.cm-content': {\n      outline: 'none',\n    },\n    '.cm-content:focus': {\n      outline: 'none',\n    },\n  }),\n);\n\nconst editorFocusExtensions: Extension[] = [editorFocusAttributes, editorFocusTheme];\n\ntype CodeEditorContentAttributes = {\n  'aria-label': string;\n  id?: string;\n  'aria-labelledby'?: string;\n  'aria-describedby'?: string;\n  'aria-invalid'?: string;\n};\n\nexport type CodeEditorProps = {\n  /** Prose editors can opt into the body face; code stays monospace by default. */\n  font?: CodeEditorFont;\n  data?: Record<string, unknown> | Array<Record<string, unknown>>;\n  value?: string;\n  onChange?: (value: string) => void;\n  showCopyButton?: boolean;\n  /** Offers a button that rewrites the JSON with Prettier. Needs `onChange`; ignored for markdown or read-only editors. */\n  showFormatButton?: boolean;\n  className?: string;\n  highlightVariables?: boolean;\n  language?: CodeEditorLanguage;\n  placeholder?: string;\n  /** JSON Schema to enable variable autocomplete for {{variable}} placeholders (markdown only) */\n  schema?: JsonSchema;\n  autoFocus?: boolean;\n  /** Show line numbers in the gutter (default: true) */\n  lineNumbers?: boolean;\n  /** Wrap long lines within the editor viewport (default: true) */\n  lineWrapping?: boolean;\n  /** When false, makes the editor read-only */\n  editable?: boolean;\n  /** Extra CodeMirror extensions, added after the built-in ones. Memoize them to avoid reconfiguring on every render. */\n  extensions?: Extension[];\n} & VariantProps<typeof codeEditorVariants> &\n  Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeEditor = forwardRef<ReactCodeMirrorRef, CodeEditorProps>(\n  (\n    {\n      data,\n      value,\n      onChange,\n      showCopyButton = true,\n      showFormatButton = false,\n      className,\n      language = 'json',\n      font = 'mono',\n      highlightVariables = false,\n      placeholder,\n      schema,\n      autoFocus,\n      lineNumbers = true,\n      lineWrapping = true,\n      editable,\n      extensions: extraExtensions,\n      variant,\n      id,\n      'aria-label': ariaLabelProp,\n      'aria-labelledby': ariaLabelledByProp,\n      'aria-describedby': ariaDescribedByProp,\n      'aria-invalid': ariaInvalidProp,\n      ...props\n    },\n    ref,\n  ) => {\n    const fieldAria = useFieldControlAria({ 'aria-label': ariaLabelProp });\n    const ariaLabel = ariaLabelProp ?? 'Code editor';\n    const controlId = id ?? fieldAria.id;\n    const ariaLabelledBy = ariaLabelledByProp ?? fieldAria['aria-labelledby'];\n    const ariaDescribedBy = ariaDescribedByProp ?? fieldAria['aria-describedby'];\n    const ariaInvalid = ariaInvalidProp ?? fieldAria['aria-invalid'];\n    const theme = useCodemirrorTheme(font);\n    const formattedCode = data ? JSON.stringify(data, null, 2) : (value ?? '');\n    const canFormat = showFormatButton && language === 'json' && editable !== false && Boolean(onChange);\n\n    const handleFormat = async () => {\n      try {\n        onChange?.((await formatJSON(formattedCode)).trimEnd());\n      } catch {\n        toast.error('Can’t format: the JSON is invalid');\n      }\n    };\n\n    const extensions = useMemo(() => {\n      const contentAttributes: CodeEditorContentAttributes = { 'aria-label': ariaLabel };\n      if (controlId) contentAttributes.id = controlId;\n      if (ariaLabelledBy) contentAttributes['aria-labelledby'] = ariaLabelledBy;\n      if (ariaDescribedBy) contentAttributes['aria-describedby'] = ariaDescribedBy;\n      if (ariaInvalid !== undefined) contentAttributes['aria-invalid'] = String(ariaInvalid);\n\n      const exts: Extension[] = [\n        ...editorFocusExtensions,\n        EditorView.contentAttributes.of(contentAttributes),\n        codeFoldGutter,\n      ];\n\n      if (lineWrapping) {\n        exts.push(EditorView.lineWrapping);\n      }\n\n      if (language === 'json') {\n        exts.push(jsonLanguage);\n      } else if (language === 'markdown') {\n        exts.push(markdown({ base: markdownLanguage, codeLanguages }));\n      }\n\n      if (highlightVariables && language === 'markdown') {\n        exts.push(variableHighlight);\n      }\n\n      if (schema && language === 'markdown') {\n        exts.push(createVariableAutocomplete(schema));\n      }\n\n      if (editable === false) {\n        exts.push(EditorState.readOnly.of(true));\n      }\n\n      if (extraExtensions) {\n        exts.push(...extraExtensions);\n      }\n\n      return exts;\n    }, [\n      extraExtensions,\n      language,\n      highlightVariables,\n      schema,\n      editable,\n      lineWrapping,\n      controlId,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      ariaInvalid,\n    ]);\n\n    return (\n      <div className={cn(codeEditorVariants({ variant }), className)} {...props}>\n        {(showCopyButton || canFormat) && (\n          <div className=\"absolute top-2 right-2 z-20 flex gap-1\">\n            {canFormat && (\n              <Button\n                type=\"button\"\n                size=\"icon-sm\"\n                tooltip=\"Format JSON\"\n                aria-label=\"Format JSON\"\n                onClick={handleFormat}\n              >\n                <Braces />\n              </Button>\n            )}\n            {showCopyButton && <CopyButton content={formattedCode} />}\n          </div>\n        )}\n        <CodeMirror\n          ref={ref}\n          value={formattedCode}\n          theme={theme}\n          extensions={extensions}\n          onChange={onChange}\n          editable={editable}\n          aria-label={ariaLabel}\n          placeholder={placeholder}\n          height=\"100%\"\n          style={{ height: '100%' }}\n          autoFocus={autoFocus}\n          basicSetup={{ lineNumbers, foldGutter: false }}\n        />\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"CodeEditor-CPVxj7WS.js","names":[],"sources":["../src/ds/components/CodeEditor/code-languages.ts","../src/ds/components/CodeEditor/fold-gutter-extension.ts","../src/ds/components/CodeEditor/schema-to-variables.ts","../src/ds/components/CodeEditor/variable-autocomplete-extension.ts","../src/ds/components/CodeEditor/variable-highlight-extension.ts","../src/ds/components/CodeEditor/code-editor.tsx"],"sourcesContent":["import { LanguageDescription, LanguageSupport, StreamLanguage } from '@codemirror/language';\n\nfunction legacy(parser: Parameters<typeof StreamLanguage.define>[0]) {\n  return new LanguageSupport(StreamLanguage.define(parser));\n}\n\n/**\n * A minimal subset of CodeMirror language descriptions used for fenced code\n * blocks inside markdown. Mirrors the relevant entries from\n * `@codemirror/language-data` but only the languages we actually support, so\n * bundlers don't have to emit a chunk for every known language.\n */\nexport const codeLanguages = [\n  LanguageDescription.of({\n    name: 'JavaScript',\n    alias: ['ecmascript', 'js', 'node'],\n    extensions: ['js', 'mjs', 'cjs'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSON',\n    alias: ['json5'],\n    extensions: ['json', 'map'],\n    load() {\n      return import('@codemirror/lang-json').then(m => m.json());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'JSX',\n    extensions: ['jsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Markdown',\n    extensions: ['md', 'markdown', 'mkd'],\n    load() {\n      return import('@codemirror/lang-markdown').then(m => m.markdown());\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TSX',\n    extensions: ['tsx'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ jsx: true, typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'TypeScript',\n    alias: ['ts'],\n    extensions: ['ts', 'mts', 'cts'],\n    load() {\n      return import('@codemirror/lang-javascript').then(m => m.javascript({ typescript: true }));\n    },\n  }),\n  LanguageDescription.of({\n    name: 'Shell',\n    alias: ['bash', 'sh', 'zsh'],\n    extensions: ['sh', 'ksh', 'bash'],\n    filename: /^PKGBUILD$/,\n    load() {\n      return import('@codemirror/legacy-modes/mode/shell').then(m => legacy(m.shell));\n    },\n  }),\n];\n","import { foldGutter } from '@codemirror/language';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\n\nconst foldTheme = EditorView.theme({\n  '.cm-foldGutter .cm-gutterElement': {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    padding: '0 4px',\n  },\n  '.cm-fold-marker': {\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: '12px',\n    height: '12px',\n    boxSizing: 'border-box',\n    border: '1px solid var(--border)',\n    borderRadius: '2px',\n    color: 'var(--muted-foreground)',\n    fontSize: 'var(--text-caption)',\n    lineHeight: '1',\n    cursor: 'pointer',\n    userSelect: 'none',\n  },\n  '.cm-fold-marker:hover': {\n    background: 'var(--fill-hover)',\n    color: 'var(--foreground)',\n  },\n  '.cm-foldPlaceholder': {\n    background: 'var(--fill-hover)',\n    border: '1px solid var(--border)',\n    color: 'var(--muted-foreground)',\n    borderRadius: '2px',\n    padding: '0 4px',\n    margin: '0 2px',\n  },\n});\n\n/** Fold gutter with a square −/+ toggle next to each foldable line, styled with design tokens. */\nexport const codeFoldGutter: Extension = [\n  foldGutter({\n    markerDOM: open => {\n      const marker = document.createElement('span');\n      marker.className = 'cm-fold-marker';\n      marker.dataset.state = open ? 'open' : 'closed';\n      marker.title = open ? 'Fold' : 'Unfold';\n      marker.textContent = open ? '−' : '+';\n      return marker;\n    },\n  }),\n  foldTheme,\n];\n","import type { JsonSchema, JsonSchemaProperty } from '@/lib/json-schema';\n\n/**\n * Represents a variable completion option derived from a schema\n */\nexport interface VariableCompletion {\n  /** The dot-notation path (e.g., \"user.name\") */\n  path: string;\n  /** Display label for the autocomplete */\n  label: string;\n  /** Description from the schema, if available */\n  description?: string;\n  /** The type of the property */\n  type?: string;\n}\n\n/**\n * Flattens a JSON Schema into a list of variable completions for autocomplete.\n * Recursively extracts property paths using dot-notation.\n *\n * @param schema - The JSON Schema to flatten\n * @param maxDepth - Maximum recursion depth (default: 5)\n * @returns Array of variable completions\n *\n * @example\n * ```ts\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: {\n *       type: 'object',\n *       properties: {\n *         name: { type: 'string' },\n *         email: { type: 'string' }\n *       }\n *     }\n *   }\n * };\n *\n * flattenSchemaToVariables(schema);\n * // Returns:\n * // [\n * //   { path: 'user', label: 'user', type: 'object' },\n * //   { path: 'user.name', label: 'user.name', type: 'string' },\n * //   { path: 'user.email', label: 'user.email', type: 'string' }\n * // ]\n * ```\n */\nexport function flattenSchemaToVariables(schema: JsonSchema | undefined, maxDepth = 5): VariableCompletion[] {\n  if (!schema?.properties) {\n    return [];\n  }\n\n  const results: VariableCompletion[] = [];\n\n  function processProperty(property: JsonSchemaProperty, path: string, depth: number): void {\n    if (depth > maxDepth) {\n      return;\n    }\n\n    const type = Array.isArray(property.type) ? property.type.join(' | ') : property.type;\n\n    results.push({\n      path,\n      label: path,\n      description: property.description ?? property.title,\n      type,\n    });\n\n    // Recurse into nested object properties\n    if (property.properties) {\n      for (const [key, nestedProperty] of Object.entries(property.properties)) {\n        processProperty(nestedProperty, `${path}.${key}`, depth + 1);\n      }\n    }\n\n    // Handle array items if they have properties (array of objects)\n    if (property.items?.properties) {\n      // Add a placeholder for array item access (e.g., items[0].name)\n      for (const [key, itemProperty] of Object.entries(property.items.properties)) {\n        processProperty(itemProperty, `${path}[].${key}`, depth + 1);\n      }\n    }\n  }\n\n  for (const [key, property] of Object.entries(schema.properties)) {\n    processProperty(property, key, 1);\n  }\n\n  return results;\n}\n","import { autocompletion } from '@codemirror/autocomplete';\nimport type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';\nimport type { Extension } from '@codemirror/state';\nimport { flattenSchemaToVariables } from './schema-to-variables';\nimport type { VariableCompletion } from './schema-to-variables';\nimport type { JsonSchema } from '@/lib/json-schema';\n\n/**\n * Creates a CodeMirror autocomplete extension for {{variable}} placeholders.\n * Triggers when the user types `{{` and shows suggestions derived from the schema.\n *\n * @param schema - JSON Schema to derive variable suggestions from\n * @returns CodeMirror Extension that provides variable autocomplete\n *\n * @example\n * ```tsx\n * const schema = {\n *   type: 'object',\n *   properties: {\n *     user: { type: 'object', properties: { name: { type: 'string' } } }\n *   }\n * };\n *\n * <CodeMirror extensions={[createVariableAutocomplete(schema)]} />\n * // Typing \"{{\" will show: user, user.name\n * ```\n */\nexport function createVariableAutocomplete(schema: JsonSchema | undefined): Extension {\n  const variables = flattenSchemaToVariables(schema);\n\n  return autocompletion({\n    override: [createVariableCompletionSource(variables)],\n    defaultKeymap: true,\n    closeOnBlur: true,\n    icons: false,\n  });\n}\n\n/**\n * Creates a completion source function for CodeMirror's autocompletion.\n */\nexport function createVariableCompletionSource(\n  variables: VariableCompletion[],\n): (context: CompletionContext) => CompletionResult | null {\n  return (context: CompletionContext): CompletionResult | null => {\n    // Look for {{ pattern before cursor\n    const beforeCursor = context.state.sliceDoc(Math.max(0, context.pos - 50), context.pos);\n    const match = beforeCursor.match(/\\{\\{([a-zA-Z0-9_.\\[\\]]*)?$/);\n\n    if (!match) {\n      return null;\n    }\n\n    // The text after {{ that we're matching against\n    const prefix = match[1] ?? '';\n    const startPos = context.pos - prefix.length;\n\n    // Filter variables based on what the user has typed\n    const filteredVariables = prefix\n      ? variables.filter(v => v.path.toLowerCase().startsWith(prefix.toLowerCase()))\n      : variables;\n\n    if (filteredVariables.length === 0) {\n      return null;\n    }\n\n    const completions: Completion[] = filteredVariables.map(variable => ({\n      label: variable.path,\n      displayLabel: variable.path,\n      detail: variable.type,\n      info: variable.description,\n      apply: (view, completion, from, to) => {\n        // Inside an existing placeholder, replace the rest of the identifier and reuse its closing }}\n        const rest = view.state.sliceDoc(to);\n        const identifierEnd = to + (rest.match(/^[a-zA-Z0-9_.\\[\\]]*/)?.[0].length ?? 0);\n        const hasClosingBraces = view.state.sliceDoc(identifierEnd, identifierEnd + 2) === '}}';\n        const end = hasClosingBraces ? identifierEnd : to;\n\n        const insertText = hasClosingBraces ? completion.label : `${completion.label}}}`;\n\n        view.dispatch({\n          changes: { from, to: end, insert: insertText },\n          selection: { anchor: from + insertText.length },\n        });\n      },\n    }));\n\n    return {\n      from: startPos,\n      options: completions,\n      validFor: /^[a-zA-Z0-9_.\\[\\]]*$/,\n    };\n  };\n}\n","import type { DecorationSet, EditorView, ViewUpdate } from '@codemirror/view';\nimport { Decoration, MatchDecorator, ViewPlugin } from '@codemirror/view';\n\n/**\n * Regex pattern to match variable placeholders like {{variableName}} or {{user.name}}\n * Matches: {{ followed by a valid identifier path (with optional dot notation), then }}\n */\nexport const VARIABLE_PATTERN = /\\{\\{([a-zA-Z_][a-zA-Z0-9_]*(?:\\.[a-zA-Z_][a-zA-Z0-9_]*)*)\\}\\}/g;\n\nconst variableDecoration = Decoration.mark({\n  class: 'cm-variable-highlight',\n});\n\nconst variableMatcher = new MatchDecorator({\n  regexp: VARIABLE_PATTERN,\n  decoration: () => variableDecoration,\n});\n\nconst variableHighlightPlugin = ViewPlugin.fromClass(\n  class {\n    decorations: DecorationSet;\n\n    constructor(view: EditorView) {\n      this.decorations = variableMatcher.createDeco(view);\n    }\n\n    update(update: ViewUpdate) {\n      this.decorations = variableMatcher.updateDeco(update, this.decorations);\n    }\n  },\n  {\n    decorations: v => v.decorations,\n  },\n);\n\n/**\n * CodeMirror extension that highlights {{variableName}} patterns\n * with orange color and semibold weight\n */\nexport const variableHighlight = variableHighlightPlugin;\n","import { jsonLanguage } from '@codemirror/lang-json';\nimport { markdown, markdownLanguage } from '@codemirror/lang-markdown';\nimport { syntaxHighlighting } from '@codemirror/language';\nimport { EditorState, Prec } from '@codemirror/state';\nimport type { Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\nimport CodeMirror from '@uiw/react-codemirror';\nimport type { ReactCodeMirrorRef } from '@uiw/react-codemirror';\nimport { cva } from 'class-variance-authority';\nimport type { VariantProps } from 'class-variance-authority';\nimport { Braces } from 'lucide-react';\nimport { forwardRef, useMemo } from 'react';\nimport type { HTMLAttributes } from 'react';\nimport { codeLanguages } from './code-languages';\nimport { codeFoldGutter } from './fold-gutter-extension';\nimport { syntaxHighlighter } from './highlight';\nimport { createVariableAutocomplete } from './variable-autocomplete-extension';\nimport { variableHighlight } from './variable-highlight-extension';\nimport { Button } from '@/ds/components/Button';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { useFieldControlAria } from '@/ds/components/Field/field-control-aria';\nimport { fieldErrorRimWithin, inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { formatJSON } from '@/lib/formatting';\nimport type { JsonSchema } from '@/lib/json-schema';\nimport { toast } from '@/lib/toast';\nimport { cn } from '@/lib/utils';\n\nexport type CodeEditorLanguage = 'json' | 'markdown';\ntype CodeEditorFont = 'body' | 'mono';\n\n/**\n * The single CodeMirror theme for every editor. Chrome and syntax colors come\n * from CSS variables that flip under `.dark`, and syntax roles use the same\n * `syntaxHighlighter` as the read-only `<Code>` viewer, so editors and viewers\n * look identical in both modes.\n */\nfunction buildCodemirrorTheme(font: CodeEditorFont): Extension {\n  const editorTheme = EditorView.theme({\n    '&': {\n      backgroundColor: 'transparent',\n      color: 'var(--foreground)',\n      fontSize: 'var(--text-body-sm)',\n    },\n    '&.cm-editor .cm-scroller': {\n      fontFamily: `var(--font-${font})`,\n    },\n    '.cm-gutters': {\n      backgroundColor: 'transparent',\n      color: 'var(--placeholder)',\n      borderRight: 'none',\n    },\n    '.cm-content': {\n      color: 'var(--foreground)',\n      caretColor: 'var(--foreground)',\n    },\n    '.cm-activeLine': {\n      backgroundColor: 'transparent',\n    },\n    '.cm-lineNumbers .cm-gutterElement': {\n      color: 'var(--placeholder)',\n    },\n    '.cm-activeLineGutter': {\n      backgroundColor: 'transparent',\n      color: 'var(--muted-foreground)',\n    },\n    '.cm-cursor, .cm-dropCursor': {\n      borderLeftColor: 'var(--foreground)',\n    },\n    '&.cm-focused .cm-selectionBackground, & .cm-line::selection, & .cm-selectionLayer .cm-selectionBackground, .cm-content ::selection':\n      {\n        background: 'var(--info-edge) !important',\n      },\n    '.cm-tooltip-autocomplete': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      borderRadius: '6px',\n      boxShadow: 'var(--elevation-overlay)',\n    },\n    '.cm-tooltip-autocomplete > ul': {\n      fontFamily: 'var(--font-mono)',\n    },\n    '.cm-completionLabel': {\n      color: 'var(--foreground)',\n    },\n    '.cm-completionDetail': {\n      color: 'var(--muted-foreground)',\n      fontSize: 'var(--text-caption)',\n      marginLeft: 'auto',\n      paddingLeft: '12px',\n    },\n    '.cm-completionInfo': {\n      backgroundColor: 'var(--background)',\n      border: '1px solid var(--border)',\n      color: 'var(--muted-foreground)',\n      padding: '8px 12px',\n    },\n    '.cm-completionIcon': {\n      display: 'none',\n    },\n    'ul.cm-completionList li[aria-selected]': {\n      backgroundColor: 'var(--fill-hover)',\n      color: 'var(--foreground)',\n    },\n    '.cm-line .cm-variable-highlight': {\n      color: 'var(--warning-foreground) !important',\n      fontWeight: '500',\n    },\n  });\n\n  return [editorTheme, syntaxHighlighting(syntaxHighlighter)];\n}\n\n// eslint-disable-next-line react-refresh/only-export-components -- shared hook intentionally co-located with the editor it themes\nexport const useCodemirrorTheme = (font: CodeEditorFont = 'mono'): Extension => {\n  return useMemo(() => buildCodemirrorTheme(font), [font]);\n};\n\nconst codeEditorVariants = cva(\n  cn(\n    'relative overflow-hidden font-mono outline-hidden focus-within:outline-hidden focus:outline-hidden',\n    'transition-colors duration-normal ease-out-custom',\n  ),\n  {\n    variants: {\n      variant: {\n        default: cn(inputSurfaceAndFocusWithinStyle, 'rounded-md p-1', fieldErrorRimWithin),\n        embedded: 'rounded-none border-none bg-transparent p-0',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nconst editorFocusAttributes = Prec.highest(\n  EditorView.editorAttributes.of({\n    style: 'outline: none',\n  }),\n);\n\nconst editorFocusTheme = Prec.highest(\n  EditorView.theme({\n    '&': {\n      outline: 'none',\n    },\n    '&.cm-focused': {\n      outline: 'none',\n    },\n    '.cm-scroller': {\n      outline: 'none',\n    },\n    '.cm-content': {\n      outline: 'none',\n    },\n    '.cm-content:focus': {\n      outline: 'none',\n    },\n  }),\n);\n\nconst editorFocusExtensions: Extension[] = [editorFocusAttributes, editorFocusTheme];\n\ntype CodeEditorContentAttributes = {\n  'aria-label': string;\n  id?: string;\n  'aria-labelledby'?: string;\n  'aria-describedby'?: string;\n  'aria-invalid'?: string;\n};\n\nexport type CodeEditorProps = {\n  /** Prose editors can opt into the body face; code stays monospace by default. */\n  font?: CodeEditorFont;\n  data?: Record<string, unknown> | Array<Record<string, unknown>>;\n  value?: string;\n  onChange?: (value: string) => void;\n  showCopyButton?: boolean;\n  /** Offers a button that rewrites the JSON with Prettier. Needs `onChange`; ignored for markdown or read-only editors. */\n  showFormatButton?: boolean;\n  className?: string;\n  highlightVariables?: boolean;\n  language?: CodeEditorLanguage;\n  placeholder?: string;\n  /** JSON Schema to enable variable autocomplete for {{variable}} placeholders (markdown only) */\n  schema?: JsonSchema;\n  autoFocus?: boolean;\n  /** Show line numbers in the gutter (default: true) */\n  lineNumbers?: boolean;\n  /** Wrap long lines within the editor viewport (default: true) */\n  lineWrapping?: boolean;\n  /** When false, makes the editor read-only */\n  editable?: boolean;\n  /** Extra CodeMirror extensions, added after the built-in ones. Memoize them to avoid reconfiguring on every render. */\n  extensions?: Extension[];\n} & VariantProps<typeof codeEditorVariants> &\n  Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeEditor = forwardRef<ReactCodeMirrorRef, CodeEditorProps>(\n  (\n    {\n      data,\n      value,\n      onChange,\n      showCopyButton = true,\n      showFormatButton = false,\n      className,\n      language = 'json',\n      font = 'mono',\n      highlightVariables = false,\n      placeholder,\n      schema,\n      autoFocus,\n      lineNumbers = true,\n      lineWrapping = true,\n      editable,\n      extensions: extraExtensions,\n      variant,\n      id,\n      'aria-label': ariaLabelProp,\n      'aria-labelledby': ariaLabelledByProp,\n      'aria-describedby': ariaDescribedByProp,\n      'aria-invalid': ariaInvalidProp,\n      ...props\n    },\n    ref,\n  ) => {\n    const fieldAria = useFieldControlAria({ 'aria-label': ariaLabelProp });\n    const ariaLabel = ariaLabelProp ?? 'Code editor';\n    const controlId = id ?? fieldAria.id;\n    const ariaLabelledBy = ariaLabelledByProp ?? fieldAria['aria-labelledby'];\n    const ariaDescribedBy = ariaDescribedByProp ?? fieldAria['aria-describedby'];\n    const ariaInvalid = ariaInvalidProp ?? fieldAria['aria-invalid'];\n    const theme = useCodemirrorTheme(font);\n    const formattedCode = data ? JSON.stringify(data, null, 2) : (value ?? '');\n    const canFormat = showFormatButton && language === 'json' && editable !== false && Boolean(onChange);\n\n    const handleFormat = async () => {\n      try {\n        onChange?.((await formatJSON(formattedCode)).trimEnd());\n      } catch {\n        toast.error('Can’t format: the JSON is invalid');\n      }\n    };\n\n    const extensions = useMemo(() => {\n      const contentAttributes: CodeEditorContentAttributes = { 'aria-label': ariaLabel };\n      if (controlId) contentAttributes.id = controlId;\n      if (ariaLabelledBy) contentAttributes['aria-labelledby'] = ariaLabelledBy;\n      if (ariaDescribedBy) contentAttributes['aria-describedby'] = ariaDescribedBy;\n      if (ariaInvalid !== undefined) contentAttributes['aria-invalid'] = String(ariaInvalid);\n\n      const exts: Extension[] = [\n        ...editorFocusExtensions,\n        EditorView.contentAttributes.of(contentAttributes),\n        codeFoldGutter,\n      ];\n\n      if (lineWrapping) {\n        exts.push(EditorView.lineWrapping);\n      }\n\n      if (language === 'json') {\n        exts.push(jsonLanguage);\n      } else if (language === 'markdown') {\n        exts.push(markdown({ base: markdownLanguage, codeLanguages }));\n      }\n\n      if (highlightVariables && language === 'markdown') {\n        exts.push(variableHighlight);\n      }\n\n      if (schema && language === 'markdown') {\n        exts.push(createVariableAutocomplete(schema));\n      }\n\n      if (editable === false) {\n        exts.push(EditorState.readOnly.of(true));\n      }\n\n      if (extraExtensions) {\n        exts.push(...extraExtensions);\n      }\n\n      return exts;\n    }, [\n      extraExtensions,\n      language,\n      highlightVariables,\n      schema,\n      editable,\n      lineWrapping,\n      controlId,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      ariaInvalid,\n    ]);\n\n    return (\n      <div className={cn(codeEditorVariants({ variant }), className)} {...props}>\n        {(showCopyButton || canFormat) && (\n          <div className=\"absolute top-2 right-2 z-20 flex gap-1\">\n            {canFormat && (\n              <Button\n                type=\"button\"\n                size=\"icon-sm\"\n                tooltip=\"Format JSON\"\n                aria-label=\"Format JSON\"\n                onClick={handleFormat}\n              >\n                <Braces />\n              </Button>\n            )}\n            {showCopyButton && <CopyButton content={formattedCode} />}\n          </div>\n        )}\n        <CodeMirror\n          ref={ref}\n          value={formattedCode}\n          theme={theme}\n          extensions={extensions}\n          onChange={onChange}\n          editable={editable}\n          aria-label={ariaLabel}\n          placeholder={placeholder}\n          height=\"100%\"\n          style={{ height: '100%' }}\n          autoFocus={autoFocus}\n          basicSetup={{ lineNumbers, foldGutter: false }}\n        />\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/{Composer-CFkNhdTm.cjs → Composer-BcueJvdX.cjs}

@@ -1,5 +1,5 @@
 require('./Composer.css');const require_utils = require("./utils-uDc1ofX1.cjs");
-const require_scroll_area = require("./scroll-area-CpCAy8S0.cjs");
+const require_scroll_area = require("./scroll-area-BP4gPZ4G.cjs");
 const require_primitives_password_manager_autofill = require("./primitives/password-manager-autofill.cjs.js");
 const require_keyboard_use_keydown = require("./keyboard/use-keydown.cjs.js");
 let react = require("react");
@@ -438,4 +438,4 @@ Object.defineProperty(exports, "useComposerCommands", {
 	}
 });
 
-//# sourceMappingURL=Composer-CFkNhdTm.cjs.map
+//# sourceMappingURL=Composer-BcueJvdX.cjs.map

package/dist/{Composer-CFkNhdTm.cjs.map → Composer-BcueJvdX.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Composer-CFkNhdTm.cjs","names":["useState","forwardRef","cn","ScrollArea","textFieldAutofillProps","forwardRef","Collapsible","cn","useRef","Collapsible","ArrowLeft","ScrollArea","ScrollAreaViewport","cn","Check","useId","useState"],"sources":["../src/ds/components/Composer/use-composer-pointer.ts","../src/ds/components/Composer/composer.tsx","../src/ds/components/Composer/composer-header.tsx","../src/ds/components/Composer/commands/composer-suggestions.tsx","../src/ds/components/Composer/commands/command-matches.ts","../src/ds/components/Composer/commands/use-composer-commands.ts"],"sourcesContent":["import { useState } from 'react';\nimport type { PointerEvent } from 'react';\n\nexport function useComposerPointer(enabled: boolean) {\n  const [pointer, setPointer] = useState<{ x: number; y: number; angle: number }>();\n\n  function trackPointer(event: PointerEvent<HTMLDivElement>) {\n    if (!enabled || event.defaultPrevented) return;\n\n    const bounds = event.currentTarget.getBoundingClientRect();\n    const x = event.clientX - bounds.left;\n    const y = event.clientY - bounds.top;\n    const radians = Math.atan2(y - bounds.height / 2, x - bounds.width / 2);\n    // conic-gradient starts at 12 o'clock, atan2 at 3 o'clock\n    setPointer({ x, y, angle: (radians * 180) / Math.PI + 90 });\n  }\n\n  return {\n    trackPointer,\n    pointerStyle: {\n      '--composer-spotlight-x': pointer && `${pointer.x}px`,\n      '--composer-spotlight-y': pointer && `${pointer.y}px`,\n      '--composer-ring-angle': pointer && `${pointer.angle}deg`,\n    },\n  };\n}\n","import type { ComponentPropsWithoutRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport { ScrollArea } from '../ScrollArea';\nimport { useComposerPointer } from './use-composer-pointer';\nimport { textFieldAutofillProps } from '@/ds/primitives/password-manager-autofill';\nimport { cn } from '@/lib/utils';\n\nimport './composer.css';\nimport './composer-ring.css';\nimport './composer-sending.css';\n\nexport type ComposerProps = ComponentPropsWithoutRef<'form'>;\n\nexport interface ComposerInputProps extends ComponentPropsWithoutRef<'textarea'> {\n  variant?: 'inline' | 'textarea';\n  maxHeight?: string;\n}\n\nexport const Composer = forwardRef<HTMLFormElement, ComposerProps>(({ children, ...props }, ref) => (\n  <form ref={ref} data-slot=\"composer\" {...props}>\n    {children}\n  </form>\n));\nComposer.displayName = 'Composer';\n\nexport interface ComposerBoxProps extends ComponentPropsWithoutRef<'div'> {\n  sendingPulseKey?: number;\n}\n\nexport const ComposerBox = forwardRef<HTMLDivElement, ComposerBoxProps>(\n  ({ children, className, sendingPulseKey = 0, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-box\"\n      className={cn(\n        // The suggestions list and the input scroll flush with the top corners, so their scrollbars\n        // take the inset for this radius.\n        'composer-box @container relative mx-auto mt-auto w-full max-w-3xl overflow-hidden rounded-[22px] border border-border transition-colors duration-normal scrollbar-inset-[22px] focus-within:border-border-strong',\n        className,\n      )}\n      {...props}\n    >\n      <ComposerSendingPulse pulseKey={sendingPulseKey} />\n      <div className=\"relative z-10\">{children}</div>\n    </div>\n  ),\n);\nComposerBox.displayName = 'ComposerBox';\n\nexport type ComposerTone = 'default' | 'green' | 'purple' | 'orange';\n\nexport interface ComposerRingProps extends ComponentPropsWithoutRef<'div'> {\n  busy?: boolean;\n  tone?: ComposerTone;\n}\n\nexport const ComposerRing = ({\n  busy = false,\n  tone = 'green',\n  className,\n  style,\n  onPointerEnter,\n  onPointerMove,\n  ...props\n}: ComposerRingProps) => {\n  const { trackPointer, pointerStyle } = useComposerPointer(!busy);\n\n  return (\n    <div\n      data-slot=\"composer-ring\"\n      data-composer-tone={tone}\n      data-busy={busy ? 'true' : 'false'}\n      className={cn('composer-ring relative mx-auto w-full max-w-3xl rounded-[23px] p-px', className)}\n      style={{ ...pointerStyle, ...style }}\n      onPointerEnter={event => {\n        onPointerEnter?.(event);\n        trackPointer(event);\n      }}\n      onPointerMove={event => {\n        onPointerMove?.(event);\n        trackPointer(event);\n      }}\n      {...props}\n    />\n  );\n};\nComposerRing.displayName = 'ComposerRing';\n\nexport const ComposerAttachments = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"region\"\n      data-slot=\"composer-attachments\"\n      className={cn('mx-auto w-full max-w-3xl pb-2', className)}\n      {...props}\n    />\n  ),\n);\nComposerAttachments.displayName = 'ComposerAttachments';\n\nexport const ComposerInput = forwardRef<HTMLTextAreaElement, ComposerInputProps>(\n  ({ className, variant = 'inline', maxHeight, autoComplete, ...props }, ref) => (\n    <ScrollArea maxHeight={maxHeight ?? (variant === 'textarea' ? '16rem' : '13rem')}>\n      <textarea\n        ref={ref}\n        data-slot=\"composer-input\"\n        className={cn(\n          'field-sizing-content w-full resize-none overflow-hidden bg-transparent px-3 pt-2.5 pb-2 text-body text-muted-foreground outline-hidden placeholder:text-placeholder focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n          variant === 'textarea' ? 'min-h-28' : 'min-h-10',\n          className,\n        )}\n        {...props}\n        {...textFieldAutofillProps(autoComplete)}\n      />\n    </ScrollArea>\n  ),\n);\nComposerInput.displayName = 'ComposerInput';\n\nexport const ComposerActions = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"region\"\n      data-slot=\"composer-actions\"\n      className={cn('flex w-full flex-wrap items-end justify-between gap-2 px-3 pb-3', className)}\n      {...props}\n    />\n  ),\n);\nComposerActions.displayName = 'ComposerActions';\n\nconst ComposerGradientColumn = ({ className }: { className?: string }) => (\n  <div className={cn('flex size-full flex-col -space-y-3', className)}>\n    <div className=\"w-full flex-1 bg-brand-green blur-xl\" />\n    <div className=\"w-full flex-1 bg-product-observability blur-xl\" />\n    <div className=\"w-full flex-1 bg-brand-green blur-xl\" />\n    <div className=\"w-full flex-1 bg-product-observability blur-xl\" />\n  </div>\n);\n\nconst ComposerSendingPulse = ({ pulseKey }: { pulseKey: number }) => {\n  if (pulseKey === 0) return null;\n\n  return (\n    <div\n      key={pulseKey}\n      aria-hidden=\"true\"\n      data-slot=\"composer-sending-pulse\"\n      className=\"composer-sending pointer-events-none absolute top-0 left-[-10%] z-0 flex h-10 w-[120%] transform-gpu\"\n    >\n      <ComposerGradientColumn />\n      <ComposerGradientColumn className=\"-translate-y-2\" />\n      <ComposerGradientColumn />\n    </div>\n  );\n};\n\nexport interface ComposerToneLabelProps extends ComponentPropsWithoutRef<'span'> {\n  tone: ComposerTone;\n}\n\nexport function ComposerToneLabel({ tone, className, ...props }: ComposerToneLabelProps) {\n  return <span data-composer-tone={tone} className={cn('composer-tone-label', className)} {...props} />;\n}\n","import { Collapsible } from '@base-ui/react/collapsible';\nimport type { ComponentPropsWithoutRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport './composer-header.css';\n\nexport interface ComposerHeaderProps extends ComponentPropsWithoutRef<'div'> {\n  /** Animate visibility while retaining content through the closing transition. */\n  open?: boolean;\n}\n\n/** Optional context above ComposerRing or ComposerBox. Empty rendered content occupies no space. */\nexport const ComposerHeader = forwardRef<HTMLDivElement, ComposerHeaderProps>(\n  ({ className, children, open = true, ...props }, ref) => (\n    <Collapsible.Root\n      ref={ref}\n      open={open}\n      data-slot=\"composer-header\"\n      className={cn('composer-header relative isolate mx-auto w-full max-w-3xl', className)}\n      {...props}\n    >\n      <Collapsible.Panel className=\"composer-header-panel\">\n        <div\n          data-slot=\"composer-header-surface\"\n          className=\"flex flex-col gap-3 overflow-hidden rounded-t-[23px] border border-b-0 border-surface-rim bg-card px-3 pt-3 pb-8 text-body-sm text-muted-foreground empty:hidden\"\n        >\n          {children}\n        </div>\n      </Collapsible.Panel>\n    </Collapsible.Root>\n  ),\n);\nComposerHeader.displayName = 'ComposerHeader';\n\nexport interface ComposerHeaderRowProps extends ComponentPropsWithoutRef<'div'> {\n  tone?: 'default' | 'destructive' | 'success';\n}\n\nexport const ComposerHeaderRow = forwardRef<HTMLDivElement, ComposerHeaderRowProps>(\n  ({ className, tone = 'default', ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-header-row\"\n      className={cn(\n        'flex min-w-0 flex-wrap items-center gap-2 [&>svg]:size-icon-sm [&>svg]:shrink-0',\n        tone === 'destructive' && 'text-destructive-foreground',\n        tone === 'success' && 'text-success-indicator',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nComposerHeaderRow.displayName = 'ComposerHeaderRow';\n\nexport type ComposerHeaderContentProps = ComponentPropsWithoutRef<'div'>;\n\nexport const ComposerHeaderContent = forwardRef<HTMLDivElement, ComposerHeaderContentProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-header-content\"\n      className={cn('min-w-0 flex-1 wrap-anywhere', className)}\n      {...props}\n    />\n  ),\n);\nComposerHeaderContent.displayName = 'ComposerHeaderContent';\n\nexport type ComposerHeaderActionsProps = ComponentPropsWithoutRef<'div'>;\n\nexport const ComposerHeaderActions = forwardRef<HTMLDivElement, ComposerHeaderActionsProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-header-actions\"\n      className={cn('ml-auto flex max-w-full shrink-0 flex-wrap items-center gap-2', className)}\n      {...props}\n    />\n  ),\n);\nComposerHeaderActions.displayName = 'ComposerHeaderActions';\n","import { Collapsible } from '@base-ui/react/collapsible';\nimport { ArrowLeft, Check } from 'lucide-react';\nimport { useEffect, useRef } from 'react';\nimport { ScrollArea, ScrollAreaViewport } from '../../ScrollArea';\nimport { cn } from '@/lib/utils';\n\nexport interface ComposerSuggestionItem {\n  id: string;\n  label: string;\n  description?: string;\n  active?: boolean;\n}\n\nexport interface ComposerSuggestionsProps {\n  id: string;\n  items: readonly ComposerSuggestionItem[];\n  activeIndex: number;\n  contextLabel?: string;\n  onBack?: () => void;\n  onSelect: (index: number) => void;\n}\n\nexport function ComposerSuggestions({\n  id,\n  items,\n  activeIndex,\n  contextLabel,\n  onBack,\n  onSelect,\n}: ComposerSuggestionsProps) {\n  const activeOption = useRef<HTMLButtonElement>(null);\n  const activeItemId = items[activeIndex]?.id;\n  const label = contextLabel ? `${contextLabel} options` : 'Slash commands';\n\n  useEffect(() => {\n    activeOption.current?.scrollIntoView({ block: 'nearest' });\n  }, [activeItemId]);\n\n  return (\n    <Collapsible.Root open={items.length > 0}>\n      <Collapsible.Panel className=\"h-[var(--collapsible-panel-height)] overflow-hidden transition-[height] duration-normal ease-out-custom data-[ending-style]:h-0 data-[starting-style]:h-0 motion-reduce:transition-none\">\n        <div className=\"border-b border-border\" role=\"region\" aria-label={label}>\n          {contextLabel && onBack && (\n            <div className=\"border-b border-border px-1.5 py-1\">\n              <button\n                type=\"button\"\n                className=\"flex items-center gap-1.5 rounded-xl px-2 py-1.5 text-caption text-muted-foreground transition-colors duration-normal ease-out-custom hover:bg-fill-subtle hover:text-foreground motion-reduce:transition-none\"\n                aria-label=\"Back to slash commands\"\n                onMouseDown={event => event.preventDefault()}\n                onClick={onBack}\n              >\n                <ArrowLeft size={14} aria-hidden />\n                <span>{contextLabel}</span>\n              </button>\n            </div>\n          )}\n          <ScrollArea maxHeight=\"min(22rem, 50dvh)\">\n            <ScrollAreaViewport className=\"overscroll-y-contain\">\n              <div id={id} role=\"listbox\" aria-label={label} className=\"flex flex-col gap-px p-1.5\">\n                {items.map((item, index) => (\n                  <button\n                    ref={index === activeIndex ? activeOption : undefined}\n                    id={item.id}\n                    key={item.id}\n                    type=\"button\"\n                    role=\"option\"\n                    tabIndex={-1}\n                    aria-selected={index === activeIndex}\n                    aria-current={item.active ? 'true' : undefined}\n                    className={cn(\n                      'flex w-full cursor-pointer items-center justify-between gap-4 rounded-2xl px-2 py-1.5 text-left text-caption transition-colors duration-normal ease-out-custom motion-reduce:transition-none',\n                      index === activeIndex\n                        ? 'bg-fill-subtle text-foreground'\n                        : 'text-muted-foreground hover:bg-fill-subtle hover:text-foreground',\n                    )}\n                    onMouseDown={event => event.preventDefault()}\n                    onClick={() => onSelect(index)}\n                  >\n                    <span className=\"max-w-[60%] min-w-0 shrink-0 truncate\" title={item.label}>\n                      {item.label}\n                    </span>\n                    {(item.description || item.active) && (\n                      <span className=\"flex min-w-0 items-center gap-1.5 text-right\">\n                        {item.description && (\n                          <span className=\"truncate\" title={item.description}>\n                            {item.description}\n                          </span>\n                        )}\n                        {item.active && (\n                          <span className=\"flex shrink-0 items-center gap-1\">\n                            <Check size={13} aria-hidden />\n                            Current\n                          </span>\n                        )}\n                      </span>\n                    )}\n                  </button>\n                ))}\n              </div>\n            </ScrollAreaViewport>\n          </ScrollArea>\n        </div>\n      </Collapsible.Panel>\n    </Collapsible.Root>\n  );\n}\n","export interface ComposerCommandOption {\n  value: string;\n  label: string;\n  description?: string;\n  active?: boolean;\n}\n\nexport interface ComposerCommand {\n  name: string;\n  description: string;\n  options?: readonly ComposerCommandOption[];\n}\n\nexport function matchCommands<T extends Pick<ComposerCommand, 'name'>>(commands: readonly T[], draft: string): T[] {\n  if (!draft.startsWith('/')) return [];\n  const query = draft.slice(1).toLowerCase();\n  if (/\\s/.test(query)) return [];\n  return commands.filter(command => command.name.toLowerCase().startsWith(query));\n}\n\nexport function matchCommandOptions<T extends ComposerCommand>(commands: readonly T[], draft: string) {\n  if (!draft.startsWith('/')) return undefined;\n  const firstWhitespace = draft.search(/\\s/);\n  if (firstWhitespace === -1) return undefined;\n  const command = commands.find(candidate => candidate.name === draft.slice(1, firstWhitespace));\n  if (!command?.options) return undefined;\n  const query = draft.slice(firstWhitespace).trim().toLowerCase();\n  if (/\\s/.test(query)) return undefined;\n  const options = command.options.filter(option => option.value.toLowerCase().startsWith(query));\n  return options.length > 0 ? { command, options } : undefined;\n}\n","import type { ChangeEvent, ComponentPropsWithoutRef, RefObject } from 'react';\nimport { useId, useState } from 'react';\nimport type { ComposerCommand, ComposerCommandOption } from './command-matches';\nimport { matchCommandOptions, matchCommands } from './command-matches';\nimport type { ComposerSuggestionItem, ComposerSuggestionsProps } from './composer-suggestions';\nimport { useKeydown } from '@/lib/keyboard/use-keydown';\n\nfunction createSuggestionItems(\n  listId: string,\n  commands: readonly ComposerCommand[],\n  options?: readonly ComposerCommandOption[],\n): ComposerSuggestionItem[] {\n  if (options)\n    return options.map(option => ({ ...option, id: `${listId}-option-${encodeURIComponent(option.value)}` }));\n  return commands.map(command => ({\n    id: `${listId}-command-${encodeURIComponent(command.name)}`,\n    label: `/${command.name}`,\n    description: command.description,\n  }));\n}\n\nexport interface UseComposerCommandsProps {\n  commands: readonly ComposerCommand[];\n  value: string;\n  onValueChange: (value: string) => void;\n  onSubmit: (value: string) => void;\n  inputRef: RefObject<HTMLTextAreaElement | null>;\n  enabled?: boolean;\n}\n\nexport function useComposerCommands({\n  commands,\n  value,\n  onValueChange,\n  onSubmit,\n  inputRef,\n  enabled = true,\n}: UseComposerCommandsProps) {\n  const listId = useId();\n  const [navigation, setNavigation] = useState({ value: '', index: 0 });\n  const optionMatch = enabled ? matchCommandOptions(commands, value) : undefined;\n  const matchingCommands = enabled && !optionMatch ? matchCommands(commands, value) : [];\n  const items = createSuggestionItems(listId, matchingCommands, optionMatch?.options);\n  const boundedIndex = Math.min(navigation.index, Math.max(0, items.length - 1));\n  const activeIndex = navigation.value === value ? boundedIndex : 0;\n\n  function updateValue(nextValue: string) {\n    setNavigation({ value: nextValue, index: 0 });\n    onValueChange(nextValue);\n  }\n\n  function returnToCommands() {\n    updateValue(optionMatch ? `/${optionMatch.command.name}` : '');\n    inputRef.current?.focus();\n  }\n\n  function selectSuggestion(index: number) {\n    inputRef.current?.focus();\n    if (optionMatch) {\n      const option = optionMatch.options[index];\n      if (option) onSubmit(`/${optionMatch.command.name} ${option.value}`);\n      return;\n    }\n    const command = matchingCommands[index];\n    if (command) updateValue(`/${command.name} `);\n  }\n\n  function moveSelection(direction: number) {\n    setNavigation({ value, index: (activeIndex + direction + items.length) % items.length });\n  }\n\n  function shouldHandleCommandKey(event: KeyboardEvent) {\n    const command = matchingCommands[activeIndex];\n    const submitExactCommand =\n      matchingCommands.length === 1 && value.toLowerCase() === `/${command?.name}` && !command?.options?.length;\n    return event.key !== 'Enter' || !submitExactCommand;\n  }\n\n  useKeydown(\n    {\n      ArrowDown: () => moveSelection(1),\n      ArrowUp: () => moveSelection(-1),\n      Escape: returnToCommands,\n      Tab: () => selectSuggestion(activeIndex),\n      Enter: () => selectSuggestion(activeIndex),\n    },\n    {\n      target: inputRef,\n      enabled: items.length > 0,\n      shouldHandle: shouldHandleCommandKey,\n    },\n  );\n\n  const inputProps = {\n    value,\n    onChange: (event: ChangeEvent<HTMLTextAreaElement>) => updateValue(event.target.value),\n    'aria-autocomplete': 'list',\n    'aria-controls': items.length > 0 ? listId : undefined,\n    'aria-activedescendant': items[activeIndex]?.id,\n  } satisfies ComponentPropsWithoutRef<'textarea'>;\n\n  const suggestionsProps: ComposerSuggestionsProps = {\n    id: listId,\n    items,\n    activeIndex,\n    contextLabel: optionMatch ? `/${optionMatch.command.name}` : undefined,\n    onBack: optionMatch ? returnToCommands : undefined,\n    onSelect: selectSuggestion,\n  };\n\n  return { inputProps, suggestionsProps };\n}\n"],"mappings":"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"}
+{"version":3,"file":"Composer-BcueJvdX.cjs","names":["useState","forwardRef","cn","ScrollArea","textFieldAutofillProps","forwardRef","Collapsible","cn","useRef","Collapsible","ArrowLeft","ScrollArea","ScrollAreaViewport","cn","Check","useId","useState"],"sources":["../src/ds/components/Composer/use-composer-pointer.ts","../src/ds/components/Composer/composer.tsx","../src/ds/components/Composer/composer-header.tsx","../src/ds/components/Composer/commands/composer-suggestions.tsx","../src/ds/components/Composer/commands/command-matches.ts","../src/ds/components/Composer/commands/use-composer-commands.ts"],"sourcesContent":["import { useState } from 'react';\nimport type { PointerEvent } from 'react';\n\nexport function useComposerPointer(enabled: boolean) {\n  const [pointer, setPointer] = useState<{ x: number; y: number; angle: number }>();\n\n  function trackPointer(event: PointerEvent<HTMLDivElement>) {\n    if (!enabled || event.defaultPrevented) return;\n\n    const bounds = event.currentTarget.getBoundingClientRect();\n    const x = event.clientX - bounds.left;\n    const y = event.clientY - bounds.top;\n    const radians = Math.atan2(y - bounds.height / 2, x - bounds.width / 2);\n    // conic-gradient starts at 12 o'clock, atan2 at 3 o'clock\n    setPointer({ x, y, angle: (radians * 180) / Math.PI + 90 });\n  }\n\n  return {\n    trackPointer,\n    pointerStyle: {\n      '--composer-spotlight-x': pointer && `${pointer.x}px`,\n      '--composer-spotlight-y': pointer && `${pointer.y}px`,\n      '--composer-ring-angle': pointer && `${pointer.angle}deg`,\n    },\n  };\n}\n","import type { ComponentPropsWithoutRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport { ScrollArea } from '../ScrollArea';\nimport { useComposerPointer } from './use-composer-pointer';\nimport { textFieldAutofillProps } from '@/ds/primitives/password-manager-autofill';\nimport { cn } from '@/lib/utils';\n\nimport './composer.css';\nimport './composer-ring.css';\nimport './composer-sending.css';\n\nexport type ComposerProps = ComponentPropsWithoutRef<'form'>;\n\nexport interface ComposerInputProps extends ComponentPropsWithoutRef<'textarea'> {\n  variant?: 'inline' | 'textarea';\n  maxHeight?: string;\n}\n\nexport const Composer = forwardRef<HTMLFormElement, ComposerProps>(({ children, ...props }, ref) => (\n  <form ref={ref} data-slot=\"composer\" {...props}>\n    {children}\n  </form>\n));\nComposer.displayName = 'Composer';\n\nexport interface ComposerBoxProps extends ComponentPropsWithoutRef<'div'> {\n  sendingPulseKey?: number;\n}\n\nexport const ComposerBox = forwardRef<HTMLDivElement, ComposerBoxProps>(\n  ({ children, className, sendingPulseKey = 0, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-box\"\n      className={cn(\n        // The suggestions list and the input scroll flush with the top corners, so their scrollbars\n        // take the inset for this radius.\n        'composer-box @container relative mx-auto mt-auto w-full max-w-3xl overflow-hidden rounded-[22px] border border-border transition-colors duration-normal scrollbar-inset-[22px] focus-within:border-border-strong',\n        className,\n      )}\n      {...props}\n    >\n      <ComposerSendingPulse pulseKey={sendingPulseKey} />\n      <div className=\"relative z-10\">{children}</div>\n    </div>\n  ),\n);\nComposerBox.displayName = 'ComposerBox';\n\nexport type ComposerTone = 'default' | 'green' | 'purple' | 'orange';\n\nexport interface ComposerRingProps extends ComponentPropsWithoutRef<'div'> {\n  busy?: boolean;\n  tone?: ComposerTone;\n}\n\nexport const ComposerRing = ({\n  busy = false,\n  tone = 'green',\n  className,\n  style,\n  onPointerEnter,\n  onPointerMove,\n  ...props\n}: ComposerRingProps) => {\n  const { trackPointer, pointerStyle } = useComposerPointer(!busy);\n\n  return (\n    <div\n      data-slot=\"composer-ring\"\n      data-composer-tone={tone}\n      data-busy={busy ? 'true' : 'false'}\n      className={cn('composer-ring relative mx-auto w-full max-w-3xl rounded-[23px] p-px', className)}\n      style={{ ...pointerStyle, ...style }}\n      onPointerEnter={event => {\n        onPointerEnter?.(event);\n        trackPointer(event);\n      }}\n      onPointerMove={event => {\n        onPointerMove?.(event);\n        trackPointer(event);\n      }}\n      {...props}\n    />\n  );\n};\nComposerRing.displayName = 'ComposerRing';\n\nexport const ComposerAttachments = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"region\"\n      data-slot=\"composer-attachments\"\n      className={cn('mx-auto w-full max-w-3xl pb-2', className)}\n      {...props}\n    />\n  ),\n);\nComposerAttachments.displayName = 'ComposerAttachments';\n\nexport const ComposerInput = forwardRef<HTMLTextAreaElement, ComposerInputProps>(\n  ({ className, variant = 'inline', maxHeight, autoComplete, ...props }, ref) => (\n    <ScrollArea maxHeight={maxHeight ?? (variant === 'textarea' ? '16rem' : '13rem')}>\n      <textarea\n        ref={ref}\n        data-slot=\"composer-input\"\n        className={cn(\n          'field-sizing-content w-full resize-none overflow-hidden bg-transparent px-3 pt-2.5 pb-2 text-body text-muted-foreground outline-hidden placeholder:text-placeholder focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n          variant === 'textarea' ? 'min-h-28' : 'min-h-10',\n          className,\n        )}\n        {...props}\n        {...textFieldAutofillProps(autoComplete)}\n      />\n    </ScrollArea>\n  ),\n);\nComposerInput.displayName = 'ComposerInput';\n\nexport const ComposerActions = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"region\"\n      data-slot=\"composer-actions\"\n      className={cn('flex w-full flex-wrap items-end justify-between gap-2 px-3 pb-3', className)}\n      {...props}\n    />\n  ),\n);\nComposerActions.displayName = 'ComposerActions';\n\nconst ComposerGradientColumn = ({ className }: { className?: string }) => (\n  <div className={cn('flex size-full flex-col -space-y-3', className)}>\n    <div className=\"w-full flex-1 bg-brand-green blur-xl\" />\n    <div className=\"w-full flex-1 bg-product-observability blur-xl\" />\n    <div className=\"w-full flex-1 bg-brand-green blur-xl\" />\n    <div className=\"w-full flex-1 bg-product-observability blur-xl\" />\n  </div>\n);\n\nconst ComposerSendingPulse = ({ pulseKey }: { pulseKey: number }) => {\n  if (pulseKey === 0) return null;\n\n  return (\n    <div\n      key={pulseKey}\n      aria-hidden=\"true\"\n      data-slot=\"composer-sending-pulse\"\n      className=\"composer-sending pointer-events-none absolute top-0 left-[-10%] z-0 flex h-10 w-[120%] transform-gpu\"\n    >\n      <ComposerGradientColumn />\n      <ComposerGradientColumn className=\"-translate-y-2\" />\n      <ComposerGradientColumn />\n    </div>\n  );\n};\n\nexport interface ComposerToneLabelProps extends ComponentPropsWithoutRef<'span'> {\n  tone: ComposerTone;\n}\n\nexport function ComposerToneLabel({ tone, className, ...props }: ComposerToneLabelProps) {\n  return <span data-composer-tone={tone} className={cn('composer-tone-label', className)} {...props} />;\n}\n","import { Collapsible } from '@base-ui/react/collapsible';\nimport type { ComponentPropsWithoutRef } from 'react';\nimport { forwardRef } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nimport './composer-header.css';\n\nexport interface ComposerHeaderProps extends ComponentPropsWithoutRef<'div'> {\n  /** Animate visibility while retaining content through the closing transition. */\n  open?: boolean;\n}\n\n/** Optional context above ComposerRing or ComposerBox. Empty rendered content occupies no space. */\nexport const ComposerHeader = forwardRef<HTMLDivElement, ComposerHeaderProps>(\n  ({ className, children, open = true, ...props }, ref) => (\n    <Collapsible.Root\n      ref={ref}\n      open={open}\n      data-slot=\"composer-header\"\n      className={cn('composer-header relative isolate mx-auto w-full max-w-3xl', className)}\n      {...props}\n    >\n      <Collapsible.Panel className=\"composer-header-panel\">\n        <div\n          data-slot=\"composer-header-surface\"\n          className=\"flex flex-col gap-3 overflow-hidden rounded-t-[23px] border border-b-0 border-surface-rim bg-card px-3 pt-3 pb-8 text-body-sm text-muted-foreground empty:hidden\"\n        >\n          {children}\n        </div>\n      </Collapsible.Panel>\n    </Collapsible.Root>\n  ),\n);\nComposerHeader.displayName = 'ComposerHeader';\n\nexport interface ComposerHeaderRowProps extends ComponentPropsWithoutRef<'div'> {\n  tone?: 'default' | 'destructive' | 'success';\n}\n\nexport const ComposerHeaderRow = forwardRef<HTMLDivElement, ComposerHeaderRowProps>(\n  ({ className, tone = 'default', ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-header-row\"\n      className={cn(\n        'flex min-w-0 flex-wrap items-center gap-2 [&>svg]:size-icon-sm [&>svg]:shrink-0',\n        tone === 'destructive' && 'text-destructive-foreground',\n        tone === 'success' && 'text-success-indicator',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nComposerHeaderRow.displayName = 'ComposerHeaderRow';\n\nexport type ComposerHeaderContentProps = ComponentPropsWithoutRef<'div'>;\n\nexport const ComposerHeaderContent = forwardRef<HTMLDivElement, ComposerHeaderContentProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-header-content\"\n      className={cn('min-w-0 flex-1 wrap-anywhere', className)}\n      {...props}\n    />\n  ),\n);\nComposerHeaderContent.displayName = 'ComposerHeaderContent';\n\nexport type ComposerHeaderActionsProps = ComponentPropsWithoutRef<'div'>;\n\nexport const ComposerHeaderActions = forwardRef<HTMLDivElement, ComposerHeaderActionsProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-slot=\"composer-header-actions\"\n      className={cn('ml-auto flex max-w-full shrink-0 flex-wrap items-center gap-2', className)}\n      {...props}\n    />\n  ),\n);\nComposerHeaderActions.displayName = 'ComposerHeaderActions';\n","import { Collapsible } from '@base-ui/react/collapsible';\nimport { ArrowLeft, Check } from 'lucide-react';\nimport { useEffect, useRef } from 'react';\nimport { ScrollArea, ScrollAreaViewport } from '../../ScrollArea';\nimport { cn } from '@/lib/utils';\n\nexport interface ComposerSuggestionItem {\n  id: string;\n  label: string;\n  description?: string;\n  active?: boolean;\n}\n\nexport interface ComposerSuggestionsProps {\n  id: string;\n  items: readonly ComposerSuggestionItem[];\n  activeIndex: number;\n  contextLabel?: string;\n  onBack?: () => void;\n  onSelect: (index: number) => void;\n}\n\nexport function ComposerSuggestions({\n  id,\n  items,\n  activeIndex,\n  contextLabel,\n  onBack,\n  onSelect,\n}: ComposerSuggestionsProps) {\n  const activeOption = useRef<HTMLButtonElement>(null);\n  const activeItemId = items[activeIndex]?.id;\n  const label = contextLabel ? `${contextLabel} options` : 'Slash commands';\n\n  useEffect(() => {\n    activeOption.current?.scrollIntoView({ block: 'nearest' });\n  }, [activeItemId]);\n\n  return (\n    <Collapsible.Root open={items.length > 0}>\n      <Collapsible.Panel className=\"h-[var(--collapsible-panel-height)] overflow-hidden transition-[height] duration-normal ease-out-custom data-[ending-style]:h-0 data-[starting-style]:h-0 motion-reduce:transition-none\">\n        <div className=\"border-b border-border\" role=\"region\" aria-label={label}>\n          {contextLabel && onBack && (\n            <div className=\"border-b border-border px-1.5 py-1\">\n              <button\n                type=\"button\"\n                className=\"flex items-center gap-1.5 rounded-xl px-2 py-1.5 text-caption text-muted-foreground transition-colors duration-normal ease-out-custom hover:bg-fill-subtle hover:text-foreground motion-reduce:transition-none\"\n                aria-label=\"Back to slash commands\"\n                onMouseDown={event => event.preventDefault()}\n                onClick={onBack}\n              >\n                <ArrowLeft size={14} aria-hidden />\n                <span>{contextLabel}</span>\n              </button>\n            </div>\n          )}\n          <ScrollArea maxHeight=\"min(22rem, 50dvh)\">\n            <ScrollAreaViewport className=\"overscroll-y-contain\">\n              <div id={id} role=\"listbox\" aria-label={label} className=\"flex flex-col gap-px p-1.5\">\n                {items.map((item, index) => (\n                  <button\n                    ref={index === activeIndex ? activeOption : undefined}\n                    id={item.id}\n                    key={item.id}\n                    type=\"button\"\n                    role=\"option\"\n                    tabIndex={-1}\n                    aria-selected={index === activeIndex}\n                    aria-current={item.active ? 'true' : undefined}\n                    className={cn(\n                      'flex w-full cursor-pointer items-center justify-between gap-4 rounded-2xl px-2 py-1.5 text-left text-caption transition-colors duration-normal ease-out-custom motion-reduce:transition-none',\n                      index === activeIndex\n                        ? 'bg-fill-subtle text-foreground'\n                        : 'text-muted-foreground hover:bg-fill-subtle hover:text-foreground',\n                    )}\n                    onMouseDown={event => event.preventDefault()}\n                    onClick={() => onSelect(index)}\n                  >\n                    <span className=\"max-w-[60%] min-w-0 shrink-0 truncate\" title={item.label}>\n                      {item.label}\n                    </span>\n                    {(item.description || item.active) && (\n                      <span className=\"flex min-w-0 items-center gap-1.5 text-right\">\n                        {item.description && (\n                          <span className=\"truncate\" title={item.description}>\n                            {item.description}\n                          </span>\n                        )}\n                        {item.active && (\n                          <span className=\"flex shrink-0 items-center gap-1\">\n                            <Check size={13} aria-hidden />\n                            Current\n                          </span>\n                        )}\n                      </span>\n                    )}\n                  </button>\n                ))}\n              </div>\n            </ScrollAreaViewport>\n          </ScrollArea>\n        </div>\n      </Collapsible.Panel>\n    </Collapsible.Root>\n  );\n}\n","export interface ComposerCommandOption {\n  value: string;\n  label: string;\n  description?: string;\n  active?: boolean;\n}\n\nexport interface ComposerCommand {\n  name: string;\n  description: string;\n  options?: readonly ComposerCommandOption[];\n}\n\nexport function matchCommands<T extends Pick<ComposerCommand, 'name'>>(commands: readonly T[], draft: string): T[] {\n  if (!draft.startsWith('/')) return [];\n  const query = draft.slice(1).toLowerCase();\n  if (/\\s/.test(query)) return [];\n  return commands.filter(command => command.name.toLowerCase().startsWith(query));\n}\n\nexport function matchCommandOptions<T extends ComposerCommand>(commands: readonly T[], draft: string) {\n  if (!draft.startsWith('/')) return undefined;\n  const firstWhitespace = draft.search(/\\s/);\n  if (firstWhitespace === -1) return undefined;\n  const command = commands.find(candidate => candidate.name === draft.slice(1, firstWhitespace));\n  if (!command?.options) return undefined;\n  const query = draft.slice(firstWhitespace).trim().toLowerCase();\n  if (/\\s/.test(query)) return undefined;\n  const options = command.options.filter(option => option.value.toLowerCase().startsWith(query));\n  return options.length > 0 ? { command, options } : undefined;\n}\n","import type { ChangeEvent, ComponentPropsWithoutRef, RefObject } from 'react';\nimport { useId, useState } from 'react';\nimport type { ComposerCommand, ComposerCommandOption } from './command-matches';\nimport { matchCommandOptions, matchCommands } from './command-matches';\nimport type { ComposerSuggestionItem, ComposerSuggestionsProps } from './composer-suggestions';\nimport { useKeydown } from '@/lib/keyboard/use-keydown';\n\nfunction createSuggestionItems(\n  listId: string,\n  commands: readonly ComposerCommand[],\n  options?: readonly ComposerCommandOption[],\n): ComposerSuggestionItem[] {\n  if (options)\n    return options.map(option => ({ ...option, id: `${listId}-option-${encodeURIComponent(option.value)}` }));\n  return commands.map(command => ({\n    id: `${listId}-command-${encodeURIComponent(command.name)}`,\n    label: `/${command.name}`,\n    description: command.description,\n  }));\n}\n\nexport interface UseComposerCommandsProps {\n  commands: readonly ComposerCommand[];\n  value: string;\n  onValueChange: (value: string) => void;\n  onSubmit: (value: string) => void;\n  inputRef: RefObject<HTMLTextAreaElement | null>;\n  enabled?: boolean;\n}\n\nexport function useComposerCommands({\n  commands,\n  value,\n  onValueChange,\n  onSubmit,\n  inputRef,\n  enabled = true,\n}: UseComposerCommandsProps) {\n  const listId = useId();\n  const [navigation, setNavigation] = useState({ value: '', index: 0 });\n  const optionMatch = enabled ? matchCommandOptions(commands, value) : undefined;\n  const matchingCommands = enabled && !optionMatch ? matchCommands(commands, value) : [];\n  const items = createSuggestionItems(listId, matchingCommands, optionMatch?.options);\n  const boundedIndex = Math.min(navigation.index, Math.max(0, items.length - 1));\n  const activeIndex = navigation.value === value ? boundedIndex : 0;\n\n  function updateValue(nextValue: string) {\n    setNavigation({ value: nextValue, index: 0 });\n    onValueChange(nextValue);\n  }\n\n  function returnToCommands() {\n    updateValue(optionMatch ? `/${optionMatch.command.name}` : '');\n    inputRef.current?.focus();\n  }\n\n  function selectSuggestion(index: number) {\n    inputRef.current?.focus();\n    if (optionMatch) {\n      const option = optionMatch.options[index];\n      if (option) onSubmit(`/${optionMatch.command.name} ${option.value}`);\n      return;\n    }\n    const command = matchingCommands[index];\n    if (command) updateValue(`/${command.name} `);\n  }\n\n  function moveSelection(direction: number) {\n    setNavigation({ value, index: (activeIndex + direction + items.length) % items.length });\n  }\n\n  function shouldHandleCommandKey(event: KeyboardEvent) {\n    const command = matchingCommands[activeIndex];\n    const submitExactCommand =\n      matchingCommands.length === 1 && value.toLowerCase() === `/${command?.name}` && !command?.options?.length;\n    return event.key !== 'Enter' || !submitExactCommand;\n  }\n\n  useKeydown(\n    {\n      ArrowDown: () => moveSelection(1),\n      ArrowUp: () => moveSelection(-1),\n      Escape: returnToCommands,\n      Tab: () => selectSuggestion(activeIndex),\n      Enter: () => selectSuggestion(activeIndex),\n    },\n    {\n      target: inputRef,\n      enabled: items.length > 0,\n      shouldHandle: shouldHandleCommandKey,\n    },\n  );\n\n  const inputProps = {\n    value,\n    onChange: (event: ChangeEvent<HTMLTextAreaElement>) => updateValue(event.target.value),\n    'aria-autocomplete': 'list',\n    'aria-controls': items.length > 0 ? listId : undefined,\n    'aria-activedescendant': items[activeIndex]?.id,\n  } satisfies ComponentPropsWithoutRef<'textarea'>;\n\n  const suggestionsProps: ComposerSuggestionsProps = {\n    id: listId,\n    items,\n    activeIndex,\n    contextLabel: optionMatch ? `/${optionMatch.command.name}` : undefined,\n    onBack: optionMatch ? returnToCommands : undefined,\n    onSelect: selectSuggestion,\n  };\n\n  return { inputProps, suggestionsProps };\n}\n"],"mappings":"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"}

package/dist/{Composer-CLTgWusX.js → Composer-D1gF-0jZ.js}

@@ -1,5 +1,5 @@
 import { t as cn } from "./utils-DQx8TpNT.js";
-import { n as ScrollAreaViewport, t as ScrollArea } from "./scroll-area-Dh9UQ7HP.js";
+import { n as ScrollAreaViewport, t as ScrollArea } from "./scroll-area-C226l0v0.js";
 import { textFieldAutofillProps } from "./primitives/password-manager-autofill.es.js";
 import { useKeydown } from "./keyboard/use-keydown.es.js";
 import { forwardRef, useEffect, useId, useRef, useState } from "react";
@@ -349,4 +349,4 @@ function useComposerCommands({ commands, value, onValueChange, onSubmit, inputRe
 }
 export { ComposerHeader as a, ComposerHeaderRow as c, ComposerAttachments as d, ComposerBox as f, ComposerToneLabel as h, ComposerSuggestions as i, Composer as l, ComposerRing as m, matchCommandOptions as n, ComposerHeaderActions as o, ComposerInput as p, matchCommands as r, ComposerHeaderContent as s, useComposerCommands as t, ComposerActions as u };
 
-//# sourceMappingURL=Composer-CLTgWusX.js.map
+//# sourceMappingURL=Composer-D1gF-0jZ.js.map