@threadlabs/looma 0.21.4 → 0.21.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threadlabs/looma",
-  "version": "0.21.4",
+  "version": "0.21.6",
   "type": "module",
   "description": "Looma components as HTML, Vue, and plain DOM, with design tokens.",
   "license": "MIT",
@@ -77,7 +77,7 @@
     "./*.css"
   ],
   "dependencies": {
-    "@nextwebwg/html-next": "1.0.0-alpha.13",
+    "@nextwebwg/html-next": "1.0.0-alpha.14",
     "dompurify": "3.4.15",
     "highlight.js": "11.11.2",
     "lowlight": "^3.3.0",

package/styles/ui-action-bar.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-action-bar-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-affordance-scope.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-affordance-scope"]) to ([data-component], [data-slotted]) {
 :scope {
       display: contents;

package/styles/ui-avatar-group.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-avatar-group-edge-ring {
       syntax: "*";
       inherits: false;
@@ -58,6 +58,15 @@
       block-size: 1.75rem;
     }
 
+    :scope[data-ui-avatar-group-state~="size=xs"] .overflow {
+      margin-inline-start: -0.1875rem;
+      inline-size: 1.25rem;
+      block-size: 1.25rem;
+      /* Matches the xs Avatar's initials. */
+      font-size: calc(var(--ui-font-size) * 0.5625);
+      line-height: 1;
+    }
+
     .overflow[hidden] {
       display: none;
     }

package/styles/ui-avatar.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-avatar-border {
       syntax: "*";
       inherits: false;

package/styles/ui-badge.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-badge-border {
       syntax: "*";
       inherits: false;

package/styles/ui-breadcrumb-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-breadcrumb-item"]) to ([data-component], [data-slotted]) {
 /* One step in a ui-breadcrumbs trail: a link up to that place, or the current view. A chevron leads
        every step but the first. An icon slotted before the name sits with it. */

package/styles/ui-breadcrumbs.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-breadcrumbs"]) to ([data-component], [data-slotted]) {
 /* Where a view sits: a trail of ui-breadcrumb-item, from the top down to the current view. It wraps
        rather than scrolls, so every step stays reachable. */

package/styles/ui-button.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-button-active-surface {
       syntax: "*";
       inherits: false;
@@ -150,6 +150,16 @@
       }
     }
 
+    :scope[data-ui-button-state~="size=xs"] {
+      min-block-size: 1.5rem;
+      padding: calc(var(--ui-space-0-5) * 1.5) calc(var(--ui-space-1) * 1.25);
+      font-size: var(--ui-font-size-xs);
+    }
+
+    :scope[data-ui-button-state~="shape=pill"] {
+      border-radius: var(--ui-button-radius, var(--ui-radius-round));
+    }
+
     :scope[data-ui-button-state~="size=sm"] {
       min-block-size: var(--ui-control-size-sm);
       padding: var(--ui-space-1) var(--ui-space-2);
@@ -250,10 +260,12 @@
       border-color: transparent;
     }
 
+    /* Pressed, or holding its menu open, a ghost button sinks slightly: a light surface with a faint
+       edge and a soft inner shadow. Lighter than hover, so an open menu's trigger never reads as heavy. */
     :scope[data-ui-button-state~="variant=ghost"]:is(:active, [aria-expanded="true"]):not(:disabled, [aria-disabled="true"]) {
-      background-color: var(--ui-button-ghost-active-surface, oklch(from var(--_tone) l c h / 16%));
+      background-color: var(--ui-button-ghost-active-surface, color-mix(in oklch, var(--ui-surface), var(--_tone) 3%));
       border-color: transparent;
-      box-shadow: var(--ui-pressed);
+      box-shadow: inset 0 0 0 1px oklch(from var(--_tone) l c h / 10%), inset 0 1px 2px oklch(from var(--_tone) l c h / 8%);
     }
 
     /* A soft halo that transitions in with the other box-shadow changes, layered on the raised shadow. */
@@ -303,12 +315,15 @@
     /* Under touch, a link-style button's press lands within the control minimum: an invisible hit
        area, centred on it, like IconButton's. A boxed button grows to the minimum itself (below);
        a link-style one keeps its text size, so a standalone one ("See all" under a list) needs the
-       area. Only the link needs it: a hit area on every button would reach over its neighbours. */
-    html[data-ui-input-modality="touch"] :scope[data-ui-button-state~="variant=link"] {
+       area. xs sits inside a line of text the same way, so it keeps its size and gains the area too.
+       Only these need it: a hit area on every button would reach over its neighbours. */
+    html[data-ui-input-modality="touch"] :scope[data-ui-button-state~="variant=link"],
+    html[data-ui-input-modality="touch"] :scope[data-ui-button-state~="size=xs"] {
       position: relative;
     }
 
-    html[data-ui-input-modality="touch"] :scope[data-ui-button-state~="variant=link"]::after {
+    html[data-ui-input-modality="touch"] :scope[data-ui-button-state~="variant=link"]::after,
+    html[data-ui-input-modality="touch"] :scope[data-ui-button-state~="size=xs"]::after {
       position: absolute;
       inset: 50% auto auto 50%;
       inline-size: max(100%, var(--ui-control-min-block-size));
@@ -383,6 +398,9 @@
 
     /* Tints derive from the text colour, not a surface token, so hover and press show on any background. */
 
+    /* Pressed, or holding its menu open, a ghost button sinks slightly: a light surface with a faint
+       edge and a soft inner shadow. Lighter than hover, so an open menu's trigger never reads as heavy. */
+
     /* A soft halo that transitions in with the other box-shadow changes, layered on the raised shadow. */
 
     /* A loading action stays visually active; only an explicitly disabled action takes the
@@ -397,7 +415,8 @@
     /* Under touch, a link-style button's press lands within the control minimum: an invisible hit
        area, centred on it, like IconButton's. A boxed button grows to the minimum itself (below);
        a link-style one keeps its text size, so a standalone one ("See all" under a list) needs the
-       area. Only the link needs it: a hit area on every button would reach over its neighbours. */
+       area. xs sits inside a line of text the same way, so it keeps its size and gains the area too.
+       Only these need it: a hit area on every button would reach over its neighbours. */
 
     /* Link: an inline text action. No box, padding, or minimum height (inline targets are exempt under
        WCAG 2.5.8); the inherited font; an underline that strengthens on hover; a visible focus ring. */

package/styles/ui-callout.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-callout-border {
       syntax: "*";
       inherits: false;

package/styles/ui-card.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-card"]) to ([data-component], [data-slotted]) {
 /* A surface that groups content. Its children stack with even space between them, so a card
        needs no layout of its own. */

package/styles/ui-checkbox.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-checkbox-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-cluster.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-cluster-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-combobox.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-combobox-affordance-text {
       syntax: "*";
       inherits: false;

package/styles/ui-container.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-container-gutters {
       syntax: "*";
       inherits: false;

package/styles/ui-context-menu.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-context-menu-surface {
       syntax: "*";
       inherits: false;

package/styles/ui-cover.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-cover"]) to ([data-component], [data-slotted]) {
 /* A layout primitive that centres its content in the space, both ways, with room around it: the
        frame for a view that is one card or one message. */

package/styles/ui-description-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-description-item"]) to ([data-component], [data-slotted]) {
 /* One term and its value in a ui-description-list, laid out by the list's layout. */
     :scope {

package/styles/ui-description-list.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-description-list"]) to ([data-component], [data-slotted]) {
 /* Named values: a term and what it is, for each item (ui-description-item). */
     /* Rows line every term up in one column and every value in the next, through subgrid. */

package/styles/ui-dialog.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-dialog-duration {
       syntax: "*";
       inherits: false;

package/styles/ui-disclosure.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-disclosure-trigger-min-block-size {
       syntax: "*";
       inherits: false;

package/styles/ui-editable.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editable"]) to ([data-component], [data-slotted]) {
 :scope {
       display: flex;

package/styles/ui-editor-insert-table-grid.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-insert-table-grid"]) to ([data-component], [data-slotted]) {
 :scope {
       padding: var(--ui-space-3);

package/styles/ui-editor-mention-menu-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-mention-menu-item"]) to ([data-component], [data-slotted]) {
 :scope {
       display: flex;

package/styles/ui-editor-mention-menu.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-mention-menu"]) to ([data-component], [data-slotted]) {
 :scope {
       user-select: none;

package/styles/ui-editor-slash-menu-group.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-slash-menu-group"]) to ([data-component], [data-slotted]) {
 :scope {
       display: block;

package/styles/ui-editor-slash-menu-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-slash-menu-item"]) to ([data-component], [data-slotted]) {
 :scope {
       display: flex;

package/styles/ui-editor-slash-menu.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-slash-menu"]) to ([data-component], [data-slotted]) {
 :scope {
       user-select: none;

package/styles/ui-editor-table-context-menu.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-table-context-menu"]) to ([data-component], [data-slotted]) {
 :scope {
       /* The max-width is a promise about the menu's footprint, so it counts padding and border. */

package/styles/ui-editor-table-overlay.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-table-overlay"]) to ([data-component], [data-slotted]) {
 :scope {
       display: block;

package/styles/ui-editor-table-toolbar.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-table-toolbar"]) to ([data-component], [data-slotted]) {
 .looma-editor__mobile-toolbar-shell :scope {
       min-width: max-content;

package/styles/ui-editor-toolbar.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-editor-toolbar"]) to ([data-component], [data-slotted]) {
 :scope {
       position: sticky;

package/styles/ui-floating-action-button.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-floating-action-button-inset-block-end {
       syntax: "*";
       inherits: false;

package/styles/ui-form-field.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-form-field-danger {
       syntax: "*";
       inherits: false;

package/styles/ui-grid.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-grid-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-icon-button.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-icon-button-active-scale {
       syntax: "*";
       inherits: false;

package/styles/ui-icon.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-icon-size {
       syntax: "*";
       inherits: false;

package/styles/ui-input-group.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-input-group-radius {
       syntax: "*";
       inherits: false;

package/styles/ui-input.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-input-border {
       syntax: "*";
       inherits: false;

package/styles/ui-list-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-list-item-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-list.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-list-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-listbox.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-listbox-radius {
       syntax: "*";
       inherits: false;

package/styles/ui-menu-group.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-menu-group"]) to ([data-component], [data-slotted]) {
 :scope {
       display: flex;

package/styles/ui-menu-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-menu-item-font-size {
       syntax: "*";
       inherits: false;
@@ -59,8 +59,8 @@
       justify-content: center;
       flex: none;
       box-sizing: border-box;
-      inline-size: var(--ui-icon-size-sm);
-      block-size: var(--ui-icon-size-sm);
+      inline-size: var(--_ui-default-menu-indicator-size, var(--ui-icon-size-sm));
+      block-size: var(--_ui-default-menu-indicator-size, var(--ui-icon-size-sm));
       border: 1.5px solid var(--ui-control-border);
       border-radius: var(--ui-radius-sm);
       color: var(--ui-surface);
@@ -76,20 +76,11 @@
       background: var(--ui-accent);
     }
 
+    /* A menu marks its chosen item with a check, as menus conventionally do; a radio circle reads
+       as a form control. The empty slot keeps unchosen labels aligned with the chosen one. */
     :scope[data-ui-menu-item-state~="type=radio"] .indicator {
-      border-radius: var(--ui-radius-round);
-    }
-
-    :scope[data-ui-menu-item-state~="type=radio"][aria-checked="true"] .indicator {
-      border-color: var(--ui-accent);
-    }
-
-    :scope[data-ui-menu-item-state~="type=radio"][aria-checked="true"] .indicator::after {
-      content: "";
-      inline-size: 0.375rem;
-      block-size: 0.375rem;
-      border-radius: var(--ui-radius-round);
-      background: var(--ui-accent);
+      border-color: transparent;
+      color: var(--ui-text-secondary);
     }
 
     .shortcut {
@@ -106,7 +97,7 @@
     /* Keep the text row at the shared control height where cap trimming is available. */
     @supports (text-box-trim: trim-both) {
       :scope {
-        min-block-size: var(--ui-menu-item-min-block-size, var(--ui-control-size-md, 2.5rem));
+        min-block-size: var(--ui-menu-item-min-block-size, var(--_ui-default-menu-item-min-block-size, var(--ui-control-size-md, 2.5rem)));
         text-box-trim: trim-both;
         text-box-edge: cap alphabetic;
       }
@@ -151,6 +142,9 @@
 @scope ([data-component~="ui-menu-item"]) to ([data-component]) {
 /* This component's hooks style the element they are set on, and never a nested one. */
 
+    /* A menu marks its chosen item with a check, as menus conventionally do; a radio circle reads
+       as a form control. The empty slot keeps unchosen labels aligned with the chosen one. */
+
     /* Keep the text row at the shared control height where cap trimming is available. */
     @supports (text-box-trim: trim-both) {
     }

package/styles/ui-menu.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-menu-surface {
       syntax: "*";
       inherits: false;
@@ -33,6 +33,19 @@
       gap: 0;
     }
 
+    /* Small follows its trigger down: an item's own hooks still win. */
+    :scope[data-ui-menu-state~="size=sm"] {
+      --_ui-default-menu-item-padding-block: var(--ui-space-0-5);
+      --_ui-default-menu-item-padding-inline: var(--ui-space-2);
+      --_ui-default-menu-item-font-size: var(--ui-font-size-xs);
+      --_ui-default-menu-item-radius: var(--ui-radius-sm);
+      --_ui-default-menu-item-min-block-size: 1.5rem;
+      --_ui-default-menu-indicator-size: 0.75rem;
+      min-inline-size: min(8rem, calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2));
+      padding: var(--ui-space-1);
+      gap: 0;
+    }
+
     :scope {
       --_ui-menu-surface: var(--ui-menu-surface);
       --_ui-menu-border: var(--ui-menu-border);
@@ -43,6 +56,8 @@
       --_ui-default-menu-item-padding-inline: initial;
       --_ui-default-menu-item-font-size: initial;
       --_ui-default-menu-item-radius: initial;
+      --_ui-default-menu-item-min-block-size: initial;
+      --_ui-default-menu-indicator-size: initial;
       display: flex;
       flex-direction: column;
       box-sizing: border-box;
@@ -127,6 +142,8 @@
     /* Compact sets its items' defaults, so nothing has to rescale a global; an item's own hooks
        still win. */
 
+    /* Small follows its trigger down: an item's own hooks still win. */
+
     @starting-style {
     }
 

package/styles/ui-meter.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-meter-inline-size {
       syntax: "*";
       inherits: false;

package/styles/ui-nav-item.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-nav-item-current-surface {
       syntax: "*";
       inherits: false;

package/styles/ui-page-header.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-page-header"]) to ([data-component], [data-slotted]) {
 /* The top of a view: its title (the page's one h1), with an optional icon or mark before it, a
        short eyebrow above it, a line or two of description under it, and the view's own actions at

package/styles/ui-popover.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-popover-surface {
       syntax: "*";
       inherits: false;

package/styles/ui-radio-group.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-radio-group-invalid-text {
       syntax: "*";
       inherits: false;

package/styles/ui-radio.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-radio-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-reel.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-reel-gap {
       syntax: "*";
       inherits: false;

package/styles/ui-scroll-area.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-scroll-area"]) to ([data-component], [data-slotted]) {
 /* The controller sets each fade length from overflow and scroll position. The mask blends
        into whatever is behind the area without needing to know its colour. Before upgrade, its

package/styles/ui-search-result-row.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-search-result-row-border {
       syntax: "*";
       inherits: false;

package/styles/ui-search-shell.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-search-shell-border {
       syntax: "*";
       inherits: false;

package/styles/ui-section.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @scope ([data-component~="ui-section"]) to ([data-component], [data-slotted]) {
 /* A part of a view: a heading, an optional line under it, actions for the whole section at its
        end, and the content. Sections space themselves out through the Stack around them. */

package/styles/ui-select.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-select-border {
       syntax: "*";
       inherits: false;

package/styles/ui-separator.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-separator-color {
       syntax: "*";
       inherits: false;

package/styles/ui-sidebar.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @property --ui-sidebar-backdrop {
       syntax: "*";
       inherits: false;

package/styles/ui-spinner.css

@@ -1,4 +1,4 @@
-/* Generated by HTML Next 1.0.0-alpha.13. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.14. Do not edit. */
 @keyframes ui-spinner-rotate {
       100% {
         transform: rotate(1turn);