@kubex/zinc 1.1.184 → 2.0.0

package/dist/vscode.html-custom-data.json

@@ -13,22 +13,16 @@
         }
       ]
     },
-    {
-      "name": "zn-action-bar",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-      "attributes": [],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://zinc.style/components/action-bar"
-        }
-      ]
-    },
     {
       "name": "zn-alert",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
       "attributes": [
         { "name": "icon", "values": [] },
+        {
+          "name": "icon-size",
+          "description": "The status icon's size in pixels.",
+          "values": []
+        },
         { "name": "caption", "values": [] },
         { "name": "collapse", "values": [] },
         {
@@ -37,6 +31,7 @@
         },
         {
           "name": "level",
+          "description": "`ai` marks AI-generated content only.",
           "values": [
             { "name": "primary" },
             { "name": "error" },
@@ -44,7 +39,8 @@
             { "name": "success" },
             { "name": "warning" },
             { "name": "note" },
-            { "name": "cosmic" }
+            { "name": "cosmic" },
+            { "name": "ai" }
           ]
         },
         { "name": "center", "values": [] },
@@ -64,6 +60,17 @@
         }
       ]
     },
+    {
+      "name": "zn-action-bar",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/action-bar"
+        }
+      ]
+    },
     {
       "name": "zn-animated-button",
       "description": "\n---\n\n\n### **Methods:**\n - **purchase(): _void_** - Programmatically trigger the purchase flow\n- **setSuccess(): _void_** - Set the button to success state manually\n- **setFailure(message): _void_** - Set the button to failure state manually with optional error message\n- **reset(): _void_** - Reset the button to idle state",
@@ -138,6 +145,23 @@
         }
       ]
     },
+    {
+      "name": "zn-avatar-group",
+      "description": "Overlapping avatars that show each person's name on hover, collapsing any past `max` into a \"+N\" count.\n---\n\n\n### **Slots:**\n - _default_ - `zn-icon` avatars. Each one's tooltip shows its `alt`, or its `src` when it has none.\n\n### **CSS Properties:**\n - **--zn-avatar-ring-color** - The ring that separates overlapping avatars; defaults to the panel surface. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overflow** - The \"+N\" count standing in for the avatars past `max`.",
+      "attributes": [
+        {
+          "name": "max",
+          "description": "The most avatars to show; the rest are counted in a \"+N\" avatar whose tooltip lists them. 0 shows them all.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/avatar-group"
+        }
+      ]
+    },
     {
       "name": "zn-background",
       "description": "Composes a colour, decorative image, image strength, optional motion and contrast overlay behind slotted content.\n---\n\n\n### **Slots:**\n - _default_ - Content displayed above the background layers.\n\n### **CSS Properties:**\n - **--zn-background-color** - Fallback colour when the `color` attribute is not set. _(default: undefined)_\n- **--zn-background-image-position** - Position of the background image. Defaults to `center`. _(default: undefined)_\n- **--zn-background-overlay-angle** - Direction of the overlay gradient. Defaults to `110deg`. _(default: undefined)_\n- **--zn-background-floating-icon-color** - Colour of the floating icons. Defaults to `currentColor`. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's full-size background canvas.\n- **image** - The decorative background image.\n- **overlay** - The contrast overlay between the image and content.\n- **floating-icons** - The non-interactive layer containing the floating icons.\n- **floating-icon** - Each floating `zn-icon`.\n- **content** - The wrapper around the default slot.",
@@ -190,6 +214,44 @@
         }
       ]
     },
+    {
+      "name": "zn-badge",
+      "description": "Badges label the status or category of a record, such as \"Active\" or \"Past due\".\n---\n\n\n### **Slots:**\n - _default_ - The badge's label.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "type",
+          "description": "`ai` marks AI-generated content only.",
+          "values": [
+            { "name": "neutral" },
+            { "name": "success" },
+            { "name": "warning" },
+            { "name": "danger" },
+            { "name": "info" },
+            { "name": "ai" }
+          ]
+        },
+        {
+          "name": "size",
+          "values": [{ "name": "medium" }, { "name": "large" }]
+        },
+        {
+          "name": "solid",
+          "description": "Fills the badge with its type colour.",
+          "values": []
+        },
+        {
+          "name": "dot",
+          "description": "Leads the label with a dot in the type colour.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/badge"
+        }
+      ]
+    },
     {
       "name": "zn-bulk-actions",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -207,10 +269,11 @@
     },
     {
       "name": "zn-button",
-      "description": "Buttons represent actions that are available to the user.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the button loses focus.\n- **zn-focus** - Emitted when the button gains focus.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Slots:**\n - _default_ - The button's label.\n- **prefix** - A presentational prefix icon or similar element.\n- **suffix** - A presentational suffix icon or similar element.\n- **cancel** - Slot for custom cancel button/content when autoClick is active.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **prefix** - The container that wraps the prefix.\n- **label** - The button's label.\n- **suffix** - The container that wraps the suffix.\n- **caret** - The button's caret icon, an `<zn-icon>` element.\n- **spinner** - The spinner that shows when the button is in the loading state.",
+      "description": "Buttons represent actions that are available to the user.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the button loses focus.\n- **zn-focus** - Emitted when the button gains focus.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **showMenu()** - Opens the advanced options in the `menu` slot.\n- **hideMenu()** - Closes the advanced options in the `menu` slot.\n\n### **Slots:**\n - _default_ - The button's label.\n- **prefix** - A presentational prefix icon or similar element.\n- **suffix** - A presentational suffix icon or similar element.\n- **cancel** - Slot for custom cancel button/content when autoClick is active.\n- **menu** - A `<zn-menu>` of advanced options, opened by a long press, a right click, or ArrowDown on the button.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **prefix** - The container that wraps the prefix.\n- **label** - The button's label.\n- **suffix** - The container that wraps the suffix.\n- **caret** - The button's caret icon, an `<zn-icon>` element.\n- **spinner** - The spinner that shows when the button is in the loading state.",
       "attributes": [
         {
           "name": "color",
+          "description": "`ai` is reserved for actions that invoke or act on AI-generated content.",
           "values": [
             { "name": "default" },
             { "name": "primary" },
@@ -219,14 +282,28 @@
             { "name": "info" },
             { "name": "success" },
             { "name": "warning" },
+            { "name": "ai" },
             { "name": "transparent" },
             { "name": "star" },
             { "name": "(string & Record<never, never>)" }
           ]
         },
+        {
+          "name": "size",
+          "values": [
+            { "name": "small" },
+            { "name": "medium" },
+            { "name": "large" }
+          ]
+        },
         { "name": "hover-color", "values": [] },
         { "name": "text", "values": [] },
         { "name": "outline", "values": [] },
+        {
+          "name": "solid",
+          "description": "Keeps the filled look where a container forces `text`, such as a page header's action menu.",
+          "values": []
+        },
         { "name": "disabled", "values": [] },
         { "name": "grow", "values": [] },
         { "name": "square", "values": [] },
@@ -251,6 +328,29 @@
           "values": []
         },
         { "name": "panel-bg", "values": [] },
+        {
+          "name": "long-press-delay",
+          "description": "How long, in milliseconds, the button must be held to open the `menu` slot.",
+          "values": []
+        },
+        {
+          "name": "menu-placement",
+          "description": "Where the `menu` slot opens relative to the button.",
+          "values": [
+            { "name": "top" },
+            { "name": "top-start" },
+            { "name": "top-end" },
+            { "name": "right" },
+            { "name": "right-start" },
+            { "name": "right-end" },
+            { "name": "bottom" },
+            { "name": "bottom-start" },
+            { "name": "bottom-end" },
+            { "name": "left" },
+            { "name": "left-start" },
+            { "name": "left-end" }
+          ]
+        },
         { "name": "dropdown-closer", "values": [] },
         { "name": "notification", "values": [] },
         { "name": "muted-notifications", "values": [] },
@@ -337,6 +437,16 @@
             { "name": "mixed" }
           ]
         },
+        {
+          "name": "aria-expanded",
+          "description": "Popup state, forwarded to the inner button's `aria-expanded`.",
+          "values": [{ "name": "true" }, { "name": "false" }]
+        },
+        {
+          "name": "aria-haspopup",
+          "description": "Popup type, forwarded to the inner button's `aria-haspopup`.",
+          "values": []
+        },
         { "name": "auto-click", "values": [] },
         { "name": "auto-click-delay", "values": [] },
         { "name": "loading-text", "values": [] },
@@ -348,7 +458,17 @@
             { "name": "center" }
           ]
         },
-        { "name": "loading", "values": [] }
+        { "name": "loading", "values": [] },
+        {
+          "name": "processing",
+          "description": "Shows a spinner and ignores clicks, e.g. while a request is in flight.",
+          "values": []
+        },
+        {
+          "name": "processing-text",
+          "description": "Replaces the label while processing.",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -384,7 +504,7 @@
     },
     {
       "name": "zn-button-menu",
-      "description": "Automatically hides buttons in a menu when the screen is too small.\n---\n\n\n### **Slots:**\n - _default_ - The default slot.",
+      "description": "Automatically hides buttons in a menu when the screen is too small.\n---\n\n\n### **Slots:**\n - _default_ - The default slot.\n- **prefix** - Controls shown just before the inline buttons, such as a segmented toggle. Their width is kept free when working out which buttons fit.",
       "attributes": [
         { "name": "max-width", "values": [] },
         { "name": "containerWidth", "values": [] },
@@ -506,7 +626,7 @@
     },
     {
       "name": "zn-chart",
-      "description": "Chart component powered by Apache ECharts.\n---\n\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Chart component powered by Apache ECharts.\n---\n\n\n### **Events:**\n - **zn-chart-click** - Emitted when a data point, bar or slice is clicked.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
       "attributes": [
         { "name": "type", "values": [{ "name": "ChartType" }] },
         { "name": "data", "values": [{ "name": "SeriesItem[]" }] },
@@ -524,7 +644,11 @@
         { "name": "d-size", "values": [] },
         { "name": "stacked", "values": [] },
         { "name": "live", "values": [] },
-        { "name": "data-url", "values": [] },
+        {
+          "name": "data-url",
+          "description": "JSON series polled with `live`; otherwise fetched once, as a series array or `{categories, data}`.",
+          "values": []
+        },
         { "name": "stream-url", "values": [] },
         { "name": "live-renew-url", "values": [] },
         { "name": "hide-zero", "values": [] },
@@ -540,6 +664,11 @@
         { "name": "show-labels", "values": [] },
         { "name": "min-value", "values": [] },
         { "name": "max-value", "values": [] },
+        {
+          "name": "mark-latest",
+          "description": "On line and area charts, marks each series' latest point and hides the rest.",
+          "values": []
+        },
         { "name": "scale", "values": [] }
       ],
       "references": [
@@ -551,7 +680,7 @@
     },
     {
       "name": "zn-chat-message",
-      "description": "A single message in a chat-style conversation: avatar, sender,\ntime, optional badge, and a message bubble with optional actions. Also renders\nsystem events (connections, transfers, etc.) as a centred card.\n---\n\n\n### **Slots:**\n - _default_ - The message content. Ignored when the `message` attribute is set.\n- **badge** - Rendered in the header after the sender and time (e.g. an INTERNAL NOTE chip).\n- **attachments** - Attachments displayed beneath the message content. Use `zn-chat-message-attachment`, which auto-assigns itself to this slot.\n- **edit-dialog-trigger** - Action rendered at the end of the bubble (e.g. a remove icon button).\n- **edit-dialog** - Pass-through for an associated dialog element.\n\n### **CSS Properties:**\n - **--message-background** - The bubble's background color. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **avatar** - The avatar column.\n- **body** - The header and bubble column.\n- **header** - The sender/time/badge row.\n- **bubble** - The message bubble.\n- **content** - The message content within the bubble.\n- **attachments** - The attachments row beneath the message content.\n- **system-card** - The card rendered for system action types.",
+      "description": "A single message in a chat-style conversation: avatar, sender,\ntime, optional badge, and a message bubble with optional actions. Also renders\nsystem events (connections, transfers, etc.) as a centred card.\n---\n\n\n### **Slots:**\n - _default_ - The message content. Ignored when the `message` attribute is set.\n- **badge** - Rendered in the header after the sender and time (e.g. an INTERNAL NOTE chip).\n- **attachments** - Attachments displayed beneath the message content. Use `zn-chat-message-attachment`, which auto-assigns itself to this slot.\n- **footer** - Content beneath the bubble, such as reactions or a thread summary.\n- **edit-dialog-trigger** - Action rendered at the end of the bubble (e.g. a remove icon button).\n- **edit-dialog** - Pass-through for an associated dialog element.\n\n### **CSS Properties:**\n - **--message-background** - The bubble's background color. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **avatar** - The avatar column.\n- **body** - The header and bubble column.\n- **header** - The sender/time/badge row.\n- **bubble** - The message bubble.\n- **content** - The message content within the bubble.\n- **attachments** - The attachments row beneath the message content.\n- **footer** - The row beneath the bubble.\n- **system-card** - The card rendered for system action types.",
       "attributes": [
         {
           "name": "sender",
@@ -697,6 +826,11 @@
           "description": "Squares off the corners of the container drawn by `contained`, which is rounded by default.",
           "values": []
         },
+        {
+          "name": "centered",
+          "description": "Centres the text of a contained checkbox that has no image or `card-title`.",
+          "values": []
+        },
         {
           "name": "src",
           "description": "URL for the image shown in a contained checkbox.",
@@ -714,7 +848,7 @@
         },
         {
           "name": "control-position",
-          "description": "Places the checkbox indicator within a contained card. Use `none` to hide the indicator so the card itself\nshows the selected state. Requires `contained`.",
+          "description": "Places the checkbox indicator within a contained card. A contained checkbox without an image or `card-title` hides it\nat `start`, as does `none`. Requires `contained`.",
           "values": [{ "name": "SelectionCardControlPosition" }]
         },
         {
@@ -756,7 +890,7 @@
         },
         {
           "name": "unchecked-icon",
-          "description": "The icon to show when the checkbox is unchecked.",
+          "description": "The icon to show when the checkbox is unchecked. Defaults to a muted `checked-icon`.",
           "values": []
         },
         {
@@ -835,6 +969,11 @@
           "description": "Squares off the corners of every contained checkbox in the group, which are rounded by default.",
           "values": []
         },
+        {
+          "name": "centered",
+          "description": "Centres the text of every contained checkbox in the group.",
+          "values": []
+        },
         {
           "name": "wrap",
           "description": "Lays horizontal contained checkboxes out as a wrapping row instead of an equal-width grid, so each one sizes from\n`--zn-checkbox-group-column-width` (set it to `auto` to size from content) and wraps onto a new line when needed.",
@@ -867,17 +1006,29 @@
         { "name": "icon-size", "values": [] },
         {
           "name": "type",
+          "description": "`ai` marks AI-generated content only.",
           "values": [
             { "name": "info" },
             { "name": "success" },
             { "name": "warning" },
             { "name": "error" },
             { "name": "primary" },
+            { "name": "ai" },
             { "name": "transparent" },
             { "name": "custom" },
             { "name": "neutral" }
           ]
         },
+        {
+          "name": "solid",
+          "description": "Fills the chip with its type colour.",
+          "values": []
+        },
+        {
+          "name": "dot",
+          "description": "Leads the label with a dot in the type colour.",
+          "values": []
+        },
         { "name": "flush", "values": [] },
         { "name": "flush-x", "values": [] },
         { "name": "flush-y", "values": [] }
@@ -912,6 +1063,29 @@
         }
       ]
     },
+    {
+      "name": "zn-color-picker",
+      "description": "A colour panel: a saturation/brightness area, a hue slider and the colour's HEX, RGB, HSL and OKLCH values.\n---\n\n\n### **Events:**\n - **zn-input** - Emitted when the colour or the format being worked in changes.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Moves focus to the colour area.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "The colour, in any CSS colour syntax. Reads back as `#RRGGBB`.",
+          "values": []
+        },
+        {
+          "name": "format",
+          "description": "The format being worked in. Focusing or editing a row switches to that row's format.",
+          "values": [{ "name": "ColorFormat" }]
+        },
+        { "name": "label", "values": [] }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/color-picker"
+        }
+      ]
+    },
     {
       "name": "zn-color-select",
       "description": "A simple color picker. The dropdown lists color swatches with names; the closed control shows only the selected color's swatch.\n---\n\n\n### **Events:**\n - **zn-input** - Emitted when the selected color changes.\n- **zn-clear** - Emitted when the clear button is activated.\n\n### **CSS Parts:**\n - **swatch** - The color swatch shown in the closed control.\n- **combobox** - The container that wraps the swatch and expand button (forwarded from zn-select).\n- **form-control-help-text** - The help text's wrapper (forwarded from zn-select).\n- **form-control-input** - The select's wrapper (forwarded from zn-select).",
@@ -966,6 +1140,11 @@
           "values": []
         },
         { "name": "mc", "values": [] },
+        {
+          "name": "basis",
+          "description": "Minimum width in px of a one-unit column before the row wraps; a column of layout `n` asks for n times this. Defaults to 250.",
+          "values": []
+        },
         { "name": "no-gap", "values": [] },
         { "name": "border", "values": [] },
         { "name": "pad", "values": [] },
@@ -1017,9 +1196,9 @@
         { "name": "caption", "values": [] },
         { "name": "action", "values": [] },
         { "name": "content", "values": [] },
-        { "name": "confirmText", "values": [] },
-        { "name": "cancelText", "values": [] },
-        { "name": "closeText", "values": [] },
+        { "name": "confirm-text", "values": [] },
+        { "name": "cancel-text", "values": [] },
+        { "name": "close-text", "values": [] },
         { "name": "hide-icon", "values": [] },
         {
           "name": "show-loading",
@@ -1232,6 +1411,37 @@
         { "name": "caption", "values": [] },
         { "name": "empty-state-caption", "values": [] },
         { "name": "empty-state-icon", "values": [] },
+        {
+          "name": "total-label",
+          "description": "Unit for the row total shown with the caption: \"publishers\" reads \"16 publishers\".",
+          "values": []
+        },
+        {
+          "name": "total-label-singular",
+          "description": "Unit used when the total is exactly one: \"publisher\" reads \"1 publisher\". Falls back to `total-label`.",
+          "values": []
+        },
+        {
+          "name": "tabs",
+          "description": "Tabs rendered inside the table. The selected tab's value is sent as `tab-param` with every request.",
+          "values": [{ "name": "TableTab[]" }]
+        },
+        { "name": "tab-param", "values": [] },
+        {
+          "name": "pill-tabs",
+          "description": "Draws the tabs as a segmented control: a grey track with a pill that slides to the selected tab.",
+          "values": []
+        },
+        {
+          "name": "active-tab",
+          "description": "The selected tab's value; the first tab when empty.",
+          "values": []
+        },
+        {
+          "name": "filter-fields",
+          "description": "Fields for the funnel's filter builder. When set, the table renders its own zn-data-table-filter in the\nheader, in place of the `filter` slot, and the applied rules show as chips under the tabs. Rules are sent\nas `filter`.",
+          "values": [{ "name": "FilterField[]" }]
+        },
         { "name": "filters", "values": [{ "name": "[]" }] },
         { "name": "method", "values": [{ "name": "GET" }, { "name": "POST" }] },
         { "name": "no-initial-load", "values": [] },
@@ -1258,14 +1468,14 @@
     },
     {
       "name": "zn-data-table-filter",
-      "description": "An inline filter bar for data tables. Each active filter is a pill whose dropdown sets its value.\n---\n\n\n### **Events:**\n - **zn-filter-change** - Emitted when the active filters change. Read the encoded query off `value`.\n\n### **Methods:**\n - **clear()** - Removes every active filter.",
+      "description": "The filter for data tables: a funnel that opens a field / operator / value builder, and chips for the\nrules that apply.\n---\n\n\n### **Events:**\n - **zn-filter-change** - Emitted when the applied rules change. Read the encoded query off `value`.\n- **zn-clear** - Emitted when `clear()` removes every rule.\n\n### **Methods:**\n - **show()** - Opens the filter builder.\n- **hide()** - Closes the filter builder.\n- **clear()** - Removes every rule.",
       "attributes": [
-        { "name": "filters", "values": [{ "name": "QueryBuilderData" }] },
+        { "name": "filters", "values": [{ "name": "FilterField[]" }] },
         { "name": "name", "values": [] },
         { "name": "value", "values": [] },
         {
           "name": "default-filters",
-          "description": "Filter keys to show a pill for before the user adds any.",
+          "description": "Fields to offer an empty rule for when the builder opens with nothing applied.",
           "values": []
         }
       ],
@@ -1330,59 +1540,58 @@
       ]
     },
     {
-      "name": "zn-defined-label",
-      "description": "This component provides a labeled input with support for predefined and custom labels,\nallowing users to select or enter label-value pairs within a dropdown interface.\n---\n\n\n### **CSS Parts:**\n - **input** - The component's main input.\n- **input-value** - The label's value inputs.",
+      "name": "zn-date-range",
+      "description": "A button showing a date range that opens a two-month calendar with quick ranges.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when a range is applied, with `{from, to}` as its detail.\n\n### **Methods:**\n - **show()** - Opens the picker.\n- **hide()** - Closes the picker without applying.\n\n### **CSS Parts:**\n - **trigger** - The button that opens the picker.\n- **popover** - The picker popover.",
       "attributes": [
         {
-          "name": "value",
-          "description": "The selected label key. Also acts as the filter while typing.",
+          "name": "from",
+          "description": "The first day of the range, `YYYY-MM-DD`. Defaults to today.",
           "values": []
         },
         {
-          "name": "inputValue",
-          "description": "The value entered for the selected label. Submitted as `label:value` when present.",
+          "name": "to",
+          "description": "The last day of the range, `YYYY-MM-DD`. Defaults to today.",
           "values": []
         },
         {
-          "name": "input-size",
-          "description": "The size of the main input.",
-          "values": [
-            { "name": "x-small" },
-            { "name": "small" },
-            { "name": "medium" },
-            { "name": "large" }
-          ]
+          "name": "min",
+          "description": "The earliest day that can be picked.",
+          "values": []
         },
         {
-          "name": "name",
-          "description": "The name of the control. Used for form submission.",
+          "name": "max",
+          "description": "The latest day that can be picked.",
           "values": []
         },
         {
-          "name": "title",
-          "description": "The title of the main input.",
-          "values": []
+          "name": "presets",
+          "description": "Quick ranges as a JSON array of `{label, from, to}`, replacing the default ones.",
+          "values": [{ "name": "DatePreset[]" }]
         },
         {
-          "name": "disabled",
-          "description": "Disables the control.",
+          "name": "note",
+          "description": "A short line shown under the calendar, such as how the range is used.",
           "values": []
         },
         {
-          "name": "allow-custom",
-          "description": "Allows labels that aren't in the predefined list.",
+          "name": "name",
+          "description": "Submits `name[from]` and `name[to]` with the form.",
           "values": []
         },
         {
-          "name": "predefined-labels",
-          "description": "The predefined labels. Entries are either a string or `{name, options}`.",
-          "values": [{ "name": "(PredefinedLabel" }, { "name": "string)[]" }]
+          "name": "size",
+          "description": "The trigger button's size.",
+          "values": [
+            { "name": "small" },
+            { "name": "medium" },
+            { "name": "large" }
+          ]
         }
       ],
       "references": [
         {
           "name": "Documentation",
-          "url": "https://zinc.style/components/defined-label"
+          "url": "https://zinc.style/components/date-range"
         }
       ]
     },
@@ -1461,6 +1670,11 @@
           "description": "Makes the input a required field.",
           "values": []
         },
+        {
+          "name": "label-note",
+          "description": "Short text shown next to the label, styled like the help text, e.g. `optional`.",
+          "values": []
+        },
         {
           "name": "clearable",
           "description": "Adds a clear button to the calendar for removing a selected date. *",
@@ -1519,9 +1733,66 @@
         }
       ]
     },
+    {
+      "name": "zn-defined-label",
+      "description": "This component provides a labeled input with support for predefined and custom labels,\nallowing users to select or enter label-value pairs within a dropdown interface.\n---\n\n\n### **CSS Parts:**\n - **input** - The component's main input.\n- **input-value** - The label's value inputs.",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "The selected label key. Also acts as the filter while typing.",
+          "values": []
+        },
+        {
+          "name": "inputValue",
+          "description": "The value entered for the selected label. Submitted as `label:value` when present.",
+          "values": []
+        },
+        {
+          "name": "input-size",
+          "description": "The size of the main input.",
+          "values": [
+            { "name": "x-small" },
+            { "name": "small" },
+            { "name": "medium" },
+            { "name": "large" }
+          ]
+        },
+        {
+          "name": "name",
+          "description": "The name of the control. Used for form submission.",
+          "values": []
+        },
+        {
+          "name": "title",
+          "description": "The title of the main input.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Disables the control.",
+          "values": []
+        },
+        {
+          "name": "allow-custom",
+          "description": "Allows labels that aren't in the predefined list.",
+          "values": []
+        },
+        {
+          "name": "predefined-labels",
+          "description": "The predefined labels. Entries are either a string or `{name, options}`.",
+          "values": [{ "name": "(PredefinedLabel" }, { "name": "string)[]" }]
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/defined-label"
+        }
+      ]
+    },
     {
       "name": "zn-dialog",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-show** - Emitted when the dialog is opens.\n- **zn-close** - Emitted when the dialog is closed.\n- **zn-request-close** - Emitted when the user attempts to close the dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog.\n\n### **Slots:**\n - _default_ - The default slot.\n- **label** - The dialog's label. Alternatively you can use the `label` attribute.\n- **header-icon** - Optional icon to add to the left of the dialog's label (title). A color will be applied to the icon depending on the dialog variant.\n- **announcement-intro** - Optional Intro text to display below the icon, when using the variant `announcement`.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **footer** - The dialog's footer. This is typically used for buttons representing various options.\n- **footer-text** - Optional text to include below the footer buttons, when using the variant `announcement`.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the dialog. Note the dialog will shrink to accommodate smaller screens. _(default: undefined)_\n- **--header-spacing** - The amount of padding to use for the header. _(default: undefined)_\n- **--body-spacing** - The amount of padding to use for the body. _(default: undefined)_\n- **--footer-spacing** - The amount of padding to use for the footer. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **title** - The dialog's title.\n- **close-button** - The dialog's close button.\n- **close-button__base** - The close buttons exported `base` part.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",
+      "description": "A modal that appears above the page for a decision that blocks the flow.\n---\n\n\n### **Events:**\n - **zn-show** - Emitted when the dialog opens.\n- **zn-close** - Emitted when the dialog is closed.\n- **zn-request-close** - Emitted when the user attempts to close the dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog.\n\n### **Slots:**\n - _default_ - The default slot.\n- **label** - The dialog's label. Alternatively you can use the `label` attribute.\n- **header-icon** - Optional icon to add to the left of the dialog's label (title). A color will be applied to the icon depending on the dialog variant.\n- **announcement-intro** - Optional intro text to display below the icon, when using the variant `announcement`.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **footer** - The dialog's footer. This is typically used for buttons representing various options.\n- **footer-text** - Optional text to include below the footer buttons, when using the variant `announcement`.\n\n### **CSS Properties:**\n - **--width** - The preferred width of a `size=\"custom\"` dialog. The dialog shrinks to fit smaller screens. _(default: undefined)_\n- **--header-spacing** - The amount of padding to use for the header. _(default: undefined)_\n- **--body-spacing** - The amount of padding to use for the body. _(default: undefined)_\n- **--footer-spacing** - The amount of padding to use for the footer. _(default: undefined)_\n- **--zn-dialog-width-small** - Theme token: the width of `size=\"small\"`. _(default: undefined)_\n- **--zn-dialog-width-medium** - Theme token: the width of `size=\"medium\"`. _(default: undefined)_\n- **--zn-dialog-width-large** - Theme token: the width of `size=\"large\"`. _(default: undefined)_\n- **--zn-dialog-border-radius** - Theme token: the dialog's corner radius. _(default: undefined)_\n- **--zn-dialog-backdrop** - Theme token: the backdrop behind the dialog. _(default: undefined)_\n- **--zn-dialog-body-color** - Theme token: the body text colour. _(default: undefined)_\n- **--zn-dialog-icon-background** - Theme token: the fill behind a default or warning header icon. _(default: undefined)_\n- **--zn-dialog-close-color** - Theme token: the close button's icon colour. _(default: undefined)_\n- **--zn-dialog-close-icon-size** - Theme token: the close button's icon size, read when the dialog opens. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **title** - The dialog's title.\n- **close-button** - The dialog's close button.\n- **close-button__base** - The close button's exported `base` part.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",
       "attributes": [
         {
           "name": "variant",
@@ -1533,41 +1804,107 @@
           ]
         },
         {
-          "name": "size",
-          "description": "The dialog's size.",
-          "values": [
-            { "name": "small" },
-            { "name": "medium" },
-            { "name": "large" },
-            { "name": "custom" }
-          ]
+          "name": "size",
+          "description": "The dialog's size.",
+          "values": [
+            { "name": "small" },
+            { "name": "medium" },
+            { "name": "large" },
+            { "name": "custom" }
+          ]
+        },
+        {
+          "name": "open",
+          "description": "Indicated whether of not the dialog is open. You can toggle this attribute to show and hide the dialog, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the dialog's state.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "The dialog's label as displayed in the header. You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.",
+          "values": []
+        },
+        { "name": "cosmic", "values": [] },
+        {
+          "name": "no-header",
+          "description": "Disables the header. This will also remove the default close button, so please ensure you provide an easy,\naccessible way to close the dialog.",
+          "values": []
+        },
+        {
+          "name": "trigger",
+          "description": "The dialog's trigger element. This is used to open the dialog when clicked. If you do not provide a trigger, you\nwill need to manually open the dialog using the `show()` method.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/dialog"
+        }
+      ]
+    },
+    {
+      "name": "zn-diff",
+      "description": "A side-by-side comparison of two versions of something, one column each, built from `zn-diff-row`s.\n---\n\n\n### **Slots:**\n - _default_ - The `zn-diff-row`s.\n- **before** - Inline content after the left heading, such as a status badge.\n- **after** - Inline content after the right heading, such as a status badge.\n\n### **CSS Properties:**\n - **--zn-diff-head-background** - The heading row's background. _(default: undefined)_\n- **--zn-diff-sticky-top** - How far from the top of its scroll container the heading row sticks. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The table.\n- **head** - The sticky row of column headings.",
+      "attributes": [
+        {
+          "name": "before-caption",
+          "description": "The left column's heading, such as the older version.",
+          "values": []
+        },
+        {
+          "name": "before-description",
+          "description": "A line under the left heading.",
+          "values": []
+        },
+        {
+          "name": "after-caption",
+          "description": "The right column's heading, such as the newer version.",
+          "values": []
+        },
+        {
+          "name": "after-description",
+          "description": "A line under the right heading.",
+          "values": []
+        }
+      ],
+      "references": [
+        { "name": "Documentation", "url": "https://zinc.style/components/diff" }
+      ]
+    },
+    {
+      "name": "zn-diff-row",
+      "description": "One aligned row of a `zn-diff`: the same item in both versions, tinted by how it changed.\n---\n\n\n### **Slots:**\n - **before** - The item's details in the older version.\n- **after** - The item's details in the newer version.\n\n### **CSS Properties:**\n - **--zn-diff-row-border** - The line below the row. _(default: undefined)_\n\n### **CSS Parts:**\n - **row** - The row.\n- **before** - The left cell.\n- **after** - The right cell.",
+      "attributes": [
+        {
+          "name": "caption",
+          "description": "The item's name, shown in both columns.",
+          "values": []
         },
         {
-          "name": "open",
-          "description": "Indicated whether of not the dialog is open. You can toggle this attribute to show and hide the dialog, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the dialog's state.",
+          "name": "change",
+          "description": "How the item changed: `changed`, `added` or `removed`. Unchanged when empty.",
           "values": []
         },
         {
-          "name": "label",
-          "description": "The dialog's label as displayed in the header. You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.",
+          "name": "heading",
+          "description": "When true, the row is a heading spanning both columns, such as a section name.",
           "values": []
         },
-        { "name": "cosmic", "values": [] },
         {
-          "name": "no-header",
-          "description": "Disables the header. This will also remove the default close button, so please ensure you provide an easy,\naccessible way to close the dialog.",
+          "name": "before-placeholder",
+          "description": "Shown in the left column when the item was added.",
           "values": []
         },
         {
-          "name": "trigger",
-          "description": "The dialog's trigger element. This is used to open the dialog when clicked. If you do not provide a trigger, you\nwill need to manually open the dialog using the `show()` method.",
+          "name": "after-placeholder",
+          "description": "Shown in the right column when the item was removed.",
           "values": []
         }
       ],
       "references": [
         {
           "name": "Documentation",
-          "url": "https://zinc.style/components/dialog"
+          "url": "https://zinc.style/components/diff-row"
         }
       ]
     },
@@ -1644,11 +1981,42 @@
     },
     {
       "name": "zn-editor",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n- **help-text** - Text under the editor. Alternatively, use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
       "attributes": [
         { "name": "id", "values": [] },
         { "name": "name", "values": [] },
         { "name": "value", "values": [] },
+        { "name": "placeholder", "values": [] },
+        {
+          "name": "compact",
+          "description": "Draws the editor as a form field: a bordered, resizable box under a small toolbar of bold, italic, link and lists.",
+          "values": []
+        },
+        {
+          "name": "source",
+          "description": "Adds a Source button that switches to editing the raw HTML, which is submitted as written.",
+          "values": []
+        },
+        {
+          "name": "document-mode",
+          "description": "Edits the HTML in place as a whole document, keeping layout the editor can't hold, such as a designed email.",
+          "values": []
+        },
+        {
+          "name": "readonly",
+          "description": "Shows only the content, without a toolbar or box, such as the source beside a translation.",
+          "values": []
+        },
+        {
+          "name": "prefix",
+          "description": "With `compact`, a short label inside the box ahead of the content, such as a language code.",
+          "values": []
+        },
+        {
+          "name": "help-text",
+          "description": "Text under the editor that describes how to use it. If you need to display HTML, use the `help-text` slot instead.",
+          "values": []
+        },
         {
           "name": "interaction-type",
           "values": [{ "name": "ticket" }, { "name": "chat" }]
@@ -1664,6 +2032,11 @@
         { "name": "emojis", "values": [] },
         { "name": "code", "values": [] },
         { "name": "ai", "values": [] },
+        {
+          "name": "merge-fields",
+          "description": "Shows `{{token}}` replacements as highlighted chips, labelled from the matching `context-items`\nquick action. The value still holds the raw tokens.",
+          "values": []
+        },
         { "name": "ai-path", "values": [] },
         {
           "name": "store-key",
@@ -1704,7 +2077,12 @@
             { "name": "''" }
           ]
         },
-        { "name": "padded", "values": [] }
+        { "name": "padded", "values": [] },
+        {
+          "name": "tile",
+          "description": "Draws the icon small inside a tinted, rounded tile rather than as a large glyph.",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -1847,6 +2225,11 @@
           "name": "upload-url",
           "description": "When set, a chosen file is immediately POSTed (multipart, field `file`) to this URL.\nThe endpoint must respond with JSON `{\"url\": \"...\"}`; that URL becomes the control's\nvalue (and `src` preview) in place of the file bytes, so the control works inside\nJSON-serialising hosts such as `zn-page-builder`. Emits `zn-error` when the upload fails.",
           "values": []
+        },
+        {
+          "name": "max-size",
+          "description": "The largest each file can be, in megabytes. A bigger file makes the control invalid. 0 for no limit.",
+          "values": []
         }
       ],
       "references": [
@@ -1867,7 +2250,19 @@
     {
       "name": "zn-filter-wrapper",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-      "attributes": [{ "name": "button", "values": [] }],
+      "attributes": [
+        { "name": "button", "values": [] },
+        {
+          "name": "submit-on-enter",
+          "description": "Submits the filters when Enter is pressed in a text field.",
+          "values": []
+        },
+        {
+          "name": "loading-text",
+          "description": "Shown on the submit button while results load.",
+          "values": []
+        }
+      ],
       "references": [
         {
           "name": "Documentation",
@@ -1950,6 +2345,11 @@
           "name": "form",
           "description": "The id of the form to act on. If omitted, the closest containing form is used.",
           "values": []
+        },
+        {
+          "name": "loading-on-submit",
+          "description": "Shows the submit button loading and ignores further submits until the console reports the request finished,\nso a slow save such as an upload can't be sent twice. Only for forms the console submits.",
+          "values": []
         }
       ],
       "references": [
@@ -1980,6 +2380,11 @@
         },
         { "name": "cols", "values": [] },
         { "name": "layout", "values": [] },
+        {
+          "name": "compact",
+          "description": "Labels the group like one of its fields and keeps it tight to them, for a section inside a form or dialog.",
+          "values": []
+        },
         { "name": "pad", "values": [] }
       ],
       "references": [
@@ -1998,6 +2403,16 @@
         { "name": "entity-id-show", "values": [] },
         { "name": "transparent", "values": [] },
         { "name": "caption", "values": [] },
+        {
+          "name": "description",
+          "description": "A line of muted text under the caption.",
+          "values": []
+        },
+        {
+          "name": "inline-description",
+          "description": "Sets the description beside the caption rather than under it, e.g. a row count.",
+          "values": []
+        },
         { "name": "icon", "values": [] },
         { "name": "navigation", "values": [{ "name": "array" }] },
         { "name": "full-width", "values": [] },
@@ -2051,11 +2466,15 @@
     },
     {
       "name": "zn-icon",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "\n---\n",
       "attributes": [
         { "name": "src", "values": [] },
         { "name": "alt", "values": [] },
-        { "name": "size", "values": [] },
+        {
+          "name": "size",
+          "description": "Size in pixels, or one of the avatar sizes `sm` (22), `md` (28), `lg` (40) and `xl` (56).",
+          "values": []
+        },
         { "name": "round", "values": [] },
         { "name": "tile", "values": [] },
         { "name": "depth", "values": [] },
@@ -2064,7 +2483,17 @@
         { "name": "fill", "values": [{ "name": "IconColor" }] },
         { "name": "padded", "values": [] },
         { "name": "blink", "values": [] },
-        { "name": "squared", "values": [] }
+        { "name": "squared", "values": [] },
+        {
+          "name": "presence",
+          "description": "A live-status dot on an avatar: `online`, `away`, `busy`, `meeting` or `offline`.",
+          "values": [{ "name": "AvatarPresence" }]
+        },
+        {
+          "name": "solid",
+          "description": "Draws an avatar as a solid circle even where the theme tints avatars.",
+          "values": []
+        }
       ],
       "references": [
         { "name": "Documentation", "url": "https://zinc.style/components/icon" }
@@ -2098,7 +2527,7 @@
     },
     {
       "name": "zn-inline-edit",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - Default slot. When `input-type` is `select`, accepts `zn-option` elements to define select options. If provided, takes precedence over the `options` property.\n- **example** - An example slot.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - Default slot. When `input-type` is `select`, accepts `zn-option` elements to define select options. If provided, takes precedence over the `options` property.\n- **example** - An example slot.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-inline-edit-hover-background** - The fill behind a field while hovered or focused. _(default: undefined)_\n- **--zn-inline-edit-bleed** - How far the hover fill extends past the left edge of the value. _(default: undefined)_\n- **--zn-inline-edit-underline-color** - The dotted underline marking an editable value at rest. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
       "attributes": [
         { "name": "value", "values": [{ "name": "string[]" }] },
         { "name": "name", "values": [] },
@@ -2233,7 +2662,7 @@
     },
     {
       "name": "zn-input",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the control loses focus.\n- **zn-change** - Emitted when an alteration to the control's value is committed by the user.\n- **zn-clear** - Emitted when the clear button is activated.\n- **zn-focus** - Emitted when the control gains focus.\n- **zn-input** - Emitted when the control receives input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **zn-slash-select** - Emitted when a slash menu item is chosen. Cancelable — call `preventDefault()` to suppress the insertion and handle the item yourself.\n- **zn-slash-insert** - Emitted after a slash menu item's value has been inserted.\n\n### **Methods:**\n - **resolveSlashItems(search): _Promise<SlashMenuItem[]>_** - The insertions the slash menu offers, gathered from every source, in the order they were declared.\n- **showSlashMenu()** - Opens the slash menu at the caret, inserting the trigger if it isn't already there.\n- **hideSlashMenu()** - Closes the slash menu.\n- **focus(options: _FocusOptions_)** - Sets focus on the input.\n- **blur()** - Removes focus from the input.\n- **select()** - Selects all the text in the input.\n- **setSelectionRange(selectionStart: _number_, selectionEnd: _number_, selectionDirection: _'forward' | 'backward' | 'none'_)** - Sets the start and end positions of the text selection (0-based).\n- **setRangeText(replacement: _string_, start: _number_, end: _number_, selectMode: _'select' | 'start' | 'end' | 'preserve'_)** - Replaces a range of text with a new string.\n- **showPicker()** - Displays the browser picker for an input element (only works if the browser supports it for the input type).\n- **stepUp()** - Increments the value of a numeric input type by the value of the step attribute.\n- **stepDown()** - Decrements the value of a numeric input type by the value of the step attribute.\n- **checkValidity(): _boolean_** - Checks the validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n- **context-note** - Used to add contextual text that is displayed above the input, on the right. Alternatively, you can use the `context-note` attribute. Range inputs display their live value here unless this is set.\n- **prefix** - Used to prepend a presentational icon or similar element to the input.\n- **suffix** - Used to append a presentational icon or similar element to the input.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **show-password-icon** - An icon to use in lieu of the default show password icon.\n- **hide-password-icon** - An icon to use in lieu of the default hide password icon.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **slash-items** - `<zn-slash-item>` elements describing the insertions offered by the slash menu. Items are picked up wherever they sit inside the input, so this slot name is optional.\n- **slash-menu** - A `<zn-slash-menu>` to use instead of the built-in one, so its heading, sizing and styling can be set in markup. Any `<zn-slash-item>` children of it become the menu's items.\n\n### **CSS Properties:**\n - **--zn-range-track-height** - The height of a range input's track. _(default: undefined)_\n- **--zn-range-track-color** - The color of a range input's track. _(default: undefined)_\n- **--zn-range-thumb-size** - The diameter of a range input's thumb. _(default: undefined)_\n- **--zn-range-thumb-color** - The color of a range input's thumb. _(default: undefined)_\n- **--zn-range-thumb-ring-width** - The width of the ring drawn around a range input's thumb. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **slash-menu** - The slash menu shown at the caret.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **input** - The internal `<input>` control.\n- **prefix** - The container that wraps the prefix.\n- **clear-button** - The clear button.\n- **password-toggle-button** - The password toggle button.\n- **suffix** - The container that wraps the suffix.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the control loses focus.\n- **zn-change** - Emitted when an alteration to the control's value is committed by the user.\n- **zn-clear** - Emitted when the clear button is activated.\n- **zn-focus** - Emitted when the control gains focus.\n- **zn-input** - Emitted when the control receives input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n- **zn-slash-select** - Emitted when a slash menu item is chosen. Cancelable — call `preventDefault()` to suppress the insertion and handle the item yourself.\n- **zn-slash-insert** - Emitted after a slash menu item's value has been inserted.\n\n### **Methods:**\n - **resolveSlashItems(search): _Promise<SlashMenuItem[]>_** - The insertions the slash menu offers, gathered from every source, in the order they were declared.\n- **showSlashMenu()** - Opens the slash menu at the caret, inserting the trigger if it isn't already there.\n- **hideSlashMenu()** - Closes the slash menu.\n- **focus(options: _FocusOptions_)** - Sets focus on the input.\n- **blur()** - Removes focus from the input.\n- **select()** - Selects all the text in the input.\n- **setSelectionRange(selectionStart: _number_, selectionEnd: _number_, selectionDirection: _'forward' | 'backward' | 'none'_)** - Sets the start and end positions of the text selection (0-based).\n- **setRangeText(replacement: _string_, start: _number_, end: _number_, selectMode: _'select' | 'start' | 'end' | 'preserve'_)** - Replaces a range of text with a new string.\n- **showPicker()** - Displays the browser picker for an input element (only works if the browser supports it for the input type).\n- **stepUp()** - Increments the value of a numeric input type by the value of the step attribute.\n- **stepDown()** - Decrements the value of a numeric input type by the value of the step attribute.\n- **checkValidity(): _boolean_** - Checks the validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n- **context-note** - Used to add contextual text that is displayed above the input, on the right. Alternatively, you can use the `context-note` attribute. Range inputs display their live value here unless this is set.\n- **prefix** - Used to prepend a presentational icon or similar element to the input.\n- **suffix** - Used to append a presentational icon or similar element to the input.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **show-password-icon** - An icon to use in lieu of the default show password icon.\n- **hide-password-icon** - An icon to use in lieu of the default hide password icon.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **slash-items** - `<zn-slash-item>` elements describing the insertions offered by the slash menu. Items are picked up wherever they sit inside the input, so this slot name is optional.\n- **slash-menu** - A `<zn-slash-menu>` to use instead of the built-in one, so its heading, sizing and styling can be set in markup. Any `<zn-slash-item>` children of it become the menu's items.\n\n### **CSS Properties:**\n - **--zn-range-track-height** - The height of a range input's track. _(default: undefined)_\n- **--zn-range-track-color** - The color of a range input's track. _(default: undefined)_\n- **--zn-range-thumb-size** - The diameter of a range input's thumb. _(default: undefined)_\n- **--zn-range-thumb-color** - The color of a range input's thumb. _(default: undefined)_\n- **--zn-range-thumb-ring-width** - The width of the ring drawn around a range input's thumb. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **slash-menu** - The slash menu shown at the caret.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **input** - The internal `<input>` control.\n- **prefix** - The container that wraps the prefix.\n- **clear-button** - The clear button.\n- **password-toggle-button** - The password toggle button.\n- **suffix** - The container that wraps the suffix.\n- **color-swatch** - The swatch that opens the colour panel on colour inputs.\n- **color-picker** - The colour panel.",
       "attributes": [
         { "name": "title", "values": [] },
         {
@@ -2347,13 +2776,8 @@
         },
         {
           "name": "color-format",
-          "description": "The color format to display for color inputs. Only applies when type is 'color'. *",
-          "values": [
-            { "name": "hex" },
-            { "name": "rgb" },
-            { "name": "hsl" },
-            { "name": "oklch" }
-          ]
+          "description": "The format a colour input writes its value in. Typing a colour in another format, or working in another format's\nrow of the colour panel, switches to that format. Only applies when type is 'color'.",
+          "values": [{ "name": "ColorFormat" }]
         },
         {
           "name": "value-suffix",
@@ -2370,6 +2794,11 @@
           "description": "Makes the input a required field.",
           "values": []
         },
+        {
+          "name": "label-note",
+          "description": "Short text shown next to the label, styled like the help text, e.g. `optional`.",
+          "values": []
+        },
         {
           "name": "pattern",
           "description": "A regular expression pattern to validate input against.",
@@ -2531,6 +2960,21 @@
         { "name": "caption", "values": [] },
         { "name": "description", "values": [] },
         { "name": "stacked", "values": [] },
+        {
+          "name": "fact",
+          "description": "A fact in a grid of headline attributes: a small muted caption above the value, without padding.",
+          "values": []
+        },
+        {
+          "name": "key-value",
+          "description": "A row in a key–value list: a small muted caption beside a right-aligned value, on a compact row.",
+          "values": []
+        },
+        {
+          "name": "mono",
+          "description": "Shows the value in the monospace font, for identifiers and codes.",
+          "values": []
+        },
         {
           "name": "size",
           "values": [
@@ -2604,6 +3048,36 @@
         }
       ]
     },
+    {
+      "name": "zn-key-value",
+      "description": "Edits a list of name and value pairs, submitted as a JSON object.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when a pair is added, removed or edited.\n\n### **Slots:**\n - **label** - The label. Alternatively, use the `label` attribute.\n- **help-text** - Text under the pairs. Alternatively, use the `help-text` attribute.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **row** - Each name and value pair.",
+      "attributes": [
+        { "name": "name", "values": [] },
+        {
+          "name": "value",
+          "description": "The pairs as a JSON object, such as `{\"1\": \"{{recipient.firstName}}\"}`.",
+          "values": []
+        },
+        { "name": "label", "values": [] },
+        { "name": "help-text", "values": [] },
+        { "name": "key-label", "values": [] },
+        { "name": "value-label", "values": [] },
+        { "name": "add-text", "values": [] },
+        {
+          "name": "slash-items",
+          "description": "Passed to each value input, so its slash menu can insert merge fields.",
+          "values": []
+        },
+        { "name": "form", "values": [] },
+        { "name": "disabled", "values": [] }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/key-value"
+        }
+      ]
+    },
     {
       "name": "zn-linked-select",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -2639,7 +3113,7 @@
     },
     {
       "name": "zn-markdown-editor",
-      "description": "A markdown editor with live preview, split view, and a fullscreen mode.\n---\n\n\n### **Events:**\n - **zn-view-mode-change** - Emitted when the user switches between editor / split / preview.\n- **zn-change** - Emitted when the markdown content changes.\n- **zn-input** - Emitted on each keystroke in the editor.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the editor.\n- **blur()** - Removes focus from the editor.\n\n### **Slots:**\n - **label** - The editor label. Alternatively, use the `label` attribute.\n- **help-text** - Help text shown below the editor. Alternatively, use the `help-text` attribute.\n- _default_ - The panel's main content.\n- **actions** - Actions displayed in the panel header (buttons, chips, etc).\n- **footer** - Content displayed in the panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n- **--zn-panel-header-padding** - Padding around the header row. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-footer-padding** - Padding around the footer row. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **toolbar** - The toolbar containing the view-mode and fullscreen controls.\n- **editor** - The textarea wrapper.\n- **preview** - The rendered markdown preview.\n- **header** - The header region, when a caption or actions are given.\n- **header-content** - The padded row inside the header, forwarded from zn-header.\n- **footer** - The footer region, when the footer slot is filled.",
+      "description": "A markdown editor with live preview, split view, and a fullscreen mode.\n---\n\n\n### **Events:**\n - **zn-view-mode-change** - Emitted when the user switches between editor / split / preview.\n- **zn-change** - Emitted when the markdown content changes.\n- **zn-input** - Emitted on each keystroke in the editor.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the editor.\n- **blur()** - Removes focus from the editor.\n\n### **Slots:**\n - **label** - The editor label. Alternatively, use the `label` attribute.\n- **help-text** - Help text shown below the editor. Alternatively, use the `help-text` attribute.\n- _default_ - The panel's main content.\n- **actions** - Actions displayed in the panel header (buttons, chips, etc).\n- **footer** - Content displayed in the panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n- **--zn-panel-header-padding** - Padding around the header row. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-footer-padding** - Padding around the footer row. _(default: undefined)_\n- **--zn-panel-padding** - Padding around the body. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-shadow** - Resting shadow. Defaults to none. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **toolbar** - The toolbar containing the view-mode and fullscreen controls.\n- **editor** - The textarea wrapper.\n- **preview** - The rendered markdown preview.\n- **header** - The header region, when a caption or actions are given.\n- **header-content** - The padded row inside the header, forwarded from zn-header.\n- **header-left** - The caption and description, forwarded from zn-header.\n- **footer** - The footer region, when the footer slot is filled.",
       "attributes": [
         {
           "name": "name",
@@ -2703,6 +3177,16 @@
         },
         { "name": "basis-px", "values": [] },
         { "name": "caption", "values": [] },
+        {
+          "name": "description",
+          "description": "Help text under the caption, in the panel's header.",
+          "values": []
+        },
+        {
+          "name": "inline-description",
+          "description": "Sets the description beside the caption rather than under it.",
+          "values": []
+        },
         { "name": "icon", "values": [] },
         { "name": "tabbed", "values": [] },
         { "name": "header-borderless", "values": [] },
@@ -2738,7 +3222,7 @@
     },
     {
       "name": "zn-menu-item",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n - **getTextLabel()** - Returns a text label based on the contents of the menu item's default slot.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n - **getTextLabel()** - Returns a text label based on the contents of the menu item's default slot.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **shortcut** - The key cap showing the item's `shortcut`.",
       "attributes": [
         {
           "name": "type",
@@ -2826,6 +3310,11 @@
           "name": "active",
           "description": "Marks the menu item as currently active/selected.",
           "values": []
+        },
+        {
+          "name": "shortcut",
+          "description": "A keyboard shortcut shown as a key cap at the end of the item, such as `E` or `⌘K`.",
+          "values": []
         }
       ],
       "references": [
@@ -2835,9 +3324,96 @@
         }
       ]
     },
+    {
+      "name": "zn-menu-label",
+      "description": "A heading for a group of items in a `zn-menu`. It is skipped by the menu's keyboard navigation.\n---\n\n\n### **Slots:**\n - _default_ - The label text.\n\n### **CSS Properties:**\n - **--zn-menu-label-padding** - Space around the label. _(default: undefined)_\n- **--zn-menu-label-color** - The label's text colour. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/menu-label"
+        }
+      ]
+    },
+    {
+      "name": "zn-nav-item",
+      "description": "A selectable row in a `zn-nav-list`, with an optional description and count.\n---\n\n\n### **Slots:**\n - _default_ - The item's label.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The label, truncated with an ellipsis.\n- **description** - The description shown below the label.\n- **count** - The count shown at the end of the row.\n- **handle** - The drag handle, shown when the list is sortable.",
+      "attributes": [
+        {
+          "name": "count",
+          "description": "A count shown at the end of the row, such as the number of entries in the group.",
+          "values": []
+        },
+        {
+          "name": "description",
+          "description": "A line of detail shown below the label.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/nav-item"
+        }
+      ]
+    },
+    {
+      "name": "zn-nav-list",
+      "description": "The list side of a master–detail layout: a card of selectable groups shown beside the selected group's\ncontents. Place it in the `left` slot of `<zn-tabs gap>`, which switches the detail panels.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when a sortable list's items have been moved.\n- **zn-reorder** - Emitted when a sortable list's items have been moved.\n\n### **Methods:**\n - **getPriorityMap()** - The order as `{key, priority}` pairs, counting from 1.\n\n### **Slots:**\n - _default_ - `zn-nav-item` elements.\n- **actions** - Actions in the card's header, beside the caption.\n\n### **CSS Properties:**\n - **--zn-nav-list-width** - The width of the card beside the detail. _(default: undefined)_\n- **--zn-nav-list-max-height** - Caps the card's height; the list scrolls beyond it. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header holding the caption and actions.\n- **search** - The wrapper around the search input.\n- **list** - The scrolling list of items.\n- **empty** - The message shown when the search matches nothing.",
+      "attributes": [
+        {
+          "name": "searchable",
+          "description": "Shows a search input that filters the items by their label.",
+          "values": []
+        },
+        { "name": "search-placeholder", "values": [] },
+        {
+          "name": "empty-label",
+          "description": "Shown when the search matches no items.",
+          "values": []
+        },
+        {
+          "name": "caption",
+          "description": "A heading for the card, shown with the `actions` slot above the items.",
+          "values": []
+        },
+        {
+          "name": "divide",
+          "description": "Draws the items as full-width rows split by dividers, marking the selected one with a bar on its edge.",
+          "values": []
+        },
+        {
+          "name": "sortable",
+          "description": "Lets the items be dragged, or moved with Alt+Arrow keys, into a new order.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "Submits the order as `[{key, priority}]` JSON, keyed by each item's `value` (or `tab`), counting from 1.",
+          "values": []
+        },
+        {
+          "name": "form",
+          "description": "Associates the list with a form by id.",
+          "values": []
+        },
+        { "name": "disabled", "values": [] },
+        {
+          "name": "formaction",
+          "description": "When set, the form is submitted after each reorder, to this URL or, when empty, the form's own action.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/nav-list"
+        }
+      ]
+    },
     {
       "name": "zn-navbar",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **expand** - Expanding action panels rendered alongside the navbar items.\n- **bottom** - Content rendered below the navbar row (e.g. chips, filters).\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **expand** - Expanding action panels rendered alongside the navbar items.\n- **bottom** - Content rendered below the navbar row (e.g. chips, filters).\n\n### **CSS Properties:**\n - **--zn-navbar-tab-indicator-slide** - `1` shows the sliding indicator in place of each tab's own line. _(default: undefined)_\n- **--zn-navbar-tab-indicator-duration** - Duration of the indicator's leading edge (default 300ms). _(default: undefined)_\n- **--zn-navbar-tab-indicator-easing** - Easing of both indicator edges. _(default: undefined)_\n- **--zn-navbar-tab-indicator-trail-duration** - Duration of the trailing edge; longer than the lead stretches the indicator. _(default: undefined)_\n- **--zn-navbar-tab-indicator-trail-easing** - Easing of the trailing edge; defaults to `--zn-navbar-tab-indicator-easing`. _(default: undefined)_\n- **--zn-navbar-tab-indicator-trail-delay** - Delay before the trailing edge follows (default 0ms). _(default: undefined)_\n- **--zn-navbar-tab-indicator-delay** - Delay before the indicator starts to move (default 0ms). _(default: undefined)_\n- **--zn-navbar-tab-indicator-squash** - Vertical scale the indicator squishes to before it travels (default 1, off). _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **indicator** - The active-tab indicator that slides between tabs. Exposes `--zn-navbar-indicator-top` / `--zn-navbar-indicator-height` (the active tab's box) for styles that fill the tab.",
       "attributes": [
         { "name": "navigation", "values": [{ "name": "array" }] },
         { "name": "full-width", "values": [] },
@@ -2847,6 +3423,21 @@
         { "name": "hide-one", "values": [] },
         { "name": "flush", "values": [] },
         { "name": "gutter", "values": [] },
+        {
+          "name": "pill",
+          "description": "Draws the tabs as a segmented control: a grey track with a pill that slides to the active tab.",
+          "values": []
+        },
+        {
+          "name": "size",
+          "description": "With `pill`, `small` draws a shorter track to sit with small controls, such as above a form field.",
+          "values": [{ "name": "small" }, { "name": "medium" }]
+        },
+        {
+          "name": "tabs",
+          "description": "The id of a zn-tabs elsewhere on the page that this navbar's tabs switch, such as one below a page header.",
+          "values": []
+        },
         { "name": "stacked", "values": [] },
         { "name": "dropdown", "values": [{ "name": "array" }] },
         { "name": "no-pad", "values": [{ "name": "false" }] },
@@ -2939,7 +3530,7 @@
     },
     {
       "name": "zn-page",
-      "description": "Combines a page header with tab navigation and tab panels.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n \n\n\n### **Slots:**\n - _default_ - Page content. Use zn-tab for named tabs and header-action/header-actions for header actions. Clicking an element in the content with `tab=\"<tab id>\"` opens that tab.\n- **description** - Rich subtitle/description content. Falls back to the `summary` attribute when empty.\n- **bottom** - Content rendered below the navbar row (e.g. chips, filters). Forwarded to the navbar's bottom slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Combines a page header with tab navigation and tab panels.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Methods:**\n \n\n\n### **Slots:**\n - _default_ - Page content. Use zn-tab for named tabs; without any, the content is shown as the page's only view. A zn-tab holding zn-tabs shows them as a second tab set, drawn as pills. Use header-action/header-actions for header actions. Clicking an element in the content with `tab=\"<tab id>\"` opens that tab.\n- **caption-badges** - Badges shown beside the caption, wrapping onto the next line as one group.\n- **description** - Rich subtitle/description content. Falls back to the `summary` attribute when empty.\n- **bottom** - Content rendered below the navbar row (e.g. chips, filters). Forwarded to the navbar's bottom slot.\n- **footer** - Actions pinned below the content, such as a form's `zn-form-actions`. In a modal page it takes the dialog footer's styling.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **footer** - The footer wrapping the footer slot.\n- **base** - The component's base wrapper.",
       "attributes": [
         { "name": "caption", "values": [] },
         { "name": "entity-id", "values": [] },
@@ -2947,6 +3538,15 @@
         { "name": "full-location", "values": [] },
         { "name": "modal", "values": [] },
         { "name": "nested", "values": [] },
+        {
+          "name": "navigation-style",
+          "description": "The tab design: `tabs` (the default), `pills` for a second tab set below a main tab bar, shown without the page\nheader, or `sidebar` when the tabs are shown outside the page, which hides the tab bar unless it has bottom content.",
+          "values": [
+            { "name": "tabs" },
+            { "name": "pills" },
+            { "name": "sidebar" }
+          ]
+        },
         { "name": "primary", "values": [] },
         { "name": "previous-path", "values": [] },
         { "name": "previous-target", "values": [] },
@@ -2966,6 +3566,16 @@
         { "name": "store-key", "values": [] },
         { "name": "store-ttl", "values": [] },
         { "name": "padded", "values": [] },
+        {
+          "name": "select-added",
+          "description": "With `store-key`, opens a tab that has appeared since the page was last shown, such as one for an item just\nadded, in place of the remembered tab.",
+          "values": []
+        },
+        {
+          "name": "gap",
+          "description": "Spaces a left or right slot from the content, for side navigation laid out as its own card.",
+          "values": []
+        },
         { "name": "fetch-style", "values": [] },
         { "name": "full-width", "values": [] },
         { "name": "padded-right", "values": [] },
@@ -3045,6 +3655,16 @@
         { "name": "store-key", "values": [] },
         { "name": "store-ttl", "values": [] },
         { "name": "padded", "values": [] },
+        {
+          "name": "select-added",
+          "description": "With `store-key`, opens a tab that has appeared since the page was last shown, such as one for an item just\nadded, in place of the remembered tab.",
+          "values": []
+        },
+        {
+          "name": "gap",
+          "description": "Spaces a left or right slot from the content, for side navigation laid out as its own card.",
+          "values": []
+        },
         { "name": "fetch-style", "values": [] },
         { "name": "full-width", "values": [] },
         { "name": "padded-right", "values": [] },
@@ -3085,10 +3705,20 @@
     },
     {
       "name": "zn-panel",
-      "description": "Panels are versatile containers that provide structure for organizing content with optional headers and footers.\n---\n\n\n### **Slots:**\n - _default_ - The panel's main content.\n- **actions** - Actions displayed in the panel header (buttons, chips, etc).\n- **footer** - Content displayed in the panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n- **--zn-panel-header-padding** - Padding around the header row. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-footer-padding** - Padding around the footer row. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header region, when a caption or actions are given.\n- **header-content** - The padded row inside the header, forwarded from zn-header.\n- **footer** - The footer region, when the footer slot is filled.",
+      "description": "Panels are versatile containers that provide structure for organizing content with optional headers and footers.\n---\n\n\n### **Slots:**\n - _default_ - The panel's main content.\n- **actions** - Actions displayed in the panel header (buttons, chips, etc).\n- **footer** - Content displayed in the panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n- **--zn-panel-header-padding** - Padding around the header row. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-footer-padding** - Padding around the footer row. _(default: undefined)_\n- **--zn-panel-padding** - Padding around the body. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-shadow** - Resting shadow. Defaults to none. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The header region, when a caption or actions are given.\n- **header-content** - The padded row inside the header, forwarded from zn-header.\n- **header-left** - The caption and description, forwarded from zn-header.\n- **footer** - The footer region, when the footer slot is filled.",
       "attributes": [
         { "name": "basis-px", "values": [] },
         { "name": "caption", "values": [] },
+        {
+          "name": "description",
+          "description": "Help text under the caption, in the panel's header.",
+          "values": []
+        },
+        {
+          "name": "inline-description",
+          "description": "Sets the description beside the caption rather than under it.",
+          "values": []
+        },
         { "name": "icon", "values": [] },
         { "name": "tabbed", "values": [] },
         { "name": "header-borderless", "values": [] },
@@ -3123,7 +3753,7 @@
         },
         {
           "name": "placement",
-          "description": "The preferred placement of the popup. Note that the actual placement will vary as configured to keep the\npanel inside of the viewport.",
+          "description": "The preferred placement of the popup. Note that the actual placement will vary as configured to keep the\npanel inside the viewport.",
           "values": [
             { "name": "" },
             { "name": "top" },
@@ -3330,7 +3960,7 @@
     },
     {
       "name": "zn-priority-list",
-      "description": "A reorderable list where each item receives a numerical priority based on its position. Supports drag-and-drop\nand keyboard reordering. Priority values are submitted as form data via hidden inputs.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the order of items changes.\n- **zn-reorder** - Emitted when items are reordered. Call `getPriorityMap()` on the component to get the updated `{ key: string, priority: number }[]` array.\n\n### **Methods:**\n - **getPriorityMap(): _PriorityItem[]_** - Returns the priority map: an array of { key, priority } objects.\n- **checkValidity(): _boolean_** - Checks for validity but does not show a validation message.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(_message)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The default slot where list items are placed. Each slotted element must have a `value` attribute that uniquely identifies the item. The component automatically assigns slot names to project each item into the correct position. The item's position in the list determines its priority (top = `priority-start`, incrementing).\n- **label** - The component's label. Required for proper accessibility. Alternatively, use the `label` attribute.\n- **label-tooltip** - Used to add text displayed in a tooltip next to the label.\n- **help-text** - Text that describes how to use the component. Alternatively, use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-priority-list-item-gap** - The gap between list items. Defaults to `var(--zn-spacing-2x-small)`. _(default: undefined)_\n- **--zn-priority-list-item-padding** - The padding inside each item. Defaults to `var(--zn-spacing-small) var(--zn-spacing-medium)`. _(default: undefined)_\n- **--zn-priority-list-actions-gap** - The gap between an item's slotted actions. Defaults to `var(--zn-spacing-x-small)`. _(default: undefined)_\n- **--zn-priority-list-handle-color** - The color of the drag handle. Defaults to `var(--zn-color-neutral-500)`. _(default: undefined)_\n- **--zn-priority-list-priority-color** - The color of the priority number. Defaults to `var(--zn-color-neutral-600)`. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control wrapper.\n- **form-control-label** - The label wrapper.\n- **form-control-input** - The input area wrapper.\n- **form-control-help-text** - The help text wrapper.\n- **list** - The list container.\n- **item** - An individual list item row.\n- **drag-handle** - The drag handle icon.\n- **priority** - The priority number badge.\n- **content** - The content area of an item.",
+      "description": "A reorderable list where each item receives a numerical priority based on its position. Supports drag-and-drop\nand keyboard reordering. Priority values are submitted as form data via hidden inputs.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the order of items changes.\n- **zn-reorder** - Emitted when items are reordered. Call `getPriorityMap()` on the component to get the updated `{ key: string, priority: number }[]` array.\n\n### **Methods:**\n - **getPriorityMap(): _PriorityItem[]_** - Returns the priority map: an array of { key, priority } objects.\n- **checkValidity(): _boolean_** - Checks for validity but does not show a validation message.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(_message)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The default slot where list items are placed. Each slotted element must have a `value` attribute that uniquely identifies the item. The component automatically assigns slot names to project each item into the correct position. The item's position in the list determines its priority (top = `priority-start`, incrementing). Use `zn-tile` items for titled rows with their own actions. Set `locked` on an item to pin it where it is.\n- **action-{value}** - Controls shown at the end of the item with that `value`.\n- **label** - The component's label. Required for proper accessibility. Alternatively, use the `label` attribute.\n- **label-tooltip** - Used to add text displayed in a tooltip next to the label.\n- **help-text** - Text that describes how to use the component. Alternatively, use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-priority-list-item-gap** - The gap between list items. Defaults to `var(--zn-spacing-2x-small)`. _(default: undefined)_\n- **--zn-priority-list-item-padding** - The padding inside each item. Defaults to `var(--zn-spacing-small) var(--zn-spacing-medium)`. _(default: undefined)_\n- **--zn-priority-list-actions-gap** - The gap between an item's slotted actions. Defaults to `var(--zn-spacing-x-small)`. _(default: undefined)_\n- **--zn-priority-list-handle-color** - The color of the drag handle. Defaults to `var(--zn-color-neutral-500)`. _(default: undefined)_\n- **--zn-priority-list-priority-color** - The color of the priority number. Defaults to `var(--zn-color-neutral-600)`. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control wrapper.\n- **form-control-label** - The label wrapper.\n- **form-control-input** - The input area wrapper.\n- **form-control-help-text** - The help text wrapper.\n- **list** - The list container.\n- **item** - An individual list item row.\n- **drag-handle** - The drag handle icon.\n- **priority** - The priority number badge.\n- **content** - The content area of an item.",
       "attributes": [
         {
           "name": "name",
@@ -3382,8 +4012,33 @@
           "values": []
         },
         {
-          "name": "priority-start",
-          "description": "The starting priority number. Defaults to 1.",
+          "name": "priority-start",
+          "description": "The starting priority number. Defaults to 1.",
+          "values": []
+        },
+        {
+          "name": "flush",
+          "description": "Draws the items as rows divided edge to edge, for a list filling a flush panel; the label is kept for\nscreen readers only.",
+          "values": []
+        },
+        {
+          "name": "selectable",
+          "description": "Lets a click or Enter select an item as well as drag it, for a list that doubles as navigation. The click is\npassed on to the item, so a `tab` or link on it acts as if clicked.",
+          "values": []
+        },
+        {
+          "name": "selected",
+          "description": "The selected item's value. An item marked active by zn-tabs takes precedence, so the list follows its tabs.",
+          "values": []
+        },
+        {
+          "name": "hide-priority",
+          "description": "Hides each item's priority number, for lists where the order shows the priority.",
+          "values": []
+        },
+        {
+          "name": "move-buttons",
+          "description": "Shows move up and move down buttons on each item.",
           "values": []
         },
         {
@@ -3450,7 +4105,17 @@
         { "name": "dropdown", "values": [] },
         { "name": "name", "values": [] },
         { "name": "value", "values": [{ "name": "PropertyKey" }] },
-        { "name": "show-values", "values": [{ "name": "string[]" }] }
+        { "name": "show-values", "values": [{ "name": "string[]" }] },
+        {
+          "name": "rules",
+          "description": "Rules to start with, in the shape the builder submits.",
+          "values": [{ "name": "QueryBuilderRule[]" }]
+        },
+        {
+          "name": "repeatable",
+          "description": "Allows a filter to be added more than once, e.g. for a date range.",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -3461,7 +4126,7 @@
     },
     {
       "name": "zn-radio",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the radio loses focus.\n- **zn-change** - Emitted when the checked state changes.\n- **zn-focus** - Emitted when the radio gains focus.\n- **zn-input** - Emitted when the radio receives input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the radio.\n- **focus(options: _FocusOptions_)** - Sets focus on the radio.\n- **blur()** - Removes focus from the radio.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n\n### **Slots:**\n - _default_ - The radio's label.\n- **image** - Replaces the built-in image used by contained radios.\n- **description** - A description of the radio's label. Serves as help text for a radio item. Alternatively, you can use the `description` attribute.\n- **selected-content** - Use to nest rich content (like an input) inside a selected radio item. Use only with the contained style.\n\n### **CSS Properties:**\n - **--zn-selection-card-image-width** - Width of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-image-height** - Height of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-min-height** - Minimum height of a contained radio with an image. _(default: undefined)_\n- **--zn-selection-card-content-min-width** - Width the card text keeps before it wraps below the image. _(default: undefined)_\n- **--zn-selection-card-title-font-size** - Font size of a selection card title. _(default: undefined)_\n- **--zn-selection-card-padding** - Equal inset around the contents of a selection card. _(default: undefined)_\n- **--zn-selection-card-gap** - Space between the image, title, and indicator gutter. _(default: undefined)_\n- **--zn-selection-card-control-offset** - Distance between a positioned control and the card edge. _(default: undefined)_\n- **--zn-selection-card-border-radius** - Corner radius of a contained container. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the radio's checked state.\n- **control--checked** - Matches the control part when the radio is checked.\n- **checked-icon** - The checked icon, an `<zn-icon>` element.\n- **image-container** - The wrapper around the built-in image or image slot.\n- **image** - The built-in image.\n- **card-title** - The title inside a selection card.\n- **label** - The container that wraps the radio's label.\n- **description** - The container that wraps the radio's description.\n- **selected-content** - The container that wraps optional content that appears when a radio is checked.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the radio loses focus.\n- **zn-change** - Emitted when the checked state changes.\n- **zn-focus** - Emitted when the radio gains focus.\n- **zn-input** - Emitted when the radio receives input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the radio.\n- **focus(options: _FocusOptions_)** - Sets focus on the radio.\n- **blur()** - Removes focus from the radio.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n\n### **Slots:**\n - _default_ - The radio's label.\n- **image** - Replaces the built-in image used by contained radios.\n- **description** - A description of the radio's label. Serves as help text for a radio item. Alternatively, you can use the `description` attribute.\n- **selected-content** - Use to nest rich content (like an input) inside a selected radio item. Use only with the contained style.\n\n### **CSS Properties:**\n - **--zn-selection-card-image-width** - Width of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-image-height** - Height of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-min-height** - Minimum height of a contained radio with an image. _(default: undefined)_\n- **--zn-selection-card-content-min-width** - Width the card text keeps before it wraps below the image. _(default: undefined)_\n- **--zn-selection-card-title-font-size** - Font size of a selection card title. _(default: undefined)_\n- **--zn-selection-card-padding** - Equal inset around the contents of a selection card. _(default: undefined)_\n- **--zn-selection-card-gap** - Space between the image, title, and indicator gutter. _(default: undefined)_\n- **--zn-selection-card-control-offset** - Distance between a positioned control and the card edge. _(default: undefined)_\n- **--zn-selection-card-border-radius** - Corner radius of a contained container. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the radio's checked state.\n- **control--checked** - Matches the control part when the radio is checked.\n- **checked-icon** - The checked dot, a `<span>` element.\n- **image-container** - The wrapper around the built-in image or image slot.\n- **image** - The built-in image.\n- **card-title** - The title inside a selection card.\n- **label** - The container that wraps the radio's label.\n- **description** - The container that wraps the radio's description.\n- **selected-content** - The container that wraps optional content that appears when a radio is checked.",
       "attributes": [
         { "name": "title", "values": [] },
         {
@@ -3508,6 +4173,11 @@
           "description": "Squares off the corners of the container drawn by `contained`, which is rounded by default.",
           "values": []
         },
+        {
+          "name": "centered",
+          "description": "Centres the text of a contained radio that has no image or `card-title`.",
+          "values": []
+        },
         {
           "name": "src",
           "description": "URL for the image shown in a contained radio.",
@@ -3525,7 +4195,7 @@
         },
         {
           "name": "control-position",
-          "description": "Places the radio indicator within a contained card. Use `none` to hide the indicator so the card itself\nshows the selected state. Requires `contained`.",
+          "description": "Places the radio indicator within a contained card. A contained radio without an image or `card-title` hides it\nat `start`, as does `none`. Requires `contained`.",
           "values": [{ "name": "SelectionCardControlPosition" }]
         },
         {
@@ -3533,6 +4203,16 @@
           "description": "Applies styles relevant to radios in a horizontal layout.",
           "values": []
         },
+        {
+          "name": "scale",
+          "description": "Draws the radio as one segment of a scale. Set by a radio group with `scale`.",
+          "values": []
+        },
+        {
+          "name": "filled",
+          "description": "Fills a scale segment, as one at or before the group's checked radio. Set by a radio group with `scale`.",
+          "values": []
+        },
         {
           "name": "form",
           "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
@@ -3611,11 +4291,21 @@
           "description": "Squares off the corners of every contained radio in the group, which are rounded by default.",
           "values": []
         },
+        {
+          "name": "centered",
+          "description": "Centres the text of every contained radio in the group.",
+          "values": []
+        },
         {
           "name": "wrap",
           "description": "Lays horizontal contained radios out as a wrapping row instead of an equal-width grid, so each one sizes from\n`--zn-radio-group-column-width` (set it to `auto` to size from content) and wraps onto a new line when needed.",
           "values": []
         },
+        {
+          "name": "scale",
+          "description": "Lays the radios out as a segmented scale, in document order, filling every segment up to the checked one. Suits\nordered answers such as 1 to 10, and unlike a range input it has no value until one is picked.",
+          "values": []
+        },
         {
           "name": "form",
           "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
@@ -3742,6 +4432,79 @@
         }
       ]
     },
+    {
+      "name": "zn-report-table",
+      "description": "A grouped report: one row per value of a dimension, read column by column, with a total row.\n---\n\n\n### **Events:**\n - **zn-report-change** - Emitted when the type, group by, date range or filter is changed, before the report is fetched again.\n\n### **Slots:**\n - **inputs** - Inputs whose name and value are sent with every request (csrf tokens and similar).\n- **empty-state** - Replaces the default empty state.",
+      "attributes": [
+        { "name": "data-uri", "values": [] },
+        { "name": "method", "values": [{ "name": "GET" }, { "name": "POST" }] },
+        { "name": "caption", "values": [] },
+        { "name": "type", "values": [] },
+        { "name": "group-by", "values": [] },
+        { "name": "from", "values": [] },
+        { "name": "to", "values": [] },
+        { "name": "filter", "values": [] },
+        { "name": "currency", "values": [] },
+        { "name": "locale", "values": [] },
+        {
+          "name": "types",
+          "description": "Report types, shown as tabs when there are two or more. `type` defaults to the first.",
+          "values": [{ "name": "ReportOption[]" }]
+        },
+        {
+          "name": "group-bys",
+          "description": "Group by options; those with a `category` are listed under its heading.",
+          "values": [{ "name": "ReportOption[]" }]
+        },
+        {
+          "name": "filter-fields",
+          "description": "Fields for the funnel's filter builder. The funnel is hidden when there are none.",
+          "values": [{ "name": "ReportFilterField[]" }]
+        },
+        {
+          "name": "presets",
+          "description": "Quick ranges for the date range, replacing the default ones.",
+          "values": [{ "name": "DatePreset[]" }]
+        },
+        {
+          "name": "max-date",
+          "description": "The latest day that can be picked. Defaults to today.",
+          "values": []
+        },
+        {
+          "name": "date-note",
+          "description": "A short line shown under the date range's calendar.",
+          "values": []
+        },
+        { "name": "search-placeholder", "values": [] },
+        {
+          "name": "sharable",
+          "description": "Mirrors the type, group by, dates, filter and search to the URL query string, and reads them back on load.",
+          "values": []
+        },
+        {
+          "name": "hide-empty-columns",
+          "description": "Leaves out columns that are zero or empty in every row, and groups left without columns.",
+          "values": []
+        },
+        {
+          "name": "selectable",
+          "description": "Gives each row a tick box that highlights it, with one in the heading for every row shown.",
+          "values": []
+        },
+        {
+          "name": "heatmap",
+          "description": "Shades number cells by their size against the largest in their column.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/report-table"
+        }
+      ]
+    },
     {
       "name": "zn-reveal",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -4022,6 +4785,11 @@
           "description": "The select's required attribute.",
           "values": []
         },
+        {
+          "name": "label-note",
+          "description": "Short text shown next to the label, styled like the help text, e.g. `optional`.",
+          "values": []
+        },
         { "name": "cache-key", "values": [] },
         { "name": "trigger-submit", "values": [] },
         {
@@ -4159,7 +4927,7 @@
         },
         {
           "name": "radius",
-          "description": "Border radius of the skeleton element. Default: \"4px\"",
+          "description": "Border radius of the skeleton element. Defaults to the theme's `--zn-skeleton-border-radius` (4px).",
           "values": []
         }
       ],
@@ -4463,8 +5231,49 @@
         },
         {
           "name": "layout",
-          "description": "`value-first` puts the amount under the caption with the description beneath it, and tints the amount rather\nthan the description with `color`.",
-          "values": [{ "name": "default" }, { "name": "value-first" }]
+          "description": "`value-first` puts the amount under the caption with the description beneath it, and tints the amount rather\nthan the description with `color`. `tile` is a self-contained card: caption, amount, a footer with the delta and\n`description`, an optional sparkline, and the default slot beneath.",
+          "values": [
+            { "name": "default" },
+            { "name": "value-first" },
+            { "name": "tile" }
+          ]
+        },
+        {
+          "name": "spark",
+          "description": "Comma-separated values drawn as a sparkline under a `tile`.",
+          "values": []
+        },
+        {
+          "name": "spark-color",
+          "description": "The sparkline's colour: a tone (`primary`, `info`, `success`, `warning`, `danger`, `ai`) or any CSS colour.",
+          "values": []
+        },
+        {
+          "name": "invert-delta",
+          "description": "Treats a rise as bad news, so an increase is coloured as a loss (declines, refunds, failures).",
+          "values": []
+        },
+        {
+          "name": "tone",
+          "description": "A coloured dot before a `tile`'s caption.",
+          "values": [
+            { "name": "''" },
+            { "name": "info" },
+            { "name": "success" },
+            { "name": "warning" },
+            { "name": "danger" },
+            { "name": "neutral" }
+          ]
+        },
+        {
+          "name": "selectable",
+          "description": "Renders a `tile` as a toggle button, for tiles that filter the content below them.",
+          "values": []
+        },
+        {
+          "name": "selected",
+          "description": "Whether a `selectable` tile is pressed, or a linked tile marks the view the page is showing.",
+          "values": []
         },
         {
           "name": "delta-format",
@@ -4490,6 +5299,23 @@
           "name": "padded",
           "description": "Pads the stat, for stats laid edge to edge in a flush container such as `zn-cols no-gap divide`.",
           "values": []
+        },
+        {
+          "name": "href",
+          "description": "Makes the whole stat a link, marked with an arrow in its corner.",
+          "values": []
+        },
+        { "name": "data-target", "values": [] },
+        { "name": "gaid", "values": [] },
+        {
+          "name": "data-url",
+          "description": "JSON fetched once to fill the stat: any of `caption`, `amount`, `description`, `previous`, `spark` and\n`sparkColor`. The stat's own attributes show until it loads.",
+          "values": []
+        },
+        {
+          "name": "loading",
+          "description": "Shows a `tile` as a placeholder. Set while `data-url` loads; the sparkline draws in once it clears.",
+          "values": []
         }
       ],
       "references": [
@@ -4603,6 +5429,7 @@
       "description": "Defines a tab panel for use inside zn-page.\n---\n\n\n### **Slots:**\n - _default_ - The tab panel content.",
       "attributes": [
         { "name": "caption", "values": [] },
+        { "name": "icon", "values": [] },
         { "name": "priority", "values": [] },
         { "name": "uri", "values": [] },
         {
@@ -4652,6 +5479,16 @@
         { "name": "store-key", "values": [] },
         { "name": "store-ttl", "values": [] },
         { "name": "padded", "values": [] },
+        {
+          "name": "select-added",
+          "description": "With `store-key`, opens a tab that has appeared since the page was last shown, such as one for an item just\nadded, in place of the remembered tab.",
+          "values": []
+        },
+        {
+          "name": "gap",
+          "description": "Spaces a left or right slot from the content, for side navigation laid out as its own card.",
+          "values": []
+        },
         { "name": "fetch-style", "values": [] },
         { "name": "full-width", "values": [] },
         { "name": "padded-right", "values": [] },
@@ -4747,6 +5584,11 @@
           "description": "Makes the textarea a required field.",
           "values": []
         },
+        {
+          "name": "label-note",
+          "description": "Short text shown next to the label, styled like the help text, e.g. `optional`.",
+          "values": []
+        },
         {
           "name": "minlength",
           "description": "The minimum length of input that will be considered valid.",
@@ -5123,10 +5965,27 @@
     },
     {
       "name": "zn-tile",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n- **--zn-tile-hover-caption-color** - The caption color while a linked tile is hovered. _(default: undefined)_\n- **--zn-tile-hover-caption-decoration** - The caption text decoration while a linked tile is hovered. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The tinted square around the icon.",
       "attributes": [
         { "name": "caption", "values": [] },
         { "name": "description", "values": [] },
+        {
+          "name": "icon",
+          "description": "Shows the icon in a tinted square before the caption.",
+          "values": []
+        },
+        {
+          "name": "icon-color",
+          "description": "The tint of the icon square: `success`, `warning`, `danger`, `info`, `ai` or `neutral`.",
+          "values": [
+            { "name": "success" },
+            { "name": "warning" },
+            { "name": "danger" },
+            { "name": "info" },
+            { "name": "ai" },
+            { "name": "neutral" }
+          ]
+        },
         { "name": "href", "values": [] },
         { "name": "data-target", "values": [] },
         { "name": "gaid", "values": [] },
@@ -5200,7 +6059,7 @@
     },
     {
       "name": "zn-toggle",
-      "description": "Toggles allow the user to switch an option on or off.\n---\n\n\n### **Events:**\n - **zn-input** - Emitted when the toggle receives input.\n\n### **Slots:**\n - _default_ - The toggle's label.\n- **description** - A description of the toggle's label. Alternatively, you can use the `description` attribute.\n- **help-text** - Text that describes how to use the toggle. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-toggle-margin** - The margin around the toggle switch. Defaults to `8px 0`. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper containing the toggle switch.\n- **control** - The toggle switch control (the circular button that slides).\n- **label** - The toggle's label.\n- **description** - The container that wraps the toggle's description.",
+      "description": "Toggles allow the user to switch an option on or off.\n---\n\n\n### **Events:**\n - **zn-input** - Emitted when the toggle receives input.\n- **zn-change** - Emitted when the toggle is switched on or off.\n\n### **Slots:**\n - _default_ - The toggle's label.\n- **description** - A description of the toggle's label. Alternatively, you can use the `description` attribute.\n- **help-text** - Text that describes how to use the toggle. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-toggle-margin** - The margin around the toggle switch. Defaults to `8px 0`. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper containing the toggle switch.\n- **control** - The toggle switch control (the circular button that slides).\n- **label** - The toggle's label.\n- **description** - The container that wraps the toggle's description.",
       "attributes": [
         { "name": "title", "values": [] },
         { "name": "name", "values": [] },
@@ -5282,9 +6141,97 @@
         }
       ]
     },
+    {
+      "name": "zn-translation-field",
+      "description": "A field's source text beside the control that translates it.\n---\n\n\n### **Slots:**\n - _default_ - The control the translation is written in, such as a `zn-input` with the language code as its prefix.\n- **source** - The source text, shown read-only.\n- **actions** - Actions beside the label.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **source** - The box holding the source.",
+      "attributes": [
+        { "name": "label", "values": [] },
+        {
+          "name": "source-code",
+          "description": "The source's language code, shown beside it.",
+          "values": []
+        },
+        {
+          "name": "multiline",
+          "description": "For source text that runs over several lines, such as a message body.",
+          "values": []
+        },
+        {
+          "name": "offset",
+          "description": "Lines the source up with a control that has a toolbar above it, such as a compact `zn-editor`.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/translation-field"
+        }
+      ]
+    },
+    {
+      "name": "zn-translation-fields",
+      "description": "Lays out `zn-translation-field`s with their source beside or above the translation, chosen by the viewer.\n---\n\n\n### **Slots:**\n - _default_ - The `zn-translation-field`s.\n- **actions** - Actions level with the layout switch.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        { "name": "layout", "values": [{ "name": "TranslationFieldsLayout" }] },
+        {
+          "name": "store-key",
+          "description": "Remembers the viewer's layout under this key in `localStorage`; leave empty to forget it.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/translation-fields"
+        }
+      ]
+    },
+    {
+      "name": "zn-translation-grid",
+      "description": "Shows how far each language's translation has got, with a column per language to choose and enable it,\nand optionally a row per translated field.\n---\n\n\n### **Slots:**\n - _default_ - Help text under the legend.\n- **enable-{code}** - The control that enables the language with that code, such as a `zn-checkbox` in a form. The Enable row only shows when at least one is given.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "languages",
+          "description": "The languages, in column order, as a JSON array of `{code, label, status, href}`.",
+          "values": [{ "name": "TranslationGridLanguage[]" }]
+        },
+        {
+          "name": "fields",
+          "description": "A row per translated field, as a JSON array of `{key, label, cells}`; without it there is one Translation row.",
+          "values": [{ "name": "TranslationGridField[]" }]
+        },
+        {
+          "name": "selected",
+          "description": "The code of the language being edited.",
+          "values": []
+        },
+        {
+          "name": "selected-field",
+          "description": "The key of the field being edited, when there are `fields`.",
+          "values": []
+        },
+        {
+          "name": "link-target",
+          "description": "Where the language links open, as a console `data-target`; `self` replaces the content they sit in.",
+          "values": []
+        },
+        {
+          "name": "source-label",
+          "description": "Names the source in the legend, such as \"English changed\".",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/translation-grid"
+        }
+      ]
+    },
     {
       "name": "zn-translation-group",
-      "description": "Puts several zn-translations fields behind one language select, so a whole form's worth of copy is\ntranslated a language at a time.\n---\n\n\n### **Events:**\n - **zn-language-change** - Emitted when the active language changes. Detail: `{ language: string }`.\n\n### **Slots:**\n - _default_ - The `zn-translations` fields the select drives.\n- **actions** - Buttons for the bottom of the panel, on the white body rather than the grey footer. They sit on the right, as zinc's form action rows do; `align=\"start\"` moves one to the left. Write them in the order they should be read — the sides are set by CSS ordering, so markup order is what a keyboard follows.\n- **footer** - Content displayed in the grey panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n- **--zn-panel-header-padding** - Padding around the header row. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-footer-padding** - Padding around the footer row. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-group** - The form group holding the caption, the language select and the fields.\n- **actions** - The row of buttons at the bottom of the body.\n- **language-field** - The select that chooses the language every child is editing, in the group's chip slot.\n- **language-select** - The select itself.\n- **header** - The header region, when a caption or actions are given.\n- **header-content** - The padded row inside the header, forwarded from zn-header.\n- **footer** - The footer region, when the footer slot is filled.",
+      "description": "Puts several zn-translations fields behind one language select, so a whole form's worth of copy is\ntranslated a language at a time.\n---\n\n\n### **Events:**\n - **zn-language-change** - Emitted when the active language changes. Detail: `{ language: string }`.\n\n### **Slots:**\n - _default_ - The `zn-translations` fields the select drives.\n- **actions** - Buttons for the bottom of the panel, on the white body rather than the grey footer. They sit on the right, as zinc's form action rows do; `align=\"start\"` moves one to the left. Write them in the order they should be read — the sides are set by CSS ordering, so markup order is what a keyboard follows.\n- **footer** - Content displayed in the grey panel footer.\n\n### **CSS Properties:**\n - **--zn-panel-basis** - The flex-basis of the panel. Can be set using the basis-px attribute. _(default: undefined)_\n- **--zn-panel-header-padding** - Padding around the header row. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-footer-padding** - Padding around the footer row. _(default: undefined)_\n- **--zn-panel-padding** - Padding around the body. Defaults to `--zn-base-gap`. _(default: undefined)_\n- **--zn-panel-shadow** - Resting shadow. Defaults to none. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-group** - The form group holding the caption, the language select and the fields.\n- **actions** - The row of buttons at the bottom of the body.\n- **language-field** - The select that chooses the language every child is editing, in the group's chip slot.\n- **language-select** - The select itself.\n- **header** - The header region, when a caption or actions are given.\n- **header-content** - The padded row inside the header, forwarded from zn-header.\n- **header-left** - The caption and description, forwarded from zn-header.\n- **footer** - The footer region, when the footer slot is filled.",
       "attributes": [
         {
           "name": "label",
@@ -5313,6 +6260,16 @@
         },
         { "name": "basis-px", "values": [] },
         { "name": "caption", "values": [] },
+        {
+          "name": "description",
+          "description": "Help text under the caption, in the panel's header.",
+          "values": []
+        },
+        {
+          "name": "inline-description",
+          "description": "Sets the description beside the caption rather than under it.",
+          "values": []
+        },
         { "name": "icon", "values": [] },
         { "name": "tabbed", "values": [] },
         { "name": "header-borderless", "values": [] },
@@ -5463,9 +6420,30 @@
         }
       ]
     },
+    {
+      "name": "zn-well",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Slots:**\n - _default_ - The default slot.\n- **action** - Content displayed on the right hand side of the well.",
+      "attributes": [
+        { "name": "icon", "values": [] },
+        { "name": "inline", "values": [] },
+        {
+          "name": "pre",
+          "description": "Renders the default slot inside a `pre` element, preserving whitespace using a monospace font.",
+          "values": []
+        },
+        {
+          "name": "break-long",
+          "description": "Breaks long unbroken words, so they wrap instead of forcing the well wider.",
+          "values": []
+        }
+      ],
+      "references": [
+        { "name": "Documentation", "url": "https://zinc.style/components/well" }
+      ]
+    },
     {
       "name": "zn-vertical-stepper",
-      "description": "Vertical steppers display a sequence of steps in a vertical layout with descriptions and optional icons.\n---\n\n\n### **Slots:**\n - **icon** - Optional slot for adding an icon or indicator before the step content.\n\n### **CSS Parts:**\n - **vs** - The main container for the vertical stepper.\n- **vs__left** - The left section containing the icon and connecting line.\n- **vs__icon** - The icon container.\n- **vs__line** - The vertical connecting line between steps.\n- **vs__right** - The right section containing caption and description text.\n- **vs__caption** - The caption/title text element.\n- **vs__description** - The description text element.",
+      "description": "Vertical steppers display a sequence of steps in a vertical layout with descriptions and optional icons.\n---\n\n\n### **Slots:**\n - _default_ - Content below the caption and description, such as metadata or chips.\n- **icon** - Optional slot for adding an icon or indicator before the step content.\n- **suffix** - Inline content after the caption and description, such as status chips.\n- **actions** - Controls aligned to the end of the step.\n\n### **CSS Parts:**\n - **vs** - The main container for the vertical stepper.\n- **vs__left** - The left section containing the icon and connecting line.\n- **vs__icon** - The icon container.\n- **vs__line** - The vertical connecting line between steps.\n- **vs__right** - The right section containing caption and description text.\n- **vs__caption** - The caption/title text element.\n- **vs__description** - The description text element.\n- **vs__content** - The container for the default slot.\n- **vs__actions** - The container for the actions slot.",
       "attributes": [
         {
           "name": "last",
@@ -5491,34 +6469,33 @@
           "name": "caption",
           "description": "The main label/title for this step.",
           "values": []
-        }
-      ],
-      "references": [
+        },
         {
-          "name": "Documentation",
-          "url": "https://zinc.style/components/vertical-stepper"
-        }
-      ]
-    },
-    {
-      "name": "zn-well",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Slots:**\n - _default_ - The default slot.\n- **action** - Content displayed on the right hand side of the well.",
-      "attributes": [
-        { "name": "icon", "values": [] },
-        { "name": "inline", "values": [] },
+          "name": "type",
+          "description": "Marker colour: neutral, primary, success, error, warning, info or ai (AI-generated steps only). Overrides `active`.",
+          "values": []
+        },
         {
-          "name": "pre",
-          "description": "Renders the default slot inside a `pre` element, preserving whitespace using a monospace font.",
+          "name": "selected",
+          "description": "When true, rings the marker to show the step is picked.",
           "values": []
         },
         {
-          "name": "break-long",
-          "description": "Breaks long unbroken words, so they wrap instead of forcing the well wider.",
+          "name": "dashed",
+          "description": "When true, draws the marker's border dashed, for a step that is not yet final.",
+          "values": []
+        },
+        {
+          "name": "highlight-line",
+          "description": "When true, colours the line below this step's marker, joining it to the next step.",
           "values": []
         }
       ],
       "references": [
-        { "name": "Documentation", "url": "https://zinc.style/components/well" }
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/vertical-stepper"
+        }
       ]
     }
   ]