@ds-mo/ui 14.31.3 → 14.32.0

package/dist/mcp-data/registry/tag.json

@@ -403,7 +403,7 @@
   "files": [
     {
       "path": "src/wc/components/Tag/Tag.css",
-      "content": "@import '../../utils/tag-chip.css';\n@import '../../utils/control-density-inset.css';\n\n/* A one-character rounded Tag resolves to a circle at every density. */\n:host {\n  min-inline-size: var(--ds-control-height);\n}\n\n/* ── Intent × Contrast — strong ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-strong) {\n  background-color: var(--color-background-strong-neutral);\n  color: var(--color-foreground-medium-neutral);\n}\n:host(.tag--intent-brand.tag--contrast-strong) {\n  background-color: var(--color-background-strong-brand);\n  color: var(--color-foreground-on-strong-background-primary);\n}\n:host(.tag--intent-ai.tag--contrast-strong) {\n  background-color: var(--color-background-strong-ai);\n  color: var(--color-foreground-medium-ai);\n}\n:host(.tag--intent-negative.tag--contrast-strong) {\n  background-color: var(--color-background-strong-negative);\n  color: var(--color-foreground-medium-negative);\n}\n:host(.tag--intent-warning.tag--contrast-strong) {\n  background-color: var(--color-background-strong-warning);\n  color: var(--color-foreground-medium-warning);\n}\n:host(.tag--intent-caution.tag--contrast-strong) {\n  background-color: var(--color-background-strong-caution);\n  color: var(--color-foreground-medium-caution);\n}\n:host(.tag--intent-positive.tag--contrast-strong) {\n  background-color: var(--color-background-strong-positive);\n  color: var(--color-foreground-medium-positive);\n}\n\n/* ── Intent × Contrast — bold ───────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-bold) {\n  background-color: var(--color-background-bold-neutral);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-brand.tag--contrast-bold) {\n  background-color: var(--color-background-bold-brand);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-ai.tag--contrast-bold) {\n  background-color: var(--color-background-bold-ai);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-negative.tag--contrast-bold) {\n  background-color: var(--color-background-bold-negative);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-warning.tag--contrast-bold) {\n  background-color: var(--color-background-bold-warning);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-caution.tag--contrast-bold) {\n  background-color: var(--color-background-bold-caution);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-positive.tag--contrast-bold) {\n  background-color: var(--color-background-bold-positive);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n\n/* ── Intent × Contrast — medium ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-medium) {\n  background-color: var(--color-background-medium-neutral);\n  color: var(--color-foreground-strong-neutral);\n}\n:host(.tag--intent-brand.tag--contrast-medium) {\n  background-color: var(--color-background-medium-brand);\n  color: var(--color-foreground-on-medium-background-primary);\n}\n:host(.tag--intent-ai.tag--contrast-medium) {\n  background-color: var(--color-background-medium-ai);\n  color: var(--color-foreground-strong-ai);\n}\n:host(.tag--intent-negative.tag--contrast-medium) {\n  background-color: var(--color-background-medium-negative);\n  color: var(--color-foreground-strong-negative);\n}\n:host(.tag--intent-warning.tag--contrast-medium) {\n  background-color: var(--color-background-medium-warning);\n  color: var(--color-foreground-strong-warning);\n}\n:host(.tag--intent-caution.tag--contrast-medium) {\n  background-color: var(--color-background-medium-caution);\n  color: var(--color-foreground-strong-caution);\n}\n:host(.tag--intent-positive.tag--contrast-medium) {\n  background-color: var(--color-background-medium-positive);\n  color: var(--color-foreground-strong-positive);\n}\n\n/* ── Intent × Contrast — faint ──────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-faint) {\n  background-color: var(--color-background-faint-neutral);\n  color: var(--color-foreground-bold-neutral);\n}\n:host(.tag--intent-brand.tag--contrast-faint) {\n  background-color: var(--color-background-faint-brand);\n  color: var(--color-foreground-bold-brand);\n}\n:host(.tag--intent-ai.tag--contrast-faint) {\n  background-color: var(--color-background-faint-ai);\n  color: var(--color-foreground-bold-ai);\n}\n:host(.tag--intent-negative.tag--contrast-faint) {\n  background-color: var(--color-background-faint-negative);\n  color: var(--color-foreground-bold-negative);\n}\n:host(.tag--intent-warning.tag--contrast-faint) {\n  background-color: var(--color-background-faint-warning);\n  color: var(--color-foreground-bold-warning);\n}\n:host(.tag--intent-caution.tag--contrast-faint) {\n  background-color: var(--color-background-faint-caution);\n  color: var(--color-foreground-bold-caution);\n}\n:host(.tag--intent-positive.tag--contrast-faint) {\n  background-color: var(--color-background-faint-positive);\n  color: var(--color-foreground-bold-positive);\n}\n\n/* ── Interactive menu trigger ───────────────────────────────────────────── */\n\n:host(.tag--interactive) {\n  padding: 0;\n  gap: 0;\n}\n\n.tag__button {\n  all: unset;\n  position: relative;\n  z-index: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  min-width: 0;\n  max-width: 100%;\n  height: 100%;\n  padding: 0 var(--ds-control-padding-inline);\n  gap: var(--ds-control-gap);\n  border-radius: inherit;\n  color: inherit;\n  cursor: default;\n}\n\n.tag__button:disabled {\n  cursor: not-allowed;\n}\n\n/* Hover/press wash stays above the Tag's semantic background. */\n\n/* ── Icons ──────────────────────────────────────────────────────────────── */\n\n.tag__prefix-icon,\n.tag__suffix-icon {\n  position: relative;\n  z-index: 2;\n  display: inline-flex;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n",
+      "content": "@import '../../utils/radius.css';\n@import '../../utils/tag-chip.css';\n@import '../../utils/control-density-inset.css';\n\n/* A one-character rounded Tag resolves to a circle at every density. */\n:host {\n  min-inline-size: var(--ds-control-height);\n}\n\n/* ── Intent × Contrast — strong ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-strong) {\n  background-color: var(--color-background-strong-neutral);\n  color: var(--color-foreground-medium-neutral);\n}\n:host(.tag--intent-brand.tag--contrast-strong) {\n  background-color: var(--color-background-strong-brand);\n  color: var(--color-foreground-on-strong-background-primary);\n}\n:host(.tag--intent-ai.tag--contrast-strong) {\n  background-color: var(--color-background-strong-ai);\n  color: var(--color-foreground-medium-ai);\n}\n:host(.tag--intent-negative.tag--contrast-strong) {\n  background-color: var(--color-background-strong-negative);\n  color: var(--color-foreground-medium-negative);\n}\n:host(.tag--intent-warning.tag--contrast-strong) {\n  background-color: var(--color-background-strong-warning);\n  color: var(--color-foreground-medium-warning);\n}\n:host(.tag--intent-caution.tag--contrast-strong) {\n  background-color: var(--color-background-strong-caution);\n  color: var(--color-foreground-medium-caution);\n}\n:host(.tag--intent-positive.tag--contrast-strong) {\n  background-color: var(--color-background-strong-positive);\n  color: var(--color-foreground-medium-positive);\n}\n\n/* ── Intent × Contrast — bold ───────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-bold) {\n  background-color: var(--color-background-bold-neutral);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-brand.tag--contrast-bold) {\n  background-color: var(--color-background-bold-brand);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-ai.tag--contrast-bold) {\n  background-color: var(--color-background-bold-ai);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-negative.tag--contrast-bold) {\n  background-color: var(--color-background-bold-negative);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-warning.tag--contrast-bold) {\n  background-color: var(--color-background-bold-warning);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-caution.tag--contrast-bold) {\n  background-color: var(--color-background-bold-caution);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n:host(.tag--intent-positive.tag--contrast-bold) {\n  background-color: var(--color-background-bold-positive);\n  color: var(--color-foreground-on-bold-background-primary);\n}\n\n/* ── Intent × Contrast — medium ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-medium) {\n  background-color: var(--color-background-medium-neutral);\n  color: var(--color-foreground-strong-neutral);\n}\n:host(.tag--intent-brand.tag--contrast-medium) {\n  background-color: var(--color-background-medium-brand);\n  color: var(--color-foreground-on-medium-background-primary);\n}\n:host(.tag--intent-ai.tag--contrast-medium) {\n  background-color: var(--color-background-medium-ai);\n  color: var(--color-foreground-strong-ai);\n}\n:host(.tag--intent-negative.tag--contrast-medium) {\n  background-color: var(--color-background-medium-negative);\n  color: var(--color-foreground-strong-negative);\n}\n:host(.tag--intent-warning.tag--contrast-medium) {\n  background-color: var(--color-background-medium-warning);\n  color: var(--color-foreground-strong-warning);\n}\n:host(.tag--intent-caution.tag--contrast-medium) {\n  background-color: var(--color-background-medium-caution);\n  color: var(--color-foreground-strong-caution);\n}\n:host(.tag--intent-positive.tag--contrast-medium) {\n  background-color: var(--color-background-medium-positive);\n  color: var(--color-foreground-strong-positive);\n}\n\n/* ── Intent × Contrast — faint ──────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-faint) {\n  background-color: var(--color-background-faint-neutral);\n  color: var(--color-foreground-bold-neutral);\n}\n:host(.tag--intent-brand.tag--contrast-faint) {\n  background-color: var(--color-background-faint-brand);\n  color: var(--color-foreground-bold-brand);\n}\n:host(.tag--intent-ai.tag--contrast-faint) {\n  background-color: var(--color-background-faint-ai);\n  color: var(--color-foreground-bold-ai);\n}\n:host(.tag--intent-negative.tag--contrast-faint) {\n  background-color: var(--color-background-faint-negative);\n  color: var(--color-foreground-bold-negative);\n}\n:host(.tag--intent-warning.tag--contrast-faint) {\n  background-color: var(--color-background-faint-warning);\n  color: var(--color-foreground-bold-warning);\n}\n:host(.tag--intent-caution.tag--contrast-faint) {\n  background-color: var(--color-background-faint-caution);\n  color: var(--color-foreground-bold-caution);\n}\n:host(.tag--intent-positive.tag--contrast-faint) {\n  background-color: var(--color-background-faint-positive);\n  color: var(--color-foreground-bold-positive);\n}\n\n/* ── Interactive menu trigger ───────────────────────────────────────────── */\n\n:host(.tag--interactive) {\n  padding: 0;\n  gap: 0;\n}\n\n.tag__button {\n  all: unset;\n  position: relative;\n  z-index: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  min-width: 0;\n  max-width: 100%;\n  height: 100%;\n  padding: 0 var(--ds-control-padding-inline);\n  gap: var(--ds-control-gap);\n  border-radius: inherit;\n  color: inherit;\n  cursor: default;\n}\n\n.tag__button:disabled {\n  cursor: not-allowed;\n}\n\n/* Hover/press wash stays above the Tag's semantic background. */\n\n/* ── Icons ──────────────────────────────────────────────────────────────── */\n\n.tag__prefix-icon,\n.tag__suffix-icon {\n  position: relative;\n  z-index: 2;\n  display: inline-flex;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n",
       "type": "registry:ui"
     },
     {

package/dist/mcp-data/registry/textarea.json

@@ -588,7 +588,7 @@
   "files": [
     {
       "path": "src/wc/components/Textarea/Textarea.css",
-      "content": "@import '../../utils/interaction-fill.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-width.css';\n@import '../../utils/field-stack.css';\n@import '../../utils/typography.css';\n@import '../../utils/forced-colors.css';\n\n:host(.textarea-host) {\n  display: inline-flex;\n  --ds-textarea-fg: var(--color-foreground-primary);\n  --ds-textarea-placeholder: var(--color-foreground-secondary);\n  --ds-textarea-placeholder-active: var(--color-foreground-quaternary);\n  --ds-textarea-border: var(--color-border-secondary);\n}\n\n:host(.ds-control-width--fill),\n:host(.ds-control-width--fill) .textarea-control {\n  width: 100%;\n}\n\n.textarea-control {\n  display: flex;\n  box-sizing: border-box;\n  min-width: 0;\n  overflow: hidden;\n  background: transparent;\n  border: none;\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  color: var(--ds-textarea-fg);\n}\n\n.textarea-control--resizable {\n  padding-block-end: var(--dimension-space-025);\n  padding-inline-end: var(--dimension-space-025);\n}\n\n.textarea-control--bordered {\n  --ds-interaction-border-width: var(--dimension-stroke-width-012);\n  --ds-interaction-border-color: var(--ds-textarea-border);\n}\n\n.textarea-control--error {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.textarea-control--bordered:focus-within:not(.textarea-control--error) {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-brand);\n}\n\n:host(.ds-control-inactive) .textarea-control::after {\n  background: transparent;\n}\n\n.native-textarea {\n  position: relative;\n  z-index: 2;\n  box-sizing: border-box;\n  min-width: 0;\n  width: 100%;\n  padding-block: var(--ds-control-padding-inline, var(--dimension-space-075));\n  padding-inline: calc(\n    var(--ds-control-padding-inline, var(--dimension-space-075)) +\n      var(--ds-control-label-inset, var(--dimension-space-025))\n  );\n  background: transparent;\n  border: none;\n  border-radius: inherit;\n  outline: none;\n  color: var(--ds-textarea-fg);\n  font-family: inherit;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.native-textarea--resize-vertical {\n  resize: vertical;\n}\n\n.native-textarea--resize-none {\n  resize: none;\n}\n\n.native-textarea:disabled {\n  cursor: not-allowed;\n}\n\n.native-textarea:read-only:not(:disabled) {\n  cursor: default;\n}\n\n.native-textarea::placeholder {\n  color: var(--ds-textarea-placeholder);\n}\n\n.native-textarea:focus::placeholder {\n  color: var(--ds-textarea-placeholder-active);\n}\n\n.error-text {\n  width: 100%;\n}\n\n@media (forced-colors: active) {\n  .textarea-control--bordered:focus-within:not(.textarea-control--error)::after {\n    outline-color: var(--ds-forced-color-selected);\n  }\n\n  .textarea-control--error::after {\n    outline-style: dashed;\n  }\n}\n",
+      "content": "@import '../../utils/interaction-fill.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-width.css';\n@import '../../utils/field-stack.css';\n@import '../../utils/typography.css';\n@import '../../utils/forced-colors.css';\n\n:host(.textarea-host) {\n  display: inline-flex;\n  --ds-textarea-fg: var(--color-foreground-primary);\n  --ds-textarea-placeholder: var(--color-foreground-secondary);\n  --ds-textarea-placeholder-active: var(--color-foreground-quaternary);\n  --ds-textarea-border: var(--color-border-secondary);\n}\n\n:host(.ds-control-width--fill),\n:host(.ds-control-width--fill) .textarea-control {\n  width: 100%;\n}\n\n.textarea-control {\n  display: flex;\n  box-sizing: border-box;\n  min-width: 0;\n  overflow: hidden;\n  background: transparent;\n  border: none;\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  color: var(--ds-textarea-fg);\n}\n\n.textarea-control--resizable {\n  padding-block-end: var(--dimension-space-025);\n  padding-inline-end: var(--dimension-space-025);\n}\n\n.textarea-control--bordered {\n  --ds-interaction-border-width: var(--dimension-stroke-width-012);\n  --ds-interaction-border-color: var(--ds-textarea-border);\n}\n\n.textarea-control--error {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.textarea-control--bordered:focus-within:not(.textarea-control--error) {\n  --ds-interaction-border-width: var(--dimension-stroke-width-018);\n  --ds-interaction-border-color: var(--color-border-bold-brand);\n}\n\n:host(.ds-control-inactive) .textarea-control::after {\n  background: transparent;\n}\n\n.native-textarea {\n  position: relative;\n  z-index: 2;\n  box-sizing: border-box;\n  min-width: 0;\n  width: 100%;\n  padding-block: var(--ds-control-padding-inline, var(--dimension-space-075));\n  padding-inline: calc(\n    var(--ds-control-padding-inline, var(--dimension-space-075)) +\n      var(--ds-control-label-inset, var(--dimension-space-025))\n  );\n  background: transparent;\n  border: none;\n  border-radius: inherit;\n  outline: none;\n  color: var(--ds-textarea-fg);\n  font-family: inherit;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.native-textarea--resize-vertical {\n  resize: vertical;\n}\n\n.native-textarea--resize-none {\n  resize: none;\n}\n\n.native-textarea:disabled {\n  cursor: not-allowed;\n}\n\n.native-textarea:read-only:not(:disabled) {\n  cursor: default;\n}\n\n.native-textarea::placeholder {\n  color: var(--ds-textarea-placeholder);\n}\n\n.native-textarea:focus::placeholder {\n  color: var(--ds-textarea-placeholder-active);\n}\n\n.error-text {\n  width: 100%;\n}\n\n@media (forced-colors: active) {\n  .textarea-control--bordered:focus-within:not(.textarea-control--error)::after {\n    outline-color: var(--ds-forced-color-selected);\n  }\n\n  .textarea-control--error::after {\n    outline-style: dashed;\n  }\n}\n",
       "type": "registry:ui"
     },
     {

package/dist/mcp-data/registry/toast.json

@@ -330,7 +330,7 @@
   "files": [
     {
       "path": "src/wc/components/Toast/Toast.css",
-      "content": "@import '../../utils/visually-hidden.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n  display: contents;\n}\n\n.toast-region {\n  position: fixed;\n  inset: 0;\n  z-index: var(--dimension-z-index-floating);\n  pointer-events: none;\n  outline: none;\n}\n\n.toast-viewport {\n  position: absolute;\n  right: var(--dimension-space-200);\n  bottom: var(--dimension-space-200);\n  display: grid;\n  width: min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)));\n}\n\n@media (max-width: 767px) {\n  :host([avoid-mobile-shell-bar]) .toast-viewport {\n    bottom: calc(\n      var(--dimension-space-200) + var(--dimension-stroke-width-012) + var(--dimension-space-100) +\n        var(--dimension-size-500) + max(var(--dimension-space-100), env(safe-area-inset-bottom))\n    );\n  }\n}\n\n.toast-positioner {\n  grid-area: 1 / 1;\n  align-self: end;\n  justify-self: center;\n  width: 100%;\n  pointer-events: auto;\n  transform: translateY(calc(-1 * var(--toast-index) * var(--dimension-space-100)));\n  transition:\n    transform var(--effect-motion-short-3),\n    width var(--effect-motion-short-3);\n}\n\n.toast-viewport:not([data-expanded]) .toast-positioner {\n  width: calc(100% - 2 * var(--toast-index) * var(--dimension-space-100));\n}\n\n.toast-viewport[data-expanded] .toast-positioner {\n  transform: translateY(calc(-1 * var(--toast-offset-y)));\n}\n\n.toast-positioner[data-limited] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.toast-positioner--anchored {\n  position: fixed;\n  width: min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)));\n  transform: none;\n}\n\n.toast-positioner--anchored[data-positioned='false'] {\n  visibility: hidden;\n}\n\n.toast-surface {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  height: var(--toast-height, auto);\n  padding: var(--dimension-space-200);\n  overflow: hidden;\n  color: var(--color-foreground-primary);\n  background-color: var(--color-background-primary);\n  border-radius: var(--dimension-radius-050);\n  box-shadow: var(--effect-elevation-elevated-floating);\n  transform: translate(var(--toast-swipe-movement-x), var(--toast-swipe-movement-y));\n  animation: toast-enter var(--effect-motion-short-2) both;\n}\n\n.toast-positioner--ending .toast-surface {\n  animation: toast-exit var(--effect-motion-short-3) both;\n}\n\n.toast-surface--swiping {\n  transition: none;\n  user-select: none;\n}\n\n.toast-content {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  padding-inline-end: var(--dimension-size-500);\n  transition: opacity var(--effect-motion-short-3);\n}\n\n.toast-copy {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  min-height: var(--typography-lineheight-md);\n  margin-block: calc(-1 * var(--dimension-space-025));\n  gap: var(--dimension-space-050);\n}\n\n.toast-title,\n.toast-description {\n  min-width: 0;\n}\n\n.toast-action {\n  align-self: start;\n  margin-top: calc(var(--dimension-space-200) + var(--dimension-space-025));\n}\n\n.toast-close {\n  position: absolute;\n  top: var(--dimension-space-100);\n  right: var(--dimension-space-100);\n  transition: opacity var(--effect-motion-short-3);\n}\n\n.toast-viewport:not([data-expanded]) .toast-positioner[data-behind] .toast-content,\n.toast-viewport:not([data-expanded]) .toast-positioner[data-behind] .toast-close {\n  opacity: 0;\n}\n\n@keyframes toast-enter {\n  from {\n    opacity: 0;\n    transform: translateY(var(--dimension-space-100));\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes toast-exit {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .toast-positioner,\n  .toast-surface,\n  .toast-content,\n  .toast-close,\n  .toast-positioner--ending .toast-surface {\n    transition: none;\n    animation: none;\n  }\n\n  .toast-positioner--ending .toast-surface {\n    opacity: 0;\n  }\n}\n\n@media (forced-colors: active) {\n  .toast-surface {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n",
+      "content": "@import '../../utils/visually-hidden.css';\n@import '../../utils/forced-colors.css';\n@import '../../utils/radius.css';\n\n:host {\n  display: contents;\n}\n\n.toast-region {\n  position: fixed;\n  inset: 0;\n  z-index: var(--dimension-z-index-floating);\n  pointer-events: none;\n  outline: none;\n}\n\n.toast-viewport {\n  position: absolute;\n  right: var(--dimension-space-200);\n  bottom: var(--dimension-space-200);\n  display: grid;\n  width: min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)));\n}\n\n@media (max-width: 767px) {\n  :host([avoid-mobile-shell-bar]) .toast-viewport {\n    bottom: calc(\n      var(--dimension-space-200) + var(--dimension-stroke-width-012) + var(--dimension-space-100) +\n        var(--dimension-size-500) + max(var(--dimension-space-100), env(safe-area-inset-bottom))\n    );\n  }\n}\n\n.toast-positioner {\n  grid-area: 1 / 1;\n  align-self: end;\n  justify-self: center;\n  width: 100%;\n  pointer-events: auto;\n  transform: translateY(calc(-1 * var(--toast-index) * var(--dimension-space-100)));\n  transition:\n    transform var(--effect-motion-short-3),\n    width var(--effect-motion-short-3);\n}\n\n.toast-viewport:not([data-expanded]) .toast-positioner {\n  width: calc(100% - 2 * var(--toast-index) * var(--dimension-space-100));\n}\n\n.toast-viewport[data-expanded] .toast-positioner {\n  transform: translateY(calc(-1 * var(--toast-offset-y)));\n}\n\n.toast-positioner[data-limited] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.toast-positioner--anchored {\n  position: fixed;\n  width: min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)));\n  transform: none;\n}\n\n.toast-positioner--anchored[data-positioned='false'] {\n  visibility: hidden;\n}\n\n.toast-surface {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  height: var(--toast-height, auto);\n  padding: var(--dimension-space-200);\n  overflow: hidden;\n  color: var(--color-foreground-primary);\n  background-color: var(--color-background-primary);\n  border-radius: var(--ds-radius-modal);\n  box-shadow: var(--effect-elevation-elevated-floating);\n  transform: translate(var(--toast-swipe-movement-x), var(--toast-swipe-movement-y));\n  animation: toast-enter var(--effect-motion-short-2) both;\n}\n\n.toast-positioner--ending .toast-surface {\n  animation: toast-exit var(--effect-motion-short-3) both;\n}\n\n.toast-surface--swiping {\n  transition: none;\n  user-select: none;\n}\n\n.toast-content {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  padding-inline-end: var(--dimension-size-500);\n  transition: opacity var(--effect-motion-short-3);\n}\n\n.toast-copy {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  min-height: var(--typography-lineheight-md);\n  margin-block: calc(-1 * var(--dimension-space-025));\n  gap: var(--dimension-space-050);\n}\n\n.toast-title,\n.toast-description {\n  min-width: 0;\n}\n\n.toast-action {\n  align-self: start;\n  margin-top: calc(var(--dimension-space-200) + var(--dimension-space-025));\n}\n\n.toast-close {\n  position: absolute;\n  top: var(--dimension-space-100);\n  right: var(--dimension-space-100);\n  transition: opacity var(--effect-motion-short-3);\n}\n\n.toast-viewport:not([data-expanded]) .toast-positioner[data-behind] .toast-content,\n.toast-viewport:not([data-expanded]) .toast-positioner[data-behind] .toast-close {\n  opacity: 0;\n}\n\n@keyframes toast-enter {\n  from {\n    opacity: 0;\n    transform: translateY(var(--dimension-space-100));\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes toast-exit {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .toast-positioner,\n  .toast-surface,\n  .toast-content,\n  .toast-close,\n  .toast-positioner--ending .toast-surface {\n    transition: none;\n    animation: none;\n  }\n\n  .toast-positioner--ending .toast-surface {\n    opacity: 0;\n  }\n}\n\n@media (forced-colors: active) {\n  .toast-surface {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n",
       "type": "registry:ui"
     },
     {

package/dist/mcp-data/registry/tooltip-chart.json

@@ -248,7 +248,7 @@
   "files": [
     {
       "path": "src/wc/components/TooltipChart/TooltipChart.css",
-      "content": "@import '../../utils/control-density.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n  position: absolute;\n  z-index: var(--dimension-z-index-tooltip);\n  background-color: var(--color-translucent-translucent);\n  backdrop-filter: blur(var(--effect-blur-md));\n  -webkit-backdrop-filter: blur(var(--effect-blur-md));\n  border-radius: var(--dimension-radius-075);\n  box-shadow: var(--effect-elevation-elevated-floating);\n  white-space: nowrap;\n  pointer-events: none;\n  opacity: 0;\n}\n\n:host(.tooltip-chart--visible) {\n  animation: tooltip-chart-fade-in var(--effect-motion-short-2) forwards;\n}\n\n.tooltip-chart__item {\n  width: 100%;\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n}\n\n.tooltip-chart__items {\n  display: contents;\n}\n\n.tooltip-chart__swatch-box {\n  pointer-events: none;\n}\n\n.tooltip-chart__swatch {\n  width: var(--dimension-size-100);\n  height: var(--dimension-size-100);\n  flex: none;\n  border-radius: var(--dimension-radius-half);\n  background: var(--ds-tooltip-chart-swatch);\n}\n\n.tooltip-chart__value {\n  margin-inline-start: auto;\n  text-align: end;\n}\n\n.tooltip-chart__label,\n.tooltip-chart__value {\n  flex: none;\n}\n\n@keyframes tooltip-chart-fade-in {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host(.tooltip-chart--visible) {\n    animation: none;\n    opacity: 1;\n  }\n}\n\n@media (forced-colors: active) {\n  :host {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n",
+      "content": "@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n  position: absolute;\n  z-index: var(--dimension-z-index-tooltip);\n  background-color: var(--color-translucent-translucent);\n  backdrop-filter: blur(var(--effect-blur-md));\n  -webkit-backdrop-filter: blur(var(--effect-blur-md));\n  border-radius: var(--ds-radius-tooltip-menu);\n  box-shadow: var(--effect-elevation-elevated-floating);\n  white-space: nowrap;\n  pointer-events: none;\n  opacity: 0;\n}\n\n:host(.tooltip-chart--visible) {\n  animation: tooltip-chart-fade-in var(--effect-motion-short-2) forwards;\n}\n\n.tooltip-chart__item {\n  width: 100%;\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n}\n\n.tooltip-chart__items {\n  display: contents;\n}\n\n.tooltip-chart__swatch-box {\n  pointer-events: none;\n}\n\n.tooltip-chart__swatch {\n  width: var(--dimension-size-100);\n  height: var(--dimension-size-100);\n  flex: none;\n  border-radius: var(--dimension-radius-half);\n  background: var(--ds-tooltip-chart-swatch);\n}\n\n.tooltip-chart__value {\n  margin-inline-start: auto;\n  text-align: end;\n}\n\n.tooltip-chart__label,\n.tooltip-chart__value {\n  flex: none;\n}\n\n@keyframes tooltip-chart-fade-in {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host(.tooltip-chart--visible) {\n    animation: none;\n    opacity: 1;\n  }\n}\n\n@media (forced-colors: active) {\n  :host {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n",
       "type": "registry:ui"
     },
     {

package/dist/mcp-data/registry/tooltip.json

@@ -378,7 +378,7 @@
   "files": [
     {
       "path": "src/wc/components/Tooltip/Tooltip.css",
-      "content": "@import '../../utils/control-density.css';\n@import '../../utils/key-hint.css';\n@import '../../utils/forced-colors.css';\n\n.tooltip-popup {\n  box-sizing: border-box;\n  background-color: var(--color-background-primary);\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  box-shadow: var(--effect-elevation-elevated-floating);\n  white-space: nowrap;\n  pointer-events: none;\n  animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n  will-change: transform;\n  backface-visibility: hidden;\n}\n\n/* Warm handoff between nearby triggers — no enter fade (avoids 20–100ms lag). */\n.tooltip-popup--instant {\n  animation: none;\n  opacity: 1;\n}\n\n.tooltip-popup--closing {\n  animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n/* Density: md / sm / xs via `.ds-control--*` on `.tooltip-inner`. */\n.tooltip-inner {\n  box-sizing: border-box;\n  height: var(--ds-control-height, var(--dimension-size-400));\n  display: flex;\n  align-items: center;\n  gap: var(--ds-control-gap, var(--dimension-space-050));\n  padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n}\n\n/*\n * Label layout lives on ds-text (metric-box + control label-inset).\n * NOTE: Stencil scopes this to `ds-text.sc-ds-tooltip`, but portaled\n * createElement ds-text loses that class when Text's <Host class> renders.\n * `renderPopupContent` therefore also sets these as inline styles.\n */\n.tooltip-inner > ds-text {\n  flex-shrink: 0;\n  min-width: max-content;\n  max-width: none;\n  padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n  color: var(--color-foreground-primary);\n}\n\n.tooltip-popup--wrap {\n  white-space: normal;\n  max-inline-size: var(--dimension-panel-width-xs);\n}\n\n.tooltip-popup--wrap .tooltip-inner {\n  height: auto;\n  min-height: var(--ds-control-height, var(--dimension-size-400));\n  padding-block: var(--dimension-space-050);\n  align-items: flex-start;\n}\n\n.tooltip-popup--wrap .tooltip-inner > ds-text {\n  flex: 1 1 auto;\n  min-width: 0;\n  max-width: 100%;\n  white-space: pre-line;\n}\n\n@keyframes tooltipFadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes tooltipFadeOut {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .tooltip-popup,\n  .tooltip-popup--instant {\n    animation: none;\n    opacity: 1;\n  }\n\n  .tooltip-popup--closing {\n    animation: none;\n    opacity: 0;\n  }\n}\n\n@media (forced-colors: active) {\n  .tooltip-popup {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n",
+      "content": "@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/key-hint.css';\n@import '../../utils/forced-colors.css';\n\n.tooltip-popup {\n  box-sizing: border-box;\n  background-color: var(--color-background-primary);\n  border-radius: var(--ds-radius-tooltip-control, var(--dimension-radius-025));\n  box-shadow: var(--effect-elevation-elevated-floating);\n  white-space: nowrap;\n  pointer-events: none;\n  animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n  will-change: transform;\n  backface-visibility: hidden;\n}\n\n/* Warm handoff between nearby triggers — no enter fade (avoids 20–100ms lag). */\n.tooltip-popup--instant {\n  animation: none;\n  opacity: 1;\n}\n\n.tooltip-popup--closing {\n  animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n/* Density: md / sm / xs via `.ds-control--*` on `.tooltip-inner`. */\n.tooltip-inner {\n  box-sizing: border-box;\n  height: var(--ds-control-height, var(--dimension-size-400));\n  display: flex;\n  align-items: center;\n  gap: var(--ds-control-gap, var(--dimension-space-050));\n  padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n}\n\n/*\n * Label layout lives on ds-text (metric-box + control label-inset).\n * NOTE: Stencil scopes this to `ds-text.sc-ds-tooltip`, but portaled\n * createElement ds-text loses that class when Text's <Host class> renders.\n * `renderPopupContent` therefore also sets these as inline styles.\n */\n.tooltip-inner > ds-text {\n  flex-shrink: 0;\n  min-width: max-content;\n  max-width: none;\n  padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n  color: var(--color-foreground-primary);\n}\n\n.tooltip-popup--wrap {\n  white-space: normal;\n  max-inline-size: var(--dimension-panel-width-xs);\n}\n\n.tooltip-popup--wrap .tooltip-inner {\n  height: auto;\n  min-height: var(--ds-control-height, var(--dimension-size-400));\n  padding-block: var(--dimension-space-050);\n  align-items: flex-start;\n}\n\n.tooltip-popup--wrap .tooltip-inner > ds-text {\n  flex: 1 1 auto;\n  min-width: 0;\n  max-width: 100%;\n  white-space: pre-line;\n}\n\n@keyframes tooltipFadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes tooltipFadeOut {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .tooltip-popup,\n  .tooltip-popup--instant {\n    animation: none;\n    opacity: 1;\n  }\n\n  .tooltip-popup--closing {\n    animation: none;\n    opacity: 0;\n  }\n}\n\n@media (forced-colors: active) {\n  .tooltip-popup {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n}\n",
       "type": "registry:ui"
     },
     {

package/dist/react/components.d.ts

@@ -13,6 +13,7 @@ export { DsBadge } from "./ds-badge.js";
 export { DsBanner } from "./ds-banner.js";
 export { DsBarAction } from "./ds-bar-action.js";
 export { DsBarNav } from "./ds-bar-nav.js";
+export { DsBarPageTitle } from "./ds-bar-page-title.js";
 export { DsBarTitle } from "./ds-bar-title.js";
 export { DsBarWorkflow } from "./ds-bar-workflow.js";
 export { DsBreadcrumb } from "./ds-breadcrumb.js";

package/dist/react/components.js

@@ -14,6 +14,7 @@ export { DsBadge } from "./ds-badge.js";
 export { DsBanner } from "./ds-banner.js";
 export { DsBarAction } from "./ds-bar-action.js";
 export { DsBarNav } from "./ds-bar-nav.js";
+export { DsBarPageTitle } from "./ds-bar-page-title.js";
 export { DsBarTitle } from "./ds-bar-title.js";
 export { DsBarWorkflow } from "./ds-bar-workflow.js";
 export { DsBreadcrumb } from "./ds-breadcrumb.js";

package/dist/react/ds-bar-page-title.d.ts

@@ -0,0 +1,14 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import type { EventName, StencilReactComponent } from './react-runtime.js';
+import { type DsBarPageTitleCustomEvent } from "@ds-mo/ui";
+import type { Components } from "@ds-mo/ui/dist/components";
+import { DsBarPageTitle as DsBarPageTitleElement } from "@ds-mo/ui/dist/components/ds-bar-page-title.js";
+export type DsBarPageTitleEvents = {
+    onDsBack: EventName<DsBarPageTitleCustomEvent<MouseEvent>>;
+    onDsSectionChange: EventName<DsBarPageTitleCustomEvent<string>>;
+    onDsAction: EventName<DsBarPageTitleCustomEvent<string>>;
+};
+export declare const DsBarPageTitle: StencilReactComponent<DsBarPageTitleElement, DsBarPageTitleEvents, Components.DsBarPageTitle, 'heading'>;

package/dist/react/ds-bar-page-title.js

@@ -0,0 +1,16 @@
+'use client';
+import { createComponent } from './react-runtime.js';
+import React from 'react';
+import { DsBarPageTitle as DsBarPageTitleElement, defineCustomElement as defineDsBarPageTitle } from "@ds-mo/ui/dist/components/ds-bar-page-title.js";
+export const DsBarPageTitle = /*@__PURE__*/ createComponent({
+    tagName: 'ds-bar-page-title',
+    elementClass: DsBarPageTitleElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsBack: 'dsBack',
+        onDsSectionChange: 'dsSectionChange',
+        onDsAction: 'dsAction'
+    },
+    defineCustomElement: defineDsBarPageTitle
+});

package/dist/styles/table.css

@@ -43,7 +43,7 @@
   --_table-column-border: var(--ds-table-column-border, var(--color-border-tertiary));
   --_table-sticky-border: var(--ds-table-sticky-border, var(--color-border-tertiary));
   --_table-border-strong: var(--ds-table-border-strong, var(--color-border-secondary));
-  --_table-radius: var(--ds-table-radius, var(--dimension-radius-000));
+  --_table-radius: var(--ds-table-radius, var(--ds-radius-table, var(--dimension-radius-050)));
   --_table-header-min-block-size: var(--ds-table-header-min-block-size, var(--dimension-size-400));
   --_table-row-min-block-size: var(--ds-table-row-min-block-size, var(--dimension-size-500));
   --_table-cell-padding-block: var(--ds-table-cell-padding-block, var(--dimension-space-100));

package/dist/types/components/BarPageTitle/BarPageTitle.d.ts

@@ -0,0 +1,124 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { BarTitleActionConfigItem, BarTitleActionItem, BarTitlePrimaryAction, BarTitleSectionItem } from '../BarTitle/bar-title-types';
+export declare class BarPageTitle {
+    private static readonly INTRINSIC_WIDTH_RETRY_MAX;
+    private static readonly TAB_LAYOUT_COMMIT_MAX_FRAMES;
+    private static readonly OVERFLOW_HYSTERESIS_PX;
+    el: HTMLElement;
+    /** The page's single visible h1. */
+    heading: string;
+    /** Show the leading page-level Back action. */
+    showBack: boolean;
+    /** Accessible name for the leading Back action. */
+    backAriaLabel: string;
+    /** Optional page sections shown as an all-or-nothing tab row, or the compact section button. */
+    sections: BarTitleSectionItem[];
+    /** Id of the active page section. */
+    value: string;
+    /** Accessible name for the page-section tablist and menu. */
+    sectionsAriaLabel: string;
+    /** The one highest-emphasis page action. */
+    primaryAction: BarTitlePrimaryAction | null;
+    /** Secondary page actions shown in the overflow menu. Dividers create groups. */
+    actions: BarTitleActionItem[];
+    /**
+     * Ordered page-header actions. When supplied, this replaces the legacy
+     * primaryAction/actions presentation while preserving the same dsAction event.
+     */
+    actionItems?: BarTitleActionConfigItem[];
+    /** Accessible name for the page-actions menu. */
+    actionsAriaLabel: string;
+    /** Draw the compact bottom divider beneath the header. */
+    showDivider: boolean;
+    /** Override divider visibility for the compact shell-bar presentation. */
+    showCompactDivider?: boolean;
+    /** Emitted when the leading Back action is activated. */
+    dsBack: EventEmitter<MouseEvent>;
+    /** Emitted with the newly selected page-section id. */
+    dsSectionChange: EventEmitter<string>;
+    /** Emitted with the activated primary or overflow action id. */
+    dsAction: EventEmitter<string>;
+    private sectionMenuOpen;
+    private openActionMenuId;
+    private surfaceActionMenuId;
+    private sectionSurfaceOpen;
+    private sectionMenuInitialFocusVisible;
+    private actionMenuInitialFocusVisible;
+    private sectionsCollapsed;
+    private layoutCommitted;
+    private focusedTabId;
+    private readonly instanceId;
+    private readonly sectionMenuTriggerId;
+    private readonly sectionMenuId;
+    private readonly actionMenuTriggerId;
+    private readonly actionMenuId;
+    private sectionTriggerEl;
+    private actionTriggerEl;
+    private actionTriggerEls;
+    private chromeEl;
+    private rowEl;
+    private probeRowEl;
+    private visibleTabListEl;
+    private resizeObserver;
+    private intrinsicWidthRetryCount;
+    private tabLayoutPendingFrames;
+    private readonly panelNavTransition;
+    private readonly panelToolsTransition;
+    private readonly overflowCoalescer;
+    private chromeTransitionShell;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    componentDidRender(): void;
+    disconnectedCallback(): void;
+    handleSectionsChange(next: BarTitleSectionItem[], prev: BarTitleSectionItem[]): void;
+    handleValueChange(): void;
+    handleLayoutInputsChange(): void;
+    private reportActionIdIssues;
+    private get dividerVisible();
+    private get selectableSections();
+    private get hasSectionSelector();
+    private get sectionTabs();
+    private get selectableTabs();
+    private get effectiveValue();
+    private get selectedSectionLabel();
+    private get sectionTriggerAriaLabel();
+    private get sectionMenuSections();
+    private get resolvedActionItems();
+    private get visibleActions();
+    private get actionMenuSections();
+    private get showActionMenuTrigger();
+    private get availableActionMenuIds();
+    private get showSectionTabs();
+    private get showSectionButton();
+    private resetSectionLayout;
+    private bindChromeTransitionListeners;
+    private unbindChromeTransitionListeners;
+    private onChromeTransitionStart;
+    private chromeOverflowPaused;
+    private onChromeTransitionEnd;
+    private setupOverflowObserver;
+    private scheduleOverflowCheck;
+    private scheduleIntrinsicWidthRetry;
+    private forceTabLayoutCommit;
+    private getAvailableWidth;
+    private updateSectionsCollapsed;
+    private syncFocusedTabId;
+    private selectSection;
+    private toggleSectionMenu;
+    private closeSectionMenu;
+    private handleSectionSelect;
+    private toggleActionMenu;
+    private finishActionMenuClose;
+    private closeActionMenu;
+    private handleActionSelect;
+    private focusVisibleTab;
+    private findEnabledTab;
+    private handleTabKeyDown;
+    private chromeActionOptions;
+    private renderHeading;
+    private renderTabList;
+    private renderIdentity;
+    private renderSectionRegion;
+    render(): any;
+}
+//# sourceMappingURL=BarPageTitle.d.ts.map

package/dist/types/components/BarPageTitle/index.d.ts

@@ -0,0 +1,2 @@
+export type { BarTitleActionConfigItem, BarTitleActionItem, BarTitlePrimaryAction, BarTitleSectionItem, } from '../BarTitle/bar-title-types';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/components/BarTitle/BarTitle.d.ts

@@ -72,24 +72,18 @@ export declare class BarTitle {
     private get effectiveVariant();
     private get dividerVisible();
     private get expandedBreadcrumbItems();
-    /** Tooltip copy is fixed and generic; backAriaLabel/actionsAriaLabel stay page-specific. */
-    private get backTooltipLabel();
     private get primaryCollapsed();
     private get selectableSections();
     private get hasSectionSelector();
     private get effectiveValue();
     private get selectedSectionLabel();
     private get sectionTriggerAriaLabel();
-    private groupsFromSections;
     private get sectionMenuSections();
     private get resolvedActionItems();
     private get visibleActions();
     private get actionMenuSections();
     private get showActionMenuTrigger();
     private get availableActionMenuIds();
-    private actionMenuDomId;
-    private actionMenuAnchor;
-    private menuSectionsForAction;
     private toggleSectionMenu;
     private closeSectionMenu;
     private handleSectionSelect;
@@ -97,8 +91,8 @@ export declare class BarTitle {
     private finishActionMenuClose;
     private closeActionMenu;
     private handleActionSelect;
+    private chromeActionOptions;
     private renderSectionSelector;
-    private renderVisibleAction;
     private renderActions;
     private renderActionMenus;
     private handleBreadcrumbSelect;

package/dist/types/components/BarTitle/bar-title-action-chrome.d.ts

@@ -0,0 +1,76 @@
+import type { MenuItemData, MenuSection } from '../Menu/menu-types';
+import type { BarTitleActionConfigItem, BarTitlePrimaryAction } from './bar-title-types';
+export type FocusableBarTitleButton = HTMLElement & {
+    setFocus?: (segment?: 'primary' | 'menu') => Promise<void>;
+};
+export declare function barTitleActionMenuDomId(classPrefix: string, instanceId: number, resolvedActionItems: BarTitleActionConfigItem[], id: string): string;
+export declare function barTitleActionMenuAnchor(id: string, overflowTrigger: FocusableBarTitleButton | null, actionTriggers: Map<string, FocusableBarTitleButton>): HTMLElement | undefined;
+export declare function restoreBarTitleActionFocus(options: {
+    menuId: string;
+    overflowTrigger: FocusableBarTitleButton | null;
+    actionTriggers: Map<string, FocusableBarTitleButton>;
+    resolvedActionItems: BarTitleActionConfigItem[];
+}): Promise<void>;
+export declare function renderBarTitleBack(options: {
+    classPrefix: string;
+    showBack: boolean;
+    backAriaLabel: string;
+    onBack: (event: MouseEvent) => void;
+}): any;
+export declare function renderBarTitleSectionTrigger(options: {
+    classPrefix: string;
+    triggerId: string;
+    menuId: string;
+    open: boolean;
+    surfaceOpen: boolean;
+    ariaLabel: string;
+    selectedLabel: string;
+    setTriggerEl: (el: HTMLButtonElement | null) => void;
+    onToggle: (event: MouseEvent) => void;
+}): any;
+export declare function renderBarTitleActions(options: {
+    classPrefix: string;
+    compact: boolean;
+    visibleActions: BarTitleActionConfigItem[];
+    showOverflowTrigger: boolean;
+    actionItems: BarTitleActionConfigItem[] | undefined;
+    primaryAction: BarTitlePrimaryAction | null;
+    resolvedActionItems: BarTitleActionConfigItem[];
+    instanceId: number;
+    openActionMenuId: string;
+    surfaceActionMenuId: string;
+    actionsAriaLabel: string;
+    actionMenuTriggerId: string;
+    actionMenuId: string;
+    actionTriggers: Map<string, FocusableBarTitleButton>;
+    setOverflowTriggerEl: (el: FocusableBarTitleButton | null) => void;
+    toggleActionMenu: (id: string, event: MouseEvent) => void;
+    emitAction: (id: string) => void;
+}): any;
+export declare function renderBarTitleActionMenus(options: {
+    classPrefix: string;
+    visibleActions: BarTitleActionConfigItem[];
+    instanceId: number;
+    resolvedActionItems: BarTitleActionConfigItem[];
+    openActionMenuId: string;
+    actionMenuInitialFocusVisible: boolean;
+    overflowTrigger: FocusableBarTitleButton | null;
+    actionTriggers: Map<string, FocusableBarTitleButton>;
+    closeActionMenu: () => void;
+    finishActionMenuClose: (event: CustomEvent<void>) => void;
+    handleActionSelect: (event: CustomEvent<MenuItemData>) => void;
+}): any[];
+export declare function renderBarTitleOverflowMenu(options: {
+    classPrefix: string;
+    showOverflowTrigger: boolean;
+    actionMenuId: string;
+    actionMenuTriggerId: string;
+    actionsAriaLabel: string;
+    open: boolean;
+    actionMenuInitialFocusVisible: boolean;
+    actionMenuSections: MenuSection[];
+    closeActionMenu: () => void;
+    finishActionMenuClose: (event: CustomEvent<void>) => void;
+    handleActionSelect: (event: CustomEvent<MenuItemData>) => void;
+}): any;
+//# sourceMappingURL=bar-title-action-chrome.d.ts.map

package/dist/types/components/BarTitle/bar-title-actions.d.ts

@@ -7,5 +7,6 @@ export declare function barTitleActionIdIssues(items: BarTitleActionConfigItem[]
 export declare function visibleBarTitleActions(items: BarTitleActionConfigItem[], presentation: BarTitleActionPresentation): BarTitleActionConfigItem[];
 export declare function barTitleChoiceSections(choices: BarTitleMenuChoiceItem[]): MenuSection[];
 export declare function overflowBarTitleActionSections(items: BarTitleActionConfigItem[], presentation: BarTitleActionPresentation): MenuSection[];
+export declare function availableBarTitleActionMenuIds(visibleActions: BarTitleActionConfigItem[], showOverflowTrigger: boolean): Set<string>;
 export declare function findBarTitleAction(items: BarTitleActionConfigItem[], id: string): BarTitleAction | undefined;
 //# sourceMappingURL=bar-title-actions.d.ts.map

package/dist/types/components/BarTitle/bar-title-sections.d.ts

@@ -0,0 +1,11 @@
+import type { MenuSection } from '../Menu/menu-types';
+import type { TabItem } from '../TabGroup/tab-item-utils';
+import { type BarTitleSection, type BarTitleSectionItem } from './bar-title-types';
+export declare function selectableBarTitleSections(sections: BarTitleSectionItem[]): BarTitleSection[];
+export declare function effectiveBarTitleSectionValue(sections: BarTitleSectionItem[], value: string): string;
+export declare function selectedBarTitleSectionLabel(sections: BarTitleSectionItem[], value: string): string;
+export declare function barTitleSectionTriggerAriaLabel(sectionsAriaLabel: string, selectedLabel: string): string;
+export declare function barTitleSectionMenuSections(sections: BarTitleSectionItem[], selectedId: string): MenuSection[];
+export declare function barTitleSectionsToTabs(sections: BarTitleSectionItem[]): TabItem[];
+export declare function barTitleSectionsDigest(sections: BarTitleSectionItem[] | undefined): string;
+//# sourceMappingURL=bar-title-sections.d.ts.map

package/dist/types/components/CardSettingsScope/CardSettingsScope.d.ts

@@ -5,12 +5,14 @@ export interface SettingsScopeRequest {
     originalEvent: MouseEvent;
 }
 export declare class CardSettingsScope {
-    /** Current product area or the label for the combined settings view. */
+    /** Current product area or complete combined-view label in the sentence trigger. */
     areaLabel: string;
     /** Current organization or settings profile. */
     profileLabel: string;
     /** Sentence prefix, supplied separately for localization. */
     managingLabel: string;
+    /** Optional sentence noun after an area-only trigger label, supplied separately for localization. */
+    settingsLabel: string;
     /** Sentence connector, supplied separately for localization. */
     forLabel: string;
     /** Accessible name for this context region. */

package/dist/types/components/ShellApp/ShellApp.d.ts

@@ -200,6 +200,7 @@ export declare class ShellApp {
     private handleMobileActionSelect;
     private renderManagedMobileActionMenu;
     private get barTitleSections();
+    private renderManagedBarPageTitle;
     private renderManagedBarTitle;
     private renderManagedPage;
     private renderSlottedShell;