@pgcorp/ui-kit 0.14.0 → 0.15.0

package/docs/theming.md

@@ -27,10 +27,21 @@ prop `hitbox`; переопределяйте токены только как
 
 ### Интеграция шкалы слоёв host-приложения
 
-Floating surfaces (`STooltip`, menu, select, combobox и popover), modal и
-drawer телепортируются в `document.body`. `SToastContainer` также размещается
-в корневой области приложения. Их layer tokens разрешаются на `:root`, а не
-во вложенном theme-контейнере trigger.
+Unscoped floating surfaces (`STooltip`, menu, select, combobox и popover)
+телепортируются в `document.body`. Их layer tokens разрешаются на `:root`, а
+не во вложенном theme-контейнере trigger. Viewport modal/drawer — нативные
+modal dialogs в top layer. Их floating descendants используют собственный
+untransformed portal внутри dialog, вне visual-frame scroll/clipping.
+
+Global `SToastContainer` и application-root `SControlledToastViewport`
+сохраняют background-приоритет и native недоступность во время viewport modal.
+Modal-local `SControlledToastViewport` использует portal своего dialog;
+parent-local уведомление недоступно в дочернем modal. Notification records,
+действия и lifetime принадлежат своим явным owners, не глобальному переносу.
+Exact native portal задаёт локальный toast anchor как сумму backdrop owner
+и `--s-layer-toast`. Application-root anchor не изменяется. Зарегистрированные
+nested popup сохраняют собственный динамический step и могут находиться выше
+локального уведомления; toast не является новым modal или focus-stack owner.
 
 Шкала задаёт base anchors, а не статический total order:
 
@@ -63,6 +74,12 @@ drawer телепортируются в `document.body`. `SToastContainer` та
 интеграции проверьте tooltip/menu/select, toast, drag, modal/drawer и floating
 surface внутри modal. Не меняйте `z-index` внутренних элементов компонентов.
 
+Host offset согласует обычные stacking contexts. Native top-layer order
+определяется браузером: `z-index` не поднимает body portal или global toast над
+modal и не допускает взаимодействие с background. Modal-owned drag surface
+остаётся внутри actual dialog; background drag не начинается во время
+модальности. Вложенные native dialogs следуют lifecycle общего layer owner.
+
 Локальные floating-элементы не входят в root-level bridge. Autocomplete-tooltip
 `SCodeEditor` остаётся потомком `.cm-editor`, а overlay-вариант
 `SResizeHandle` — абсолютным потомком своего positioned owner. Они используют
@@ -99,10 +116,21 @@ the hitbox.
 
 ### Host application layer-scale integration
 
-Floating surfaces (`STooltip`, menus, selects, comboboxes, and popovers), modals,
-and drawers teleport to `document.body`. `SToastContainer` also belongs at the
-application root. Their layer tokens resolve on `:root`, not in the trigger's
-nested theme container.
+Unscoped floating surfaces (`STooltip`, menus, selects, comboboxes, and popovers)
+teleport to `document.body`. Their layer tokens resolve on `:root`, not in the
+trigger's nested theme container. Viewport modals/drawers are native modal
+dialogs in the top layer. Floating descendants use the dialog's untransformed
+portal outside visual-frame scrolling/clipping.
+
+Global `SToastContainer` and application-root `SControlledToastViewport` retain
+background priority and native inactivity during viewport modality. A modal-local
+`SControlledToastViewport` uses its own dialog's portal; parent-local
+notifications are inactive inside a child modal. Notification records, actions,
+and lifetimes retain their explicit owners without global relocation.
+The exact native portal derives its local toast anchor from its backdrop owner
+plus `--s-layer-toast`; the application-root anchor is unchanged. Registered
+nested popups keep their dynamic step and may paint above local notifications.
+The toast does not create a modal or a focus-stack owner.
 
 The scale defines base anchors, not a static total order:
 
@@ -134,6 +162,12 @@ sticky, affordance, and navigation anchors are not shifted.
 Verify tooltip/menu/select, toast, drag, modal/drawer, and a floating surface
 inside a modal. Do not override internal component `z-index` values.
 
+The host offset integrates ordinary stacking contexts. The browser determines
+native top-layer order: `z-index` cannot lift body portals or global toasts over
+a modal or enable background interaction. A modal-owned drag surface stays
+inside the actual dialog; background dragging cannot start during modality.
+Nested native dialogs follow the shared layer owner's lifecycle.
+
 Local floating elements are outside the root-level bridge. The `SCodeEditor`
 autocomplete tooltip remains a descendant of `.cm-editor`, and the overlay
 `SResizeHandle` remains an absolutely positioned child of its positioned owner.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pgcorp/ui-kit",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "Typed Vue 3 design system with accessible components, semantic themes, and workbench patterns.",
   "type": "module",
   "types": "./dist/index.d.ts",

package/src/components/shared/_internal/SDialogSurface.css

@@ -1,86 +1,165 @@
 @reference "../../../styles/reference.css";
 
 .s-dialog-surface {
+  position: absolute;
+  inset: 0;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  max-width: none;
+  max-height: none;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+  background: transparent;
+  color: inherit;
+  box-shadow: none;
+}
+
+dialog.s-dialog-surface {
+  position: fixed;
+  display: block;
+}
+
+dialog.s-dialog-surface::backdrop {
+  background: transparent;
+  pointer-events: none;
+}
+
+.s-dialog-surface__portal {
+  display: contents;
+}
+
+.s-dialog-surface__frame {
   box-shadow: var(--s-elevation-overlay);
 }
 
 .s-dialog-surface:focus-visible {
+  outline: none;
+}
+
+.s-dialog-surface:focus-visible .s-dialog-surface__frame {
   outline: var(--s-focus-ring-width) solid var(--s-focus-ring-color);
   outline-offset: var(--s-focus-ring-inset-offset);
 }
 
-.s-dialog-surface[data-presentation='modal'] {
-  @apply w-full transform overflow-hidden rounded-2xl p-6 text-left align-middle transition-all;
+.s-modal-backdrop,
+.s-drawer-backdrop {
+  position: absolute;
+  inset: 0;
+  background: var(--s-overlay-backdrop-surface);
+  -webkit-backdrop-filter: blur(var(--s-overlay-backdrop-blur));
+  backdrop-filter: blur(var(--s-overlay-backdrop-blur));
+}
+
+.s-modal-container,
+.s-drawer-shell {
+  position: absolute;
+  inset: 0;
+}
+
+.s-modal-container {
+  overflow-y: auto;
+}
+
+.s-drawer-backdrop[data-scope='contained'],
+.s-drawer-shell[data-scope='contained'] {
+  pointer-events: auto;
+}
+
+.s-modal-panel-container {
+  @apply flex min-h-full items-center justify-center p-4 text-center;
+}
+
+.s-modal-panel-container--fullscreen {
+  @apply items-stretch justify-stretch p-0 text-left;
+}
+
+.s-drawer-positioner {
+  @apply absolute inset-0 flex items-stretch;
+  justify-content: right;
+}
+
+.s-drawer-positioner[data-placement='left'] {
+  justify-content: left;
+}
+
+.s-drawer-positioner[data-placement='bottom'] {
+  @apply items-end justify-stretch;
+}
+
+.s-dialog-surface__frame[data-presentation='modal'] {
+  @apply w-full transform overflow-hidden rounded-2xl p-6 text-left align-middle;
   @apply bg-surface-0 dark:bg-surface-800;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-surface='subtle'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-surface='subtle'] {
   @apply bg-surface-50 dark:bg-surface-900;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-scroll='body'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-scroll='body'] {
   @apply flex max-h-[calc(100dvh-2rem)] flex-col;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-scroll='body'] .s-dialog-surface__body {
+.s-dialog-surface__frame[data-presentation='modal'][data-scroll='body'] .s-dialog-surface__body {
   @apply min-h-0 flex-1 overflow-y-auto;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-layout='fullscreen'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-layout='fullscreen'] {
   @apply min-h-screen rounded-none;
   max-width: 100%;
   height: 100%;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='sm'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='sm'] {
   max-width: 24rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='md'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='md'] {
   max-width: 28rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='lg'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='lg'] {
   max-width: 32rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='xl'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='xl'] {
   max-width: 36rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='2xl'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='2xl'] {
   max-width: 42rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='3xl'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='3xl'] {
   max-width: 48rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='4xl'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='4xl'] {
   max-width: 56rem;
 }
 
-.s-dialog-surface[data-presentation='modal'][data-size='wide'] {
+.s-dialog-surface__frame[data-presentation='modal'][data-size='wide'] {
   max-width: 72rem;
 }
 
-.s-dialog-surface[data-presentation='modal'] .s-dialog-surface__header {
+.s-dialog-surface__frame[data-presentation='modal'] .s-dialog-surface__header {
   @apply flex items-start justify-between border-b border-surface-200 pb-4 dark:border-surface-700;
 }
 
-.s-dialog-surface[data-presentation='modal'] .s-dialog-surface__title {
+.s-dialog-surface__frame[data-presentation='modal'] .s-dialog-surface__title {
   @apply text-lg font-medium leading-6 text-surface-900 dark:text-surface-100;
 }
 
-.s-dialog-surface[data-presentation='modal'] .s-dialog-surface__body {
+.s-dialog-surface__frame[data-presentation='modal'] .s-dialog-surface__body {
   @apply mt-4 text-sm text-surface-600 dark:text-surface-300;
 }
 
-.s-dialog-surface[data-presentation='modal'] .s-dialog-surface__footer {
+.s-dialog-surface__frame[data-presentation='modal'] .s-dialog-surface__footer {
   @apply mt-6 flex justify-end gap-3 border-t border-surface-200 pt-4 dark:border-surface-700;
 }
 
-.s-dialog-surface[data-presentation='modal'] .s-dialog-surface__footer[data-layout='split'] {
+.s-dialog-surface__frame[data-presentation='modal'] .s-dialog-surface__footer[data-layout='split'] {
   @apply flex-wrap items-center justify-start gap-x-3 gap-y-2;
 }
 
@@ -97,90 +176,156 @@
   @apply ml-auto justify-end;
 }
 
-.s-dialog-surface[data-presentation='drawer'] {
+.s-dialog-surface__frame[data-presentation='drawer'] {
   @apply relative flex h-full w-full flex-col overflow-hidden border-l border-surface-200 bg-surface-0 text-surface-900 dark:border-surface-700 dark:bg-surface-900 dark:text-surface-0;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-placement='left'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-placement='left'] {
   @apply border-l-0 border-r;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-size='sm'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-size='sm'] {
   max-width: 30rem;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-size='md'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-size='md'] {
   max-width: 36rem;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-size='lg'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-size='lg'] {
   max-width: 44rem;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-placement='bottom'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-placement='bottom'] {
   @apply max-w-none rounded-t-2xl border-l-0 border-t border-surface-200 dark:border-surface-700;
   width: 100%;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'] {
   max-height: calc(100dvh - 1rem);
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'][data-size='sm'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'][data-size='sm'] {
   height: 50dvh;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'][data-size='md'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'][data-size='md'] {
   height: 70dvh;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'][data-size='lg'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='viewport'][data-placement='bottom'][data-size='lg'] {
   height: 90dvh;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='contained'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='contained'] {
   max-inline-size: none;
   max-block-size: 100%;
   min-inline-size: 0;
   min-block-size: 0;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='contained'][data-placement='bottom'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='contained'][data-placement='bottom'] {
   block-size: var(--s-drawer-extent);
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scope='contained'][data-placement='left'],
-.s-dialog-surface[data-presentation='drawer'][data-scope='contained'][data-placement='right'] {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='contained'][data-placement='left'],
+.s-dialog-surface__frame[data-presentation='drawer'][data-scope='contained'][data-placement='right'] {
   inline-size: var(--s-drawer-extent);
 }
 
-.s-dialog-surface[data-presentation='drawer'] .s-dialog-surface__header {
+.s-dialog-surface__frame[data-presentation='drawer'] .s-dialog-surface__header {
   @apply flex shrink-0 items-start gap-3 border-b border-surface-200 px-5 py-4 dark:border-surface-700 md:px-6;
 }
 
-.s-dialog-surface[data-presentation='drawer'] .s-dialog-surface__title {
+.s-dialog-surface__frame[data-presentation='drawer'] .s-dialog-surface__title {
   @apply min-w-0 flex-1 text-lg font-semibold leading-6 text-surface-950 dark:text-surface-0;
 }
 
-.s-dialog-surface[data-presentation='drawer'] .s-dialog-surface__body {
+.s-dialog-surface__frame[data-presentation='drawer'] .s-dialog-surface__body {
   @apply min-h-0 min-w-0 flex-1 overflow-y-auto p-5 md:p-6;
   overscroll-behavior: contain;
 }
 
-.s-dialog-surface[data-presentation='drawer'][data-scroll='content'] .s-dialog-surface__body {
+.s-dialog-surface__frame[data-presentation='drawer'][data-scroll='content'] .s-dialog-surface__body {
   @apply flex flex-col overflow-hidden p-0;
 }
 
-.s-dialog-surface[data-presentation='drawer'] .s-dialog-surface__footer {
+.s-dialog-surface__frame[data-presentation='drawer'] .s-dialog-surface__footer {
   @apply flex shrink-0 flex-wrap justify-end gap-3 border-t border-surface-200 px-5 py-4 dark:border-surface-700 md:px-6;
 }
 
 @media (max-width: 767px) {
-  .s-dialog-surface[data-presentation='drawer'][data-layout='mobile-fullscreen'] {
+  .s-dialog-surface__frame[data-presentation='drawer'][data-layout='mobile-fullscreen'] {
     @apply max-w-full border-l-0 border-r-0;
   }
 }
 
-.s-dialog-surface[data-presentation][hidden] {
+.s-dialog-surface[hidden] {
   display: none;
 }
+
+.s-dialog-surface-motion-enter-active .s-dialog-surface__frame,
+.s-dialog-surface-motion-leave-active .s-dialog-surface__frame {
+  transition: transform var(--s-motion-standard) ease;
+}
+
+.s-dialog-surface-motion-enter-from[data-presentation='modal'] .s-dialog-surface__frame,
+.s-dialog-surface-motion-leave-to[data-presentation='modal'] .s-dialog-surface__frame {
+  transform: scale(0.96);
+}
+
+.s-dialog-surface-motion-enter-from[data-presentation='drawer'] .s-dialog-surface__frame,
+.s-dialog-surface-motion-leave-to[data-presentation='drawer'] .s-dialog-surface__frame {
+  transform: translateX(1.5rem);
+}
+
+.s-dialog-surface-motion-enter-from[data-placement='left'] .s-dialog-surface__frame,
+.s-dialog-surface-motion-leave-to[data-placement='left'] .s-dialog-surface__frame {
+  transform: translateX(-1.5rem);
+}
+
+.s-dialog-surface-motion-enter-from[data-placement='bottom'] .s-dialog-surface__frame,
+.s-dialog-surface-motion-leave-to[data-placement='bottom'] .s-dialog-surface__frame {
+  transform: translateY(1.5rem);
+}
+
+@media (max-width: 767px) {
+  .s-dialog-surface-motion-enter-from[data-placement='right'] .s-dialog-surface__frame,
+  .s-dialog-surface-motion-leave-to[data-placement='right'] .s-dialog-surface__frame {
+    transform: translateY(1.5rem);
+  }
+}
+
+.s-dialog-surface-motion-enter-active .s-modal-backdrop,
+.s-dialog-surface-motion-leave-active .s-modal-backdrop,
+.s-dialog-surface-motion-enter-active .s-drawer-backdrop,
+.s-dialog-surface-motion-leave-active .s-drawer-backdrop {
+  transition: opacity var(--s-motion-standard) ease;
+}
+
+.s-dialog-surface-motion-enter-from .s-modal-backdrop,
+.s-dialog-surface-motion-leave-to .s-modal-backdrop,
+.s-dialog-surface-motion-enter-from .s-drawer-backdrop,
+.s-dialog-surface-motion-leave-to .s-drawer-backdrop {
+  opacity: 0;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .s-dialog-surface-motion-enter-active .s-dialog-surface__frame,
+  .s-dialog-surface-motion-leave-active .s-dialog-surface__frame,
+  .s-dialog-surface-motion-enter-active .s-modal-backdrop,
+  .s-dialog-surface-motion-leave-active .s-modal-backdrop,
+  .s-dialog-surface-motion-enter-active .s-drawer-backdrop,
+  .s-dialog-surface-motion-leave-active .s-drawer-backdrop {
+    transition: none;
+  }
+
+  .s-dialog-surface-motion-enter-from[data-presentation='modal'] .s-dialog-surface__frame,
+  .s-dialog-surface-motion-leave-to[data-presentation='modal'] .s-dialog-surface__frame,
+  .s-dialog-surface-motion-enter-from[data-presentation='drawer'] .s-dialog-surface__frame,
+  .s-dialog-surface-motion-leave-to[data-presentation='drawer'] .s-dialog-surface__frame,
+  .s-dialog-surface-motion-enter-from[data-placement] .s-dialog-surface__frame,
+  .s-dialog-surface-motion-leave-to[data-placement] .s-dialog-surface__frame {
+    transform: none;
+  }
+}

package/src/components/shared/controls/SButton.css

@@ -21,10 +21,7 @@
   appearance: none;
   touch-action: manipulation;
   transition:
-    background-color var(--s-motion-standard) ease,
-    border-color var(--s-motion-standard) ease,
     box-shadow var(--s-motion-standard) ease,
-    color var(--s-motion-standard) ease,
     transform var(--s-motion-fast) ease;
 }
 

package/src/components/shared/controls/SCheckbox.css

@@ -4,19 +4,29 @@
 @reference "../../../styles/reference.css";
 
 .s-checkbox-control {
-  @apply relative inline-flex items-center;
+  @apply relative inline-flex shrink-0 items-center justify-center;
+  width: var(--s-control-hitbox-2xs);
+  height: var(--s-control-hitbox-2xs);
+}
+
+.s-checkbox-control[data-presentation='inline'] {
   width: var(--s-control-indicator-size);
   height: var(--s-control-indicator-size);
 }
 
 /* Hide the browser's default checkbox */
 .s-checkbox-input {
-  @apply absolute opacity-0 w-0 h-0;
+  @apply absolute inset-0 m-0 h-full w-full cursor-pointer opacity-0;
+}
+
+.s-checkbox-input:disabled,
+.s-checkbox-input[aria-readonly='true'] {
+  @apply cursor-default;
 }
 
 /* The custom checkbox */
 .s-checkbox-box {
-  @apply relative shrink-0 rounded-md border;
+  @apply pointer-events-none relative shrink-0 rounded-md border;
   width: var(--s-control-indicator-size);
   height: var(--s-control-indicator-size);
   @apply border-surface-300 dark:border-surface-600;
@@ -27,12 +37,13 @@
 }
 
 /* Hover state */
-.s-checkbox-input:not(:disabled) + .s-checkbox-box {
-  @apply hover:border-primary-500 dark:hover:border-primary-400;
+.s-checkbox-input:not(:disabled):not([aria-readonly='true']):hover + .s-checkbox-box {
+  @apply border-primary-500 dark:border-primary-400;
 }
 
 /* Checked state */
-.s-checkbox-input:checked + .s-checkbox-box {
+.s-checkbox-input:checked + .s-checkbox-box,
+.s-checkbox-input:indeterminate + .s-checkbox-box {
   @apply border-primary-500 bg-primary-500;
   @apply dark:border-primary-400 dark:bg-primary-400;
 }
@@ -50,7 +61,8 @@
   height: var(--s-icon-size-xs);
 }
 
-.s-checkbox-input:checked + .s-checkbox-box > .s-checkbox-check {
+.s-checkbox-input:checked + .s-checkbox-box > .s-checkbox-check,
+.s-checkbox-input:indeterminate + .s-checkbox-box > .s-checkbox-check {
   @apply opacity-100;
 }
 

package/src/components/shared/data-display/SControlledToastViewport.css

@@ -44,35 +44,27 @@
 }
 
 .notification-transition-enter-active {
-  transition:
-    opacity var(--s-motion-standard) ease-out,
-    transform var(--s-motion-standard) ease-out;
+  transition: transform var(--s-motion-standard) ease-out;
 }
 
 .notification-transition-enter-from {
-  opacity: 0;
   transform: translate3d(0, 0.75rem, 0) scale(0.98);
 }
 
 .notification-transition-enter-to {
-  opacity: 1;
   transform: translate3d(0, 0, 0) scale(1);
 }
 
 .notification-transition-leave-active {
   position: absolute;
-  transition:
-    opacity var(--s-motion-fast) ease-in,
-    transform var(--s-motion-fast) ease-in;
+  transition: transform var(--s-motion-fast) ease-in;
 }
 
 .notification-transition-leave-from {
-  opacity: 1;
   transform: translate3d(0, 0, 0) scale(1);
 }
 
 .notification-transition-leave-to {
-  opacity: 0;
   transform: translate3d(0, 0.5rem, 0) scale(0.98);
 }
 

package/src/components/shared/data-display/SScrollViewport.css

@@ -34,6 +34,22 @@
   block-size: 100%;
 }
 
+.s-scroll-viewport[data-block-size='content'] {
+  block-size: auto;
+}
+
+.s-scroll-viewport[data-max-block-size='sm'] {
+  max-block-size: var(--s-scroll-viewport-max-block-size-sm);
+}
+
+.s-scroll-viewport[data-max-block-size='md'] {
+  max-block-size: var(--s-scroll-viewport-max-block-size-md);
+}
+
+.s-scroll-viewport[data-max-block-size='lg'] {
+  max-block-size: var(--s-scroll-viewport-max-block-size-lg);
+}
+
 .s-scroll-viewport[data-overscroll-behavior='contain'] {
   overscroll-behavior: contain;
 }
@@ -42,7 +58,7 @@
   overscroll-behavior: none;
 }
 
-.s-scroll-viewport[data-focusable='true']:focus-visible {
+.s-scroll-viewport:focus-visible {
   outline: var(--s-focus-ring-width) solid var(--s-focus-ring-color);
   outline-offset: var(--s-focus-ring-inset-offset);
 }

package/src/components/shared/data-display/STooltip.css

@@ -10,7 +10,7 @@
   overflow-wrap: anywhere;
   word-break: break-word;
   white-space: normal;
-  pointer-events: auto;
+  pointer-events: none;
   user-select: none;
 }
 

package/src/components/shared/data-display/_internal/STableFrame.css

@@ -1,7 +1,7 @@
 @reference "../../../../styles/reference.css";
 
 .s-table-wrapper {
-  @apply w-full min-w-0 overflow-auto rounded-lg border border-surface-200 bg-surface-0;
+  @apply w-full min-w-0 overflow-hidden rounded-lg border border-surface-200 bg-surface-0;
   @apply dark:border-surface-700 dark:bg-surface-800;
 }
 
@@ -9,10 +9,6 @@
   @apply rounded-none border-0 bg-transparent dark:bg-transparent;
 }
 
-.s-table-wrapper[data-max-height="sm"] { max-block-size: var(--s-scroll-viewport-max-block-size-sm); }
-.s-table-wrapper[data-max-height="md"] { max-block-size: var(--s-scroll-viewport-max-block-size-md); }
-.s-table-wrapper[data-max-height="lg"] { max-block-size: var(--s-scroll-viewport-max-block-size-lg); }
-
 .s-table {
   --s-table-cell-padding-inline: 1rem;
   --s-table-cell-padding-block: 0.75rem;

package/dist/assets/src/components/shared/_internal/SDialogSurface.css_vue_type_style_index_0_src_0e58afdc_scoped_0e58afdc_lang.css

@@ -1,2 +0,0 @@
-/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){[data-v-0e58afdc],[data-v-0e58afdc]:before,[data-v-0e58afdc]:after,[data-v-0e58afdc]::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial}}}.s-dialog-surface[data-v-0e58afdc]{box-shadow:var(--s-elevation-overlay)}.s-dialog-surface[data-v-0e58afdc]:focus-visible{outline:var(--s-focus-ring-width) solid var(--s-focus-ring-color);outline-offset:var(--s-focus-ring-inset-offset)}.s-dialog-surface[data-presentation=modal][data-v-0e58afdc]{width:100%;transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);border-radius:var(--radius-2xl,1rem);padding:calc(var(--spacing,.25rem) * 6);text-align:left;vertical-align:middle;transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));background-color:var(--color-surface-0,#fff);overflow:hidden}.s-dialog-surface[data-presentation=modal][data-v-0e58afdc]:where(.dark,.dark *){background-color:var(--color-surface-800,#1e293b)}.s-dialog-surface[data-presentation=modal][data-surface=subtle][data-v-0e58afdc]{background-color:var(--color-surface-50,#f8fafc)}.s-dialog-surface[data-presentation=modal][data-surface=subtle][data-v-0e58afdc]:where(.dark,.dark *){background-color:var(--color-surface-900,#0f172a)}.s-dialog-surface[data-presentation=modal][data-scroll=body][data-v-0e58afdc]{flex-direction:column;max-height:calc(100dvh - 2rem);display:flex}.s-dialog-surface[data-presentation=modal][data-scroll=body] .s-dialog-surface__body[data-v-0e58afdc]{flex:1;min-height:0;overflow-y:auto}.s-dialog-surface[data-presentation=modal][data-layout=fullscreen][data-v-0e58afdc]{border-radius:0;max-width:100%;height:100%;min-height:100vh}.s-dialog-surface[data-presentation=modal][data-size=sm][data-v-0e58afdc]{max-width:24rem}.s-dialog-surface[data-presentation=modal][data-size=md][data-v-0e58afdc]{max-width:28rem}.s-dialog-surface[data-presentation=modal][data-size=lg][data-v-0e58afdc]{max-width:32rem}.s-dialog-surface[data-presentation=modal][data-size=xl][data-v-0e58afdc]{max-width:36rem}.s-dialog-surface[data-presentation=modal][data-size="2xl"][data-v-0e58afdc]{max-width:42rem}.s-dialog-surface[data-presentation=modal][data-size="3xl"][data-v-0e58afdc]{max-width:48rem}.s-dialog-surface[data-presentation=modal][data-size="4xl"][data-v-0e58afdc]{max-width:56rem}.s-dialog-surface[data-presentation=modal][data-size=wide][data-v-0e58afdc]{max-width:72rem}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__header[data-v-0e58afdc]{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-surface-200,#e2e8f0);padding-bottom:calc(var(--spacing,.25rem) * 4);justify-content:space-between;align-items:flex-start;display:flex}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__header[data-v-0e58afdc]:where(.dark,.dark *){border-color:var(--color-surface-700,#334155)}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__title[data-v-0e58afdc]{font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75 / 1.125)));--tw-leading:calc(var(--spacing,.25rem) * 6);line-height:calc(var(--spacing,.25rem) * 6);--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500);color:var(--color-surface-900,#0f172a)}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__title[data-v-0e58afdc]:where(.dark,.dark *){color:var(--color-surface-100,#f1f5f9)}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__body[data-v-0e58afdc]{margin-top:calc(var(--spacing,.25rem) * 4);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));color:var(--color-surface-600,#475569)}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__body[data-v-0e58afdc]:where(.dark,.dark *){color:var(--color-surface-300,#cbd5e1)}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__footer[data-v-0e58afdc]{margin-top:calc(var(--spacing,.25rem) * 6);justify-content:flex-end;gap:calc(var(--spacing,.25rem) * 3);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--color-surface-200,#e2e8f0);padding-top:calc(var(--spacing,.25rem) * 4);display:flex}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__footer[data-v-0e58afdc]:where(.dark,.dark *){border-color:var(--color-surface-700,#334155)}.s-dialog-surface[data-presentation=modal] .s-dialog-surface__footer[data-layout=split][data-v-0e58afdc]{justify-content:flex-start;align-items:center;column-gap:calc(var(--spacing,.25rem) * 3);row-gap:calc(var(--spacing,.25rem) * 2);flex-wrap:wrap}.s-dialog-surface__footer-start[data-v-0e58afdc],.s-dialog-surface__footer-end[data-v-0e58afdc]{align-items:center;gap:calc(var(--spacing,.25rem) * 2);flex-wrap:wrap;min-width:0;display:flex}.s-dialog-surface__footer-start[data-v-0e58afdc]{margin-right:auto}.s-dialog-surface__footer-end[data-v-0e58afdc]{justify-content:flex-end;margin-left:auto}.s-dialog-surface[data-presentation=drawer][data-v-0e58afdc]{border-left-style:var(--tw-border-style);border-left-width:1px;border-color:var(--color-surface-200,#e2e8f0);background-color:var(--color-surface-0,#fff);width:100%;height:100%;color:var(--color-surface-900,#0f172a);flex-direction:column;display:flex;position:relative;overflow:hidden}.s-dialog-surface[data-presentation=drawer][data-v-0e58afdc]:where(.dark,.dark *){border-color:var(--color-surface-700,#334155);background-color:var(--color-surface-900,#0f172a);color:var(--color-surface-0,#fff)}.s-dialog-surface[data-presentation=drawer][data-placement=left][data-v-0e58afdc]{border-right-style:var(--tw-border-style);border-right-width:1px;border-left-style:var(--tw-border-style);border-left-width:0}.s-dialog-surface[data-presentation=drawer][data-size=sm][data-v-0e58afdc]{max-width:30rem}.s-dialog-surface[data-presentation=drawer][data-size=md][data-v-0e58afdc]{max-width:36rem}.s-dialog-surface[data-presentation=drawer][data-size=lg][data-v-0e58afdc]{max-width:44rem}.s-dialog-surface[data-presentation=drawer][data-placement=bottom][data-v-0e58afdc]{border-top-left-radius:var(--radius-2xl,1rem);border-top-right-radius:var(--radius-2xl,1rem);border-top-style:var(--tw-border-style);border-top-width:1px;border-left-style:var(--tw-border-style);border-left-width:0;border-color:var(--color-surface-200,#e2e8f0);max-width:none}.s-dialog-surface[data-presentation=drawer][data-placement=bottom][data-v-0e58afdc]:where(.dark,.dark *){border-color:var(--color-surface-700,#334155)}.s-dialog-surface[data-presentation=drawer][data-placement=bottom][data-v-0e58afdc]{width:100%}.s-dialog-surface[data-presentation=drawer][data-scope=viewport][data-placement=bottom][data-v-0e58afdc]{max-height:calc(100dvh - 1rem)}.s-dialog-surface[data-presentation=drawer][data-scope=viewport][data-placement=bottom][data-size=sm][data-v-0e58afdc]{height:50dvh}.s-dialog-surface[data-presentation=drawer][data-scope=viewport][data-placement=bottom][data-size=md][data-v-0e58afdc]{height:70dvh}.s-dialog-surface[data-presentation=drawer][data-scope=viewport][data-placement=bottom][data-size=lg][data-v-0e58afdc]{height:90dvh}.s-dialog-surface[data-presentation=drawer][data-scope=contained][data-v-0e58afdc]{min-block-size:0;max-block-size:100%;min-inline-size:0;max-inline-size:none}.s-dialog-surface[data-presentation=drawer][data-scope=contained][data-placement=bottom][data-v-0e58afdc]{block-size:var(--s-drawer-extent)}.s-dialog-surface[data-presentation=drawer][data-scope=contained][data-placement=left][data-v-0e58afdc],.s-dialog-surface[data-presentation=drawer][data-scope=contained][data-placement=right][data-v-0e58afdc]{inline-size:var(--s-drawer-extent)}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__header[data-v-0e58afdc]{align-items:flex-start;gap:calc(var(--spacing,.25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:var(--color-surface-200,#e2e8f0);padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 4);flex-shrink:0;display:flex}@media (width>=48rem){.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__header[data-v-0e58afdc]{padding-inline:calc(var(--spacing,.25rem) * 6)}}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__header[data-v-0e58afdc]:where(.dark,.dark *){border-color:var(--color-surface-700,#334155)}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__title[data-v-0e58afdc]{min-width:0;font-size:var(--text-lg,1.125rem);line-height:var(--tw-leading,var(--text-lg--line-height,calc(1.75 / 1.125)));--tw-leading:calc(var(--spacing,.25rem) * 6);line-height:calc(var(--spacing,.25rem) * 6);--tw-font-weight:var(--font-weight-semibold,600);font-weight:var(--font-weight-semibold,600);color:var(--color-surface-950,#020617);flex:1}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__title[data-v-0e58afdc]:where(.dark,.dark *){color:var(--color-surface-0,#fff)}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__body[data-v-0e58afdc]{min-width:0;min-height:0;padding:calc(var(--spacing,.25rem) * 5);flex:1;overflow-y:auto}@media (width>=48rem){.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__body[data-v-0e58afdc]{padding:calc(var(--spacing,.25rem) * 6)}}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__body[data-v-0e58afdc]{overscroll-behavior:contain}.s-dialog-surface[data-presentation=drawer][data-scroll=content] .s-dialog-surface__body[data-v-0e58afdc]{flex-direction:column;padding:0;display:flex;overflow:hidden}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__footer[data-v-0e58afdc]{justify-content:flex-end;gap:calc(var(--spacing,.25rem) * 3);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:var(--color-surface-200,#e2e8f0);padding-inline:calc(var(--spacing,.25rem) * 5);padding-block:calc(var(--spacing,.25rem) * 4);flex-wrap:wrap;flex-shrink:0;display:flex}@media (width>=48rem){.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__footer[data-v-0e58afdc]{padding-inline:calc(var(--spacing,.25rem) * 6)}}.s-dialog-surface[data-presentation=drawer] .s-dialog-surface__footer[data-v-0e58afdc]:where(.dark,.dark *){border-color:var(--color-surface-700,#334155)}@media (width<=767px){.s-dialog-surface[data-presentation=drawer][data-layout=mobile-fullscreen][data-v-0e58afdc]{border-right-style:var(--tw-border-style);border-right-width:0;border-left-style:var(--tw-border-style);border-left-width:0;max-width:100%}}.s-dialog-surface[data-presentation][hidden][data-v-0e58afdc]{display:none}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}

package/dist/assets/src/components/shared/containers/SDrawer.css_vue_type_style_index_0_src_61cf20dd_scoped_61cf20dd_lang.css

@@ -1,2 +0,0 @@
-/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
-.s-drawer-backdrop[data-v-61cf20dd]{background:var(--s-overlay-backdrop-surface);-webkit-backdrop-filter:blur(var(--s-overlay-backdrop-blur));backdrop-filter:blur(var(--s-overlay-backdrop-blur));position:fixed;inset:0}.s-drawer-shell[data-v-61cf20dd]{position:fixed;inset:0}.s-drawer-positioner[data-v-61cf20dd]{justify-content:right;align-items:stretch;display:flex;position:absolute;inset:0}.s-drawer-positioner[data-placement=left][data-v-61cf20dd]{justify-content:left}.s-drawer-positioner[data-placement=bottom][data-v-61cf20dd]{justify-content:stretch;align-items:flex-end}.s-drawer-backdrop[data-scope=contained][data-v-61cf20dd],.s-drawer-shell[data-scope=contained][data-v-61cf20dd]{pointer-events:auto;position:absolute}.s-drawer-backdrop-enter-active[data-v-61cf20dd],.s-drawer-backdrop-leave-active[data-v-61cf20dd]{transition:opacity var(--s-motion-standard) ease}.s-drawer-backdrop-enter-from[data-v-61cf20dd],.s-drawer-backdrop-leave-to[data-v-61cf20dd]{opacity:0}.s-drawer-panel-enter-active[data-v-61cf20dd],.s-drawer-panel-leave-active[data-v-61cf20dd]{transition:opacity var(--s-motion-standard) ease, transform var(--s-motion-standard) ease}.s-drawer-panel-enter-from[data-v-61cf20dd],.s-drawer-panel-leave-to[data-v-61cf20dd]{opacity:0;transform:translate(1.5rem)}.s-drawer-shell[data-placement=left].s-drawer-panel-enter-from[data-v-61cf20dd],.s-drawer-shell[data-placement=left].s-drawer-panel-leave-to[data-v-61cf20dd]{transform:translate(-1.5rem)}.s-drawer-shell[data-placement=bottom].s-drawer-panel-enter-from[data-v-61cf20dd],.s-drawer-shell[data-placement=bottom].s-drawer-panel-leave-to[data-v-61cf20dd]{transform:translateY(1.5rem)}@media (width<=767px){.s-drawer-shell[data-placement=right].s-drawer-panel-enter-from[data-v-61cf20dd],.s-drawer-shell[data-placement=right].s-drawer-panel-leave-to[data-v-61cf20dd]{transform:translateY(1.5rem)}}@media (prefers-reduced-motion:reduce){.s-drawer-backdrop-enter-active[data-v-61cf20dd],.s-drawer-backdrop-leave-active[data-v-61cf20dd],.s-drawer-panel-enter-active[data-v-61cf20dd],.s-drawer-panel-leave-active[data-v-61cf20dd]{transition:none}.s-drawer-panel-enter-from[data-v-61cf20dd],.s-drawer-panel-leave-to[data-v-61cf20dd],.s-drawer-shell[data-placement].s-drawer-panel-enter-from[data-v-61cf20dd],.s-drawer-shell[data-placement].s-drawer-panel-leave-to[data-v-61cf20dd]{transform:none}}

package/dist/assets/src/components/shared/containers/SModal.css_vue_type_style_index_0_src_42e1bd5f_scoped_42e1bd5f_lang.css

@@ -1,2 +0,0 @@
-/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
-.s-modal-backdrop[data-v-42e1bd5f]{background:var(--s-overlay-backdrop-surface);-webkit-backdrop-filter:blur(var(--s-overlay-backdrop-blur));backdrop-filter:blur(var(--s-overlay-backdrop-blur));position:fixed;inset:0}.s-modal-container[data-v-42e1bd5f]{position:fixed;inset:0;overflow-y:auto}.s-modal-panel-container[data-v-42e1bd5f]{min-height:100%;padding:calc(var(--spacing,.25rem) * 4);text-align:center;justify-content:center;align-items:center;display:flex}.s-modal-panel-container--fullscreen[data-v-42e1bd5f]{text-align:left;justify-content:stretch;align-items:stretch;padding:0}