@editora/ui-core 0.1.25 → 0.2.1

package/dist/radio-group.cjs.js

@@ -5,21 +5,22 @@
     color-scheme: light dark;
 
     --ui-radio-gap: 8px;
-    --ui-radio-pad-y: 10px;
-    --ui-radio-pad-x: 12px;
-    --ui-radio-radius: 12px;
+    --ui-radio-pad-y: 6px;
+    --ui-radio-pad-x: 8px;
+    --ui-radio-radius: var(--ui-control-radius-2, var(--ui-radius, 6px));
     --ui-radio-dot-size: 10px;
     --ui-radio-control-size: 18px;
 
-    --ui-radio-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 94%, transparent);
-    --ui-radio-bg-hover: color-mix(in srgb, var(--ui-color-surface, #ffffff) 80%, #f8fafc 20%);
-    --ui-radio-bg-selected: color-mix(in srgb, var(--ui-color-primary, #2563eb) 10%, var(--ui-color-surface, #ffffff));
-    --ui-radio-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent);
+    --ui-radio-bg: transparent;
+    --ui-radio-bg-hover: var(--ui-color-fill-hover, color-mix(in srgb, currentColor 6%, transparent));
+    --ui-radio-bg-selected: transparent;
+    --ui-radio-border: transparent;
+    --ui-radio-line: var(--ui-color-line, #cbd5e1);
     --ui-radio-border-selected: var(--ui-color-primary, #2563eb);
     --ui-radio-text: var(--ui-color-text, #0f172a);
-    --ui-radio-muted: #526175;
+    --ui-radio-muted: var(--ui-color-text-secondary, #526175);
     --ui-radio-shadow: none;
-    --ui-radio-ring: color-mix(in srgb, var(--ui-color-primary, #2563eb) 34%, transparent);
+    --ui-radio-ring: var(--ui-ring-color, var(--ui-color-primary, #2563eb));
   }
 
   .root {
@@ -59,15 +60,19 @@
   }
 
   .option:focus-visible {
-    outline: none;
-    box-shadow: 0 0 0 2px var(--ui-radio-ring), var(--ui-radio-shadow);
+    outline: var(--ui-ring-width, 2px) solid var(--ui-radio-ring);
+    outline-offset: var(--ui-ring-offset, 1px);
   }
 
   .option[data-checked="true"] {
-    border-color: var(--ui-radio-border-selected);
     background: var(--ui-radio-bg-selected);
   }
 
+  :host([variant="card"]) .option[data-checked="true"],
+  :host([variant="segmented"]) .option[data-checked="true"] {
+    border-color: var(--ui-radio-border-selected);
+  }
+
   .option[data-disabled="true"] {
     opacity: 0.56;
     cursor: not-allowed;
@@ -79,8 +84,8 @@
     inline-size: var(--ui-radio-control-size);
     block-size: var(--ui-radio-control-size);
     border-radius: 999px;
-    border: 1.5px solid color-mix(in srgb, var(--ui-radio-border-selected) 44%, var(--ui-radio-border));
-    background: color-mix(in srgb, var(--ui-radio-bg) 88%, white 12%);
+    border: 1px solid var(--ui-color-line-strong, var(--ui-radio-line));
+    background: var(--ui-color-surface, #ffffff);
     display: grid;
     place-items: center;
     transition: border-color 140ms ease, background-color 140ms ease;
@@ -101,6 +106,14 @@
     transform: scale(1);
   }
 
+  .option[data-checked="true"] .control {
+    border-color: var(--ui-radio-border-selected);
+  }
+
+  .option:hover .control {
+    border-color: var(--ui-radio-border-selected);
+  }
+
   .text {
     display: grid;
     gap: 2px;
@@ -108,7 +121,7 @@
   }
 
   .label {
-    font: 600 13px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
+    font: 500 14px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
     letter-spacing: 0.01em;
     white-space: nowrap;
     overflow: hidden;
@@ -116,7 +129,7 @@
   }
 
   .description {
-    font: 500 12px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
+    font: 400 13px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
     color: var(--ui-radio-muted);
     white-space: nowrap;
     overflow: hidden;
@@ -124,13 +137,26 @@
   }
 
   :host([variant="card"]) .option {
-    border-radius: 14px;
-    box-shadow:
-      0 1px 3px rgba(2, 6, 23, 0.06),
-      0 10px 24px rgba(2, 6, 23, 0.08);
+    --ui-radio-bg: var(--color-panel-solid, var(--ui-color-surface, #ffffff));
+    --ui-radio-border: var(--ui-color-line-subtle, var(--ui-radio-line));
+    --ui-radio-bg-selected: color-mix(in srgb, var(--ui-color-primary, #2563eb) 8%, var(--ui-color-surface, #ffffff));
+    --ui-radio-pad-y: 10px;
+    --ui-radio-pad-x: 12px;
+    border-radius: calc(var(--ui-radio-radius) + 2px);
+  }
+
+  :host([variant="segmented"]) .option:focus-visible {
+    outline-offset: -2px;
+  }
+
+  :host([variant="segmented"]) .option {
+    --ui-radio-bg-selected: color-mix(in srgb, var(--ui-color-primary, #2563eb) 10%, var(--ui-color-surface, #ffffff));
+    --ui-radio-pad-y: 8px;
+    --ui-radio-pad-x: 12px;
   }
 
   :host([variant="segmented"]) .root {
+    --ui-radio-border: var(--ui-color-line-subtle, var(--ui-radio-line));
     gap: 0;
     border: 1px solid var(--ui-radio-border);
     border-radius: calc(var(--ui-radio-radius) + 2px);
@@ -159,21 +185,19 @@
   }
 
   :host([size="sm"]) {
-    --ui-radio-pad-y: 8px;
-    --ui-radio-pad-x: 10px;
+    --ui-radio-pad-y: 4px;
+    --ui-radio-pad-x: 6px;
     --ui-radio-control-size: 16px;
     --ui-radio-dot-size: 8px;
     --ui-radio-gap: 6px;
-    --ui-radio-radius: 10px;
   }
 
   :host([size="lg"]) {
-    --ui-radio-pad-y: 12px;
-    --ui-radio-pad-x: 14px;
+    --ui-radio-pad-y: 8px;
+    --ui-radio-pad-x: 10px;
     --ui-radio-control-size: 20px;
     --ui-radio-dot-size: 11px;
     --ui-radio-gap: 10px;
-    --ui-radio-radius: 14px;
   }
 
   :host([tone="neutral"]) { --ui-radio-border-selected: #64748b; }

package/dist/radio-group.esm.js

@@ -1,5 +1,5 @@
 import { E as v } from "./ElementBase-BeZT54Hj.mjs";
-import { m as x, r as h, f as g, s as m, g as p } from "./roving-focus-group-Dbm1Jko_.mjs";
+import { m as g, r as h, f as x, s as m, g as p } from "./roving-focus-group-Dbm1Jko_.mjs";
 const _ = `
   :host {
     display: block;
@@ -7,21 +7,22 @@ const _ = `
     color-scheme: light dark;
 
     --ui-radio-gap: 8px;
-    --ui-radio-pad-y: 10px;
-    --ui-radio-pad-x: 12px;
-    --ui-radio-radius: 12px;
+    --ui-radio-pad-y: 6px;
+    --ui-radio-pad-x: 8px;
+    --ui-radio-radius: var(--ui-control-radius-2, var(--ui-radius, 6px));
     --ui-radio-dot-size: 10px;
     --ui-radio-control-size: 18px;
 
-    --ui-radio-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 94%, transparent);
-    --ui-radio-bg-hover: color-mix(in srgb, var(--ui-color-surface, #ffffff) 80%, #f8fafc 20%);
-    --ui-radio-bg-selected: color-mix(in srgb, var(--ui-color-primary, #2563eb) 10%, var(--ui-color-surface, #ffffff));
-    --ui-radio-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent);
+    --ui-radio-bg: transparent;
+    --ui-radio-bg-hover: var(--ui-color-fill-hover, color-mix(in srgb, currentColor 6%, transparent));
+    --ui-radio-bg-selected: transparent;
+    --ui-radio-border: transparent;
+    --ui-radio-line: var(--ui-color-line, #cbd5e1);
     --ui-radio-border-selected: var(--ui-color-primary, #2563eb);
     --ui-radio-text: var(--ui-color-text, #0f172a);
-    --ui-radio-muted: #526175;
+    --ui-radio-muted: var(--ui-color-text-secondary, #526175);
     --ui-radio-shadow: none;
-    --ui-radio-ring: color-mix(in srgb, var(--ui-color-primary, #2563eb) 34%, transparent);
+    --ui-radio-ring: var(--ui-ring-color, var(--ui-color-primary, #2563eb));
   }
 
   .root {
@@ -61,15 +62,19 @@ const _ = `
   }
 
   .option:focus-visible {
-    outline: none;
-    box-shadow: 0 0 0 2px var(--ui-radio-ring), var(--ui-radio-shadow);
+    outline: var(--ui-ring-width, 2px) solid var(--ui-radio-ring);
+    outline-offset: var(--ui-ring-offset, 1px);
   }
 
   .option[data-checked="true"] {
-    border-color: var(--ui-radio-border-selected);
     background: var(--ui-radio-bg-selected);
   }
 
+  :host([variant="card"]) .option[data-checked="true"],
+  :host([variant="segmented"]) .option[data-checked="true"] {
+    border-color: var(--ui-radio-border-selected);
+  }
+
   .option[data-disabled="true"] {
     opacity: 0.56;
     cursor: not-allowed;
@@ -81,8 +86,8 @@ const _ = `
     inline-size: var(--ui-radio-control-size);
     block-size: var(--ui-radio-control-size);
     border-radius: 999px;
-    border: 1.5px solid color-mix(in srgb, var(--ui-radio-border-selected) 44%, var(--ui-radio-border));
-    background: color-mix(in srgb, var(--ui-radio-bg) 88%, white 12%);
+    border: 1px solid var(--ui-color-line-strong, var(--ui-radio-line));
+    background: var(--ui-color-surface, #ffffff);
     display: grid;
     place-items: center;
     transition: border-color 140ms ease, background-color 140ms ease;
@@ -103,6 +108,14 @@ const _ = `
     transform: scale(1);
   }
 
+  .option[data-checked="true"] .control {
+    border-color: var(--ui-radio-border-selected);
+  }
+
+  .option:hover .control {
+    border-color: var(--ui-radio-border-selected);
+  }
+
   .text {
     display: grid;
     gap: 2px;
@@ -110,7 +123,7 @@ const _ = `
   }
 
   .label {
-    font: 600 13px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
+    font: 500 14px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
     letter-spacing: 0.01em;
     white-space: nowrap;
     overflow: hidden;
@@ -118,7 +131,7 @@ const _ = `
   }
 
   .description {
-    font: 500 12px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
+    font: 400 13px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, Helvetica, Arial, sans-serif;
     color: var(--ui-radio-muted);
     white-space: nowrap;
     overflow: hidden;
@@ -126,13 +139,26 @@ const _ = `
   }
 
   :host([variant="card"]) .option {
-    border-radius: 14px;
-    box-shadow:
-      0 1px 3px rgba(2, 6, 23, 0.06),
-      0 10px 24px rgba(2, 6, 23, 0.08);
+    --ui-radio-bg: var(--color-panel-solid, var(--ui-color-surface, #ffffff));
+    --ui-radio-border: var(--ui-color-line-subtle, var(--ui-radio-line));
+    --ui-radio-bg-selected: color-mix(in srgb, var(--ui-color-primary, #2563eb) 8%, var(--ui-color-surface, #ffffff));
+    --ui-radio-pad-y: 10px;
+    --ui-radio-pad-x: 12px;
+    border-radius: calc(var(--ui-radio-radius) + 2px);
+  }
+
+  :host([variant="segmented"]) .option:focus-visible {
+    outline-offset: -2px;
+  }
+
+  :host([variant="segmented"]) .option {
+    --ui-radio-bg-selected: color-mix(in srgb, var(--ui-color-primary, #2563eb) 10%, var(--ui-color-surface, #ffffff));
+    --ui-radio-pad-y: 8px;
+    --ui-radio-pad-x: 12px;
   }
 
   :host([variant="segmented"]) .root {
+    --ui-radio-border: var(--ui-color-line-subtle, var(--ui-radio-line));
     gap: 0;
     border: 1px solid var(--ui-radio-border);
     border-radius: calc(var(--ui-radio-radius) + 2px);
@@ -161,21 +187,19 @@ const _ = `
   }
 
   :host([size="sm"]) {
-    --ui-radio-pad-y: 8px;
-    --ui-radio-pad-x: 10px;
+    --ui-radio-pad-y: 4px;
+    --ui-radio-pad-x: 6px;
     --ui-radio-control-size: 16px;
     --ui-radio-dot-size: 8px;
     --ui-radio-gap: 6px;
-    --ui-radio-radius: 10px;
   }
 
   :host([size="lg"]) {
-    --ui-radio-pad-y: 12px;
-    --ui-radio-pad-x: 14px;
+    --ui-radio-pad-y: 8px;
+    --ui-radio-pad-x: 10px;
     --ui-radio-control-size: 20px;
     --ui-radio-dot-size: 11px;
     --ui-radio-gap: 10px;
-    --ui-radio-radius: 14px;
   }
 
   :host([tone="neutral"]) { --ui-radio-border-selected: #64748b; }
@@ -348,7 +372,7 @@ class k extends v {
     this._focusOption(e);
   }
   _moveSelection(e) {
-    const i = x(this._options, this._focusIndex, e > 0 ? 1 : -1, {
+    const i = g(this._options, this._focusIndex, e > 0 ? 1 : -1, {
       wrap: !0,
       fallbackIndex: h(this._options, {
         activeIndex: this._focusIndex,
@@ -361,7 +385,7 @@ class k extends v {
   }
   _focusOption(e) {
     const i = this.root.querySelector(`.option[data-index="${e}"]`);
-    g(i);
+    x(i);
   }
   _syncInteractiveState() {
     if (!this.root.querySelector(".root")) return;

package/dist/radio.cjs.js

@@ -1,17 +1,17 @@
 "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("./ElementBase-DxbvhLJs.js"),u=`
   :host {
-    --ui-radio-size: 18px;
+    --ui-radio-size: 16px;
     --ui-radio-hit-area: 24px;
-    --ui-radio-dot-size: 8px;
-    --ui-radio-border: 1.5px solid color-mix(in srgb, var(--ui-radio-accent, var(--ui-primary, var(--ui-color-primary, #2563eb))) 44%, var(--ui-color-border, #cbd5e1) 56%);
-    --ui-radio-background: var(--ui-bg, var(--ui-color-surface, #ffffff));
+    --ui-radio-dot-size: 6px;
+    --ui-radio-border: 1px solid var(--ui-color-line-strong, var(--ui-color-border, #cbd5e1));
+    --ui-radio-background: var(--ui-bg, var(--color-panel-solid, var(--ui-color-surface, #ffffff)));
     --ui-radio-accent: var(--ui-primary, var(--ui-color-primary, #2563eb));
-    --ui-radio-dot-color: var(--ui-radio-accent);
-    --ui-radio-focus: 0 0 0 4px color-mix(in srgb, var(--ui-radio-accent) 24%, transparent);
-    --ui-radio-invalid: var(--ui-color-danger, #dc2626);
-    --ui-radio-invalid-focus: 0 0 0 4px color-mix(in srgb, var(--ui-radio-invalid) 24%, transparent);
+    --ui-radio-dot-color: var(--ui-color-foreground-on-primary, #ffffff);
+    --ui-radio-focus: 0 0 0 2px var(--ui-color-background, #ffffff), 0 0 0 4px var(--ui-ring-color, var(--ui-color-focus-ring, #2563eb));
+    --ui-radio-invalid: var(--ui-color-danger-text, var(--ui-color-danger, #dc2626));
+    --ui-radio-invalid-focus: 0 0 0 2px var(--ui-color-background, #ffffff), 0 0 0 4px var(--ui-radio-invalid);
     --ui-radio-disabled-bg: color-mix(in srgb, var(--ui-color-surface-alt, #f1f5f9) 88%, #ffffff 12%);
-    --ui-radio-disabled-border: 1.5px solid color-mix(in srgb, var(--ui-color-border, #cbd5e1) 78%, transparent);
+    --ui-radio-disabled-border: 1px solid var(--ui-color-line, var(--ui-color-border, #cbd5e1));
     --ui-radio-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
     --ui-radio-muted: var(--ui-color-muted, #526175);
     --ui-radio-duration: 170ms;
@@ -130,7 +130,7 @@
 
   :host([checked]) .control {
     border-color: var(--ui-radio-accent);
-    background: color-mix(in srgb, var(--ui-radio-accent) 8%, var(--ui-radio-background));
+    background: var(--ui-radio-accent);
   }
 
   :host([checked]) .control::before {
@@ -146,9 +146,12 @@
     box-shadow: var(--ui-radio-focus);
   }
 
-  :host(:not([disabled]):not([loading]):hover) .control {
-    transform: translateY(-0.5px);
-    border-color: color-mix(in srgb, var(--ui-radio-accent) 80%, #0f172a 20%);
+  :host(:not([disabled]):not([loading]):not([checked]):hover) .control {
+    border-color: var(--ui-color-text-secondary, #64748b);
+  }
+
+  :host(:not([disabled]):not([loading])[checked]:hover) .control {
+    background: color-mix(in srgb, var(--ui-radio-accent) 88%, var(--ui-color-text-strong, #0f172a));
   }
 
   :host(:not([disabled]):not([loading]):active) .control {

package/dist/radio.esm.js

@@ -1,18 +1,18 @@
 import { E as l } from "./ElementBase-BeZT54Hj.mjs";
 const u = `
   :host {
-    --ui-radio-size: 18px;
+    --ui-radio-size: 16px;
     --ui-radio-hit-area: 24px;
-    --ui-radio-dot-size: 8px;
-    --ui-radio-border: 1.5px solid color-mix(in srgb, var(--ui-radio-accent, var(--ui-primary, var(--ui-color-primary, #2563eb))) 44%, var(--ui-color-border, #cbd5e1) 56%);
-    --ui-radio-background: var(--ui-bg, var(--ui-color-surface, #ffffff));
+    --ui-radio-dot-size: 6px;
+    --ui-radio-border: 1px solid var(--ui-color-line-strong, var(--ui-color-border, #cbd5e1));
+    --ui-radio-background: var(--ui-bg, var(--color-panel-solid, var(--ui-color-surface, #ffffff)));
     --ui-radio-accent: var(--ui-primary, var(--ui-color-primary, #2563eb));
-    --ui-radio-dot-color: var(--ui-radio-accent);
-    --ui-radio-focus: 0 0 0 4px color-mix(in srgb, var(--ui-radio-accent) 24%, transparent);
-    --ui-radio-invalid: var(--ui-color-danger, #dc2626);
-    --ui-radio-invalid-focus: 0 0 0 4px color-mix(in srgb, var(--ui-radio-invalid) 24%, transparent);
+    --ui-radio-dot-color: var(--ui-color-foreground-on-primary, #ffffff);
+    --ui-radio-focus: 0 0 0 2px var(--ui-color-background, #ffffff), 0 0 0 4px var(--ui-ring-color, var(--ui-color-focus-ring, #2563eb));
+    --ui-radio-invalid: var(--ui-color-danger-text, var(--ui-color-danger, #dc2626));
+    --ui-radio-invalid-focus: 0 0 0 2px var(--ui-color-background, #ffffff), 0 0 0 4px var(--ui-radio-invalid);
     --ui-radio-disabled-bg: color-mix(in srgb, var(--ui-color-surface-alt, #f1f5f9) 88%, #ffffff 12%);
-    --ui-radio-disabled-border: 1.5px solid color-mix(in srgb, var(--ui-color-border, #cbd5e1) 78%, transparent);
+    --ui-radio-disabled-border: 1px solid var(--ui-color-line, var(--ui-color-border, #cbd5e1));
     --ui-radio-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
     --ui-radio-muted: var(--ui-color-muted, #526175);
     --ui-radio-duration: 170ms;
@@ -131,7 +131,7 @@ const u = `
 
   :host([checked]) .control {
     border-color: var(--ui-radio-accent);
-    background: color-mix(in srgb, var(--ui-radio-accent) 8%, var(--ui-radio-background));
+    background: var(--ui-radio-accent);
   }
 
   :host([checked]) .control::before {
@@ -147,9 +147,12 @@ const u = `
     box-shadow: var(--ui-radio-focus);
   }
 
-  :host(:not([disabled]):not([loading]):hover) .control {
-    transform: translateY(-0.5px);
-    border-color: color-mix(in srgb, var(--ui-radio-accent) 80%, #0f172a 20%);
+  :host(:not([disabled]):not([loading]):not([checked]):hover) .control {
+    border-color: var(--ui-color-text-secondary, #64748b);
+  }
+
+  :host(:not([disabled]):not([loading])[checked]:hover) .control {
+    background: color-mix(in srgb, var(--ui-radio-accent) 88%, var(--ui-color-text-strong, #0f172a));
   }
 
   :host(:not([disabled]):not([loading]):active) .control {

package/dist/rating.cjs.js

@@ -3,14 +3,14 @@
     --ui-rating-size: var(--ui-control-size, var(--ui-font-size-lg, 20px));
     --ui-rating-gap: var(--ui-control-gap, 6px);
     --ui-rating-color: var(--ui-color-warning, #f59e0b);
-    --ui-rating-color-empty: var(--ui-color-muted, #cbd5e1);
+    --ui-rating-color-empty: var(--ui-color-line-strong, #cbd5e1);
     --ui-rating-color-hover: color-mix(in srgb, var(--ui-rating-color) 86%, #ffffff);
     --ui-rating-color-active: color-mix(in srgb, var(--ui-rating-color) 92%, #ffffff);
-    --ui-rating-color-disabled: color-mix(in srgb, var(--ui-color-muted, #cbd5e1) 60%, transparent);
-    --ui-rating-shadow: 0 1px 2px rgba(2, 6, 23, 0.12);
+    --ui-rating-color-disabled: color-mix(in srgb, var(--ui-color-line-strong, #cbd5e1) 70%, transparent);
+    --ui-rating-shadow: none;
     --ui-rating-duration: var(--ui-motion-base, 160ms);
     --ui-rating-easing: var(--ui-motion-easing, cubic-bezier(0.2, 0.8, 0.2, 1));
-    --ui-rating-radius: var(--ui-control-radius, var(--ui-radius, 4px));
+    --ui-rating-radius: var(--ui-control-radius, var(--ui-radius, 6px));
     display: inline-flex;
     flex-wrap: wrap;
     max-inline-size: 100%;
@@ -78,7 +78,7 @@
   :host([variant="minimal"]) {
     --ui-rating-shadow: none;
     --ui-rating-color: color-mix(in srgb, var(--ui-rating-color) 70%, #ffffff);
-    --ui-rating-color-empty: color-mix(in srgb, var(--ui-color-muted, #cbd5e1) 50%, transparent);
+    --ui-rating-color-empty: color-mix(in srgb, var(--ui-color-line-strong, #cbd5e1) 60%, transparent);
     --ui-rating-color-hover: color-mix(in srgb, var(--ui-rating-color) 80%, #ffffff);
     --ui-rating-color-active: color-mix(in srgb, var(--ui-rating-color) 85%, #ffffff);
   }
@@ -244,12 +244,8 @@
     transition: opacity 140ms var(--ui-rating-easing);
   }
 
-  .star:hover::after {
-    opacity: 0.08;
-  }
-
   .star:active::after {
-    opacity: 0.12;
+    opacity: 0.08;
   }
 
   .label {
@@ -317,11 +313,11 @@
       forced-color-adjust: auto;
     }
   }
-`;function x(i){return i!==null&&i.toLowerCase()!=="false"&&i!=="0"}function $(i){return i==="soft"||i==="glass"||i==="contrast"||i==="minimal"?i:"default"}function N(i){return i==="sm"||i==="lg"?i:"md"}function T(i){return i==="square"||i==="pill"?i:"rounded"}function I(i){return i==="neutral"||i==="info"||i==="success"||i==="warning"||i==="danger"?i:null}function q(i){return i==="hover"||i==="focus"||i==="disabled"?i:"idle"}function y(i){return i==="scale"||i==="pulse"||i==="none"?i:null}function B(i){if(!i)return null;const t=i.trim();return t?t==="full"?"999px":/^-?\\d+(\\.\\d+)?$/.test(t)?`${t}px`:t:null}function A(i){const t=Number(i);return!Number.isFinite(t)||t<=0?1:t===.5?.5:1}function n(i,t,e){return Math.min(e,Math.max(t,i))}function u(i,t){const e=Math.round(i/t)*t;return Number(e.toFixed(2))}function o(i,t){const e=i.getAttribute(t);if(e!=null)return e;const r=i[t];return typeof r=="string"&&r.length>0?r:null}function g(i,t){const e=i.getAttribute(t);if(e!=null)return x(e);const r=i[t];return typeof r=="boolean"?r:typeof r=="string"?x(r):!1}function w(i){return i.replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function z(i){return`
+`;function x(i){return i!==null&&i.toLowerCase()!=="false"&&i!=="0"}function $(i){return i==="soft"||i==="glass"||i==="contrast"||i==="minimal"?i:"default"}function N(i){return i==="sm"||i==="lg"?i:"md"}function T(i){return i==="square"||i==="pill"?i:"rounded"}function I(i){return i==="neutral"||i==="info"||i==="success"||i==="warning"||i==="danger"?i:null}function q(i){return i==="hover"||i==="focus"||i==="disabled"?i:"idle"}function y(i){return i==="scale"||i==="pulse"||i==="none"?i:null}function D(i){if(!i)return null;const t=i.trim();return t?t==="full"?"999px":/^-?\\d+(\\.\\d+)?$/.test(t)?`${t}px`:t:null}function A(i){const t=Number(i);return!Number.isFinite(t)||t<=0?1:t===.5?.5:1}function l(i,t,e){return Math.min(e,Math.max(t,i))}function h(i,t){const e=Math.round(i/t)*t;return Number(e.toFixed(2))}function a(i,t){const e=i.getAttribute(t);if(e!=null)return e;const r=i[t];return typeof r=="string"&&r.length>0?r:null}function g(i,t){const e=i.getAttribute(t);if(e!=null)return x(e);const r=i[t];return typeof r=="boolean"?r:typeof r=="string"?x(r):!1}function w(i){return i.replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function z(i){return`
     <svg viewBox="0 0 24 24" aria-hidden="true"${i?` class="${i}"`:""}>
       <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"></path>
     </svg>
-  `}class k extends V.ElementBase{constructor(){super(),this._autoAriaLabel=!1,this._stars=[],this._value=0,this._max=5,this._precision=1,this._disabled=!1,this._readonly=!1,this._hoverValue=0,this._onRootClick=this._onRootClick.bind(this),this._onRootMouseMove=this._onRootMouseMove.bind(this),this._onRootMouseLeave=this._onRootMouseLeave.bind(this),this._onRootFocusIn=this._onRootFocusIn.bind(this),this._onRootFocusOut=this._onRootFocusOut.bind(this),this._onRootKeyDown=this._onRootKeyDown.bind(this)}static get observedAttributes(){return["value","max","precision","disabled","readonly","variant","size","headless","theme","tone","state","animation","shape","radius","aria-label","aria-labelledby","aria-describedby","label","show-value"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onRootClick,!0),this.root.addEventListener("mousemove",this._onRootMouseMove,!0),this.root.addEventListener("mouseleave",this._onRootMouseLeave,!0),this.root.addEventListener("focusin",this._onRootFocusIn,!0),this.root.addEventListener("focusout",this._onRootFocusOut,!0),this.root.addEventListener("keydown",this._onRootKeyDown,!0)}disconnectedCallback(){this.root.removeEventListener("click",this._onRootClick,!0),this.root.removeEventListener("mousemove",this._onRootMouseMove,!0),this.root.removeEventListener("mouseleave",this._onRootMouseLeave,!0),this.root.removeEventListener("focusin",this._onRootFocusIn,!0),this.root.removeEventListener("focusout",this._onRootFocusOut,!0),this.root.removeEventListener("keydown",this._onRootKeyDown,!0),super.disconnectedCallback()}attributeChangedCallback(t,e,r){if(e!==r){if(t==="value"){const s=Number(r);Number.isFinite(s)&&(this._value=n(u(s,this._precision),0,this._max),this._syncStars(),this._syncAria())}if(t==="max"){const s=Number(r);Number.isFinite(s)&&s>0&&(this._max=Math.max(1,s),this._value>this._max&&(this._value=this._max),this._syncStars(),this._syncAria())}if(t==="precision"&&(this._precision=A(r),this._value=n(u(this._value,this._precision),0,this._max),this._hoverValue=this._hoverValue>0?n(u(this._hoverValue,this._precision),0,this._max):0,this._syncStars(),this._syncAria()),t==="disabled"&&(this._disabled=r!==null),t==="readonly"&&(this._readonly=r!==null),t==="animation"){const s=y(r);s?this.setAttribute("data-animation",s):this.removeAttribute("data-animation")}this.isConnected&&this.requestRender()}}get value(){return this._value}set value(t){const e=Number(t);if(!Number.isFinite(e))return;const r=n(u(e,this._precision),0,this._max);this._value!==r&&(this._value=r,this.setAttribute("value",String(this._value)),this._syncStars(),this._syncAria(),this._emit("change"),this._emit("input"))}get max(){return this._max}set max(t){const e=Number(t);Number.isFinite(e)&&(this._max=Math.max(1,e),this.setAttribute("max",String(this._max)),this._value>this._max&&(this._value=this._max,this.setAttribute("value",String(this._value))),this.requestRender())}get precision(){return this._precision}set precision(t){this._precision=t===.5?.5:1,this.setAttribute("precision",String(this._precision)),this._value=n(u(this._value,this._precision),0,this._max),this.requestRender()}get disabled(){return this._disabled}set disabled(t){this._disabled=!!t,this._disabled?this.setAttribute("disabled",""):this.removeAttribute("disabled"),this.requestRender()}get readonly(){return this._readonly}set readonly(t){this._readonly=!!t,this._readonly?this.setAttribute("readonly",""):this.removeAttribute("readonly"),this.requestRender()}_getStarFromEventTarget(t){return t instanceof Element?t.closest(".star"):null}_getStarIndex(t){if(!t)return-1;const e=Number(t.dataset.index);return Number.isFinite(e)?e:-1}_getValueFromPointer(t,e){const r=this._getStarIndex(e);if(r===-1)return this._value;if(this._precision!==.5)return r+1;const s=e.getBoundingClientRect(),l=t.clientX-s.left<=s.width/2?.5:1;return r+l}_formatValue(t){return Number.isInteger(t)?String(t):t.toFixed(1)}_getAriaValueText(t){return`${this._formatValue(t)} out of ${this._max}`}_onRootClick(t){if(this._disabled||this._readonly)return;const e=t,r=this._getStarFromEventTarget(e.target);r&&(this.value=this._getValueFromPointer(e,r))}_onRootMouseMove(t){if(this._disabled||this._readonly)return;const e=t,r=this._getStarFromEventTarget(e.target);r&&(this._hoverValue=this._getValueFromPointer(e,r),this.setAttribute("state","hover"),this._syncStars())}_onRootMouseLeave(){this._disabled||this._readonly||(this._hoverValue=0,this.removeAttribute("state"),this._syncStars())}_onRootFocusIn(t){if(this._disabled||this._readonly)return;const e=this._getStarFromEventTarget(t.target),r=this._getStarIndex(e);r!==-1&&(this._hoverValue=r+1,this.setAttribute("state","focus"),this._syncStars())}_onRootFocusOut(){this._disabled||this._readonly||(this._hoverValue=0,this.removeAttribute("state"),this._syncStars())}_onRootKeyDown(t){if(this._disabled||this._readonly)return;const e=t,r=this._getStarFromEventTarget(e.target),s=this._getStarIndex(r);if(s===-1)return;let a=this._value;const l=this._precision;switch(e.key){case"ArrowRight":case"ArrowUp":case"+":a=n(this._value+l,0,this._max);break;case"ArrowLeft":case"ArrowDown":case"-":a=n(this._value-l,0,this._max);break;case"Home":a=0;break;case"End":a=this._max;break;case" ":case"Enter":a=s+1;break;default:return}e.preventDefault(),this.value=a}_getFillPercent(t,e){const r=e-(t-1);return r>=1?100:r<=0?0:r*100}_syncStars(){const t=this._hoverValue>0?this._hoverValue:this._value;this._stars.forEach((e,r)=>{const s=r+1,a=this._getFillPercent(s,t);if(e.style.setProperty("--fill-percent",`${a}%`),this._disabled){e.setAttribute("data-state","disabled"),e.setAttribute("aria-disabled","true");return}if(e.removeAttribute("aria-disabled"),this._hoverValue>0){a>0?e.setAttribute("data-state","hover"):e.removeAttribute("data-state");return}a>0?e.setAttribute("data-state","active"):e.removeAttribute("data-state")}),this._syncAria()}_syncAria(){const t=this._getAriaValueText(this._value);this.setAttribute("role","slider"),this.setAttribute("tabindex",this._disabled||this._readonly?"-1":"0"),this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax",String(this._max)),this.setAttribute("aria-valuenow",String(this._value)),this.setAttribute("aria-valuetext",t),this.setAttribute("aria-orientation","horizontal"),this.setAttribute("aria-disabled",this._disabled?"true":"false"),this.setAttribute("aria-readonly",this._readonly?"true":"false"),this._stars.forEach((e,r)=>{const s=r+1,a=this._getFillPercent(s,this._hoverValue>0?this._hoverValue:this._value);e.setAttribute("aria-hidden","true"),e.setAttribute("data-fill",String(a)),e.setAttribute("data-star-value",String(s))})}_emit(t){this.dispatchEvent(new CustomEvent(t,{detail:{value:this._value,max:this._max,precision:this._precision,disabled:this._disabled,readonly:this._readonly},bubbles:!0,composed:!0}))}render(){const t=g(this,"disabled"),e=g(this,"readonly"),r=$(o(this,"variant")),s=N(o(this,"size")),a=o(this,"theme"),l=I(o(this,"tone")),c=q(o(this,"state")),m=y(o(this,"animation")),d=T(o(this,"shape")),v=B(o(this,"radius")),R=A(o(this,"precision")),p=this._autoAriaLabel?null:o(this,"aria-label"),f=o(this,"aria-labelledby"),_=o(this,"aria-describedby"),h=o(this,"label"),b=g(this,"show-value"),S=o(this,"value"),E=o(this,"max");this._max=Math.max(1,Number(E)||5),this._precision=R,this._value=n(u(Number(S)||0,this._precision),0,this._max),this._disabled=t,this._readonly=e,m?this.setAttribute("data-animation",m):this.removeAttribute("data-animation"),a==="dark"||a==="brand"?this.setAttribute("theme",a):this.removeAttribute("theme"),l?this.setAttribute("tone",l):this.removeAttribute("tone"),c==="disabled"?this.setAttribute("state","disabled"):c!=="idle"?this.setAttribute("state",c):this.removeAttribute("state"),d==="square"||d==="pill"?this.setAttribute("shape",d):this.removeAttribute("shape"),r==="default"?this.removeAttribute("variant"):this.setAttribute("variant",r),s==="md"?this.removeAttribute("size"):this.setAttribute("size",s),v?this.style.setProperty("--ui-rating-radius",v):this.style.removeProperty("--ui-rating-radius"),this.setAttribute("precision",String(this._precision));const F=Array.from({length:this._max},(P,M)=>`
+  `}class k extends V.ElementBase{constructor(){super(),this._autoAriaLabel=!1,this._stars=[],this._value=0,this._max=5,this._precision=1,this._disabled=!1,this._readonly=!1,this._hoverValue=0,this._onHostKeyDown=t=>{t.composedPath()[0]===this&&this._onRootKeyDown(t,!0)},this._onRootClick=this._onRootClick.bind(this),this._onRootMouseMove=this._onRootMouseMove.bind(this),this._onRootMouseLeave=this._onRootMouseLeave.bind(this),this._onRootFocusIn=this._onRootFocusIn.bind(this),this._onRootFocusOut=this._onRootFocusOut.bind(this),this._onRootKeyDown=this._onRootKeyDown.bind(this)}static get observedAttributes(){return["value","max","precision","disabled","readonly","variant","size","headless","theme","tone","state","animation","shape","radius","aria-label","aria-labelledby","aria-describedby","label","show-value"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onRootClick,!0),this.root.addEventListener("mousemove",this._onRootMouseMove,!0),this.root.addEventListener("mouseleave",this._onRootMouseLeave,!0),this.root.addEventListener("focusin",this._onRootFocusIn,!0),this.root.addEventListener("focusout",this._onRootFocusOut,!0),this.root.addEventListener("keydown",this._onRootKeyDown,!0),this.addEventListener("keydown",this._onHostKeyDown)}disconnectedCallback(){this.root.removeEventListener("click",this._onRootClick,!0),this.root.removeEventListener("mousemove",this._onRootMouseMove,!0),this.root.removeEventListener("mouseleave",this._onRootMouseLeave,!0),this.root.removeEventListener("focusin",this._onRootFocusIn,!0),this.root.removeEventListener("focusout",this._onRootFocusOut,!0),this.root.removeEventListener("keydown",this._onRootKeyDown,!0),this.removeEventListener("keydown",this._onHostKeyDown),super.disconnectedCallback()}attributeChangedCallback(t,e,r){if(e!==r){if(t==="value"){const s=Number(r);Number.isFinite(s)&&(this._value=l(h(s,this._precision),0,this._max),this._syncStars(),this._syncAria())}if(t==="max"){const s=Number(r);Number.isFinite(s)&&s>0&&(this._max=Math.max(1,s),this._value>this._max&&(this._value=this._max),this._syncStars(),this._syncAria())}if(t==="precision"&&(this._precision=A(r),this._value=l(h(this._value,this._precision),0,this._max),this._hoverValue=this._hoverValue>0?l(h(this._hoverValue,this._precision),0,this._max):0,this._syncStars(),this._syncAria()),t==="disabled"&&(this._disabled=r!==null),t==="readonly"&&(this._readonly=r!==null),t==="animation"){const s=y(r);s?this.setAttribute("data-animation",s):this.removeAttribute("data-animation")}this.isConnected&&this.requestRender()}}get value(){return this._value}set value(t){const e=Number(t);if(!Number.isFinite(e))return;const r=l(h(e,this._precision),0,this._max);this._value!==r&&(this._value=r,this.setAttribute("value",String(this._value)),this._syncStars(),this._syncAria(),this._emit("change"),this._emit("input"))}get max(){return this._max}set max(t){const e=Number(t);Number.isFinite(e)&&(this._max=Math.max(1,e),this.setAttribute("max",String(this._max)),this._value>this._max&&(this._value=this._max,this.setAttribute("value",String(this._value))),this.requestRender())}get precision(){return this._precision}set precision(t){this._precision=t===.5?.5:1,this.setAttribute("precision",String(this._precision)),this._value=l(h(this._value,this._precision),0,this._max),this.requestRender()}get disabled(){return this._disabled}set disabled(t){this._disabled=!!t,this._disabled?this.setAttribute("disabled",""):this.removeAttribute("disabled"),this.requestRender()}get readonly(){return this._readonly}set readonly(t){this._readonly=!!t,this._readonly?this.setAttribute("readonly",""):this.removeAttribute("readonly"),this.requestRender()}_getStarFromEventTarget(t){return t instanceof Element?t.closest(".star"):null}_getStarIndex(t){if(!t)return-1;const e=Number(t.dataset.index);return Number.isFinite(e)?e:-1}_getValueFromPointer(t,e){const r=this._getStarIndex(e);if(r===-1)return this._value;if(this._precision!==.5)return r+1;const s=e.getBoundingClientRect(),n=t.clientX-s.left<=s.width/2?.5:1;return r+n}_formatValue(t){return Number.isInteger(t)?String(t):t.toFixed(1)}_getAriaValueText(t){return`${this._formatValue(t)} out of ${this._max}`}_onRootClick(t){if(this._disabled||this._readonly)return;const e=t,r=this._getStarFromEventTarget(e.target);r&&(this.value=this._getValueFromPointer(e,r))}_onRootMouseMove(t){if(this._disabled||this._readonly)return;const e=t,r=this._getStarFromEventTarget(e.target);r&&(this._hoverValue=this._getValueFromPointer(e,r),this.setAttribute("state","hover"),this._syncStars())}_onRootMouseLeave(){this._disabled||this._readonly||(this._hoverValue=0,this.removeAttribute("state"),this._syncStars())}_onRootFocusIn(t){if(this._disabled||this._readonly)return;const e=this._getStarFromEventTarget(t.target),r=this._getStarIndex(e);r!==-1&&(this._hoverValue=r+1,this.setAttribute("state","focus"),this._syncStars())}_onRootFocusOut(){this._disabled||this._readonly||(this._hoverValue=0,this.removeAttribute("state"),this._syncStars())}_onRootKeyDown(t,e=!1){if(this._disabled||this._readonly)return;const r=t,s=this._getStarFromEventTarget(r.target),o=e?Math.max(0,Math.ceil(this._value)-1):this._getStarIndex(s);if(o===-1)return;let n=this._value;const u=this._precision;switch(r.key){case"ArrowRight":case"ArrowUp":case"+":n=l(this._value+u,0,this._max);break;case"ArrowLeft":case"ArrowDown":case"-":n=l(this._value-u,0,this._max);break;case"Home":n=0;break;case"End":n=this._max;break;case" ":case"Enter":n=o+1;break;default:return}r.preventDefault(),this.value=n}_getFillPercent(t,e){const r=e-(t-1);return r>=1?100:r<=0?0:r*100}_syncStars(){const t=this._hoverValue>0?this._hoverValue:this._value;this._stars.forEach((e,r)=>{const s=r+1,o=this._getFillPercent(s,t);if(e.style.setProperty("--fill-percent",`${o}%`),this._disabled){e.setAttribute("data-state","disabled"),e.setAttribute("aria-disabled","true");return}if(e.removeAttribute("aria-disabled"),this._hoverValue>0){o>0?e.setAttribute("data-state","hover"):e.removeAttribute("data-state");return}o>0?e.setAttribute("data-state","active"):e.removeAttribute("data-state")}),this._syncAria()}_syncAria(){const t=this._getAriaValueText(this._value);this.setAttribute("role","slider"),this.setAttribute("tabindex",this._disabled||this._readonly?"-1":"0"),this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax",String(this._max)),this.setAttribute("aria-valuenow",String(this._value)),this.setAttribute("aria-valuetext",t),this.setAttribute("aria-orientation","horizontal"),this.setAttribute("aria-disabled",this._disabled?"true":"false"),this.setAttribute("aria-readonly",this._readonly?"true":"false"),this._stars.forEach((e,r)=>{const s=r+1,o=this._getFillPercent(s,this._hoverValue>0?this._hoverValue:this._value);e.setAttribute("aria-hidden","true"),e.setAttribute("data-fill",String(o)),e.setAttribute("data-star-value",String(s))})}_emit(t){this.dispatchEvent(new CustomEvent(t,{detail:{value:this._value,max:this._max,precision:this._precision,disabled:this._disabled,readonly:this._readonly},bubbles:!0,composed:!0}))}render(){const t=g(this,"disabled"),e=g(this,"readonly"),r=$(a(this,"variant")),s=N(a(this,"size")),o=a(this,"theme"),n=I(a(this,"tone")),u=q(a(this,"state")),m=y(a(this,"animation")),d=T(a(this,"shape")),v=D(a(this,"radius")),R=A(a(this,"precision")),_=this._autoAriaLabel?null:a(this,"aria-label"),f=a(this,"aria-labelledby"),p=a(this,"aria-describedby"),c=a(this,"label"),b=g(this,"show-value"),S=a(this,"value"),E=a(this,"max");this._max=Math.max(1,Number(E)||5),this._precision=R,this._value=l(h(Number(S)||0,this._precision),0,this._max),this._disabled=t,this._readonly=e,m?this.setAttribute("data-animation",m):this.removeAttribute("data-animation"),o==="dark"||o==="brand"?this.setAttribute("theme",o):this.removeAttribute("theme"),n?this.setAttribute("tone",n):this.removeAttribute("tone"),u==="disabled"?this.setAttribute("state","disabled"):u!=="idle"?this.setAttribute("state",u):this.removeAttribute("state"),d==="square"||d==="pill"?this.setAttribute("shape",d):this.removeAttribute("shape"),r==="default"?this.removeAttribute("variant"):this.setAttribute("variant",r),s==="md"?this.removeAttribute("size"):this.setAttribute("size",s),v?this.style.setProperty("--ui-rating-radius",v):this.style.removeProperty("--ui-rating-radius"),this.setAttribute("precision",String(this._precision));const F=Array.from({length:this._max},(P,M)=>`
       <span
         class="star"
         aria-hidden="true"
@@ -347,10 +343,10 @@
       >
         ${F}
       </div>
-      ${h||b?`
+      ${c||b?`
             <div class="label" part="label">
-              ${h?`<span class="label-text">${w(h)}</span>`:""}
+              ${c?`<span class="label-text">${w(c)}</span>`:""}
               ${b?`<span class="value">${w(L)}</span>`:""}
             </div>
           `:""}
-    `),queueMicrotask(()=>{this._stars=Array.from(this.root.querySelectorAll(".star")),this._syncStars()}),this._autoAriaLabel=!1,p?this.setAttribute("aria-label",p):f?this.removeAttribute("aria-label"):(this.setAttribute("aria-label",(h||"").trim()||"Rating"),this._autoAriaLabel=!0),f?this.setAttribute("aria-labelledby",f):this.removeAttribute("aria-labelledby"),_?this.setAttribute("aria-describedby",_):this.removeAttribute("aria-describedby"),this._disabled?this.setAttribute("disabled",""):this.removeAttribute("disabled"),this._readonly?this.setAttribute("readonly",""):this.removeAttribute("readonly"),this._syncAria()}}typeof customElements<"u"&&!customElements.get("ui-rating")&&customElements.define("ui-rating",k);exports.UIRating=k;
+    `),queueMicrotask(()=>{this._stars=Array.from(this.root.querySelectorAll(".star")),this._syncStars()}),this._autoAriaLabel=!1,_?this.setAttribute("aria-label",_):f?this.removeAttribute("aria-label"):(this.setAttribute("aria-label",(c||"").trim()||"Rating"),this._autoAriaLabel=!0),f?this.setAttribute("aria-labelledby",f):this.removeAttribute("aria-labelledby"),p?this.setAttribute("aria-describedby",p):this.removeAttribute("aria-describedby"),this._disabled?this.setAttribute("disabled",""):this.removeAttribute("disabled"),this._readonly?this.setAttribute("readonly",""):this.removeAttribute("readonly"),this._syncAria()}}typeof customElements<"u"&&!customElements.get("ui-rating")&&customElements.define("ui-rating",k);exports.UIRating=k;