@mastra/playground-ui 68.0.0-alpha.0 → 68.0.0-alpha.2

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

@@ -1 +1 @@
-{"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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"}
+{"version":3,"file":"CodeEditor-CLzs0yVc.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-CPVxj7WS.js → CodeEditor-COnz9c6B.js}

@@ -2,10 +2,10 @@ import { t as cn } from "./utils-DQx8TpNT.js";
 import { t as formatJSON } from "./formatting-FU4kOXPG.js";
 import { t as cva } from "./dist-BhWtUEhi.js";
 import { fieldErrorRimWithin, inputSurfaceAndFocusWithinStyle } from "./primitives/form-element.es.js";
-import { t as Button } from "./Button-Bw1e3ONi.js";
+import { t as Button } from "./Button-CLXTbAY8.js";
 import { i as useFieldControlAria } from "./field-control-aria-BaRSUUMR.js";
-import { t as toast } from "./toast-api-WhxnAT9F.js";
-import { t as CopyButton } from "./copy-button-CF-X4iDj.js";
+import { t as toast } from "./toast-api-D_rrRhNG.js";
+import { t as CopyButton } from "./copy-button-BXrbevLn.js";
 import { r as syntaxHighlighter } from "./highlight-DF-vd68d.js";
 import { forwardRef, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -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-CPVxj7WS.js.map
+//# sourceMappingURL=CodeEditor-COnz9c6B.js.map

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

@@ -1 +1 @@
-{"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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"}
+{"version":3,"file":"CodeEditor-COnz9c6B.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/{Comment-VFJq2wRp.js → Comment-0n98b_f_.js}

@@ -1,13 +1,13 @@
 import { t as cn } from "./utils-DQx8TpNT.js";
 import { t as cva } from "./dist-BhWtUEhi.js";
 import { raisedSurfaceStyle } from "./primitives/raised-surface.es.js";
-import { t as Button } from "./Button-Bw1e3ONi.js";
+import { t as Button } from "./Button-CLXTbAY8.js";
 import { textStyle } from "./primitives/text.es.js";
 import { t as Txt } from "./Txt-BM6TVV_c.js";
 import { o as useWatched, t as ArrivalScope } from "./Arrival-CJFEOXr5.js";
 import { Field, FieldError } from "./components/Field.es.js";
 import { TextareaControl } from "./primitives/textarea-control.es.js";
-import { i as InputGroupInput, n as InputGroupAddon, r as InputGroupButton, t as InputGroup } from "./input-group-g85FYfze.js";
+import { i as InputGroupInput, n as InputGroupAddon, r as InputGroupButton, t as InputGroup } from "./input-group-QKKV_ouF.js";
 import { createContext, forwardRef, useContext, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ArrowUp, Check, X } from "lucide-react";
@@ -314,4 +314,4 @@ function CommentQuote({ authorName, quote, onDismiss, className }) {
 }
 export { CommentComposerSend as a, CommentItem as c, CommentItemAvatar as d, CommentItemBody as f, CommentList as g, CommentItemTimestamp as h, CommentComposerInput as i, CommentItemActions as l, CommentItemHeader as m, CommentEditor as n, CommentArrival as o, CommentItemContent as p, CommentComposer as r, Comment as s, CommentQuote as t, CommentItemAuthor as u };
 
-//# sourceMappingURL=Comment-VFJq2wRp.js.map
+//# sourceMappingURL=Comment-0n98b_f_.js.map

package/dist/{Comment-VFJq2wRp.js.map → Comment-0n98b_f_.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Comment-VFJq2wRp.js","names":[],"sources":["../src/ds/components/Comment/comment-context.ts","../src/ds/components/Comment/comment.tsx","../src/ds/components/Comment/comment-arrival.tsx","../src/ds/components/Comment/comment-composer.tsx","../src/ds/components/Comment/comment-editor.tsx","../src/ds/components/Comment/comment-quote.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nexport type CommentVariant = 'default' | 'embed' | 'thread';\n\nexport const CommentContext = createContext<CommentVariant | null>(null);\n\nexport function useCommentVariant(): CommentVariant {\n  const variant = useContext(CommentContext);\n  if (!variant) throw new Error('Comment compounds must be rendered within Comment');\n  return variant;\n}\n","import { useRender } from '@base-ui/react/use-render';\nimport { cva } from 'class-variance-authority';\nimport type { ComponentPropsWithoutRef, HTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\n\nimport { CommentContext, useCommentVariant } from './comment-context';\nimport type { CommentVariant } from './comment-context';\nimport { Txt } from '@/ds/components/Txt';\nimport type { TxtProps } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { textStyle } from '@/ds/primitives/text';\nimport { cn } from '@/lib/utils';\n\nconst commentVariants = cva('flex flex-col', {\n  variants: {\n    variant: {\n      default: 'gap-2',\n      embed: cn(raisedSurfaceStyle, 'gap-1 rounded-xl p-3'),\n      thread: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nexport interface CommentProps extends ComponentPropsWithoutRef<'div'> {\n  variant?: CommentVariant;\n}\n\nexport const Comment = forwardRef<HTMLDivElement, CommentProps>(({ className, variant = 'default', ...props }, ref) => (\n  <CommentContext.Provider value={variant}>\n    <div\n      ref={ref}\n      data-slot=\"comment\"\n      data-variant={variant}\n      className={cn(commentVariants({ variant }), className)}\n      {...props}\n    />\n  </CommentContext.Provider>\n));\nComment.displayName = 'Comment';\n\nconst commentListGap: Record<CommentVariant, string> = {\n  default: 'gap-3',\n  embed: 'gap-2',\n  thread: '',\n};\n\nexport type CommentListProps = ComponentPropsWithoutRef<'ul'>;\n\nexport const CommentList = forwardRef<HTMLUListElement, CommentListProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <ul\n      ref={ref}\n      data-slot=\"comment-list\"\n      className={cn('flex flex-col', commentListGap[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentList.displayName = 'CommentList';\n\nconst commentItemLayout: Record<CommentVariant, string> = {\n  default: 'flex flex-col gap-1',\n  embed: 'flex flex-col gap-1',\n  thread: 'relative flex gap-2 rounded-lg px-2 hover:bg-fill-subtle',\n};\n\nexport interface CommentItemProps extends HTMLAttributes<HTMLElement> {\n  /** Same author moments after the row above: the header is dropped and the row tightens. */\n  continued?: boolean;\n  /** The comment a link pointed at. */\n  highlighted?: boolean;\n}\n\nexport const CommentItem = forwardRef<HTMLElement, CommentItemProps>(\n  ({ className, continued = false, highlighted = false, ...props }, ref) => {\n    const variant = useCommentVariant();\n    // A thread row is a stream entry among runs and moves, not a list item.\n    const Root = variant === 'thread' ? 'div' : 'li';\n\n    return (\n      <Root\n        // Cast needed: `Root` is polymorphic, so TS narrows the expected ref to a single element type.\n        ref={ref as never}\n        data-slot=\"comment-item\"\n        className={cn(\n          'group/comment-item',\n          commentItemLayout[variant],\n          variant === 'thread' && (continued ? 'py-0.5' : 'py-1.5'),\n          highlighted && 'bg-info-subtle',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nCommentItem.displayName = 'CommentItem';\n\nexport type CommentItemAvatarProps = ComponentPropsWithoutRef<'div'>;\n\n/** Fixed gutter: left empty on a continuation row, it keeps the body aligned under the avatar above. */\nexport const CommentItemAvatar = forwardRef<HTMLDivElement, CommentItemAvatarProps>(({ className, ...props }, ref) => (\n  <div ref={ref} data-slot=\"comment-item-avatar\" className={cn('w-6 shrink-0 pt-0.5', className)} {...props} />\n));\nCommentItemAvatar.displayName = 'CommentItemAvatar';\n\nexport type CommentItemContentProps = ComponentPropsWithoutRef<'div'>;\n\n/** Everything beside the gutter, stacked and free to shrink so long words wrap instead of widening the row. */\nexport const CommentItemContent = forwardRef<HTMLDivElement, CommentItemContentProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} data-slot=\"comment-item-content\" className={cn('min-w-0 flex-1', className)} {...props} />\n  ),\n);\nCommentItemContent.displayName = 'CommentItemContent';\n\nconst commentItemHeaderLayout: Record<CommentVariant, string> = {\n  default: 'flex items-center gap-2',\n  embed: 'flex items-center gap-2',\n  thread: 'flex items-baseline gap-1.5',\n};\n\nexport type CommentItemHeaderProps = ComponentPropsWithoutRef<'div'>;\n\nexport const CommentItemHeader = forwardRef<HTMLDivElement, CommentItemHeaderProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"comment-item-header\"\n      className={cn(commentItemHeaderLayout[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemHeader.displayName = 'CommentItemHeader';\n\nconst commentItemAuthorSize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'subheading',\n  embed: 'subheading',\n  thread: 'column',\n};\n\nconst commentItemAuthorTone: Record<CommentVariant, string> = {\n  default: 'text-foreground',\n  embed: 'text-foreground',\n  thread: 'truncate text-foreground',\n};\n\nexport type CommentItemAuthorProps = ComponentPropsWithoutRef<'span'>;\n\nexport const CommentItemAuthor = forwardRef<HTMLElement, CommentItemAuthorProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <Txt\n      ref={ref}\n      as=\"span\"\n      variant={commentItemAuthorSize[variant]}\n      data-slot=\"comment-item-author\"\n      className={cn(commentItemAuthorTone[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemAuthor.displayName = 'CommentItemAuthor';\n\nconst commentItemTimestampTone: Record<CommentVariant, string> = {\n  default: 'text-caption text-muted-foreground',\n  embed: 'text-caption text-muted-foreground',\n  thread: 'text-meta text-placeholder shrink-0',\n};\n\nexport type CommentItemTimestampProps = ComponentPropsWithoutRef<'time'>;\n\nexport const CommentItemTimestamp = forwardRef<HTMLTimeElement, CommentItemTimestampProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n\n    return (\n      <time\n        ref={ref}\n        data-slot=\"comment-item-timestamp\"\n        className={cn(commentItemTimestampTone[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemTimestamp.displayName = 'CommentItemTimestamp';\n\nconst commentItemBodySize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'body',\n  embed: 'body',\n  thread: 'caption',\n};\n\nconst commentItemBodyTone: Record<CommentVariant, string> = {\n  default: 'whitespace-pre-wrap text-foreground border-l border-border pl-3',\n  embed: 'whitespace-pre-wrap text-foreground',\n  thread: '',\n};\n\nexport type CommentItemBodyProps = ComponentPropsWithoutRef<'p'>;\n\nexport const CommentItemBody = forwardRef<HTMLElement, CommentItemBodyProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  // Rendered markdown brings its own blocks, which a paragraph cannot hold.\n  return useRender({\n    defaultTagName: variant === 'thread' ? 'div' : 'p',\n    props: {\n      ...props,\n      ref,\n      'data-slot': 'comment-item-body',\n      className: cn(textStyle({ variant: commentItemBodySize[variant] }), commentItemBodyTone[variant], className),\n    },\n  });\n});\nCommentItemBody.displayName = 'CommentItemBody';\n\nconst commentItemActionsLayout: Record<CommentVariant, string> = {\n  default:\n    'flex items-center gap-1 opacity-0 group-focus-within/comment-item:opacity-100 group-hover/comment-item:opacity-100 motion-safe:transition-opacity',\n  embed: '',\n  // Inline at the end of the header row, revealed on hover/focus.\n  // `pointer-fine` only: a touch screen has no hover to reveal it with.\n  thread:\n    'ml-auto flex shrink-0 items-center gap-0.5 self-center transition-opacity duration-200 ease-out motion-reduce:transition-none pointer-fine:opacity-0 pointer-fine:group-focus-within/comment-item:opacity-100 pointer-fine:group-hover/comment-item:opacity-100',\n};\n\nexport type CommentItemActionsProps = ComponentPropsWithoutRef<'div'>;\n\n/** Hidden in the `embed` variant, which drops per-item actions. */\nexport const CommentItemActions = forwardRef<HTMLDivElement, CommentItemActionsProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n    if (variant === 'embed') return null;\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"comment-item-actions\"\n        className={cn(commentItemActionsLayout[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemActions.displayName = 'CommentItemActions';\n","import type { ReactNode } from 'react';\n\nimport { ArrivalScope, useWatched } from '@/ds/components/Arrival';\n\nimport './comment-arrival.css';\n\n/** A comment the reader watched land rises into place; one that was already there just appears. */\nexport function CommentArrival({ children }: { children: ReactNode }) {\n  const watched = useWatched();\n\n  return (\n    <div data-slot=\"comment-arrival\" className={watched ? 'mastra-comment-arriving' : undefined}>\n      <ArrivalScope>{children}</ArrivalScope>\n    </div>\n  );\n}\n","import { ArrowUp } from 'lucide-react';\nimport type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport { useCommentVariant } from './comment-context';\nimport type { CommentVariant } from './comment-context';\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from '@/ds/components/InputGroup';\nimport type { InputGroupButtonProps, InputGroupInputProps } from '@/ds/components/InputGroup';\nimport type { ControlSize } from '@/ds/primitives/control-size';\nimport { cn } from '@/lib/utils';\n\nexport type CommentComposerProps = ComponentPropsWithoutRef<'form'>;\n\nexport const CommentComposer = forwardRef<HTMLFormElement, CommentComposerProps>(({ className, ...props }, ref) => (\n  <form ref={ref} data-slot=\"comment-composer\" className={cn('flex w-full items-center gap-2', className)} {...props} />\n));\nCommentComposer.displayName = 'CommentComposer';\n\nconst composerSize: Record<CommentVariant, ControlSize> = {\n  default: 'md',\n  embed: 'sm',\n  thread: 'md',\n};\n\nexport interface CommentComposerInputProps extends InputGroupInputProps {\n  /** Layout classes for the surrounding InputGroup. */\n  groupClassName?: string;\n  children?: ReactNode;\n}\n\nexport const CommentComposerInput = forwardRef<HTMLInputElement, CommentComposerInputProps>(\n  ({ groupClassName, children, ...props }, ref) => {\n    const variant = useCommentVariant();\n\n    return (\n      <InputGroup size={composerSize[variant]} className={groupClassName}>\n        <InputGroupInput ref={ref} data-slot=\"comment-composer-input\" {...props} />\n        {children}\n      </InputGroup>\n    );\n  },\n);\nCommentComposerInput.displayName = 'CommentComposerInput';\n\nexport type CommentComposerSendProps = Omit<InputGroupButtonProps, 'children'>;\n\nexport const CommentComposerSend = forwardRef<HTMLButtonElement, CommentComposerSendProps>(\n  ({ 'aria-label': ariaLabel = 'Send comment', type = 'submit', ...props }, ref) => (\n    <InputGroupAddon align=\"inline-end\">\n      <InputGroupButton ref={ref} data-slot=\"comment-composer-send\" type={type} aria-label={ariaLabel} {...props}>\n        <ArrowUp />\n      </InputGroupButton>\n    </InputGroupAddon>\n  ),\n);\nCommentComposerSend.displayName = 'CommentComposerSend';\n","import { Check, X } from 'lucide-react';\nimport { useState } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport { Button } from '@/ds/components/Button';\nimport { Field, FieldError } from '@/ds/components/Field';\nimport { TextareaControl } from '@/ds/primitives/textarea-control';\nimport { cn } from '@/lib/utils';\n\nexport interface CommentEditorProps {\n  initialBody: string;\n  /** Handed the trimmed draft. Closing is the caller's call, so a save that failed keeps what was typed. */\n  onSave: (body: string) => void;\n  onClose: () => void;\n  /** The caller's save in flight: the box locks until it settles. */\n  isPending?: boolean;\n  /** Why the caller's last save failed. */\n  error?: string;\n  'aria-label'?: string;\n  className?: string;\n}\n\n/** Owns the draft only; whether a save landed is the caller's mutation to report. */\nexport function CommentEditor({\n  initialBody,\n  onSave,\n  onClose,\n  isPending = false,\n  error,\n  'aria-label': ariaLabel = 'Edit comment',\n  className,\n}: CommentEditorProps) {\n  const [draft, setDraft] = useState(initialBody);\n  const body = draft.trim();\n  const canSave = body.length > 0 && !isPending;\n\n  const save = () => {\n    if (!canSave) return;\n    if (body === initialBody) {\n      onClose();\n      return;\n    }\n    onSave(body);\n  };\n\n  const onKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\n    // An IME commit fires Enter mid-composition; acting on it would save half a word.\n    if (event.nativeEvent.isComposing) return;\n    if (event.key === 'Enter' && !event.shiftKey) {\n      event.preventDefault();\n      save();\n    }\n  };\n\n  return (\n    <Field invalid={Boolean(error)} data-slot=\"comment-editor\" className={cn('mt-1 flex flex-col gap-1.5', className)}>\n      <div className=\"relative\">\n        <TextareaControl\n          value={draft}\n          onChange={event => setDraft(event.target.value)}\n          onKeyDown={onKeyDown}\n          readOnly={isPending}\n          aria-label={ariaLabel}\n          rows={2}\n          className=\"block field-sizing-content max-h-40 w-full resize-none overflow-y-auto rounded-lg border border-border bg-background px-2 pt-1.5 pb-9 text-caption text-foreground outline-none focus:border-border-strong\"\n        />\n        <div className=\"absolute inset-x-px bottom-px flex items-center justify-end gap-1 rounded-b-lg bg-background px-1.5 pt-1 pb-1.5\">\n          <Button icon={<X />} type=\"button\" variant=\"ghost\" size=\"sm\" disabled={isPending} onClick={onClose}>\n            Cancel\n          </Button>\n          <Button icon={<Check />} type=\"button\" size=\"sm\" disabled={!canSave} onClick={save}>\n            {isPending ? 'Saving…' : 'Save'}\n          </Button>\n        </div>\n      </div>\n      <FieldError>{error}</FieldError>\n    </Field>\n  );\n}\n","import { X } from 'lucide-react';\n\nimport { Button } from '@/ds/components/Button';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport interface CommentQuoteProps {\n  authorName?: string;\n  quote: string;\n  /** Given only while the quote is a draft the writer can still drop. */\n  onDismiss?: () => void;\n  className?: string;\n}\n\n/** The passage a reply answers, above the reply itself or inside the composer writing it. */\nexport function CommentQuote({ authorName, quote, onDismiss, className }: CommentQuoteProps) {\n  return (\n    <blockquote\n      data-slot=\"comment-quote\"\n      className={cn(\n        'm-0 flex min-w-0 gap-2 border-l-2 border-border-strong pl-2 text-caption text-muted-foreground',\n        className,\n      )}\n    >\n      <span className=\"min-w-0 flex-1\">\n        {authorName ? (\n          <Txt as=\"span\" variant=\"column\">\n            {authorName}{' '}\n          </Txt>\n        ) : null}\n        <span className=\"line-clamp-2 wrap-anywhere whitespace-pre-line\">{quote}</span>\n      </span>\n      {onDismiss ? (\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"icon-sm\"\n          aria-label=\"Remove quote\"\n          onClick={onDismiss}\n          className=\"shrink-0\"\n        >\n          <X size={12} aria-hidden />\n        </Button>\n      ) : null}\n    </blockquote>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAIA,IAAa,iBAAiB,cAAqC,IAAI;AAEvE,SAAgB,oBAAoC;CAClD,MAAM,UAAU,WAAW,cAAc;CACzC,IAAI,CAAC,SAAS,MAAM,IAAI,MAAM,mDAAmD;CACjF,OAAO;AACT;;ACGA,IAAM,kBAAkB,IAAI,iBAAiB;CAC3C,UAAU,EACR,SAAS;EACP,SAAS;EACT,OAAO,GAAG,oBAAoB,sBAAsB;EACpD,QAAQ;CACV,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAMD,IAAa,UAAU,YAA0C,EAAE,WAAW,UAAU,WAAW,GAAG,SAAS,QAC7G,oBAAC,eAAe,UAAhB;CAAyB,OAAO;CAC9B,UAAA,oBAAC,OAAD;EACO;EACL,aAAU;EACV,gBAAc;EACd,WAAW,GAAG,gBAAgB,EAAE,QAAQ,CAAC,GAAG,SAAS;EACrD,GAAI;CACL,CAAA;AACsB,CAAA,CAC1B;AACD,QAAQ,cAAc;AAEtB,IAAM,iBAAiD;CACrD,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAIA,IAAa,cAAc,YAAgD,EAAE,WAAW,GAAG,SAAS,QAAQ;CAC1G,MAAM,UAAU,kBAAkB;CAElC,OACE,oBAAC,MAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,iBAAiB,eAAe,UAAU,SAAS;EACjE,GAAI;CACL,CAAA;AAEL,CAAC;AACD,YAAY,cAAc;AAE1B,IAAM,oBAAoD;CACxD,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AASA,IAAa,cAAc,YACxB,EAAE,WAAW,YAAY,OAAO,cAAc,OAAO,GAAG,SAAS,QAAQ;CACxE,MAAM,UAAU,kBAAkB;CAIlC,OACE,oBAHW,YAAY,WAAW,QAAQ,MAG1C;EAEO;EACL,aAAU;EACV,WAAW,GACT,sBACA,kBAAkB,UAClB,YAAY,aAAa,YAAY,WAAW,WAChD,eAAe,kBACf,SACF;EACA,GAAI;CACL,CAAA;AAEL,CACF;AACA,YAAY,cAAc;;AAK1B,IAAa,oBAAoB,YAAoD,EAAE,WAAW,GAAG,SAAS,QAC5G,oBAAC,OAAD;CAAU;CAAK,aAAU;CAAsB,WAAW,GAAG,uBAAuB,SAAS;CAAG,GAAI;AAAQ,CAAA,CAC7G;AACD,kBAAkB,cAAc;;AAKhC,IAAa,qBAAqB,YAC/B,EAAE,WAAW,GAAG,SAAS,QACxB,oBAAC,OAAD;CAAU;CAAK,aAAU;CAAuB,WAAW,GAAG,kBAAkB,SAAS;CAAG,GAAI;AAAQ,CAAA,CAE5G;AACA,mBAAmB,cAAc;AAEjC,IAAM,0BAA0D;CAC9D,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAIA,IAAa,oBAAoB,YAAoD,EAAE,WAAW,GAAG,SAAS,QAAQ;CACpH,MAAM,UAAU,kBAAkB;CAElC,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,wBAAwB,UAAU,SAAS;EACzD,GAAI;CACL,CAAA;AAEL,CAAC;AACD,kBAAkB,cAAc;AAEhC,IAAM,wBAAqE;CACzE,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAEA,IAAM,wBAAwD;CAC5D,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAIA,IAAa,oBAAoB,YAAiD,EAAE,WAAW,GAAG,SAAS,QAAQ;CACjH,MAAM,UAAU,kBAAkB;CAElC,OACE,oBAAC,KAAD;EACO;EACL,IAAG;EACH,SAAS,sBAAsB;EAC/B,aAAU;EACV,WAAW,GAAG,sBAAsB,UAAU,SAAS;EACvD,GAAI;CACL,CAAA;AAEL,CAAC;AACD,kBAAkB,cAAc;AAEhC,IAAM,2BAA2D;CAC/D,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAIA,IAAa,uBAAuB,YACjC,EAAE,WAAW,GAAG,SAAS,QAAQ;CAChC,MAAM,UAAU,kBAAkB;CAElC,OACE,oBAAC,QAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,yBAAyB,UAAU,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL,CACF;AACA,qBAAqB,cAAc;AAEnC,IAAM,sBAAmE;CACvE,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAEA,IAAM,sBAAsD;CAC1D,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAIA,IAAa,kBAAkB,YAA+C,EAAE,WAAW,GAAG,SAAS,QAAQ;CAC7G,MAAM,UAAU,kBAAkB;CAGlC,OAAO,UAAU;EACf,gBAAgB,YAAY,WAAW,QAAQ;EAC/C,OAAO;GACL,GAAG;GACH;GACA,aAAa;GACb,WAAW,GAAG,UAAU,EAAE,SAAS,oBAAoB,SAAS,CAAC,GAAG,oBAAoB,UAAU,SAAS;EAC7G;CACF,CAAC;AACH,CAAC;AACD,gBAAgB,cAAc;AAE9B,IAAM,2BAA2D;CAC/D,SACE;CACF,OAAO;CAGP,QACE;AACJ;;AAKA,IAAa,qBAAqB,YAC/B,EAAE,WAAW,GAAG,SAAS,QAAQ;CAChC,MAAM,UAAU,kBAAkB;CAClC,IAAI,YAAY,SAAS,OAAO;CAEhC,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,yBAAyB,UAAU,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL,CACF;AACA,mBAAmB,cAAc;;;ACxPjC,SAAgB,eAAe,EAAE,YAAqC;CACpE,MAAM,UAAU,WAAW;CAE3B,OACE,oBAAC,OAAD;EAAK,aAAU;EAAkB,WAAW,UAAU,4BAA4B,KAAA;EAChF,UAAA,oBAAC,cAAD,EAAe,SAAuB,CAAA;CACnC,CAAA;AAET;;ACFA,IAAa,kBAAkB,YAAmD,EAAE,WAAW,GAAG,SAAS,QACzG,oBAAC,QAAD;CAAW;CAAK,aAAU;CAAmB,WAAW,GAAG,kCAAkC,SAAS;CAAG,GAAI;AAAQ,CAAA,CACtH;AACD,gBAAgB,cAAc;AAE9B,IAAM,eAAoD;CACxD,SAAS;CACT,OAAO;CACP,QAAQ;AACV;AAQA,IAAa,uBAAuB,YACjC,EAAE,gBAAgB,UAAU,GAAG,SAAS,QAAQ;CAC/C,MAAM,UAAU,kBAAkB;CAElC,OACE,qBAAC,YAAD;EAAY,MAAM,aAAa;EAAU,WAAW;EAApD,UAAA,CACE,oBAAC,iBAAD;GAAsB;GAAK,aAAU;GAAyB,GAAI;EAAQ,CAAA,GACzE,QACS;;AAEhB,CACF;AACA,qBAAqB,cAAc;AAInC,IAAa,sBAAsB,YAChC,EAAE,cAAc,YAAY,gBAAgB,OAAO,UAAU,GAAG,SAAS,QACxE,oBAAC,iBAAD;CAAiB,OAAM;CACrB,UAAA,oBAAC,kBAAD;EAAuB;EAAK,aAAU;EAA8B;EAAM,cAAY;EAAW,GAAI;EACnG,UAAA,oBAAC,SAAD,CAAU,CAAA;CACM,CAAA;AACH,CAAA,CAErB;AACA,oBAAoB,cAAc;;;AChClC,SAAgB,cAAc,EAC5B,aACA,QACA,SACA,YAAY,OACZ,OACA,cAAc,YAAY,gBAC1B,aACqB;CACrB,MAAM,CAAC,OAAO,YAAY,SAAS,WAAW;CAC9C,MAAM,OAAO,MAAM,KAAK;CACxB,MAAM,UAAU,KAAK,SAAS,KAAK,CAAC;CAEpC,MAAM,aAAa;EACjB,IAAI,CAAC,SAAS;EACd,IAAI,SAAS,aAAa;GACxB,QAAQ;GACR;EACF;EACA,OAAO,IAAI;CACb;CAEA,MAAM,aAAa,UAA8C;EAE/D,IAAI,MAAM,YAAY,aAAa;EACnC,IAAI,MAAM,QAAQ,WAAW,CAAC,MAAM,UAAU;GAC5C,MAAM,eAAe;GACrB,KAAK;EACP;CACF;CAEA,OACE,qBAAC,OAAD;EAAO,SAAS,QAAQ,KAAK;EAAG,aAAU;EAAiB,WAAW,GAAG,8BAA8B,SAAS;EAAhH,UAAA,CACE,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACE,oBAAC,iBAAD;IACE,OAAO;IACP,WAAU,UAAS,SAAS,MAAM,OAAO,KAAK;IACnC;IACX,UAAU;IACV,cAAY;IACZ,MAAM;IACN,WAAU;GACX,CAAA,GACD,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,oBAAC,QAAD;KAAQ,MAAM,oBAAC,GAAD,CAAI,CAAA;KAAG,MAAK;KAAS,SAAQ;KAAQ,MAAK;KAAK,UAAU;KAAW,SAAS;KAAS,UAAA;IAE5F,CAAA,GACR,oBAAC,QAAD;KAAQ,MAAM,oBAAC,OAAD,CAAQ,CAAA;KAAG,MAAK;KAAS,MAAK;KAAK,UAAU,CAAC;KAAS,SAAS;KAC3E,UAAA,YAAY,YAAY;IACnB,CAAA,CACL;GACF,CAAA,CAAA;EACL,CAAA,GAAA,oBAAC,YAAD,EAAA,UAAa,MAAkB,CAAA,CAC1B;;AAEX;;;AC/DA,SAAgB,aAAa,EAAE,YAAY,OAAO,WAAW,aAAgC;CAC3F,OACE,qBAAC,cAAD;EACE,aAAU;EACV,WAAW,GACT,kGACA,SACF;EALF,UAAA,CAOE,qBAAC,QAAD;GAAM,WAAU;GAAhB,UAAA,CACG,aACC,qBAAC,KAAD;IAAK,IAAG;IAAO,SAAQ;IAAvB,UAAA,CACG,YAAY,GACV;GACH,CAAA,IAAA,MACJ,oBAAC,QAAD;IAAM,WAAU;IAAkD,UAAA;GAAY,CAAA,CAC1E;EACL,CAAA,GAAA,YACC,oBAAC,QAAD;GACE,MAAK;GACL,SAAQ;GACR,MAAK;GACL,cAAW;GACX,SAAS;GACT,WAAU;GAEV,UAAA,oBAAC,GAAD;IAAG,MAAM;IAAI,eAAA;GAAa,CAAA;EACpB,CAAA,IACN,IACM;;AAEhB"}
+{"version":3,"file":"Comment-0n98b_f_.js","names":[],"sources":["../src/ds/components/Comment/comment-context.ts","../src/ds/components/Comment/comment.tsx","../src/ds/components/Comment/comment-arrival.tsx","../src/ds/components/Comment/comment-composer.tsx","../src/ds/components/Comment/comment-editor.tsx","../src/ds/components/Comment/comment-quote.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nexport type CommentVariant = 'default' | 'embed' | 'thread';\n\nexport const CommentContext = createContext<CommentVariant | null>(null);\n\nexport function useCommentVariant(): CommentVariant {\n  const variant = useContext(CommentContext);\n  if (!variant) throw new Error('Comment compounds must be rendered within Comment');\n  return variant;\n}\n","import { useRender } from '@base-ui/react/use-render';\nimport { cva } from 'class-variance-authority';\nimport type { ComponentPropsWithoutRef, HTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\n\nimport { CommentContext, useCommentVariant } from './comment-context';\nimport type { CommentVariant } from './comment-context';\nimport { Txt } from '@/ds/components/Txt';\nimport type { TxtProps } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { textStyle } from '@/ds/primitives/text';\nimport { cn } from '@/lib/utils';\n\nconst commentVariants = cva('flex flex-col', {\n  variants: {\n    variant: {\n      default: 'gap-2',\n      embed: cn(raisedSurfaceStyle, 'gap-1 rounded-xl p-3'),\n      thread: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nexport interface CommentProps extends ComponentPropsWithoutRef<'div'> {\n  variant?: CommentVariant;\n}\n\nexport const Comment = forwardRef<HTMLDivElement, CommentProps>(({ className, variant = 'default', ...props }, ref) => (\n  <CommentContext.Provider value={variant}>\n    <div\n      ref={ref}\n      data-slot=\"comment\"\n      data-variant={variant}\n      className={cn(commentVariants({ variant }), className)}\n      {...props}\n    />\n  </CommentContext.Provider>\n));\nComment.displayName = 'Comment';\n\nconst commentListGap: Record<CommentVariant, string> = {\n  default: 'gap-3',\n  embed: 'gap-2',\n  thread: '',\n};\n\nexport type CommentListProps = ComponentPropsWithoutRef<'ul'>;\n\nexport const CommentList = forwardRef<HTMLUListElement, CommentListProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <ul\n      ref={ref}\n      data-slot=\"comment-list\"\n      className={cn('flex flex-col', commentListGap[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentList.displayName = 'CommentList';\n\nconst commentItemLayout: Record<CommentVariant, string> = {\n  default: 'flex flex-col gap-1',\n  embed: 'flex flex-col gap-1',\n  thread: 'relative flex gap-2 rounded-lg px-2 hover:bg-fill-subtle',\n};\n\nexport interface CommentItemProps extends HTMLAttributes<HTMLElement> {\n  /** Same author moments after the row above: the header is dropped and the row tightens. */\n  continued?: boolean;\n  /** The comment a link pointed at. */\n  highlighted?: boolean;\n}\n\nexport const CommentItem = forwardRef<HTMLElement, CommentItemProps>(\n  ({ className, continued = false, highlighted = false, ...props }, ref) => {\n    const variant = useCommentVariant();\n    // A thread row is a stream entry among runs and moves, not a list item.\n    const Root = variant === 'thread' ? 'div' : 'li';\n\n    return (\n      <Root\n        // Cast needed: `Root` is polymorphic, so TS narrows the expected ref to a single element type.\n        ref={ref as never}\n        data-slot=\"comment-item\"\n        className={cn(\n          'group/comment-item',\n          commentItemLayout[variant],\n          variant === 'thread' && (continued ? 'py-0.5' : 'py-1.5'),\n          highlighted && 'bg-info-subtle',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nCommentItem.displayName = 'CommentItem';\n\nexport type CommentItemAvatarProps = ComponentPropsWithoutRef<'div'>;\n\n/** Fixed gutter: left empty on a continuation row, it keeps the body aligned under the avatar above. */\nexport const CommentItemAvatar = forwardRef<HTMLDivElement, CommentItemAvatarProps>(({ className, ...props }, ref) => (\n  <div ref={ref} data-slot=\"comment-item-avatar\" className={cn('w-6 shrink-0 pt-0.5', className)} {...props} />\n));\nCommentItemAvatar.displayName = 'CommentItemAvatar';\n\nexport type CommentItemContentProps = ComponentPropsWithoutRef<'div'>;\n\n/** Everything beside the gutter, stacked and free to shrink so long words wrap instead of widening the row. */\nexport const CommentItemContent = forwardRef<HTMLDivElement, CommentItemContentProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} data-slot=\"comment-item-content\" className={cn('min-w-0 flex-1', className)} {...props} />\n  ),\n);\nCommentItemContent.displayName = 'CommentItemContent';\n\nconst commentItemHeaderLayout: Record<CommentVariant, string> = {\n  default: 'flex items-center gap-2',\n  embed: 'flex items-center gap-2',\n  thread: 'flex items-baseline gap-1.5',\n};\n\nexport type CommentItemHeaderProps = ComponentPropsWithoutRef<'div'>;\n\nexport const CommentItemHeader = forwardRef<HTMLDivElement, CommentItemHeaderProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"comment-item-header\"\n      className={cn(commentItemHeaderLayout[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemHeader.displayName = 'CommentItemHeader';\n\nconst commentItemAuthorSize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'subheading',\n  embed: 'subheading',\n  thread: 'column',\n};\n\nconst commentItemAuthorTone: Record<CommentVariant, string> = {\n  default: 'text-foreground',\n  embed: 'text-foreground',\n  thread: 'truncate text-foreground',\n};\n\nexport type CommentItemAuthorProps = ComponentPropsWithoutRef<'span'>;\n\nexport const CommentItemAuthor = forwardRef<HTMLElement, CommentItemAuthorProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <Txt\n      ref={ref}\n      as=\"span\"\n      variant={commentItemAuthorSize[variant]}\n      data-slot=\"comment-item-author\"\n      className={cn(commentItemAuthorTone[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemAuthor.displayName = 'CommentItemAuthor';\n\nconst commentItemTimestampTone: Record<CommentVariant, string> = {\n  default: 'text-caption text-muted-foreground',\n  embed: 'text-caption text-muted-foreground',\n  thread: 'text-meta text-placeholder shrink-0',\n};\n\nexport type CommentItemTimestampProps = ComponentPropsWithoutRef<'time'>;\n\nexport const CommentItemTimestamp = forwardRef<HTMLTimeElement, CommentItemTimestampProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n\n    return (\n      <time\n        ref={ref}\n        data-slot=\"comment-item-timestamp\"\n        className={cn(commentItemTimestampTone[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemTimestamp.displayName = 'CommentItemTimestamp';\n\nconst commentItemBodySize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'body',\n  embed: 'body',\n  thread: 'caption',\n};\n\nconst commentItemBodyTone: Record<CommentVariant, string> = {\n  default: 'whitespace-pre-wrap text-foreground border-l border-border pl-3',\n  embed: 'whitespace-pre-wrap text-foreground',\n  thread: '',\n};\n\nexport type CommentItemBodyProps = ComponentPropsWithoutRef<'p'>;\n\nexport const CommentItemBody = forwardRef<HTMLElement, CommentItemBodyProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  // Rendered markdown brings its own blocks, which a paragraph cannot hold.\n  return useRender({\n    defaultTagName: variant === 'thread' ? 'div' : 'p',\n    props: {\n      ...props,\n      ref,\n      'data-slot': 'comment-item-body',\n      className: cn(textStyle({ variant: commentItemBodySize[variant] }), commentItemBodyTone[variant], className),\n    },\n  });\n});\nCommentItemBody.displayName = 'CommentItemBody';\n\nconst commentItemActionsLayout: Record<CommentVariant, string> = {\n  default:\n    'flex items-center gap-1 opacity-0 group-focus-within/comment-item:opacity-100 group-hover/comment-item:opacity-100 motion-safe:transition-opacity',\n  embed: '',\n  // Inline at the end of the header row, revealed on hover/focus.\n  // `pointer-fine` only: a touch screen has no hover to reveal it with.\n  thread:\n    'ml-auto flex shrink-0 items-center gap-0.5 self-center transition-opacity duration-200 ease-out motion-reduce:transition-none pointer-fine:opacity-0 pointer-fine:group-focus-within/comment-item:opacity-100 pointer-fine:group-hover/comment-item:opacity-100',\n};\n\nexport type CommentItemActionsProps = ComponentPropsWithoutRef<'div'>;\n\n/** Hidden in the `embed` variant, which drops per-item actions. */\nexport const CommentItemActions = forwardRef<HTMLDivElement, CommentItemActionsProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n    if (variant === 'embed') return null;\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"comment-item-actions\"\n        className={cn(commentItemActionsLayout[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemActions.displayName = 'CommentItemActions';\n","import type { ReactNode } from 'react';\n\nimport { ArrivalScope, useWatched } from '@/ds/components/Arrival';\n\nimport './comment-arrival.css';\n\n/** A comment the reader watched land rises into place; one that was already there just appears. */\nexport function CommentArrival({ children }: { children: ReactNode }) {\n  const watched = useWatched();\n\n  return (\n    <div data-slot=\"comment-arrival\" className={watched ? 'mastra-comment-arriving' : undefined}>\n      <ArrivalScope>{children}</ArrivalScope>\n    </div>\n  );\n}\n","import { ArrowUp } from 'lucide-react';\nimport type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport { useCommentVariant } from './comment-context';\nimport type { CommentVariant } from './comment-context';\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from '@/ds/components/InputGroup';\nimport type { InputGroupButtonProps, InputGroupInputProps } from '@/ds/components/InputGroup';\nimport type { ControlSize } from '@/ds/primitives/control-size';\nimport { cn } from '@/lib/utils';\n\nexport type CommentComposerProps = ComponentPropsWithoutRef<'form'>;\n\nexport const CommentComposer = forwardRef<HTMLFormElement, CommentComposerProps>(({ className, ...props }, ref) => (\n  <form ref={ref} data-slot=\"comment-composer\" className={cn('flex w-full items-center gap-2', className)} {...props} />\n));\nCommentComposer.displayName = 'CommentComposer';\n\nconst composerSize: Record<CommentVariant, ControlSize> = {\n  default: 'md',\n  embed: 'sm',\n  thread: 'md',\n};\n\nexport interface CommentComposerInputProps extends InputGroupInputProps {\n  /** Layout classes for the surrounding InputGroup. */\n  groupClassName?: string;\n  children?: ReactNode;\n}\n\nexport const CommentComposerInput = forwardRef<HTMLInputElement, CommentComposerInputProps>(\n  ({ groupClassName, children, ...props }, ref) => {\n    const variant = useCommentVariant();\n\n    return (\n      <InputGroup size={composerSize[variant]} className={groupClassName}>\n        <InputGroupInput ref={ref} data-slot=\"comment-composer-input\" {...props} />\n        {children}\n      </InputGroup>\n    );\n  },\n);\nCommentComposerInput.displayName = 'CommentComposerInput';\n\nexport type CommentComposerSendProps = Omit<InputGroupButtonProps, 'children'>;\n\nexport const CommentComposerSend = forwardRef<HTMLButtonElement, CommentComposerSendProps>(\n  ({ 'aria-label': ariaLabel = 'Send comment', type = 'submit', ...props }, ref) => (\n    <InputGroupAddon align=\"inline-end\">\n      <InputGroupButton ref={ref} data-slot=\"comment-composer-send\" type={type} aria-label={ariaLabel} {...props}>\n        <ArrowUp />\n      </InputGroupButton>\n    </InputGroupAddon>\n  ),\n);\nCommentComposerSend.displayName = 'CommentComposerSend';\n","import { Check, X } from 'lucide-react';\nimport { useState } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport { Button } from '@/ds/components/Button';\nimport { Field, FieldError } from '@/ds/components/Field';\nimport { TextareaControl } from '@/ds/primitives/textarea-control';\nimport { cn } from '@/lib/utils';\n\nexport interface CommentEditorProps {\n  initialBody: string;\n  /** Handed the trimmed draft. Closing is the caller's call, so a save that failed keeps what was typed. */\n  onSave: (body: string) => void;\n  onClose: () => void;\n  /** The caller's save in flight: the box locks until it settles. */\n  isPending?: boolean;\n  /** Why the caller's last save failed. */\n  error?: string;\n  'aria-label'?: string;\n  className?: string;\n}\n\n/** Owns the draft only; whether a save landed is the caller's mutation to report. */\nexport function CommentEditor({\n  initialBody,\n  onSave,\n  onClose,\n  isPending = false,\n  error,\n  'aria-label': ariaLabel = 'Edit comment',\n  className,\n}: CommentEditorProps) {\n  const [draft, setDraft] = useState(initialBody);\n  const body = draft.trim();\n  const canSave = body.length > 0 && !isPending;\n\n  const save = () => {\n    if (!canSave) return;\n    if (body === initialBody) {\n      onClose();\n      return;\n    }\n    onSave(body);\n  };\n\n  const onKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\n    // An IME commit fires Enter mid-composition; acting on it would save half a word.\n    if (event.nativeEvent.isComposing) return;\n    if (event.key === 'Enter' && !event.shiftKey) {\n      event.preventDefault();\n      save();\n    }\n  };\n\n  return (\n    <Field invalid={Boolean(error)} data-slot=\"comment-editor\" className={cn('mt-1 flex flex-col gap-1.5', className)}>\n      <div className=\"relative\">\n        <TextareaControl\n          value={draft}\n          onChange={event => setDraft(event.target.value)}\n          onKeyDown={onKeyDown}\n          readOnly={isPending}\n          aria-label={ariaLabel}\n          rows={2}\n          className=\"block field-sizing-content max-h-40 w-full resize-none overflow-y-auto rounded-lg border border-border bg-background px-2 pt-1.5 pb-9 text-caption text-foreground outline-none focus:border-border-strong\"\n        />\n        <div className=\"absolute inset-x-px bottom-px flex items-center justify-end gap-1 rounded-b-lg bg-background px-1.5 pt-1 pb-1.5\">\n          <Button icon={<X />} type=\"button\" variant=\"ghost\" size=\"sm\" disabled={isPending} onClick={onClose}>\n            Cancel\n          </Button>\n          <Button icon={<Check />} type=\"button\" size=\"sm\" disabled={!canSave} onClick={save}>\n            {isPending ? 'Saving…' : 'Save'}\n          </Button>\n        </div>\n      </div>\n      <FieldError>{error}</FieldError>\n    </Field>\n  );\n}\n","import { X } from 'lucide-react';\n\nimport { Button } from '@/ds/components/Button';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\nexport interface CommentQuoteProps {\n  authorName?: string;\n  quote: string;\n  /** Given only while the quote is a draft the writer can still drop. */\n  onDismiss?: () => void;\n  className?: string;\n}\n\n/** The passage a reply answers, above the reply itself or inside the composer writing it. */\nexport function CommentQuote({ authorName, quote, onDismiss, className }: CommentQuoteProps) {\n  return (\n    <blockquote\n      data-slot=\"comment-quote\"\n      className={cn(\n        'm-0 flex min-w-0 gap-2 border-l-2 border-border-strong pl-2 text-caption text-muted-foreground',\n        className,\n      )}\n    >\n      <span className=\"min-w-0 flex-1\">\n        {authorName ? (\n          <Txt as=\"span\" variant=\"column\">\n            {authorName}{' '}\n          </Txt>\n        ) : null}\n        <span className=\"line-clamp-2 wrap-anywhere whitespace-pre-line\">{quote}</span>\n      </span>\n      {onDismiss ? (\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"icon-sm\"\n          aria-label=\"Remove quote\"\n          onClick={onDismiss}\n          className=\"shrink-0\"\n        >\n          <X size={12} aria-hidden />\n        </Button>\n      ) : null}\n    </blockquote>\n  );\n}\n"],"mappings":"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"}

package/dist/{Comment-KYUQzeSu.cjs → Comment-Cg0f7eLa.cjs}

@@ -1,13 +1,13 @@
 require('./Comment.css');const require_utils = require("./utils-uDc1ofX1.cjs");
 const require_dist = require("./dist-ClDKPtVq.cjs");
 const require_primitives_raised_surface = require("./primitives/raised-surface.cjs.js");
-const require_Button = require("./Button-YQRflC47.cjs");
+const require_Button = require("./Button-DLcMcuUL.cjs");
 const require_primitives_text = require("./primitives/text.cjs.js");
 const require_Txt = require("./Txt-BnoSqxKE.cjs");
 const require_Arrival = require("./Arrival-Cs1oWjo4.cjs");
 const require_components_Field = require("./components/Field.cjs.js");
 const require_primitives_textarea_control = require("./primitives/textarea-control.cjs.js");
-const require_input_group = require("./input-group-uDpFNnSW.cjs");
+const require_input_group = require("./input-group-DVJLZDBL.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
@@ -409,4 +409,4 @@ Object.defineProperty(exports, "CommentQuote", {
 	}
 });
 
-//# sourceMappingURL=Comment-KYUQzeSu.cjs.map
+//# sourceMappingURL=Comment-Cg0f7eLa.cjs.map