@tensor_1/tokens 2.26.3 → 2.28.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tensor_1/tokens",
-  "version": "2.26.3",
+  "version": "2.28.0",
   "description": "UIx v2 design tokens — the --uix-* contract for house products (Tensor, POSx, SHOPx). One DTCG source -> CSS variables, Tailwind theme, and typed TS constants.",
   "type": "module",
   "sideEffects": [

package/styles/components/button.css

@@ -28,9 +28,13 @@
   .uix-btn--link      { background: transparent; color: var(--uix-link); height: auto; padding: 0; }
   .uix-btn--link:hover      { text-decoration: underline; }
 
+  /* xs: the 24 px floor of WCAG 2.5.8, for dense tool rows (HAR-1348). */
+  .uix-btn--xs { height: 24px; padding: 0 var(--uix-space-2); gap: .25em; border-radius: var(--uix-radius-sm); font-size: var(--uix-text-meta); }
+  .uix-btn--xs svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
   .uix-btn--sm { height: 28px; padding: 0 var(--uix-space-3); font-size: var(--uix-text-meta); }
   .uix-btn--lg { height: 44px; padding: 0 var(--uix-space-5); }
   .uix-btn--icon { width: var(--uix-control-h); padding: 0; }
+  .uix-btn--icon.uix-btn--xs { width: 24px; }
   .uix-btn--icon.uix-btn--sm { width: 28px; }
   .uix-btn--icon.uix-btn--lg { width: 44px; }
 

package/styles/components/description-list.css

@@ -2,5 +2,6 @@
 @layer uix.components {
   .uix-dl { display: grid; grid-template-columns: max-content 1fr; gap: var(--uix-space-3) var(--uix-space-6); }
   .uix-dl dt { color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
-  .uix-dl dd { color: var(--uix-text); font-size: var(--uix-text-body); margin: 0; }
+  /* min-width:0 + anywhere: a long unbroken value (URL, id, hash) wraps instead of widening the grid (HAR-1353) */
+  .uix-dl dd { color: var(--uix-text); font-size: var(--uix-text-body); margin: 0; min-width: 0; overflow-wrap: anywhere; }
 }

package/styles/components/drawer.css

@@ -18,6 +18,18 @@
   }
   .uix-drawer[open]::backdrop { opacity: 1; }
   @starting-style { .uix-drawer[open]::backdrop { opacity: 0; } }
+  /* side="start" — the phone navigation drawer, from the left edge (HAR-1351) */
+  .uix-drawer--start { margin: 0 auto 0 0; border-left: 0; border-right: 1px solid var(--uix-border); transform: translateX(-100%); }
+  .uix-drawer--start[open] { transform: none; }
+  @starting-style { .uix-drawer--start[open] { transform: translateX(-100%); } }
+  /* side="bottom" — a bottom sheet: full width, content height, capped at 85% of the viewport */
+  .uix-drawer--bottom {
+    margin: auto 0 0 0; width: 100%; max-width: 100%; height: fit-content; max-height: 85dvh;
+    border-left: 0; border-top: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg) var(--uix-radius-lg) 0 0;
+    padding-bottom: env(safe-area-inset-bottom); transform: translateY(100%);
+  }
+  .uix-drawer--bottom[open] { transform: none; }
+  @starting-style { .uix-drawer--bottom[open] { transform: translateY(100%); } }
   .uix-drawer__header { display: flex; align-items: center; gap: var(--uix-space-3); padding: var(--uix-space-4) var(--uix-space-5); border-bottom: 1px solid var(--uix-border); }
   .uix-drawer__body { padding: var(--uix-space-5); overflow-y: auto; flex: 1; }
   .uix-drawer__footer { display: flex; gap: var(--uix-space-2); padding: var(--uix-space-4) var(--uix-space-5); border-top: 1px solid var(--uix-border); }

package/styles/components/kbd.css

@@ -6,3 +6,9 @@
     background: var(--uix-bg-subtle); border: 1px solid var(--uix-border); border-bottom-width: 2px; border-radius: var(--uix-radius-xs);
   }
 }
+
+/* A shortcut of several keys (React `KbdCombo`, HAR-1361) */
+@layer uix.components {
+  .uix-kbd-combo { display: inline-flex; align-items: center; }
+  .uix-kbd-combo__keys { display: inline-flex; align-items: center; gap: var(--uix-space-1); }
+}

package/styles/components/menu.css

@@ -13,3 +13,15 @@
   .uix-menu__sep { height: 1px; background: var(--uix-border); margin: var(--uix-space-1) 0; }
   .uix-menu__label { font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); padding: var(--uix-space-2) var(--uix-space-3) var(--uix-space-1); }
 }
+
+/* React `Menu` row parts (HAR-1359) */
+@layer uix.components {
+  .uix-menu__icon { display: inline-flex; flex: none; color: var(--uix-text-muted); }
+  .uix-menu__item--danger .uix-menu__icon { color: var(--uix-danger-text); }
+  .uix-menu__text { flex: 1; min-width: 0; }
+  .uix-menu__shortcut { margin-left: auto; padding-left: var(--uix-space-4); color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
+  a.uix-menu__item { text-decoration: none; }
+  .uix-menu__item:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: -2px; background: var(--uix-bg-hover); }
+  .uix-menu__item[aria-disabled="true"] { opacity: .5; cursor: default; }
+  .uix-menu__item[aria-disabled="true"]:hover { background: transparent; }
+}

package/styles/components/modal.css

@@ -37,3 +37,13 @@
   .uix-prompt { display: grid; gap: var(--uix-space-3); }
   .uix-prompt__actions { margin: var(--uix-space-3) calc(var(--uix-space-5) * -1) calc(var(--uix-space-5) * -1); }
 }
+
+/* ConfirmDialog body, compensation, type-to-confirm and error (HAR-1356) */
+@layer uix.components {
+  .uix-confirm { display: grid; gap: var(--uix-space-4); }
+  .uix-confirm__body { display: grid; gap: var(--uix-space-3); }
+  .uix-confirm__compensation { display: grid; gap: var(--uix-space-1); padding: var(--uix-space-3); border-radius: var(--uix-radius-sm); background: var(--uix-bg-subtle); color: var(--uix-text); font-size: var(--uix-text-meta); }
+  .uix-confirm__compensation-title { font-weight: 600; }
+  .uix-confirm__error { padding: var(--uix-space-2) var(--uix-space-3); border-radius: var(--uix-radius-sm); background: var(--uix-danger-bg); color: var(--uix-danger-text); font-size: var(--uix-text-meta); }
+  .uix-dialog__footer .uix-confirm__tertiary { margin-inline-end: auto; }
+}

package/styles/components/pagination.css

@@ -1,6 +1,6 @@
 /* uix pagination — depends only on --uix-* tokens. */
 @layer uix.components {
-  .uix-pagination { display: inline-flex; align-items: center; gap: var(--uix-space-1); }
+  .uix-pagination { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--uix-space-1); }
   .uix-pagination__btn {
     min-width: 32px; height: 32px; padding: 0 var(--uix-space-2); display: inline-flex; align-items: center; justify-content: center;
     border: 1px solid var(--uix-border); border-radius: var(--uix-radius-sm); background: var(--uix-surface);
@@ -9,6 +9,9 @@
   }
   .uix-pagination__btn:hover { background: var(--uix-bg-hover); }
   .uix-pagination__btn[aria-current="page"] { background: var(--uix-accent); border-color: var(--uix-accent); color: var(--uix-accent-fg); }
-  .uix-pagination__btn:disabled { opacity: .45; pointer-events: none; }
+  .uix-pagination__btn:disabled, .uix-pagination__btn[aria-disabled="true"] { opacity: .45; pointer-events: none; }
+  /* link pager (HAR-1357): anchors look like the buttons */
+  a.uix-pagination__btn { text-decoration: none; }
+  .uix-pagination__summary { padding: 0 var(--uix-space-2); color: var(--uix-text-muted); font-size: var(--uix-text-meta); font-variant-numeric: tabular-nums; }
   .uix-pagination__ellipsis { padding: 0 var(--uix-space-1); color: var(--uix-text-muted); }
 }

package/styles/components/popover.css

@@ -16,3 +16,11 @@
   @starting-style { [popover].uix-popover:popover-open { opacity: 0; transform: var(--popover-from); } }
   [popover].uix-popover[data-uix-placing]:popover-open { opacity: 0; transform: var(--popover-from); transition: none; }
 }
+
+/* Popconfirm — the anchored single-step confirmation (HAR-1356) */
+@layer uix.components {
+  .uix-popconfirm { display: grid; gap: var(--uix-space-2); width: max-content; max-width: min(20rem, calc(100vw - 2 * var(--uix-space-4))); padding: var(--uix-space-3); }
+  .uix-popconfirm__title { font-weight: 600; color: var(--uix-text); }
+  .uix-popconfirm__body { display: grid; gap: var(--uix-space-2); color: var(--uix-text-hushed); font-size: var(--uix-text-meta); }
+  .uix-popconfirm__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--uix-space-2); margin-top: var(--uix-space-1); }
+}

package/styles/components/rich-text.css

@@ -123,17 +123,15 @@
   /* composer variant — the composer draws the box; the toolbar joins the action bar */
   .uix-rich-text--composer { border-radius: var(--uix-radius-md); }
   .uix-rich-text--composer.uix-rich-text:focus-within { box-shadow: 0 0 0 3px var(--uix-brand-muted); }
-  /* one row: the toolbar scrolls instead of wrapping */
-  .uix-rich-text--composer .uix-rich-text__bar { flex-wrap: nowrap; align-items: center; justify-content: flex-start; min-width: 0; }
-  .uix-rich-text--composer .uix-rich-text__toolbar { flex: 1 1 auto; padding: 0; border-bottom: 0; }
+  /* the tool row scrolls and keeps five tools; the counter and toolbarEnd wrap below it first (a
+     toggle + submit on one row left the tools 0 px on a phone, TENSOR HAR-1125) */
+  .uix-rich-text--composer .uix-rich-text__bar { flex-wrap: wrap; align-items: center; justify-content: flex-start; min-width: 0; }
+  .uix-rich-text--composer .uix-rich-text__toolbar { flex: 1 1 0; min-width: min(5 * 32px, 100%); padding: 0; border-bottom: 0; }
   .uix-rich-text--composer .uix-rich-text__group--end { margin-left: 0; }
   .uix-rich-text--composer .uix-rich-text__counter,
   .uix-rich-text--composer .uix-rich-text__status { flex: none; margin-right: 0; }
   .uix-rich-text--composer .uix-rich-text__bar > :last-child:not(.uix-rich-text__toolbar) { margin-left: auto; }
-  /* a status message (uploading, failed, images off) takes its own row under the tools: inline, a
-     long message squeezed the toolbar to a sliver on a 320 px phone (TENSOR HAR-749) */
-  .uix-rich-text--composer .uix-rich-text__bar:has(> .uix-rich-text__status:not(:empty)) { flex-wrap: wrap; }
-  .uix-rich-text--composer .uix-rich-text__bar:has(> .uix-rich-text__status:not(:empty)) > .uix-rich-text__toolbar { flex-basis: 0; }
+  /* a status message (uploading, failed, images off) takes its own row (HAR-749) */
   .uix-rich-text--composer .uix-rich-text__status:not(:empty) { order: 1; flex: 1 0 100%; }
   .uix-rich-text--composer .uix-rich-text__source.uix-textarea { border: 0; box-shadow: none; }
 

package/styles/components/scheduling-calendar.css

@@ -4,6 +4,12 @@
   .uix-scheduling-calendar__grid { display:grid; grid-template-columns:repeat(7,minmax(6.5rem,1fr)); border-top:1px solid var(--uix-border); border-left:1px solid var(--uix-border); overflow:auto; }
   .uix-scheduling-calendar__day { min-height:8rem; padding:var(--uix-space-2); border-right:1px solid var(--uix-border); border-bottom:1px solid var(--uix-border); background:var(--uix-surface); }
   .uix-scheduling-calendar__day[data-outside] { background:var(--uix-bg-subtle); color:var(--uix-text-muted); }
+  .uix-scheduling-calendar__weekday { padding:var(--uix-space-1) var(--uix-space-2); border-right:1px solid var(--uix-border); border-bottom:1px solid var(--uix-border); background:var(--uix-bg-subtle); color:var(--uix-text-muted); font-size:var(--uix-text-meta); font-weight:600; text-align:right; }
+  .uix-scheduling-calendar__dayhead { display:flex; align-items:center; gap:var(--uix-space-1); min-width:0; }
+  .uix-scheduling-calendar__dayhead > .uix-scheduling-calendar__date { flex:1 1 auto; width:auto; }
+  .uix-scheduling-calendar__badge { display:inline-flex; align-items:center; min-width:0; overflow:hidden; white-space:nowrap; font-size:var(--uix-text-meta); }
+  .uix-scheduling-calendar__more { justify-self:start; padding:var(--uix-space-1) var(--uix-space-2); border:0; border-radius:var(--uix-radius-sm); background:transparent; color:var(--uix-link); font-size:var(--uix-text-meta); font-weight:600; text-align:left; cursor:pointer; }
+  .uix-scheduling-calendar__more:hover { background:var(--uix-bg-subtle); }
   .uix-scheduling-calendar__date { display:block; width:100%; border:0; background:transparent; color:inherit; text-align:right; font-size:var(--uix-text-meta); }
   .uix-scheduling-calendar__overlay { display:block; margin-block:var(--uix-space-1); padding:var(--uix-space-1) var(--uix-space-2); border-radius:var(--uix-radius-sm); background:var(--uix-info-bg); color:var(--uix-info-text); font-size:var(--uix-text-meta); }
   .uix-scheduling-calendar__overlay[data-kind="blackout"] { background:var(--uix-danger-bg); color:var(--uix-danger-text); }

package/styles/components/sidebar.css

@@ -18,7 +18,7 @@
   .uix-sidebar__toggle svg { width: 18px; height: 18px; }
 
   .uix-navitem {
-    display: flex; align-items: center; gap: var(--uix-space-3); height: 36px; padding: 0 var(--uix-space-3);
+    display: flex; align-items: center; gap: var(--uix-space-3); min-height: 36px; padding: 0 var(--uix-space-3);
     border-radius: var(--uix-radius-sm); color: var(--uix-text-hushed); cursor: pointer; text-decoration: none;
     border: 0; background: transparent; font: inherit; font-size: var(--uix-text-body); width: 100%; text-align: left;
     transition: background-color var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out);
@@ -30,6 +30,11 @@
   .uix-navitem__icon { width: var(--uix-icon-md); height: var(--uix-icon-md); flex: none; }
   .uix-navitem__label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
   .uix-navitem__badge { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
+  /* two-line row: a label plus a wrapping second line (HAR-1355). min-height above lets it grow. */
+  .uix-navitem[data-multiline] { align-items: flex-start; padding-block: var(--uix-space-2); }
+  .uix-navitem__text { flex: 1; min-width: 0; display: grid; }
+  .uix-navitem__desc { font-size: var(--uix-text-meta); line-height: 1.35; color: var(--uix-text-muted); overflow-wrap: anywhere; white-space: normal; font-weight: 400; }
+  .uix-navitem[aria-current="page"] .uix-navitem__desc { color: var(--uix-text-hushed); }
   /* on the active tint, muted badge dips below AA — hushed composites darker on the tint */
   .uix-navitem[aria-current="page"] .uix-navitem__badge { color: var(--uix-text-hushed); }
   .uix-navitem__star { position: relative; display: grid; place-items: center; width: 22px; height: 22px; border: 0; background: transparent; color: var(--uix-text-muted); cursor: pointer; border-radius: var(--uix-radius-xs); opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out); }
@@ -100,13 +105,15 @@
   .uix-sidebar[data-collapsed] .uix-sidebar__eyebrow,
   .uix-sidebar[data-collapsed] .uix-sidebar__brand,
   .uix-sidebar[data-collapsed] .uix-navgroup__chevron,
-  .uix-sidebar[data-collapsed] .uix-navgroup__panel { display: none; }
+  .uix-sidebar[data-collapsed] .uix-navgroup__panel,
+  .uix-sidebar[data-collapsed] .uix-navitem__desc { display: none; }
   .uix-sidebar[data-nav="rail"] .uix-navitem__badge,
   .uix-sidebar[data-nav="rail"] .uix-navitem__star,
   .uix-sidebar[data-nav="rail"] .uix-sidebar__eyebrow,
   .uix-sidebar[data-nav="rail"] .uix-sidebar__brand,
   .uix-sidebar[data-nav="rail"] .uix-navgroup__chevron,
-  .uix-sidebar[data-nav="rail"] .uix-navgroup__panel { display: none; }
+  .uix-sidebar[data-nav="rail"] .uix-navgroup__panel,
+  .uix-sidebar[data-nav="rail"] .uix-navitem__desc { display: none; }
   /* rail labels stay in the accessibility tree — clip pattern (mirrors .uix-visually-hidden),
      not display:none, so icon-only nav items keep their names (UIX-A11Y-2). position:absolute
      removes the label from the flex row, so the centered rail layout is unaffected. */
@@ -119,8 +126,8 @@
     white-space: nowrap; border: 0;
   }
   /* center the icon-only rail; head keeps just the toggle, centered */
-  .uix-sidebar[data-collapsed] .uix-navitem { justify-content: center; padding: 0; gap: 0; }
+  .uix-sidebar[data-collapsed] .uix-navitem { justify-content: center; align-items: center; padding: 0; gap: 0; }
   .uix-sidebar[data-collapsed] .uix-sidebar__head { justify-content: center; padding-inline: 0; }
-  .uix-sidebar[data-nav="rail"] .uix-navitem { justify-content: center; padding: 0; gap: 0; }
+  .uix-sidebar[data-nav="rail"] .uix-navitem { justify-content: center; align-items: center; padding: 0; gap: 0; }
   .uix-sidebar[data-nav="rail"] .uix-sidebar__head { justify-content: center; padding-inline: 0; }
 }

package/styles/components/stat-tile.css

@@ -36,5 +36,9 @@
   .uix-stat__chevron { display: inline-flex; flex: none; margin-inline-start: auto; color: var(--uix-text-muted); }
   .uix-stat__label .uix-stat__chevron svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); transition: transform var(--uix-dur-fast) var(--uix-ease-out); }
   .uix-stat--interactive[aria-expanded="true"] .uix-stat__chevron svg { transform: rotate(180deg); }
+  /* link — the whole tile is an <a> to a filtered list or a record (HAR-1350) */
+  .uix-stat--link { text-decoration: none; }
+  /* current: the ring outline only; a brand tint would drop the muted label below AA */
+  .uix-stat--link[aria-current="page"] { border-color: var(--uix-ring); box-shadow: inset 0 0 0 1px var(--uix-ring); }
   @media (prefers-reduced-motion: reduce) { .uix-stat--interactive, .uix-stat__label .uix-stat__chevron svg { transition: none; } }
 }

package/styles/components/steps.css

@@ -16,3 +16,31 @@
   .uix-step[data-state="done"] + .uix-step__connector,
   .uix-step__connector[data-done] { background: var(--uix-accent); }
 }
+
+/* React `Steps` (HAR-1362): an <ol>, each <li> = marker · title/description · connector */
+@layer uix.components {
+  .uix-steps--list { margin: 0; padding: 0; list-style: none; align-items: flex-start; }
+  .uix-steps--list > .uix-step { align-items: flex-start; min-width: 0; }
+  .uix-steps--list > .uix-step:not(:last-child) { flex: 1; }
+  .uix-step__text { display: grid; min-width: 0; padding-top: var(--uix-space-1); }
+  .uix-step__title { font-size: var(--uix-text-meta); font-weight: 500; }
+  .uix-step__desc { font-size: var(--uix-text-meta); color: var(--uix-text-muted); overflow-wrap: anywhere; }
+  .uix-step__action { color: inherit; text-decoration: none; padding: 0; border: 0; background: transparent; font: inherit; text-align: start; }
+  a.uix-step__action, button.uix-step__action { cursor: pointer; text-decoration: underline; text-underline-offset: .15em; }
+  .uix-steps--list .uix-step__connector { align-self: center; margin-top: 0; }
+  .uix-steps--horizontal > .uix-step > .uix-step__connector { align-self: flex-start; margin-top: 13px; }
+  .uix-steps--horizontal > .uix-step > .uix-step__text { flex: 0 0 auto; max-width: 12rem; }
+  .uix-step[data-state="waiting"] .uix-step__marker { border-style: dashed; border-color: var(--uix-warning-border); color: var(--uix-warning-text); }
+  .uix-step[data-state="error"] { color: var(--uix-text); }
+  .uix-step[data-state="error"] .uix-step__marker { background: var(--uix-danger-bg); border-color: var(--uix-danger-border); color: var(--uix-danger-text); }
+  /* vertical (and horizontal below 40rem): a column, the connector a line under the marker */
+  .uix-steps--vertical { flex-direction: column; gap: 0; }
+  .uix-steps--vertical > .uix-step { position: relative; padding-bottom: var(--uix-space-4); }
+  .uix-steps--vertical > .uix-step > .uix-step__connector { position: absolute; left: 13px; top: 30px; bottom: 4px; width: 1px; height: auto; min-width: 0; margin: 0; }
+  @media (max-width: 40rem) {
+    .uix-steps--horizontal { flex-direction: column; gap: 0; }
+    .uix-steps--horizontal > .uix-step { position: relative; padding-bottom: var(--uix-space-4); }
+    .uix-steps--horizontal > .uix-step > .uix-step__text { flex: 1 1 auto; max-width: none; }
+    .uix-steps--horizontal > .uix-step > .uix-step__connector { position: absolute; left: 13px; top: 30px; bottom: 4px; width: 1px; height: auto; min-width: 0; margin: 0; }
+  }
+}

package/styles/components/table-toolbar.css

@@ -17,8 +17,37 @@
   .uix-chip:hover { border-color: var(--uix-border-strong); color: var(--uix-text); }
   .uix-chip[data-on] { background: var(--uix-brand-muted); border-color: var(--uix-accent); color: var(--uix-accent-text); }
   .uix-chip:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
-  .uix-chip__count { font-variant-numeric: tabular-nums; opacity: .7; }
+  /* muted text, not opacity: .7 opacity on hushed text fell below AA (HAR-1360) */
+  .uix-chip__count { font-variant-numeric: tabular-nums; color: var(--uix-text-muted); }
+  .uix-chip[data-on] .uix-chip__count { color: inherit; }
   .uix-filter-popover { display: grid; gap: var(--uix-space-4); min-width: 260px; padding: var(--uix-space-4); }
   .uix-filter-popover .uix-label { display: grid; gap: var(--uix-space-2); }
   .uix-filter-popover__actions { display: flex; justify-content: flex-end; gap: var(--uix-space-2); }
 }
+
+/* Chip (React `Chip`, HAR-1360): removable, toggle, link, static and "+ add" chips, and the group */
+@layer uix.components {
+  a.uix-chip, .uix-chip__main { text-decoration: none; }
+  .uix-chip--static, .uix-chip--removable { cursor: default; }
+  .uix-chip--add { border-style: dashed; }
+  .uix-chip:disabled, .uix-chip[aria-disabled="true"] { opacity: .5; pointer-events: none; }
+  .uix-chip__icon { display: inline-flex; flex: none; }
+  .uix-chip__label { min-width: 0; overflow-wrap: anywhere; }
+  .uix-chip__icon svg { width: var(--uix-icon-sm); height: var(--uix-icon-sm); }
+  .uix-chip--removable { padding-inline-end: var(--uix-space-1); }
+  .uix-chip__main {
+    display: inline-flex; align-items: center; gap: var(--uix-space-2); padding: 0; border: 0;
+    background: transparent; color: inherit; font: inherit; border-radius: var(--uix-radius-pill);
+  }
+  button.uix-chip__main, a.uix-chip__main { cursor: pointer; }
+  .uix-chip__main:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 2px; }
+  /* 24 px hit area (WCAG 2.5.8) without growing the chip: the negative block margin eats the overhang */
+  .uix-chip__remove {
+    display: inline-grid; place-items: center; width: 24px; height: 24px; margin-block: calc(-1 * var(--uix-space-1)); padding: 0; flex: none;
+    border: 0; border-radius: var(--uix-radius-pill); background: transparent; color: inherit; cursor: pointer;
+  }
+  .uix-chip__remove svg { width: 12px; height: 12px; }
+  .uix-chip__remove:hover { background: var(--uix-bg-hover); color: var(--uix-text); }
+  .uix-chip__remove:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 1px; }
+  .uix-chip-group { display: flex; flex-wrap: wrap; align-items: center; gap: var(--uix-space-2); }
+}

package/styles/components/toast.css

@@ -19,3 +19,19 @@
   .uix-toast--danger  .uix-toast__icon { color: var(--uix-danger); }
   .uix-toast--info    .uix-toast__icon { color: var(--uix-info); }
 }
+
+/* Imperative toasts (React `toast()` + `Toaster`, HAR-1363): warning tone, action, loading, positions */
+@layer uix.components {
+  .uix-toast--warning .uix-toast__icon { color: var(--uix-warning-text); }
+  .uix-toast__action-slot { flex: none; align-self: center; }
+  .uix-toast__action {
+    border: 0; background: transparent; padding: var(--uix-space-1) var(--uix-space-2); border-radius: var(--uix-radius-xs);
+    color: var(--uix-link); font: inherit; font-size: var(--uix-text-meta); font-weight: 600; cursor: pointer; white-space: nowrap;
+  }
+  .uix-toast__action:hover { background: var(--uix-bg-hover); }
+  .uix-toast__action:focus-visible, .uix-toast__close:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 1px; }
+  .uix-toast__spinner { width: var(--uix-icon-md); height: var(--uix-icon-md); }
+  .uix-toaster[data-position^="top"] { top: var(--uix-space-4); bottom: auto; }
+  .uix-toaster[data-position$="start"] { left: var(--uix-space-4); right: auto; }
+  .uix-toaster[data-position$="center"] { left: 50%; right: auto; transform: translateX(-50%); }
+}

package/styles/components/tooltip.css

@@ -17,6 +17,9 @@
     box-shadow: var(--uix-shadow-popover); white-space: normal;
     opacity: 0; transition: opacity var(--uix-dur-fast) var(--uix-ease-out);
   }
+  /* rich content (HAR-1349): a short list or a few lines, never interactive */
+  .uix-tooltip__bubble :is(ul, ol) { margin: 0; padding-left: 1.1em; }
+  .uix-tooltip__bubble :is(p, ul, ol) + :is(p, ul, ol) { margin-top: var(--uix-space-1); }
   .uix-tooltip__bubble:popover-open { opacity: 1; }
   @starting-style { .uix-tooltip__bubble:popover-open { opacity: 0; } }