@wallarm-org/design-system 1.30.0 → 1.31.0

package/dist/metadata/components.json

@@ -1,6 +1,6 @@
 {
-  "version": "1.29.0",
-  "generatedAt": "2026-09-30T16:29:42.378Z",
+  "version": "1.30.0",
+  "generatedAt": "2026-10-01T07:56:09.079Z",
   "components": [
     {
       "name": "Accordion",
@@ -19175,12 +19175,1242 @@
         }
       ]
     },
+    {
+      "name": "CodeEditor",
+      "description": "Editable code surface (CodeMirror 6, lazy-loaded) that looks like CodeSnippet and reuses\nits chrome: syntax-adapter colours, gutters, lines, folds, copy/wrap/fullscreen/show-more,\nplus find/replace, diagnostics, JSON Schema, autocomplete and diff against an original.",
+      "importPath": "@wallarm-org/design-system/CodeEditor",
+      "props": [
+        {
+          "name": "value",
+          "type": "string | undefined",
+          "required": false,
+          "description": "Controlled document"
+        },
+        {
+          "name": "defaultValue",
+          "type": "string | undefined",
+          "required": false,
+          "description": "Uncontrolled initial document (controlled vs uncontrolled is locked on first render)"
+        },
+        {
+          "name": "language",
+          "type": "CodeEditorLanguage | undefined",
+          "required": false,
+          "description": "Passed verbatim to the syntax adapter; selects the structural parser"
+        },
+        {
+          "name": "documentId",
+          "type": "string | undefined",
+          "required": false,
+          "description": "Document identity: changing it swaps to that document's cached state (undo history,\nselection, folds). Requires a controlled `value`: when the id changes, `value` must already\nhold that document's text (an uncached id starts from `value`). In uncontrolled mode the new\ndocument would be seeded with the previous document's text."
+        },
+        {
+          "name": "readOnly",
+          "type": "boolean | undefined",
+          "required": false,
+          "description": "Focusable, selectable, searchable, copyable — but not editable by the user"
+        },
+        {
+          "name": "startingLineNumber",
+          "type": "number | undefined",
+          "required": false,
+          "description": "Offsets gutter numbers; `lines`, `folds`, `diagnostics` use absolute numbers"
+        },
+        {
+          "name": "lines",
+          "type": "Record<number, LineConfig> | undefined",
+          "required": false,
+          "description": "Per-line configuration keyed by absolute line number (static, see spec D6).\nCompared by identity: memoise it (or hoist it to a constant) — a new object\nevery render reconfigures the lines and gutters on every render."
+        },
+        {
+          "name": "folds",
+          "type": "CodeEditorFolds | undefined",
+          "required": false,
+          "description": "Fold regions, or a function re-run after edits; collapsed state is kept by `id`.\nCompared by identity: memoise the array or pass a stable function (e.g. `getHttpFolds`) —\nan inline array/arrow reconfigures folds on every render and bypasses the re-run debounce."
+        },
+        {
+          "name": "wrapLines",
+          "type": "boolean | undefined",
+          "required": false,
+          "description": "Controlled line wrapping"
+        },
+        {
+          "name": "defaultWrapLines",
+          "type": "boolean | undefined",
+          "required": false,
+          "description": "Uncontrolled initial line wrapping"
+        },
+        {
+          "name": "maxLines",
+          "type": "number | undefined",
+          "required": false,
+          "description": "Height clamp in rows; auto-renders `CodeSnippetShowMoreButton` unless one is a direct child"
+        },
+        {
+          "name": "original",
+          "type": "string | undefined",
+          "required": false,
+          "description": "Enables diff mode against this text"
+        },
+        {
+          "name": "schema",
+          "type": "JsonSchema | undefined",
+          "required": false,
+          "description": "JSON Schema for the document (`json`) or the JSON body (`http`)"
+        },
+        {
+          "name": "completions",
+          "type": "CodeEditorCompletionSource[] | undefined",
+          "required": false,
+          "description": "Consumer completion sources, added after the built-in ones. Compared by identity: a new\narray reconfigures autocomplete and closes an open list, so keep it stable (module constant\nor `useMemo`)."
+        },
+        {
+          "name": "diagnostics",
+          "type": "CodeEditorDiagnostic[] | undefined",
+          "required": false,
+          "description": "External diagnostics, merged with syntax and schema ones"
+        },
+        {
+          "name": "apiRef",
+          "type": "Ref<CodeEditorApi> | undefined",
+          "required": false,
+          "description": "Imperative handle"
+        },
+        {
+          "name": "cspNonce",
+          "type": "string | undefined",
+          "required": false,
+          "description": "Nonce for the style tags the editor injects"
+        },
+        {
+          "name": "contentEditable",
+          "type": "Booleanish | \"inherit\" | \"plaintext-only\" | undefined",
+          "required": false
+        },
+        {
+          "name": "role",
+          "type": "AriaRole | undefined",
+          "required": false
+        },
+        {
+          "name": "defaultChecked",
+          "type": "boolean | undefined",
+          "required": false
+        },
+        {
+          "name": "suppressContentEditableWarning",
+          "type": "boolean | undefined",
+          "required": false
+        },
+        {
+          "name": "suppressHydrationWarning",
+          "type": "boolean | undefined",
+          "required": false
+        },
+        {
+          "name": "accessKey",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "autoCapitalize",
+          "type": "\"off\" | \"none\" | \"on\" | \"sentences\" | \"words\" | \"characters\" | (string & {}) | undefined",
+          "required": false
+        },
+        {
+          "name": "autoFocus",
+          "type": "boolean | undefined",
+          "required": false
+        },
+        {
+          "name": "contextMenu",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "dir",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "draggable",
+          "type": "Booleanish | undefined",
+          "required": false
+        },
+        {
+          "name": "enterKeyHint",
+          "type": "\"enter\" | \"done\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\" | undefined",
+          "required": false
+        },
+        {
+          "name": "hidden",
+          "type": "boolean | undefined",
+          "required": false
+        },
+        {
+          "name": "id",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "lang",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "nonce",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "slot",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "spellCheck",
+          "type": "Booleanish | undefined",
+          "required": false
+        },
+        {
+          "name": "tabIndex",
+          "type": "number | undefined",
+          "required": false
+        },
+        {
+          "name": "title",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "translate",
+          "type": "\"yes\" | \"no\" | undefined",
+          "required": false
+        },
+        {
+          "name": "radioGroup",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "about",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "content",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "datatype",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "inlist",
+          "type": "any",
+          "required": false
+        },
+        {
+          "name": "prefix",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "property",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "rel",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "resource",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "rev",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "typeof",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "vocab",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "autoCorrect",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "autoSave",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "color",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "itemProp",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "itemScope",
+          "type": "boolean | undefined",
+          "required": false
+        },
+        {
+          "name": "itemType",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "itemID",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "itemRef",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "results",
+          "type": "number | undefined",
+          "required": false
+        },
+        {
+          "name": "security",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "unselectable",
+          "type": "\"off\" | \"on\" | undefined",
+          "required": false
+        },
+        {
+          "name": "popover",
+          "type": "\"\" | \"auto\" | \"manual\" | \"hint\" | undefined",
+          "required": false
+        },
+        {
+          "name": "popoverTargetAction",
+          "type": "\"toggle\" | \"show\" | \"hide\" | undefined",
+          "required": false
+        },
+        {
+          "name": "popoverTarget",
+          "type": "string | undefined",
+          "required": false
+        },
+        {
+          "name": "inert",
+          "type": "boolean | undefined",
+          "required": false,
+          "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert}"
+        },
+        {
+          "name": "inputMode",
+          "type": "\"none\" | \"search\" | \"text\" | \"tel\" | \"url\" | \"email\" | \"numeric\" | \"decimal\" | undefined",
+          "required": false,
+          "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+        },
+        {
+          "name": "is",
+          "type": "string | undefined",
+          "required": false,
+          "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+        },
+        {
+          "name": "exportparts",
+          "type": "string | undefined",
+          "required": false,
+          "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts}"
+        },
+        {
+          "name": "part",
+          "type": "string | undefined",
+          "required": false,
+          "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part}"
+        },
+        {
+          "name": "size",
+          "type": "{ sm: string; md: string; lg: string; }",
+          "required": false
+        }
+      ],
+      "variants": [
+        {
+          "name": "column",
+          "options": [
+            "stick",
+            "lineNumbers",
+            "folds",
+            "prefix"
+          ],
+          "defaultValue": "lineNumbers"
+        },
+        {
+          "name": "hasGutter",
+          "options": [
+            "true",
+            "false"
+          ],
+          "defaultValue": "false"
+        },
+        {
+          "name": "wrapLines",
+          "options": [
+            "true",
+            "false"
+          ],
+          "defaultValue": "false"
+        }
+      ],
+      "subComponents": [
+        {
+          "name": "CodeEditorContent",
+          "props": [
+            {
+              "name": "lineNumbers",
+              "type": "boolean | undefined",
+              "required": false,
+              "description": "Show the line-number gutter (CodeSnippet's `<CodeSnippetLineNumbers />` equivalent)",
+              "defaultValue": "false"
+            },
+            {
+              "name": "defaultChecked",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "suppressContentEditableWarning",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "suppressHydrationWarning",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "accessKey",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "autoCapitalize",
+              "type": "\"off\" | \"none\" | \"on\" | \"sentences\" | \"words\" | \"characters\" | (string & {}) | undefined",
+              "required": false
+            },
+            {
+              "name": "autoFocus",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "contextMenu",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "dir",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "draggable",
+              "type": "Booleanish | undefined",
+              "required": false
+            },
+            {
+              "name": "enterKeyHint",
+              "type": "\"enter\" | \"done\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\" | undefined",
+              "required": false
+            },
+            {
+              "name": "hidden",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "id",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "lang",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "nonce",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "slot",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "spellCheck",
+              "type": "Booleanish | undefined",
+              "required": false
+            },
+            {
+              "name": "tabIndex",
+              "type": "number | undefined",
+              "required": false
+            },
+            {
+              "name": "title",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "translate",
+              "type": "\"yes\" | \"no\" | undefined",
+              "required": false
+            },
+            {
+              "name": "radioGroup",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "about",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "content",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "datatype",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "inlist",
+              "type": "any",
+              "required": false
+            },
+            {
+              "name": "prefix",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "property",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "rel",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "resource",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "rev",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "typeof",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "vocab",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "autoCorrect",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "autoSave",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "color",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemProp",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemScope",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "itemType",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemID",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemRef",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "results",
+              "type": "number | undefined",
+              "required": false
+            },
+            {
+              "name": "security",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "unselectable",
+              "type": "\"off\" | \"on\" | undefined",
+              "required": false
+            },
+            {
+              "name": "popover",
+              "type": "\"\" | \"auto\" | \"manual\" | \"hint\" | undefined",
+              "required": false
+            },
+            {
+              "name": "popoverTargetAction",
+              "type": "\"toggle\" | \"show\" | \"hide\" | undefined",
+              "required": false
+            },
+            {
+              "name": "popoverTarget",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "inert",
+              "type": "boolean | undefined",
+              "required": false,
+              "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert}"
+            },
+            {
+              "name": "inputMode",
+              "type": "\"none\" | \"search\" | \"text\" | \"tel\" | \"url\" | \"email\" | \"numeric\" | \"decimal\" | undefined",
+              "required": false,
+              "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+            },
+            {
+              "name": "is",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+            },
+            {
+              "name": "exportparts",
+              "type": "string | undefined",
+              "required": false,
+              "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts}"
+            },
+            {
+              "name": "part",
+              "type": "string | undefined",
+              "required": false,
+              "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part}"
+            }
+          ]
+        },
+        {
+          "name": "CodeEditorRoot",
+          "props": [
+            {
+              "name": "value",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Controlled document"
+            },
+            {
+              "name": "defaultValue",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Uncontrolled initial document (controlled vs uncontrolled is locked on first render)",
+              "defaultValue": ""
+            },
+            {
+              "name": "language",
+              "type": "CodeEditorLanguage | undefined",
+              "required": false,
+              "description": "Passed verbatim to the syntax adapter; selects the structural parser",
+              "defaultValue": "text"
+            },
+            {
+              "name": "documentId",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Document identity: changing it swaps to that document's cached state (undo history,\nselection, folds). Requires a controlled `value`: when the id changes, `value` must already\nhold that document's text (an uncached id starts from `value`). In uncontrolled mode the new\ndocument would be seeded with the previous document's text."
+            },
+            {
+              "name": "readOnly",
+              "type": "boolean | undefined",
+              "required": false,
+              "description": "Focusable, selectable, searchable, copyable — but not editable by the user",
+              "defaultValue": "false"
+            },
+            {
+              "name": "startingLineNumber",
+              "type": "number | undefined",
+              "required": false,
+              "description": "Offsets gutter numbers; `lines`, `folds`, `diagnostics` use absolute numbers",
+              "defaultValue": "1"
+            },
+            {
+              "name": "lines",
+              "type": "Record<number, LineConfig> | undefined",
+              "required": false,
+              "description": "Per-line configuration keyed by absolute line number (static, see spec D6).\nCompared by identity: memoise it (or hoist it to a constant) — a new object\nevery render reconfigures the lines and gutters on every render.",
+              "defaultValue": "EMPTY_LINES"
+            },
+            {
+              "name": "folds",
+              "type": "CodeEditorFolds | undefined",
+              "required": false,
+              "description": "Fold regions, or a function re-run after edits; collapsed state is kept by `id`.\nCompared by identity: memoise the array or pass a stable function (e.g. `getHttpFolds`) —\nan inline array/arrow reconfigures folds on every render and bypasses the re-run debounce."
+            },
+            {
+              "name": "wrapLines",
+              "type": "boolean | undefined",
+              "required": false,
+              "description": "Controlled line wrapping"
+            },
+            {
+              "name": "defaultWrapLines",
+              "type": "boolean | undefined",
+              "required": false,
+              "description": "Uncontrolled initial line wrapping",
+              "defaultValue": "false"
+            },
+            {
+              "name": "maxLines",
+              "type": "number | undefined",
+              "required": false,
+              "description": "Height clamp in rows; auto-renders `CodeSnippetShowMoreButton` unless one is a direct child",
+              "defaultValue": "0"
+            },
+            {
+              "name": "original",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Enables diff mode against this text"
+            },
+            {
+              "name": "schema",
+              "type": "JsonSchema | undefined",
+              "required": false,
+              "description": "JSON Schema for the document (`json`) or the JSON body (`http`)"
+            },
+            {
+              "name": "completions",
+              "type": "CodeEditorCompletionSource[] | undefined",
+              "required": false,
+              "description": "Consumer completion sources, added after the built-in ones. Compared by identity: a new\narray reconfigures autocomplete and closes an open list, so keep it stable (module constant\nor `useMemo`).",
+              "defaultValue": "EMPTY_COMPLETIONS"
+            },
+            {
+              "name": "diagnostics",
+              "type": "CodeEditorDiagnostic[] | undefined",
+              "required": false,
+              "description": "External diagnostics, merged with syntax and schema ones",
+              "defaultValue": "EMPTY_DIAGNOSTICS"
+            },
+            {
+              "name": "apiRef",
+              "type": "Ref<CodeEditorApi> | undefined",
+              "required": false,
+              "description": "Imperative handle"
+            },
+            {
+              "name": "cspNonce",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Nonce for the style tags the editor injects"
+            },
+            {
+              "name": "contentEditable",
+              "type": "Booleanish | \"inherit\" | \"plaintext-only\" | undefined",
+              "required": false
+            },
+            {
+              "name": "role",
+              "type": "AriaRole | undefined",
+              "required": false
+            },
+            {
+              "name": "defaultChecked",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "suppressContentEditableWarning",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "suppressHydrationWarning",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "accessKey",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "autoCapitalize",
+              "type": "\"off\" | \"none\" | \"on\" | \"sentences\" | \"words\" | \"characters\" | (string & {}) | undefined",
+              "required": false
+            },
+            {
+              "name": "autoFocus",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "contextMenu",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "dir",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "draggable",
+              "type": "Booleanish | undefined",
+              "required": false
+            },
+            {
+              "name": "enterKeyHint",
+              "type": "\"enter\" | \"done\" | \"go\" | \"next\" | \"previous\" | \"search\" | \"send\" | undefined",
+              "required": false
+            },
+            {
+              "name": "hidden",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "id",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "lang",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "nonce",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "slot",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "spellCheck",
+              "type": "Booleanish | undefined",
+              "required": false
+            },
+            {
+              "name": "tabIndex",
+              "type": "number | undefined",
+              "required": false
+            },
+            {
+              "name": "title",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "translate",
+              "type": "\"yes\" | \"no\" | undefined",
+              "required": false
+            },
+            {
+              "name": "radioGroup",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "about",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "content",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "datatype",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "inlist",
+              "type": "any",
+              "required": false
+            },
+            {
+              "name": "prefix",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "property",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "rel",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "resource",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "rev",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "typeof",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "vocab",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "autoCorrect",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "autoSave",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "color",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemProp",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemScope",
+              "type": "boolean | undefined",
+              "required": false
+            },
+            {
+              "name": "itemType",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemID",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "itemRef",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "results",
+              "type": "number | undefined",
+              "required": false
+            },
+            {
+              "name": "security",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "unselectable",
+              "type": "\"off\" | \"on\" | undefined",
+              "required": false
+            },
+            {
+              "name": "popover",
+              "type": "\"\" | \"auto\" | \"manual\" | \"hint\" | undefined",
+              "required": false
+            },
+            {
+              "name": "popoverTargetAction",
+              "type": "\"toggle\" | \"show\" | \"hide\" | undefined",
+              "required": false
+            },
+            {
+              "name": "popoverTarget",
+              "type": "string | undefined",
+              "required": false
+            },
+            {
+              "name": "inert",
+              "type": "boolean | undefined",
+              "required": false,
+              "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert}"
+            },
+            {
+              "name": "inputMode",
+              "type": "\"none\" | \"search\" | \"text\" | \"tel\" | \"url\" | \"email\" | \"numeric\" | \"decimal\" | undefined",
+              "required": false,
+              "description": "Hints at the type of data that might be entered by the user while editing the element or its contents"
+            },
+            {
+              "name": "is",
+              "type": "string | undefined",
+              "required": false,
+              "description": "Specify that a standard HTML element should behave like a defined custom built-in element"
+            },
+            {
+              "name": "exportparts",
+              "type": "string | undefined",
+              "required": false,
+              "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts}"
+            },
+            {
+              "name": "part",
+              "type": "string | undefined",
+              "required": false,
+              "description": "@see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part}"
+            },
+            {
+              "name": "size",
+              "type": "{ sm: string; md: string; lg: string; }",
+              "required": false,
+              "defaultValue": "sm"
+            }
+          ]
+        }
+      ],
+      "examples": [
+        {
+          "name": "Default",
+          "code": "() => {\n  const [value, setValue] = useState(jsonCode);\n\n  return (\n    <div style={{ width: '600px' }}>\n      <CodeEditorRoot\n        value={value}\n        onChange={setValue}\n        language='json'\n        data-testid='code-editor-default'\n      >\n        <CodeEditorContent lineNumbers aria-label='Package manifest' />\n      </CodeEditorRoot>\n    </div>\n  );\n}",
+          "description": "A controlled editor: `value` plus `onChange`, like any input. With no adapter in scope the\ntext is plain, exactly as `CodeSnippet` renders it without a provider."
+        },
+        {
+          "name": "WithHeader",
+          "code": "() => {\n  const [value, setValue] = useState(jsonCode);\n\n  return (\n    <div style={{ width: '600px' }}>\n      <CodeEditorRoot\n        value={value}\n        onChange={setValue}\n        language='json'\n        data-testid='code-editor-with-header'\n      >\n        <CodeSnippetHeader>\n          <CodeSnippetTitle>rule.json</CodeSnippetTitle>\n          <CodeSnippetActions>\n            <CodeSnippetCopyButton />\n            <CodeSnippetWrapButton />\n            <CodeSnippetFullscreenButton />\n          </CodeSnippetActions>\n        </CodeSnippetHeader>\n        <CodeEditorContent lineNumbers aria-label='Rule JSON' />\n      </CodeEditorRoot>\n    </div>\n  );\n}",
+          "description": "The `CodeSnippet` header works unchanged: a title and the copy, wrap and fullscreen buttons.\nCopy puts the edited value on the clipboard, and fullscreen keeps the undo history."
+        },
+        {
+          "name": "FloatingActions",
+          "code": "() => {\n  const [value, setValue] = useState(sampleCode);\n\n  return (\n    <div style={{ width: '320px' }}>\n      <CodeEditorRoot\n        value={value}\n        onChange={setValue}\n        language='text'\n        data-testid='code-editor-floating-actions'\n      >\n        <CodeSnippetActions>\n          <CodeSnippetWrapButton />\n          <CodeSnippetCopyButton />\n        </CodeSnippetActions>\n        <CodeEditorContent lineNumbers aria-label='Sample code' />\n      </CodeEditorRoot>\n    </div>\n  );\n}",
+          "description": "Without a header, `CodeSnippetActions` as a direct child floats over the top-right of the\neditor, as it does over a snippet."
+        },
+        {
+          "name": "LineNumbersAndStartingLine",
+          "code": "() => (\n  <VStack gap={16}>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>lineNumbers</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={sampleCode}\n          language='text'\n          data-testid='code-editor-line-numbers'\n        >\n          <CodeEditorContent lineNumbers aria-label='Sample code' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>startingLineNumber = 97</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={sampleCode}\n          language='text'\n          startingLineNumber={97}\n          data-testid='code-editor-starting-line'\n        >\n          <CodeEditorContent lineNumbers aria-label='Sample code from line 97' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n  </VStack>\n)",
+          "description": "`lineNumbers` on `CodeEditorContent` is the equivalent of `CodeSnippetLineNumbers`, and\n`startingLineNumber` renumbers the gutter for a fragment taken from a longer file."
+        },
+        {
+          "name": "LineColorsAndPrefixes",
+          "code": "() => (\n  <VStack gap={16}>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>colours</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={colorsCode}\n          language='text'\n          lines={colorLines}\n          data-testid='code-editor-line-colors'\n        >\n          <CodeEditorContent lineNumbers aria-label='Line colours' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>text prefixes</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={diffCode}\n          language='text'\n          lines={diffLines}\n          data-testid='code-editor-line-diff'\n        >\n          <CodeEditorContent lineNumbers aria-label='Diff prefixes' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>ReactNode prefixes with tooltips</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={annotatedHeadersCode}\n          language='text'\n          lines={iconLines}\n          data-testid='code-editor-line-icons'\n        >\n          <CodeEditorContent lineNumbers aria-label='Annotated headers' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n  </VStack>\n)",
+          "description": "`lines` uses the same `LineConfig` as CodeSnippet: seven semantic colours, text prefixes for a\nhand-made diff, and ReactNode prefixes such as a tooltipped icon. Lines are static and tied\nto line numbers, so they stay on their number while you type."
+        },
+        {
+          "name": "Ranges",
+          "code": "() => (\n  <div style={{ width: '600px' }}>\n    <CodeEditorRoot\n      defaultValue={rangesCode}\n      language='text'\n      lines={rangeLines}\n      data-testid='code-editor-ranges'\n    >\n      <CodeEditorContent lineNumbers aria-label='Request with ranges' />\n    </CodeEditorRoot>\n  </div>\n)",
+          "description": "`ranges` colours character offsets inside a line (start inclusive, end exclusive). The line\nkeeps its background, and only the range gets the colour."
+        },
+        {
+          "name": "HttpRequestWithPrism",
+          "code": "() => {\n  const [value, setValue] = useState(httpRequestCode);\n\n  return (\n    <CodeSnippetAdapterProvider adapter={loadPrismAdapter}>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          value={value}\n          onChange={setValue}\n          language='http'\n          data-testid='code-editor-http-request'\n        >\n          <CodeEditorContent lineNumbers aria-label='HTTP request' />\n        </CodeEditorRoot>\n      </div>\n    </CodeSnippetAdapterProvider>\n  );\n}",
+          "description": "`language='http'` under Prism. The colours come from the adapter and the structure (start\nline, headers, JSON body) comes from the editor's own HTTP grammar."
+        },
+        {
+          "name": "HttpResponseWithShiki",
+          "code": "() => {\n  const [value, setValue] = useState(httpResponseCode);\n\n  return (\n    <CodeSnippetAdapterProvider adapter={loadShikiAdapter}>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          value={value}\n          onChange={setValue}\n          language='http'\n          data-testid='code-editor-http-response'\n        >\n          <CodeEditorContent lineNumbers aria-label='HTTP response' />\n        </CodeEditorRoot>\n      </div>\n    </CodeSnippetAdapterProvider>\n  );\n}",
+          "description": "The response side under Shiki. After an edit, highlighting is repainted in the background,\nso for a moment you may see the previous colours mapped through your change."
+        },
+        {
+          "name": "HttpFolds",
+          "code": "() => {\n  const [request, setRequest] = useState(foldableRequestCode);\n  const [response, setResponse] = useState(foldableResponseCode);\n\n  return (\n    <VStack gap={16}>\n      <VStack align='start' gap={4}>\n        <span className='sb-annotation'>headers collapsed by default</span>\n        <div style={{ width: '600px' }}>\n          <CodeEditorRoot\n            value={request}\n            onChange={setRequest}\n            language='http'\n            folds={foldRequestHeadersCollapsed}\n            data-testid='code-editor-http-folds-request'\n          >\n            <CodeEditorContent lineNumbers aria-label='Foldable HTTP request' />\n          </CodeEditorRoot>\n        </div>\n      </VStack>\n      <VStack align='start' gap={4}>\n        <span className='sb-annotation'>startingLineNumber = 100</span>\n        <div style={{ width: '600px' }}>\n          <CodeEditorRoot\n            value={response}\n            onChange={setResponse}\n            language='http'\n            startingLineNumber={100}\n            folds={foldHttp}\n            data-testid='code-editor-http-folds-response'\n          >\n            <CodeEditorContent lineNumbers aria-label='Foldable HTTP response' />\n          </CodeEditorRoot>\n        </div>\n      </VStack>\n    </VStack>\n  );\n}",
+          "description": "`folds` as a function of the value: `getHttpFolds` runs again after edits, so adding a header\ngrows the headers fold. Collapsed state is kept by fold `id`. The second editor starts at\nline 100, and the fold function gets the same offset."
+        },
+        {
+          "name": "ShowMore",
+          "code": "() => (\n  <div style={{ display: 'flex', flexDirection: 'column', gap: '24px', width: '500px' }}>\n    <div>\n      <p className='sb-annotation mb-8'>12 lines, clamped at 7 — 5 hidden</p>\n      <CodeEditorRoot\n        defaultValue={showMoreCode}\n        language='text'\n        maxLines={7}\n        data-testid='code-editor-show-more'\n      >\n        <CodeEditorContent aria-label='Request headers' />\n      </CodeEditorRoot>\n    </div>\n    <div>\n      <p className='sb-annotation mb-8'>9 lines, clamped at 7 — 2 hidden, no button</p>\n      <CodeEditorRoot\n        defaultValue={showMoreThresholdCode}\n        language='text'\n        maxLines={7}\n        data-testid='code-editor-show-more-threshold'\n      >\n        <CodeEditorContent aria-label='Request headers' />\n      </CodeEditorRoot>\n    </div>\n    <div>\n      <p className='sb-annotation mb-8'>the button rendered by hand</p>\n      <CodeEditorRoot\n        defaultValue={showMoreCode}\n        language='text'\n        maxLines={7}\n        data-testid='code-editor-show-more-manual'\n      >\n        <CodeEditorContent aria-label='Request headers' />\n        <CodeSnippetShowMoreButton data-analytics-id='CODE_EDITOR_SHOW_MORE' />\n      </CodeEditorRoot>\n    </div>\n  </div>\n)",
+          "description": "`maxLines` limits the height, and the editor scrolls inside it (no rows are removed). The\nbutton appears on its own when at least three lines are hidden. Render\n`CodeSnippetShowMoreButton` yourself only to pass props to the real button."
+        },
+        {
+          "name": "Wrap",
+          "code": "() => {\n  const [wrap, setWrap] = useState(true);\n\n  return (\n    <VStack gap={16}>\n      <VStack align='start' gap={4}>\n        <span className='sb-annotation'>no wrapping</span>\n        <div style={{ width: '600px' }}>\n          <CodeEditorRoot\n            defaultValue={longCode}\n            language='text'\n            lines={wrapDiffLines}\n            data-testid='code-editor-wrap-off'\n          >\n            <CodeEditorContent lineNumbers aria-label='Long lines' />\n          </CodeEditorRoot>\n        </div>\n      </VStack>\n      <VStack align='start' gap={4}>\n        <span className='sb-annotation'>defaultWrapLines + wrap button</span>\n        <div style={{ width: '600px' }}>\n          <CodeEditorRoot\n            defaultValue={longCode}\n            language='text'\n            defaultWrapLines\n            lines={wrapDiffLines}\n            data-testid='code-editor-wrap-uncontrolled'\n          >\n            <CodeSnippetActions>\n              <CodeSnippetWrapButton />\n            </CodeSnippetActions>\n            <CodeEditorContent lineNumbers aria-label='Long lines, wrapped' />\n          </CodeEditorRoot>\n        </div>\n      </VStack>\n      <VStack align='start' gap={4}>\n        <span className='sb-annotation'>controlled — wrapLines = {String(wrap)}</span>\n        <div style={{ width: '600px' }}>\n          <CodeEditorRoot\n            defaultValue={longCode}\n            language='text'\n            wrapLines={wrap}\n            onWrapLinesChange={setWrap}\n            data-testid='code-editor-wrap-controlled'\n          >\n            <CodeSnippetActions>\n              <CodeSnippetWrapButton />\n            </CodeSnippetActions>\n            <CodeEditorContent lineNumbers aria-label='Long lines, controlled wrap' />\n          </CodeEditorRoot>\n        </div>\n      </VStack>\n    </VStack>\n  );\n}",
+          "description": "Wrapping can be uncontrolled (`defaultWrapLines`, driven by the wrap button) or controlled\n(`wrapLines` plus `onWrapLinesChange`). Colour sticks and prefixes stay on the first visual row."
+        },
+        {
+          "name": "Sizes",
+          "code": "() => (\n  <VStack gap={16}>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>sm (default)</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={bashCode}\n          language='bash'\n          size='sm'\n          data-testid='code-editor-size-sm'\n        >\n          <CodeEditorContent lineNumbers aria-label='Install commands, small' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>md</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={bashCode}\n          language='bash'\n          size='md'\n          data-testid='code-editor-size-md'\n        >\n          <CodeEditorContent lineNumbers aria-label='Install commands, medium' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n    <VStack align='start' gap={4}>\n      <span className='sb-annotation'>lg</span>\n      <div style={{ width: '600px' }}>\n        <CodeEditorRoot\n          defaultValue={bashCode}\n          language='bash'\n          size='lg'\n          data-testid='code-editor-size-lg'\n        >\n          <CodeEditorContent lineNumbers aria-label='Install commands, large' />\n        </CodeEditorRoot>\n      </div>\n    </VStack>\n  </VStack>\n)",
+          "description": "The same three sizes as CodeSnippet: `sm` (12px, default), `md` (14px) and `lg` (16px), each\non 20px rows."
+        },
+        {
+          "name": "ReadOnly",
+          "code": "() => (\n  <div style={{ width: '600px' }}>\n    <CodeEditorRoot\n      value={httpResponseCode}\n      language='http'\n      readOnly\n      data-testid='code-editor-read-only'\n    >\n      <CodeSnippetHeader>\n        <CodeSnippetTitle>Response</CodeSnippetTitle>\n        <CodeSnippetActions>\n          <CodeSnippetCopyButton />\n        </CodeSnippetActions>\n      </CodeSnippetHeader>\n      <CodeEditorContent lineNumbers aria-label='HTTP response, read only' />\n    </CodeEditorRoot>\n  </div>\n)",
+          "description": "`readOnly` still lets you focus, select, search and copy, but not type. Use it when the value\ncan change elsewhere but not here. If it never changes, use `CodeSnippet`."
+        },
+        {
+          "name": "Tabs",
+          "code": "() => {\n  const [tab, setTab] = useState<TabId>('request');\n  const [docs, setDocs] = useState<Record<TabId, string>>(tabDocuments);\n\n  return (\n    <div style={{ width: '600px' }}>\n      <CodeEditorRoot\n        documentId={tab}\n        value={docs[tab]}\n        onChange={value => setDocs(prev => ({ ...prev, [tab]: value }))}\n        language='http'\n        data-testid='code-editor-tabs'\n      >\n        <CodeSnippetHeader>\n          <CodeSnippetTabs\n            value={tab}\n            onValueChange={value => {\n              if (isTabId(value)) setTab(value);\n            }}\n          >\n            <CodeSnippetTab value='request' data-testid='code-editor-tabs--tab-request'>\n              Request\n            </CodeSnippetTab>\n            <CodeSnippetTab value='response' data-testid='code-editor-tabs--tab-response'>\n              Response\n            </CodeSnippetTab>\n          </CodeSnippetTabs>\n          <CodeSnippetActions>\n            <CodeSnippetCopyButton />\n          </CodeSnippetActions>\n        </CodeSnippetHeader>\n        <CodeEditorContent lineNumbers aria-label='HTTP message' />\n      </CodeEditorRoot>\n    </div>\n  );\n}",
+          "description": "Tabs swap `value`, and `documentId` swaps the editor's whole state with it, so each tab keeps\nits own undo history, selection and collapsed folds."
+        },
+        {
+          "name": "ParityDefault",
+          "code": "() => (\n  <ParityPair testId='parity-default' code={sampleCode} language='text' />\n)",
+          "description": "Parity check: the same code and props in CodeSnippet and in a read-only CodeEditor should look\nidentical. Accepted differences: a native thin scrollbar, and CodeMirror's caret and selection\nlayer (shown only while focused)."
+        },
+        {
+          "name": "ParityLineColors",
+          "code": "() => (\n  <ParityPair\n    testId='parity-line-colors'\n    code={colorsCode}\n    language='text'\n    lines={parityColorLines}\n  />\n)",
+          "description": "Parity check with line colours, text prefixes and a tooltipped icon prefix: same stick, same\ntint, same prefix column."
+        },
+        {
+          "name": "ParityFoldsCollapsed",
+          "code": "() => (\n  <ParityPair\n    testId='parity-folds-collapsed'\n    code={foldableRequestCode}\n    language='text'\n    folds={parityCollapsedFolds}\n  />\n)",
+          "description": "Parity check with the headers fold collapsed: same chevrons and the same summary row in place\nof the hidden lines."
+        },
+        {
+          "name": "ParityHttpPrism",
+          "code": "() => (\n  <CodeSnippetAdapterProvider adapter={loadPrismAdapter}>\n    <ParityPair testId='parity-http-prism' code={httpRequestCode} language='http' />\n  </CodeSnippetAdapterProvider>\n)",
+          "description": "Parity check for an HTTP request with a JSON body, both under the same Prism provider: token\ncolours come from the same adapter."
+        },
+        {
+          "name": "ParityRanges",
+          "code": "() => (\n  <ParityPair testId='parity-ranges' code={rangesCode} language='text' lines={rangeLines} />\n)",
+          "description": "Parity check for `ranges`: the same bold, coloured spans inside the same tinted lines."
+        },
+        {
+          "name": "ParityWrap",
+          "code": "() => (\n  <ParityPair testId='parity-wrap' code={longCode} language='text' wrapLines />\n)",
+          "description": "Parity check for wrapped lines: long lines break at the same points and line numbers stay on\nthe first row of each wrapped line."
+        },
+        {
+          "name": "ParitySizes",
+          "code": "() => (\n  <VStack gap={24}>\n    <ParityPair testId='parity-size-sm' code={bashCode} language='bash' size='sm' />\n    <ParityPair testId='parity-size-md' code={bashCode} language='bash' size='md' />\n    <ParityPair testId='parity-size-lg' code={bashCode} language='bash' size='lg' />\n  </VStack>\n)",
+          "description": "Parity check for the three sizes: the same font size, line height and gutter padding per size."
+        },
+        {
+          "name": "ParityChrome",
+          "code": "() => (\n  <VStack gap={24}>\n    <ParityPair testId='parity-chrome-header' code={sampleCode} language='text'>\n      {PARITY_HEADER_CHROME}\n    </ParityPair>\n    <ParityPair testId='parity-chrome-floating' code={sampleCode} language='text'>\n      {PARITY_FLOATING_CHROME}\n    </ParityPair>\n  </VStack>\n)",
+          "description": "Parity check for the shared chrome: a header with tabs and actions, and floating actions\nwithout a header, sit in the same place with the same spacing."
+        },
+        {
+          "name": "ParityShowMore",
+          "code": "() => (\n  <ParityPair testId='parity-show-more' code={showMoreCode} language='text' maxLines={7} />\n)",
+          "description": "Parity check for `maxLines`: the same clamped height and the same \"Show N more lines\" button."
+        },
+        {
+          "name": "Languages",
+          "code": "() => (\n  <CodeSnippetAdapterProvider adapter={loadShikiAdapter}>\n    <VStack gap={16}>\n      {LANGUAGE_SAMPLES.map(sample => (\n        <LanguageExample key={sample.id} sample={sample} />\n      ))}\n    </VStack>\n  </CodeSnippetAdapterProvider>\n)",
+          "description": "Colours come from the adapter (Shiki here); JavaScript, TypeScript, Python and Lua parsers load\non first use."
+        },
+        {
+          "name": "SyntaxErrors",
+          "code": "() => (\n  <CodeSnippetAdapterProvider adapter={loadShikiAdapter}>\n    <VStack gap={16}>\n      {SYNTAX_ERROR_SAMPLES.map(sample => (\n        <SyntaxErrorExample key={sample.language} sample={sample} />\n      ))}\n    </VStack>\n  </CodeSnippetAdapterProvider>\n)",
+          "description": "Syntax errors for every language with a structure parser: JSON and an HTTP JSON body use the\nprecise `JSON.parse` message, JavaScript and TypeScript use Babel, Lua uses luaparse (first error only), YAML and Python report\nLezer error nodes. Hover an underline to read the message; the count below each editor comes from\n`onDiagnosticsChange`. Bash and plain text have no syntax diagnostics."
+        },
+        {
+          "name": "Diff",
+          "code": "() => {\n  const [value, setValue] = useState(DIFF_MODIFIED);\n\n  return (\n    <CodeEditorRoot\n      data-testid='code-editor-diff'\n      language='http'\n      original={DIFF_ORIGINAL}\n      value={value}\n      onChange={setValue}\n    >\n      <CodeEditorContent aria-label='Request draft compared with the stored request' lineNumbers />\n    </CodeEditorRoot>\n  );\n}",
+          "description": "`original` turns on diff mode: added and changed lines read as `success` lines with a `+`,\nremoved lines as `danger` rows with a `-` and no line number. The rows stay editable, and the\ndiff updates as you type."
+        },
+        {
+          "name": "DiffWrapLines",
+          "code": "() => {\n  const [value, setValue] = useState(DIFF_WRAP_MODIFIED);\n\n  return (\n    <div className='w-480'>\n      <CodeEditorRoot\n        data-testid='code-editor-diff-wrap'\n        language='http'\n        original={DIFF_WRAP_ORIGINAL}\n        value={value}\n        onChange={setValue}\n        defaultWrapLines\n      >\n        <CodeEditorContent aria-label='Request without the debug header' lineNumbers />\n      </CodeEditorRoot>\n    </div>\n  );\n}",
+          "description": "With wrapping on, a removed line longer than the frame wraps inside its `danger` row and its\n`-` marker stays on the first visual row, beside where the line starts."
+        },
+        {
+          "name": "AnalyticsAttributes",
+          "code": "() => (\n  <CodeEditorRoot\n    data-testid='analytics-editor'\n    language='http'\n    defaultValue={analyticsRequest}\n    folds={analyticsFolds}\n  >\n    <CodeSnippetHeader>\n      <CodeSnippetTitle>Request</CodeSnippetTitle>\n      <CodeSnippetActions>\n        <CodeSnippetCopyButton data-analytics-id='CODE_EDITOR_COPY' />\n        <CodeSnippetWrapButton data-analytics-id='CODE_EDITOR_WRAP' />\n        <CodeSnippetFullscreenButton data-analytics-id='CODE_EDITOR_FULLSCREEN' />\n      </CodeSnippetActions>\n    </CodeSnippetHeader>\n    <CodeEditorContent\n      aria-label='HTTP request'\n      lineNumbers\n      data-analytics-id='CODE_EDITOR_REQUEST'\n      data-analytics-props='{\"surface\":\"rule-editor\"}'\n    />\n  </CodeEditorRoot>\n)",
+          "description": "Where analytics attributes land. `data-*` / `aria-*` / `id` on `CodeEditorContent`\nreach the typing surface (`role=\"textbox\"`), chrome buttons take them directly, and\nfold buttons take them through `toggleProps` / `summaryProps`. Popups drawn by the\neditor (autocomplete, tooltips, search panel) are not attributable — see\n`CodeEditor/ANALYTICS_GAPS.md`."
+        },
+        {
+          "name": "EditingWorkflow",
+          "code": "() => <EditingWorkflowDemo />",
+          "description": "A controlled HTTP request with header and body folds and a JSON Schema on the body —\n`retries` breaks the schema's maximum on purpose, so the underline and its hover message\nare part of the example. The editor's description points at `CODE_EDITOR_KEYBOARD_HINT`."
+        },
+        {
+          "name": "TabsKeepHistory",
+          "code": "() => <TabsKeepHistoryDemo />",
+          "description": "Each tab passes its own `documentId`, so switching swaps in that document's undo history,\nselection and collapsed folds instead of replacing the text of one shared document."
+        },
+        {
+          "name": "LongDocument",
+          "code": "() => <LongDocumentDemo />",
+          "description": "2 000 read-only lines clamped by `maxLines` — the top of the envelope the colour painter is\nbuilt for, where `readOnly` still lets the text be focused, searched and copied."
+        }
+      ]
+    },
     {
       "name": "CodeSnippet",
       "description": "Code block with syntax highlighting, actions, line numbers, folding, and maxLines collapse.",
       "importPath": "@wallarm-org/design-system/CodeSnippet",
       "props": [],
-      "variants": [],
+      "variants": [
+        {
+          "name": "size",
+          "options": [
+            "sm",
+            "md",
+            "lg"
+          ],
+          "defaultValue": "sm"
+        }
+      ],
       "subComponents": [
         {
           "name": "CodeSnippetActions",
@@ -23710,9 +24940,9 @@
       "props": [
         {
           "name": "text",
-          "type": "string",
+          "type": "string | (() => string)",
           "required": true,
-          "description": "The text to copy to the clipboard."
+          "description": "The text to copy to the clipboard. Pass a function to read the text\nlazily at click time (e.g. the live document of an editor)."
         },
         {
           "name": "tooltip",