@kubex/zinc 1.1.92 → 1.1.94

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

@@ -2399,7 +2399,12 @@
         { "name": "options", "values": [{ "name": "linkedSelectOptions" }] },
         { "name": "linked-select", "values": [] },
         { "name": "cache-key", "values": [] },
-        { "name": "label", "values": [] }
+        { "name": "label", "values": [] },
+        {
+          "name": "select-first",
+          "description": "Automatically select the first option of the linked group when no value is set.",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -2744,7 +2749,7 @@
     },
     {
       "name": "zn-page-builder",
-      "description": "A config-driven page composer: a palette of predefined section types, a linear\ncanvas of section cards, and an inspector for editing each section's content.\n---\n\n\n### **Events:**\n - **zn-page-change** - Emitted whenever the page state changes. `event.detail.state` is the new PageState.\n- **zn-page-selection-change** - Emitted when the selected section changes. `event.detail.sectionId`.\n\n### **Methods:**\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- **addSection(type: _string_, index: _number_): _PageSection | null_** - Adds a section of a registered type at `index` (default: end). Returns null for unknown types.\n- **addSectionToSlot(type: _string_, containerId: _string_, slotIndex: _number_): _PageSection | null_** - Adds a new section of a registered type into a container's slot. Returns null if not allowed.\n\n### **Slots:**\n - **config** - `<template type=\"…\">` declarations; never displayed. Each template's attributes (type, label, icon, icon-library, color, category, description, slots, accepts) declare a palette entry and its content declares the inspector form for that type. `slots` makes the section a container with that many child slots; `accepts` is a comma-separated list of the type keys its slots allow.\n- **header-left** - Actions shown on the left of the header bar.\n- **header-right** - Actions shown on the right of the header bar.\n\n### **CSS Parts:**\n - **base** - The grid wrapper.\n- **header** - The full-width header action bar (only rendered when header slots are filled).\n- **palette** - The left palette panel.\n- **canvas** - The centre section-card canvas.\n- **inspector** - The right panel while a section is selected.",
+      "description": "A config-driven page composer: a palette of predefined section types, a linear\ncanvas of section cards, and an inspector for editing each section's content.\n---\n\n\n### **Events:**\n - **zn-page-change** - Emitted whenever the page state changes. `event.detail.state` is the new PageState.\n- **zn-page-selection-change** - Emitted when the selected section changes. `event.detail.sectionId`.\n\n### **Methods:**\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- **addSection(type: _string_, index: _number_): _PageSection | null_** - Adds a section of a registered type at `index` (default: end). Returns null for unknown types.\n- **addSectionToSlot(type: _string_, containerId: _string_, slotIndex: _number_): _PageSection | null_** - Adds a new section of a registered type into a container's slot. Returns null if not allowed.\n\n### **Slots:**\n - **config** - `<template type=\"…\">` declarations; never displayed. Each template's attributes (type, label, icon, icon-library, color, category, description, slots, accepts) declare a palette entry and its content declares the inspector form for that type. `slots` makes the section a container with that many child slots; `accepts` is a comma-separated list of the type keys its slots allow.\n- **header-left** - Actions shown on the left of the header bar.\n- **header-right** - Actions shown on the right of the header bar.\n\n### **CSS Parts:**\n - **base** - The grid wrapper.\n- **header** - The full-width header action bar (only rendered when header slots are filled).\n- **palette** - The left palette panel.\n- **canvas** - The centre section-card canvas.\n- **inspector** - The right panel while a section is selected.\n- **inspector-header** - The inspector's fixed header (icon, section name, type, close).\n- **inspector-body** - The inspector's scrolling form area.",
       "attributes": [
         {
           "name": "name",
@@ -3091,7 +3096,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-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).\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",
@@ -3469,6 +3474,133 @@
         }
       ]
     },
+    {
+      "name": "zn-schedule-builder",
+      "description": "Builds a weekly opening-hours schedule as a drag-to-paint calendar or a compact list of\ntime ranges, and posts the result as JSON.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the schedule changes.\n\n### **Methods:**\n - **checkValidity(): _boolean_** - Checks 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: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **setDay(day: _ScheduleDay_, ranges: _ScheduleRange[]_)** - Replaces the hours for a single day, in the save timezone.\n- **getDay(day: _ScheduleDay_): _ScheduleRange[]_** - Reads the hours for a single day, in the save timezone.\n- **setDisplayDay(day: _ScheduleDay_, ranges: _ScheduleRange[]_)** - Replaces the hours for a single day, given in the display timezone.\n\n### **Slots:**\n - **label** - The schedule's label. Alternatively, use the `label` attribute.\n- **help-text** - Text that describes how to use the schedule. Alternatively, use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--slot-height** - The height of a single time slot in the calendar. Defaults to `18px`. _(default: undefined)_\n- **--gutter-width** - The width of the calendar's time gutter. Defaults to `64px`. _(default: undefined)_\n- **--open-color** - The fill used for open hours. _(default: undefined)_\n- **--reduced-color** - The fill used for hours an exception removes. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the builder, label and help text.\n- **base** - The component's base wrapper.\n- **toolbar** - The row above the builder holding the hint, legend and view toggle.\n- **calendar** - The calendar view wrapper.\n- **list** - The form (list) view wrapper.\n- **summary** - The summary panel beside the calendar.",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "The name of the form control, submitted as a name/value pair with form data.",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "The schedule as a JSON string. This is what gets posted with the form.",
+          "values": []
+        },
+        {
+          "name": "label",
+          "description": "The schedule's label. If you need to display HTML, use the `label` slot instead.",
+          "values": []
+        },
+        {
+          "name": "help-text",
+          "description": "The schedule's help text. If you need to display HTML, use the `help-text` slot instead.",
+          "values": []
+        },
+        {
+          "name": "view",
+          "description": "Which view is showing.",
+          "values": [{ "name": "ScheduleView" }]
+        },
+        {
+          "name": "open-label",
+          "description": "The word used for hours the schedule covers, in the legend and in labels.",
+          "values": []
+        },
+        {
+          "name": "closed-label",
+          "description": "The word used for hours the schedule doesn't cover, in the legend and against empty days.",
+          "values": []
+        },
+        {
+          "name": "no-toggle",
+          "description": "Hides the calendar/form view toggle.",
+          "values": []
+        },
+        {
+          "name": "hide-summary",
+          "description": "Hides the summary panel beside the calendar.",
+          "values": []
+        },
+        {
+          "name": "start-hour",
+          "description": "The first hour shown in the calendar.",
+          "values": []
+        },
+        {
+          "name": "end-hour",
+          "description": "The last hour shown in the calendar.",
+          "values": []
+        },
+        {
+          "name": "interval",
+          "description": "The granularity of the calendar grid and the time inputs, in minutes.",
+          "values": []
+        },
+        {
+          "name": "week-start",
+          "description": "The weekday the week starts on.",
+          "values": [{ "name": "ScheduleDay" }]
+        },
+        {
+          "name": "time-format",
+          "description": "Displays times as 12 or 24 hour. The serialised value is always 24 hour `HH:MM`.",
+          "values": [{ "name": "12" }, { "name": "24" }]
+        },
+        {
+          "name": "display-timezone",
+          "description": "The IANA timezone the hours are shown in. Accepts `auto` for the viewer's own timezone. Defaults\nto `save-timezone`, so nothing is converted until you ask for it. Changing this only re-labels\nthe same underlying hours; the value never moves.",
+          "values": []
+        },
+        {
+          "name": "save-timezone",
+          "description": "The IANA timezone the value is stored in. Defaults to `UTC` as soon as the schedule is\ntimezone-aware (a display timezone is set, or the picker is shown), and to no timezone at all\notherwise — in which case the times are stored exactly as they are shown.",
+          "values": []
+        },
+        {
+          "name": "show-timezone",
+          "description": "Shows the timezone picker, letting the user read the schedule in any timezone.",
+          "values": []
+        },
+        {
+          "name": "timezones",
+          "description": "The timezones offered by the picker, as IANA names or one of the named sets — `en` (the four US\nzones, the UK and Australia, under those names), `offsets` (one zone per UTC offset, the\ndefault), `common` (every offset plus the world's major centres) or `all` (the complete IANA\nlist). Names and sets can be mixed, e.g. `en Asia/Tokyo`.",
+          "values": [{ "name": "string[]" }]
+        },
+        {
+          "name": "reference-date",
+          "description": "The date (`YYYY-MM-DD`) used to resolve timezone offsets. A weekly pattern has no date of its\nown, so one has to be picked to know whether daylight saving applies; today is used by default.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Disables the schedule.",
+          "values": []
+        },
+        {
+          "name": "readonly",
+          "description": "Renders the schedule without any editing affordances.",
+          "values": []
+        },
+        {
+          "name": "required",
+          "description": "Makes the schedule a required field, invalid until at least one period is open.",
+          "values": []
+        },
+        {
+          "name": "form",
+          "description": "The id of the form to associate with, when the control sits outside of it.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/schedule-builder"
+        }
+      ]
+    },
     {
       "name": "zn-scroll-container",
       "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.",
@@ -4543,7 +4675,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- **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\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": [] },

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@kubex/zinc",
-  "version": "1.1.92",
+  "version": "1.1.94",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -5613,6 +5613,11 @@
             {
               "name": "label",
               "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "select-first",
+              "description": "Automatically select the first option of the linked group when no value is set.",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
           "slots": [
@@ -5631,6 +5636,11 @@
               { "name": "linkedSelect", "type": "string" },
               { "name": "cacheKey", "type": "string" },
               { "name": "label", "type": "string" },
+              {
+                "name": "selectFirst",
+                "description": "Automatically select the first option of the linked group when no value is set.",
+                "type": "boolean"
+              },
               { "name": "input", "type": "ZnSelect" },
               { "name": "displayLabel" },
               { "name": "validity" },
@@ -6477,7 +6487,7 @@
         },
         {
           "name": "zn-page-builder",
-          "description": "A config-driven page composer: a palette of predefined section types, a linear\ncanvas of section cards, and an inspector for editing each section's content.\n---\n\n\n### **Events:**\n - **zn-page-change** - Emitted whenever the page state changes. `event.detail.state` is the new PageState.\n- **zn-page-selection-change** - Emitted when the selected section changes. `event.detail.sectionId`.\n\n### **Methods:**\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- **addSection(type: _string_, index: _number_): _PageSection | null_** - Adds a section of a registered type at `index` (default: end). Returns null for unknown types.\n- **addSectionToSlot(type: _string_, containerId: _string_, slotIndex: _number_): _PageSection | null_** - Adds a new section of a registered type into a container's slot. Returns null if not allowed.\n\n### **Slots:**\n - **config** - `<template type=\"…\">` declarations; never displayed. Each template's attributes (type, label, icon, icon-library, color, category, description, slots, accepts) declare a palette entry and its content declares the inspector form for that type. `slots` makes the section a container with that many child slots; `accepts` is a comma-separated list of the type keys its slots allow.\n- **header-left** - Actions shown on the left of the header bar.\n- **header-right** - Actions shown on the right of the header bar.\n\n### **CSS Parts:**\n - **base** - The grid wrapper.\n- **header** - The full-width header action bar (only rendered when header slots are filled).\n- **palette** - The left palette panel.\n- **canvas** - The centre section-card canvas.\n- **inspector** - The right panel while a section is selected.",
+          "description": "A config-driven page composer: a palette of predefined section types, a linear\ncanvas of section cards, and an inspector for editing each section's content.\n---\n\n\n### **Events:**\n - **zn-page-change** - Emitted whenever the page state changes. `event.detail.state` is the new PageState.\n- **zn-page-selection-change** - Emitted when the selected section changes. `event.detail.sectionId`.\n\n### **Methods:**\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- **addSection(type: _string_, index: _number_): _PageSection | null_** - Adds a section of a registered type at `index` (default: end). Returns null for unknown types.\n- **addSectionToSlot(type: _string_, containerId: _string_, slotIndex: _number_): _PageSection | null_** - Adds a new section of a registered type into a container's slot. Returns null if not allowed.\n\n### **Slots:**\n - **config** - `<template type=\"…\">` declarations; never displayed. Each template's attributes (type, label, icon, icon-library, color, category, description, slots, accepts) declare a palette entry and its content declares the inspector form for that type. `slots` makes the section a container with that many child slots; `accepts` is a comma-separated list of the type keys its slots allow.\n- **header-left** - Actions shown on the left of the header bar.\n- **header-right** - Actions shown on the right of the header bar.\n\n### **CSS Parts:**\n - **base** - The grid wrapper.\n- **header** - The full-width header action bar (only rendered when header slots are filled).\n- **palette** - The left palette panel.\n- **canvas** - The centre section-card canvas.\n- **inspector** - The right panel while a section is selected.\n- **inspector-header** - The inspector's fixed header (icon, section name, type, close).\n- **inspector-body** - The inspector's scrolling form area.",
           "doc-url": "",
           "attributes": [
             {
@@ -7228,7 +7238,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-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).\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.",
           "doc-url": "",
           "attributes": [
             {
@@ -8118,6 +8128,299 @@
             ]
           }
         },
+        {
+          "name": "zn-schedule-builder",
+          "description": "Builds a weekly opening-hours schedule as a drag-to-paint calendar or a compact list of\ntime ranges, and posts the result as JSON.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the schedule changes.\n\n### **Methods:**\n - **checkValidity(): _boolean_** - Checks 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: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **setDay(day: _ScheduleDay_, ranges: _ScheduleRange[]_)** - Replaces the hours for a single day, in the save timezone.\n- **getDay(day: _ScheduleDay_): _ScheduleRange[]_** - Reads the hours for a single day, in the save timezone.\n- **setDisplayDay(day: _ScheduleDay_, ranges: _ScheduleRange[]_)** - Replaces the hours for a single day, given in the display timezone.\n\n### **Slots:**\n - **label** - The schedule's label. Alternatively, use the `label` attribute.\n- **help-text** - Text that describes how to use the schedule. Alternatively, use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--slot-height** - The height of a single time slot in the calendar. Defaults to `18px`. _(default: undefined)_\n- **--gutter-width** - The width of the calendar's time gutter. Defaults to `64px`. _(default: undefined)_\n- **--open-color** - The fill used for open hours. _(default: undefined)_\n- **--reduced-color** - The fill used for hours an exception removes. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the builder, label and help text.\n- **base** - The component's base wrapper.\n- **toolbar** - The row above the builder holding the hint, legend and view toggle.\n- **calendar** - The calendar view wrapper.\n- **list** - The form (list) view wrapper.\n- **summary** - The summary panel beside the calendar.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "name",
+              "description": "The name of the form control, submitted as a name/value pair with form data.",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "value",
+              "description": "The schedule as a JSON string. This is what gets posted with the form.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "label",
+              "description": "The schedule's label. If you need to display HTML, use the `label` slot instead.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "help-text",
+              "description": "The schedule's help text. If you need to display HTML, use the `help-text` slot instead.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "view",
+              "description": "Which view is showing.",
+              "value": { "type": "ScheduleView", "default": "'calendar'" }
+            },
+            {
+              "name": "open-label",
+              "description": "The word used for hours the schedule covers, in the legend and in labels.",
+              "value": { "type": "string", "default": "'Available'" }
+            },
+            {
+              "name": "closed-label",
+              "description": "The word used for hours the schedule doesn't cover, in the legend and against empty days.",
+              "value": { "type": "string", "default": "'Closed'" }
+            },
+            {
+              "name": "no-toggle",
+              "description": "Hides the calendar/form view toggle.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "hide-summary",
+              "description": "Hides the summary panel beside the calendar.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "start-hour",
+              "description": "The first hour shown in the calendar.",
+              "value": { "type": "number", "default": "6" }
+            },
+            {
+              "name": "end-hour",
+              "description": "The last hour shown in the calendar.",
+              "value": { "type": "number", "default": "22" }
+            },
+            {
+              "name": "interval",
+              "description": "The granularity of the calendar grid and the time inputs, in minutes.",
+              "value": { "type": "number", "default": "30" }
+            },
+            {
+              "name": "week-start",
+              "description": "The weekday the week starts on.",
+              "value": { "type": "ScheduleDay", "default": "'mon'" }
+            },
+            {
+              "name": "time-format",
+              "description": "Displays times as 12 or 24 hour. The serialised value is always 24 hour `HH:MM`.",
+              "value": { "type": "'12' | '24'", "default": "'24'" }
+            },
+            {
+              "name": "display-timezone",
+              "description": "The IANA timezone the hours are shown in. Accepts `auto` for the viewer's own timezone. Defaults\nto `save-timezone`, so nothing is converted until you ask for it. Changing this only re-labels\nthe same underlying hours; the value never moves.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "save-timezone",
+              "description": "The IANA timezone the value is stored in. Defaults to `UTC` as soon as the schedule is\ntimezone-aware (a display timezone is set, or the picker is shown), and to no timezone at all\notherwise — in which case the times are stored exactly as they are shown.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "show-timezone",
+              "description": "Shows the timezone picker, letting the user read the schedule in any timezone.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "timezones",
+              "description": "The timezones offered by the picker, as IANA names or one of the named sets — `en` (the four US\nzones, the UK and Australia, under those names), `offsets` (one zone per UTC offset, the\ndefault), `common` (every offset plus the world's major centres) or `all` (the complete IANA\nlist). Names and sets can be mixed, e.g. `en Asia/Tokyo`.",
+              "value": { "type": "string[]", "default": "[]" }
+            },
+            {
+              "name": "reference-date",
+              "description": "The date (`YYYY-MM-DD`) used to resolve timezone offsets. A weekly pattern has no date of its\nown, so one has to be picked to know whether daylight saving applies; today is used by default.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "disabled",
+              "description": "Disables the schedule.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "readonly",
+              "description": "Renders the schedule without any editing affordances.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "required",
+              "description": "Makes the schedule a required field, invalid until at least one period is open.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "form",
+              "description": "The id of the form to associate with, when the control sits outside of it.",
+              "value": { "type": "string" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "label",
+              "description": "The schedule's label. Alternatively, use the `label` attribute."
+            },
+            {
+              "name": "help-text",
+              "description": "Text that describes how to use the schedule. Alternatively, use the `help-text` attribute."
+            }
+          ],
+          "events": [
+            {
+              "name": "zn-change",
+              "description": "Emitted when the schedule changes."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "name",
+                "description": "The name of the form control, submitted as a name/value pair with form data.",
+                "type": "string"
+              },
+              {
+                "name": "value",
+                "description": "The schedule as a JSON string. This is what gets posted with the form.",
+                "type": "string"
+              },
+              {
+                "name": "defaultValue",
+                "description": "The default value, used when resetting the containing form.",
+                "type": "string"
+              },
+              {
+                "name": "label",
+                "description": "The schedule's label. If you need to display HTML, use the `label` slot instead.",
+                "type": "string"
+              },
+              {
+                "name": "helpText",
+                "description": "The schedule's help text. If you need to display HTML, use the `help-text` slot instead.",
+                "type": "string"
+              },
+              {
+                "name": "view",
+                "description": "Which view is showing.",
+                "type": "ScheduleView"
+              },
+              {
+                "name": "openLabel",
+                "description": "The word used for hours the schedule covers, in the legend and in labels.",
+                "type": "string"
+              },
+              {
+                "name": "closedLabel",
+                "description": "The word used for hours the schedule doesn't cover, in the legend and against empty days.",
+                "type": "string"
+              },
+              {
+                "name": "noToggle",
+                "description": "Hides the calendar/form view toggle.",
+                "type": "boolean"
+              },
+              {
+                "name": "hideSummary",
+                "description": "Hides the summary panel beside the calendar.",
+                "type": "boolean"
+              },
+              {
+                "name": "startHour",
+                "description": "The first hour shown in the calendar.",
+                "type": "number"
+              },
+              {
+                "name": "endHour",
+                "description": "The last hour shown in the calendar.",
+                "type": "number"
+              },
+              {
+                "name": "interval",
+                "description": "The granularity of the calendar grid and the time inputs, in minutes.",
+                "type": "number"
+              },
+              {
+                "name": "weekStart",
+                "description": "The weekday the week starts on.",
+                "type": "ScheduleDay"
+              },
+              {
+                "name": "timeFormat",
+                "description": "Displays times as 12 or 24 hour. The serialised value is always 24 hour `HH:MM`.",
+                "type": "'12' | '24'"
+              },
+              {
+                "name": "displayTimezone",
+                "description": "The IANA timezone the hours are shown in. Accepts `auto` for the viewer's own timezone. Defaults\nto `save-timezone`, so nothing is converted until you ask for it. Changing this only re-labels\nthe same underlying hours; the value never moves.",
+                "type": "string"
+              },
+              {
+                "name": "saveTimezone",
+                "description": "The IANA timezone the value is stored in. Defaults to `UTC` as soon as the schedule is\ntimezone-aware (a display timezone is set, or the picker is shown), and to no timezone at all\notherwise — in which case the times are stored exactly as they are shown.",
+                "type": "string"
+              },
+              {
+                "name": "showTimezone",
+                "description": "Shows the timezone picker, letting the user read the schedule in any timezone.",
+                "type": "boolean"
+              },
+              {
+                "name": "timezones",
+                "description": "The timezones offered by the picker, as IANA names or one of the named sets — `en` (the four US\nzones, the UK and Australia, under those names), `offsets` (one zone per UTC offset, the\ndefault), `common` (every offset plus the world's major centres) or `all` (the complete IANA\nlist). Names and sets can be mixed, e.g. `en Asia/Tokyo`.",
+                "type": "string[]"
+              },
+              {
+                "name": "referenceDate",
+                "description": "The date (`YYYY-MM-DD`) used to resolve timezone offsets. A weekly pattern has no date of its\nown, so one has to be picked to know whether daylight saving applies; today is used by default.",
+                "type": "string"
+              },
+              {
+                "name": "disabled",
+                "description": "Disables the schedule.",
+                "type": "boolean"
+              },
+              {
+                "name": "readonly",
+                "description": "Renders the schedule without any editing affordances.",
+                "type": "boolean"
+              },
+              {
+                "name": "required",
+                "description": "Makes the schedule a required field, invalid until at least one period is open.",
+                "type": "boolean"
+              },
+              {
+                "name": "form",
+                "description": "The id of the form to associate with, when the control sits outside of it.",
+                "type": "string"
+              },
+              {
+                "name": "schedule",
+                "description": "The schedule as a plain object, with `days` in the save timezone. Assigning to it replaces the\nwhole schedule.",
+                "type": "ScheduleValue"
+              },
+              {
+                "name": "exceptions",
+                "description": "The exceptions annotating the schedule. Also readable from, and written into, the value.",
+                "type": "ScheduleException[]"
+              },
+              {
+                "name": "validity",
+                "description": "Gets the validity state object.",
+                "type": "ValidityState"
+              },
+              {
+                "name": "validationMessage",
+                "description": "Gets the validation message.",
+                "type": "string"
+              },
+              {
+                "name": "displayedDays",
+                "description": "The hours as currently shown, in the display timezone.",
+                "type": "ScheduleDayMap"
+              }
+            ],
+            "events": [
+              {
+                "name": "zn-change",
+                "description": "Emitted when the schedule changes."
+              }
+            ]
+          }
+        },
         {
           "name": "zn-scroll-container",
           "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.",
@@ -10711,7 +11014,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- **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\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.",
           "doc-url": "",
           "attributes": [
             {