@scripso-homepad/ui 0.4.40 → 0.4.42

package/dist/web/index.css

@@ -88,6 +88,24 @@
   border-radius: 9999px;
 }
 
+/* src/web/components/modal-motion.css */
+@keyframes homepad-modal-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+.homepad-modal-in {
+  animation: homepad-modal-in 300ms ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .homepad-modal-in {
+    animation: none;
+  }
+}
+
 /* src/web/components/sonner-toast.css */
 .homepad-toaster {
   --width: 409px;

package/dist/web/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/web/components/table-scroll.css","../../src/web/components/drawer-scroll.css","../../src/web/components/sonner-toast.css"],"sourcesContent":[".table-scroll-area {\n  scrollbar-color: var(--color-storm-gray-50, #eceef0) transparent;\n  scrollbar-width: thin;\n}\n\n.table-scroll-area::-webkit-scrollbar {\n  width: 8px;\n  height: 8px;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.table-scroll-area::-webkit-scrollbar-button,\n.table-scroll-area::-webkit-scrollbar-button:single-button,\n.table-scroll-area::-webkit-scrollbar-button:double-button,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:decrement,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:increment,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:start:decrement,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:end:increment,\n.table-scroll-area::-webkit-scrollbar-button:vertical:decrement,\n.table-scroll-area::-webkit-scrollbar-button:vertical:increment,\n.table-scroll-area::-webkit-scrollbar-button:vertical:start:decrement,\n.table-scroll-area::-webkit-scrollbar-button:vertical:end:increment,\n.table-scroll-area::-webkit-scrollbar-button:start:decrement,\n.table-scroll-area::-webkit-scrollbar-button:end:increment,\n.table-scroll-area::-webkit-scrollbar-button:decrement,\n.table-scroll-area::-webkit-scrollbar-button:increment {\n  display: none;\n  width: 0;\n  height: 0;\n  max-width: 0;\n  max-height: 0;\n  min-width: 0;\n  min-height: 0;\n  padding: 0;\n  margin: 0;\n  border: 0;\n  background: transparent;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.table-scroll-area::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.table-scroll-area::-webkit-scrollbar-thumb {\n  background-color: var(--color-storm-gray-50, #eceef0);\n  border-radius: 51px;\n}\n\n.table-scroll-area::-webkit-scrollbar-corner {\n  background: transparent;\n}\n",".drawer-scroll-area {\n  scrollbar-color: var(--color-storm-gray-200, #d5d9dd) transparent;\n  /* Chrome 121+ ignores ::-webkit-scrollbar width when scrollbar-width is set. */\n  scrollbar-width: unset;\n}\n\n/* Firefox has no ::-webkit-scrollbar; thin is the slimmest standard option. */\n@supports not selector(::-webkit-scrollbar) {\n  .drawer-scroll-area {\n    scrollbar-width: thin;\n  }\n}\n\n.drawer-scroll-area::-webkit-scrollbar {\n  width: 3px;\n  height: 3px;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.drawer-scroll-area::-webkit-scrollbar-button,\n.drawer-scroll-area::-webkit-scrollbar-button:single-button,\n.drawer-scroll-area::-webkit-scrollbar-button:double-button,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:increment,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:start:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:end:increment,\n.drawer-scroll-area::-webkit-scrollbar-button:start:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:end:increment,\n.drawer-scroll-area::-webkit-scrollbar-button:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:increment {\n  display: none;\n  width: 0;\n  height: 0;\n}\n\n.drawer-scroll-area::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.drawer-scroll-area::-webkit-scrollbar-thumb {\n  background-color: var(--color-storm-gray-200, #d5d9dd);\n  border-radius: 9999px;\n}\n",".homepad-toaster {\n  --width: 409px;\n  --gap: 12px;\n  --border-radius: 20px;\n  font-family: var(--font-sans, 'Noto Sans Armenian', ui-sans-serif, system-ui, sans-serif);\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] {\n  align-items: center;\n  gap: 16px;\n  width: 409px;\n  min-height: 72px;\n  height: auto;\n  padding: 12px 44px 12px 12px;\n  background: #fff;\n  border: 1px solid var(--color-storm-gray-50, #eceef0);\n  border-radius: 20px;\n  box-shadow: 0 1px 4px 0 #00000014;\n  color: var(--color-slate-blue, #182e3c);\n  overflow: visible;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'][data-front='true'] {\n  height: auto !important;\n}\n\n.homepad-toaster\n  [data-sonner-toast][data-styled='true'][data-mounted='true'][data-expanded='true'] {\n  height: auto !important;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-icon] {\n  width: auto;\n  height: auto;\n  margin: 0;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-content] {\n  gap: 2px;\n  min-width: 0;\n  flex: 1;\n  align-self: center;\n  overflow: visible;\n}\n\n.homepad-toaster .homepad-toast__title {\n  font-family: var(--font-sans, 'Noto Sans Armenian', ui-sans-serif, system-ui, sans-serif);\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 19px;\n  letter-spacing: 0;\n  color: var(--color-slate-blue, #182e3c);\n}\n\n.homepad-toaster .homepad-toast__description {\n  font-family: var(--font-sans, 'Noto Sans Armenian', ui-sans-serif, system-ui, sans-serif);\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 16px;\n  letter-spacing: 0;\n  color: var(--color-slate-blue, #182e3c);\n}\n\n.homepad-toaster .homepad-toast__icon-badge {\n  display: flex;\n  width: 48px;\n  height: 48px;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  padding: 12px;\n  border-radius: 12px;\n  box-sizing: border-box;\n}\n\n.homepad-toaster .homepad-toast__icon-badge svg {\n  width: 24px;\n  height: 24px;\n  margin: 0;\n  flex-shrink: 0;\n}\n\n.homepad-toaster .homepad-toast__icon-badge--success {\n  background: var(--color-emerald-green-0, #f0fbf5);\n}\n\n.homepad-toaster .homepad-toast__icon-badge--error {\n  background: var(--color-ruby-red-0, #fff5f6);\n}\n\n.homepad-toaster .homepad-toast__icon-badge--warning {\n  background: #f2a8001a;\n}\n\n.homepad-toaster .homepad-toast__icon-badge--info,\n.homepad-toaster .homepad-toast__icon-badge--default {\n  background: #0f52c71a;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-close-button] {\n  top: 50%;\n  right: 12px;\n  left: auto;\n  width: 20px;\n  height: 20px;\n  transform: translateY(-50%);\n  border: 0;\n  background: transparent;\n  box-shadow: none;\n  cursor: pointer;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true']:hover [data-close-button]:hover {\n  background: transparent;\n  border-color: transparent;\n  cursor: pointer;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-close-button] svg {\n  width: 20px;\n  height: 20px;\n}\n\n@media (max-width: 767px) {\n  .homepad-toaster {\n    --width: calc(100vw - 16px);\n  }\n\n  .homepad-toaster[data-sonner-toaster] {\n    right: var(--mobile-offset-right, 8px);\n    left: var(--mobile-offset-left, 8px);\n    width: calc(100vw - 16px);\n    max-width: calc(100vw - 16px);\n  }\n\n  .homepad-toaster [data-sonner-toast][data-styled='true'] {\n    right: 0;\n    left: 0;\n    width: 100%;\n  }\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/web/components/table-scroll.css","../../src/web/components/drawer-scroll.css","../../src/web/components/modal-motion.css","../../src/web/components/sonner-toast.css"],"sourcesContent":[".table-scroll-area {\n  scrollbar-color: var(--color-storm-gray-50, #eceef0) transparent;\n  scrollbar-width: thin;\n}\n\n.table-scroll-area::-webkit-scrollbar {\n  width: 8px;\n  height: 8px;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.table-scroll-area::-webkit-scrollbar-button,\n.table-scroll-area::-webkit-scrollbar-button:single-button,\n.table-scroll-area::-webkit-scrollbar-button:double-button,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:decrement,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:increment,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:start:decrement,\n.table-scroll-area::-webkit-scrollbar-button:horizontal:end:increment,\n.table-scroll-area::-webkit-scrollbar-button:vertical:decrement,\n.table-scroll-area::-webkit-scrollbar-button:vertical:increment,\n.table-scroll-area::-webkit-scrollbar-button:vertical:start:decrement,\n.table-scroll-area::-webkit-scrollbar-button:vertical:end:increment,\n.table-scroll-area::-webkit-scrollbar-button:start:decrement,\n.table-scroll-area::-webkit-scrollbar-button:end:increment,\n.table-scroll-area::-webkit-scrollbar-button:decrement,\n.table-scroll-area::-webkit-scrollbar-button:increment {\n  display: none;\n  width: 0;\n  height: 0;\n  max-width: 0;\n  max-height: 0;\n  min-width: 0;\n  min-height: 0;\n  padding: 0;\n  margin: 0;\n  border: 0;\n  background: transparent;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.table-scroll-area::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.table-scroll-area::-webkit-scrollbar-thumb {\n  background-color: var(--color-storm-gray-50, #eceef0);\n  border-radius: 51px;\n}\n\n.table-scroll-area::-webkit-scrollbar-corner {\n  background: transparent;\n}\n",".drawer-scroll-area {\n  scrollbar-color: var(--color-storm-gray-200, #d5d9dd) transparent;\n  /* Chrome 121+ ignores ::-webkit-scrollbar width when scrollbar-width is set. */\n  scrollbar-width: unset;\n}\n\n/* Firefox has no ::-webkit-scrollbar; thin is the slimmest standard option. */\n@supports not selector(::-webkit-scrollbar) {\n  .drawer-scroll-area {\n    scrollbar-width: thin;\n  }\n}\n\n.drawer-scroll-area::-webkit-scrollbar {\n  width: 3px;\n  height: 3px;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n.drawer-scroll-area::-webkit-scrollbar-button,\n.drawer-scroll-area::-webkit-scrollbar-button:single-button,\n.drawer-scroll-area::-webkit-scrollbar-button:double-button,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:increment,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:start:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:vertical:end:increment,\n.drawer-scroll-area::-webkit-scrollbar-button:start:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:end:increment,\n.drawer-scroll-area::-webkit-scrollbar-button:decrement,\n.drawer-scroll-area::-webkit-scrollbar-button:increment {\n  display: none;\n  width: 0;\n  height: 0;\n}\n\n.drawer-scroll-area::-webkit-scrollbar-track {\n  background: transparent;\n}\n\n.drawer-scroll-area::-webkit-scrollbar-thumb {\n  background-color: var(--color-storm-gray-200, #d5d9dd);\n  border-radius: 9999px;\n}\n","@keyframes homepad-modal-in {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n.homepad-modal-in {\n  animation: homepad-modal-in 300ms ease;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .homepad-modal-in {\n    animation: none;\n  }\n}\n",".homepad-toaster {\n  --width: 409px;\n  --gap: 12px;\n  --border-radius: 20px;\n  font-family: var(--font-sans, 'Noto Sans Armenian', ui-sans-serif, system-ui, sans-serif);\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] {\n  align-items: center;\n  gap: 16px;\n  width: 409px;\n  min-height: 72px;\n  height: auto;\n  padding: 12px 44px 12px 12px;\n  background: #fff;\n  border: 1px solid var(--color-storm-gray-50, #eceef0);\n  border-radius: 20px;\n  box-shadow: 0 1px 4px 0 #00000014;\n  color: var(--color-slate-blue, #182e3c);\n  overflow: visible;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'][data-front='true'] {\n  height: auto !important;\n}\n\n.homepad-toaster\n  [data-sonner-toast][data-styled='true'][data-mounted='true'][data-expanded='true'] {\n  height: auto !important;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-icon] {\n  width: auto;\n  height: auto;\n  margin: 0;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-content] {\n  gap: 2px;\n  min-width: 0;\n  flex: 1;\n  align-self: center;\n  overflow: visible;\n}\n\n.homepad-toaster .homepad-toast__title {\n  font-family: var(--font-sans, 'Noto Sans Armenian', ui-sans-serif, system-ui, sans-serif);\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 19px;\n  letter-spacing: 0;\n  color: var(--color-slate-blue, #182e3c);\n}\n\n.homepad-toaster .homepad-toast__description {\n  font-family: var(--font-sans, 'Noto Sans Armenian', ui-sans-serif, system-ui, sans-serif);\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 16px;\n  letter-spacing: 0;\n  color: var(--color-slate-blue, #182e3c);\n}\n\n.homepad-toaster .homepad-toast__icon-badge {\n  display: flex;\n  width: 48px;\n  height: 48px;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  padding: 12px;\n  border-radius: 12px;\n  box-sizing: border-box;\n}\n\n.homepad-toaster .homepad-toast__icon-badge svg {\n  width: 24px;\n  height: 24px;\n  margin: 0;\n  flex-shrink: 0;\n}\n\n.homepad-toaster .homepad-toast__icon-badge--success {\n  background: var(--color-emerald-green-0, #f0fbf5);\n}\n\n.homepad-toaster .homepad-toast__icon-badge--error {\n  background: var(--color-ruby-red-0, #fff5f6);\n}\n\n.homepad-toaster .homepad-toast__icon-badge--warning {\n  background: #f2a8001a;\n}\n\n.homepad-toaster .homepad-toast__icon-badge--info,\n.homepad-toaster .homepad-toast__icon-badge--default {\n  background: #0f52c71a;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-close-button] {\n  top: 50%;\n  right: 12px;\n  left: auto;\n  width: 20px;\n  height: 20px;\n  transform: translateY(-50%);\n  border: 0;\n  background: transparent;\n  box-shadow: none;\n  cursor: pointer;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true']:hover [data-close-button]:hover {\n  background: transparent;\n  border-color: transparent;\n  cursor: pointer;\n}\n\n.homepad-toaster [data-sonner-toast][data-styled='true'] [data-close-button] svg {\n  width: 20px;\n  height: 20px;\n}\n\n@media (max-width: 767px) {\n  .homepad-toaster {\n    --width: calc(100vw - 16px);\n  }\n\n  .homepad-toaster[data-sonner-toaster] {\n    right: var(--mobile-offset-right, 8px);\n    left: var(--mobile-offset-left, 8px);\n    width: calc(100vw - 16px);\n    max-width: calc(100vw - 16px);\n  }\n\n  .homepad-toaster [data-sonner-toast][data-styled='true'] {\n    right: 0;\n    left: 0;\n    width: 100%;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/web/index.d.cts

@@ -13,6 +13,7 @@ type AdminNavItem = {
     hidden?: boolean;
     disabled?: boolean;
     onClick?: () => void;
+    onboardingId?: string;
 };
 type AdminSidebarUser = {
     fullName: string;
@@ -145,7 +146,7 @@ type SidebarNavItemProps = {
     isActive: boolean;
     onNavigate?: (item: AdminNavItem) => void;
 };
-declare function SidebarNavItem({ item, isOpen, isActive, onNavigate }: SidebarNavItemProps): react.JSX.Element | null;
+declare function SidebarNavItem({ item, isOpen, isActive, onNavigate, }: SidebarNavItemProps): react.JSX.Element | null;
 
 /**
  * Matches React Router `<NavLink end>` semantics using a host-provided pathname.
@@ -276,7 +277,7 @@ type PaginationProps = {
 };
 declare function Pagination({ page, pageSize, total, onPageChange, labels, maxPageButtons, variant, className, hideOnSinglePage, }: PaginationProps): react.JSX.Element | null;
 
-type TableActionsMenuItemTone = 'default' | 'success' | 'danger';
+type TableActionsMenuItemTone = "default" | "success" | "danger";
 type TableActionsMenuItem = {
     id: string;
     label: string;
@@ -296,8 +297,11 @@ type TableActionsMenuProps = {
     menuWidth?: number;
     /** Size the menu to its content width instead of a fixed pixel width. Defaults to true so labels stay on one line. */
     menuFitContent?: boolean;
+    /** Keep the menu open while a page tour is explaining this row. */
+    forceOpen?: boolean;
+    menuOnboardingId?: string;
 };
-declare function TableActionsMenu({ items, triggerAriaLabel, className, menuClassName, triggerIcon, menuWidth, menuFitContent, }: TableActionsMenuProps): react.JSX.Element | null;
+declare function TableActionsMenu({ items, triggerAriaLabel, className, menuClassName, triggerIcon, menuWidth, menuFitContent, forceOpen, menuOnboardingId, }: TableActionsMenuProps): react.JSX.Element | null;
 
 type TableRowActionsConfig = {
     status: ReactNode;
@@ -396,7 +400,7 @@ type TableHeadProps = ThHTMLAttributes<HTMLTableCellElement> & {
     onSort?: () => void;
     children?: ReactNode;
 };
-declare function TableHead({ className, align, sortable, sortDirection, onSort, children, ...props }: TableHeadProps): react.JSX.Element;
+declare function TableHead({ className, align, sortable, sortDirection, onSort, children, onClick, onKeyDown, ...props }: TableHeadProps): react.JSX.Element;
 
 type TableCellProps = TdHTMLAttributes<HTMLTableCellElement> & {
     variant?: TableCellVariant;
@@ -474,10 +478,11 @@ type ModalProps = {
     closeOnBackdrop?: boolean;
     closeOnEscape?: boolean;
     containerClassName?: string;
+    containerDataOnboarding?: string;
     contentClassName?: string;
     buttonClassName?: string;
 };
-declare function Modal({ open, title, subtitle, icon, iconContainerClassName, titleClassName, subtitleClassName, children, cancelText, confirmText, onCancel, onConfirm, footerAlign, footerLayout, cancelDisabled, confirmDisabled, closeOnBackdrop, closeOnEscape, containerClassName, contentClassName, buttonClassName, }: ModalProps): react.JSX.Element | null;
+declare function Modal({ open, title, subtitle, icon, iconContainerClassName, titleClassName, subtitleClassName, children, cancelText, confirmText, onCancel, onConfirm, footerAlign, footerLayout, cancelDisabled, confirmDisabled, closeOnBackdrop, closeOnEscape, containerClassName, containerDataOnboarding, contentClassName, buttonClassName, }: ModalProps): react.JSX.Element | null;
 
 type DrawerProps = {
     open: boolean;

package/dist/web/index.d.ts

@@ -13,6 +13,7 @@ type AdminNavItem = {
     hidden?: boolean;
     disabled?: boolean;
     onClick?: () => void;
+    onboardingId?: string;
 };
 type AdminSidebarUser = {
     fullName: string;
@@ -145,7 +146,7 @@ type SidebarNavItemProps = {
     isActive: boolean;
     onNavigate?: (item: AdminNavItem) => void;
 };
-declare function SidebarNavItem({ item, isOpen, isActive, onNavigate }: SidebarNavItemProps): react.JSX.Element | null;
+declare function SidebarNavItem({ item, isOpen, isActive, onNavigate, }: SidebarNavItemProps): react.JSX.Element | null;
 
 /**
  * Matches React Router `<NavLink end>` semantics using a host-provided pathname.
@@ -276,7 +277,7 @@ type PaginationProps = {
 };
 declare function Pagination({ page, pageSize, total, onPageChange, labels, maxPageButtons, variant, className, hideOnSinglePage, }: PaginationProps): react.JSX.Element | null;
 
-type TableActionsMenuItemTone = 'default' | 'success' | 'danger';
+type TableActionsMenuItemTone = "default" | "success" | "danger";
 type TableActionsMenuItem = {
     id: string;
     label: string;
@@ -296,8 +297,11 @@ type TableActionsMenuProps = {
     menuWidth?: number;
     /** Size the menu to its content width instead of a fixed pixel width. Defaults to true so labels stay on one line. */
     menuFitContent?: boolean;
+    /** Keep the menu open while a page tour is explaining this row. */
+    forceOpen?: boolean;
+    menuOnboardingId?: string;
 };
-declare function TableActionsMenu({ items, triggerAriaLabel, className, menuClassName, triggerIcon, menuWidth, menuFitContent, }: TableActionsMenuProps): react.JSX.Element | null;
+declare function TableActionsMenu({ items, triggerAriaLabel, className, menuClassName, triggerIcon, menuWidth, menuFitContent, forceOpen, menuOnboardingId, }: TableActionsMenuProps): react.JSX.Element | null;
 
 type TableRowActionsConfig = {
     status: ReactNode;
@@ -396,7 +400,7 @@ type TableHeadProps = ThHTMLAttributes<HTMLTableCellElement> & {
     onSort?: () => void;
     children?: ReactNode;
 };
-declare function TableHead({ className, align, sortable, sortDirection, onSort, children, ...props }: TableHeadProps): react.JSX.Element;
+declare function TableHead({ className, align, sortable, sortDirection, onSort, children, onClick, onKeyDown, ...props }: TableHeadProps): react.JSX.Element;
 
 type TableCellProps = TdHTMLAttributes<HTMLTableCellElement> & {
     variant?: TableCellVariant;
@@ -474,10 +478,11 @@ type ModalProps = {
     closeOnBackdrop?: boolean;
     closeOnEscape?: boolean;
     containerClassName?: string;
+    containerDataOnboarding?: string;
     contentClassName?: string;
     buttonClassName?: string;
 };
-declare function Modal({ open, title, subtitle, icon, iconContainerClassName, titleClassName, subtitleClassName, children, cancelText, confirmText, onCancel, onConfirm, footerAlign, footerLayout, cancelDisabled, confirmDisabled, closeOnBackdrop, closeOnEscape, containerClassName, contentClassName, buttonClassName, }: ModalProps): react.JSX.Element | null;
+declare function Modal({ open, title, subtitle, icon, iconContainerClassName, titleClassName, subtitleClassName, children, cancelText, confirmText, onCancel, onConfirm, footerAlign, footerLayout, cancelDisabled, confirmDisabled, closeOnBackdrop, closeOnEscape, containerClassName, containerDataOnboarding, contentClassName, buttonClassName, }: ModalProps): react.JSX.Element | null;
 
 type DrawerProps = {
     open: boolean;

package/dist/web/index.js

@@ -27528,7 +27528,7 @@ var require_react_dom_development = __commonJS({
           return root2;
         }
         var ReactVersion = "18.3.1";
-        function createPortal3(children, containerInfo, implementation) {
+        function createPortal4(children, containerInfo, implementation) {
           var key = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : null;
           {
             checkKeyStringCoercion(key);
@@ -28384,7 +28384,7 @@ var require_react_dom_development = __commonJS({
           if (!isValidContainer(container)) {
             throw new Error("Target container is not a DOM element.");
           }
-          return createPortal3(children, container, null, key);
+          return createPortal4(children, container, null, key);
         }
         function renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) {
           return unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback);
@@ -28967,7 +28967,12 @@ function isNavItemActive(pathname, item) {
   }
   return pathname === item.to || pathname.startsWith(`${item.to}/`);
 }
-function SidebarNavItem({ item, isOpen, isActive, onNavigate }) {
+function SidebarNavItem({
+  item,
+  isOpen,
+  isActive,
+  onNavigate
+}) {
   if (item.hidden) {
     return null;
   }
@@ -28985,6 +28990,7 @@ function SidebarNavItem({ item, isOpen, isActive, onNavigate }) {
       type: "button",
       onClick: handleClick,
       "aria-current": isActive ? "page" : void 0,
+      "data-onboarding": item.onboardingId,
       "aria-disabled": item.disabled,
       disabled: item.disabled,
       tabIndex: item.disabled ? -1 : void 0,
@@ -29254,12 +29260,12 @@ function Sidebar({
         )
       }
     ),
-    showCollapsedRail && mobileOpen ? /* @__PURE__ */ jsx("div", { className: "h-screen w-[76px] shrink-0", "aria-hidden": true }) : null,
+    showCollapsedRail && mobileOpen ? /* @__PURE__ */ jsx("div", { className: "h-dvh w-[76px] shrink-0", "aria-hidden": true }) : null,
     /* @__PURE__ */ jsxs(
       "aside",
       {
         className: cn(
-          "fixed inset-y-0 left-0 z-50 flex h-screen w-[min(300px,85vw)] flex-col gap-8 overflow-hidden bg-navy p-4 shadow-xl",
+          "fixed inset-y-0 left-0 z-50 flex h-dvh w-[min(300px,85vw)] flex-col gap-8 overflow-hidden bg-navy p-4 shadow-xl",
           "transition-[transform,width,padding,gap] duration-300 ease-in-out will-change-[transform,width]",
           mobileOpen ? "translate-x-0" : "-translate-x-full pointer-events-none",
           "md:relative md:z-auto md:w-[76px] md:translate-x-0 md:pointer-events-auto md:shadow-none md:items-center md:gap-2 md:px-3 md:py-4",
@@ -29392,9 +29398,9 @@ function DashboardLayout({
   className,
   mainClassName
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-screen min-w-0 overflow-hidden flex-row bg-storm-gray-0", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "max-md:contents md:h-screen md:shrink-0", children: /* @__PURE__ */ jsx(Sidebar, { ...sidebar }) }),
-    /* @__PURE__ */ jsxs("div", { className: "flex h-screen min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-dvh min-w-0 overflow-hidden flex-row bg-storm-gray-0", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "max-md:contents md:h-dvh md:shrink-0", children: /* @__PURE__ */ jsx(Sidebar, { ...sidebar }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex h-dvh min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: [
       /* @__PURE__ */ jsx(SidebarMobileHeader, { ...mobileHeader }),
       /* @__PURE__ */ jsx(AppHeader, { ...header }),
       /* @__PURE__ */ jsx("main", { className: mainClassName ?? "min-h-0 min-w-0 flex-1 overflow-x-hidden overflow-y-auto p-4 xl:p-6", children })
@@ -29926,16 +29932,16 @@ function TableHead({
   sortDirection = null,
   onSort,
   children,
+  onClick,
+  onKeyDown,
   ...props
 }) {
   const isSortable = sortable && onSort != null;
   const content = isSortable ? /* @__PURE__ */ jsxs(
-    "button",
+    "span",
     {
-      type: "button",
-      onClick: onSort,
       className: cn(
-        "inline-flex w-full cursor-pointer items-center gap-2.5 border-0 bg-transparent p-0 font-[inherit] text-[length:inherit] leading-[inherit] tracking-[inherit] text-inherit transition-colors hover:text-storm-gray-500",
+        "inline-flex w-full items-center gap-2.5 font-[inherit] text-[length:inherit] leading-[inherit] tracking-[inherit] text-inherit",
         tableHeadSortButtonAlignClasses[align]
       ),
       children: [
@@ -29952,10 +29958,29 @@ function TableHead({
         tableHeadPaddingClassName,
         tableHeaderClassName,
         !isSortable && tableAlignClasses[align],
+        isSortable && "cursor-pointer select-none hover:text-storm-gray-500",
         className
       ),
       "aria-sort": resolveAriaSort(sortDirection, isSortable),
+      tabIndex: isSortable ? 0 : void 0,
       ...props,
+      onClick: (event) => {
+        onClick?.(event);
+        if (event.defaultPrevented || !isSortable) {
+          return;
+        }
+        onSort();
+      },
+      onKeyDown: (event) => {
+        onKeyDown?.(event);
+        if (event.defaultPrevented || !isSortable) {
+          return;
+        }
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          onSort();
+        }
+      },
       children: content
     }
   );
@@ -30057,7 +30082,10 @@ function clampMenuLeft(left, menuWidth) {
     return left;
   }
   const minLeft = MENU_VIEWPORT_MARGIN_PX;
-  const maxLeft = Math.max(minLeft, window.innerWidth - menuWidth - MENU_VIEWPORT_MARGIN_PX);
+  const maxLeft = Math.max(
+    minLeft,
+    window.innerWidth - menuWidth - MENU_VIEWPORT_MARGIN_PX
+  );
   return Math.min(Math.max(left, minLeft), maxLeft);
 }
 function resolveMenuItemIcon(item) {
@@ -30080,7 +30108,9 @@ function TableActionsMenu({
   menuClassName,
   triggerIcon,
   menuWidth = MENU_WIDTH_PX,
-  menuFitContent = true
+  menuFitContent = true,
+  forceOpen,
+  menuOnboardingId
 }) {
   const [open, setOpen] = useState(false);
   const [menuPosition, setMenuPosition] = useState(null);
@@ -30089,8 +30119,17 @@ function TableActionsMenu({
   const triggerRef = useRef(null);
   const menuId = useId();
   const closeMenu = useCallback(() => {
+    if (forceOpen) {
+      return;
+    }
     setOpen(false);
-  }, []);
+  }, [forceOpen]);
+  useEffect(() => {
+    if (forceOpen === void 0) {
+      return;
+    }
+    setOpen(forceOpen);
+  }, [forceOpen]);
   const updateMenuPosition = useCallback(() => {
     const trigger = triggerRef.current;
     const menuEl = menuRef.current;
@@ -30100,7 +30139,10 @@ function TableActionsMenu({
     const rect = trigger.getBoundingClientRect();
     const viewportMaxWidth = typeof window === "undefined" ? menuWidth : Math.max(menuWidth, window.innerWidth - MENU_VIEWPORT_MARGIN_PX * 2);
     const measuredWidth = menuFitContent ? menuEl?.offsetWidth || menuEl?.getBoundingClientRect().width || menuWidth : menuWidth;
-    const resolvedMenuWidth = Math.min(Math.max(measuredWidth, 1), viewportMaxWidth);
+    const resolvedMenuWidth = Math.min(
+      Math.max(measuredWidth, 1),
+      viewportMaxWidth
+    );
     setMenuPosition({
       top: rect.bottom + MENU_OFFSET_PX,
       left: clampMenuLeft(rect.right - resolvedMenuWidth, resolvedMenuWidth)
@@ -30119,6 +30161,9 @@ function TableActionsMenu({
       return;
     }
     const closeOnScroll = () => {
+      if (forceOpen) {
+        return;
+      }
       closeMenu();
     };
     window.addEventListener("resize", updateMenuPosition);
@@ -30135,7 +30180,7 @@ function TableActionsMenu({
       window.removeEventListener("scroll", closeOnScroll, true);
       document.removeEventListener("keydown", closeOnEscape);
     };
-  }, [closeMenu, open, updateMenuPosition]);
+  }, [closeMenu, forceOpen, open, updateMenuPosition]);
   if (items.length === 0) {
     return null;
   }
@@ -30155,6 +30200,7 @@ function TableActionsMenu({
         visibility: menuPosition != null ? "visible" : "hidden",
         pointerEvents: menuPosition != null ? "auto" : "none"
       },
+      ...menuOnboardingId ? { "data-onboarding": menuOnboardingId } : {},
       className: cn(
         "z-50 overflow-hidden rounded-2xl border border-storm-gray-50 bg-white shadow-[0_4px_20px_0_rgba(0,0,0,0.05)]",
         menuClassName
@@ -30439,6 +30485,7 @@ function Modal({
   closeOnBackdrop = true,
   closeOnEscape = true,
   containerClassName,
+  containerDataOnboarding,
   contentClassName,
   buttonClassName
 }) {
@@ -30463,14 +30510,11 @@ function Modal({
   if (!open) {
     return null;
   }
-  const sharedButtonClassName = cn(
-    "btn h-13 w-full! min-w-0! justify-center!",
-    buttonClassName
-  );
+  const sharedButtonClassName = cn("btn h-13 w-full! min-w-0! justify-center!", buttonClassName);
   const modal = /* @__PURE__ */ jsx(
     "div",
     {
-      className: "fixed inset-0 z-[100] flex items-center justify-center p-4 backdrop-blur-[12px] bg-storm-gray-850/40",
+      className: "homepad-modal-in fixed inset-0 z-[100] flex items-center justify-center bg-storm-gray-850/40 p-4 backdrop-blur-[12px]",
       onPointerDown: backdropDismiss.onPointerDown,
       onClick: backdropDismiss.onClick,
       role: "presentation",
@@ -30481,6 +30525,7 @@ function Modal({
           "aria-modal": "true",
           "aria-labelledby": "homepad-modal-title",
           ...subtitle ? { "aria-describedby": "homepad-modal-subtitle" } : {},
+          ...containerDataOnboarding ? { "data-onboarding": containerDataOnboarding } : {},
           className: cn(
             "flex max-h-[min(90dvh,calc(100dvh-2rem))] w-full max-w-2xl flex-col gap-6 rounded-2xl bg-white p-4 opacity-100 md:p-6",
             containerClassName
@@ -30519,7 +30564,16 @@ function Modal({
                 ) : null
               ] })
             ] }),
-            /* @__PURE__ */ jsx("div", { className: cn("drawer-scroll-area min-h-0 min-w-0 flex-1 overflow-y-auto", contentClassName), children }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "drawer-scroll-area min-h-0 min-w-0 flex-1 overflow-y-auto",
+                  contentClassName
+                ),
+                children
+              }
+            ),
             /* @__PURE__ */ jsxs(
               "footer",
               {
@@ -30562,16 +30616,22 @@ function Modal({
   );
   return typeof document !== "undefined" ? (0, import_react_dom2.createPortal)(modal, document.body) : modal;
 }
+
+// src/web/components/Drawer.tsx
+var import_react_dom3 = __toESM(require_react_dom(), 1);
 var DRAWER_TRANSITION_MS = 300;
 var bodyScrollLockCount = 0;
 var previousBodyOverflow = "";
+var previousHtmlOverflow = "";
 function lockBodyScroll() {
   if (typeof document === "undefined") {
     return;
   }
   if (bodyScrollLockCount === 0) {
     previousBodyOverflow = document.body.style.overflow;
+    previousHtmlOverflow = document.documentElement.style.overflow;
     document.body.style.overflow = "hidden";
+    document.documentElement.style.overflow = "hidden";
   }
   bodyScrollLockCount += 1;
 }
@@ -30582,7 +30642,9 @@ function unlockBodyScroll() {
   bodyScrollLockCount = Math.max(0, bodyScrollLockCount - 1);
   if (bodyScrollLockCount === 0) {
     document.body.style.overflow = previousBodyOverflow;
+    document.documentElement.style.overflow = previousHtmlOverflow;
     previousBodyOverflow = "";
+    previousHtmlOverflow = "";
   }
 }
 function Drawer({
@@ -30653,13 +30715,13 @@ function Drawer({
       window.removeEventListener("keydown", handleKeyDown);
     };
   }, [isPresent, onClose]);
-  if (!isPresent) {
+  if (!open && !isPresent) {
     return null;
   }
-  return /* @__PURE__ */ jsxs(
+  const drawer = /* @__PURE__ */ jsxs(
     "div",
     {
-      className: "fixed inset-0 z-50 flex justify-end p-2 max-md:p-0",
+      className: "fixed inset-0 z-50 flex justify-end overscroll-none p-2 max-md:p-0",
       role: "presentation",
       children: [
         /* @__PURE__ */ jsx(
@@ -30683,7 +30745,7 @@ function Drawer({
             "aria-labelledby": "homepad-drawer-title",
             ...subtitle ? { "aria-describedby": "homepad-drawer-subtitle" } : {},
             className: cn(
-              "relative z-10 flex h-[calc(100dvh-16px)] min-h-0 cursor-auto flex-col overflow-hidden rounded-[16px] bg-white shadow-2xl transition-transform duration-300 ease-in-out max-md:h-dvh max-md:rounded-none",
+              "relative z-10 flex h-full max-h-full min-h-0 cursor-auto flex-col overflow-hidden rounded-[16px] bg-white shadow-2xl transition-transform duration-300 ease-in-out max-md:rounded-none",
               // Keep GPU transform only while animating — settled translate-x-0 blurs text.
               !isTransformSettled && "will-change-transform",
               isAnimatedIn ? isTransformSettled ? "transform-none" : "translate-x-0" : "translate-x-full",
@@ -30691,48 +30753,48 @@ function Drawer({
               className
             ),
             children: [
-              /* @__PURE__ */ jsxs(
-                "header",
-                {
-                  className: cn("shrink-0 border-b border-storm-gray-50", headerClassName),
-                  children: [
-                    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between pt-6 pr-6 pb-4 pl-6", children: [
-                      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex flex-col gap-1", children: [
-                        /* @__PURE__ */ jsx(
-                          "h2",
-                          {
-                            id: "homepad-drawer-title",
-                            className: "typography-title-sm tracking-normal text-black",
-                            children: title
-                          }
+              /* @__PURE__ */ jsxs("header", { className: cn("shrink-0 border-b border-storm-gray-50", headerClassName), children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between pt-6 pr-6 pb-4 pl-6", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex flex-col gap-1", children: [
+                    /* @__PURE__ */ jsx(
+                      "h2",
+                      {
+                        id: "homepad-drawer-title",
+                        className: "typography-title-sm tracking-normal text-black",
+                        children: title
+                      }
+                    ),
+                    subtitle ? /* @__PURE__ */ jsx(
+                      "p",
+                      {
+                        id: "homepad-drawer-subtitle",
+                        className: cn(
+                          "typography-body tracking-normal text-storm-gray-400",
+                          subtitleClassName
                         ),
-                        subtitle ? /* @__PURE__ */ jsx(
-                          "p",
-                          {
-                            id: "homepad-drawer-subtitle",
-                            className: cn(
-                              "typography-body tracking-normal text-storm-gray-400",
-                              subtitleClassName
-                            ),
-                            children: subtitle
-                          }
-                        ) : null
-                      ] }),
-                      /* @__PURE__ */ jsx(
-                        "button",
+                        children: subtitle
+                      }
+                    ) : null
+                  ] }),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      "aria-label": closeAriaLabel,
+                      className: "flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-lg text-storm-gray-400 transition-colors hover:bg-storm-gray-50 hover:text-storm-gray-600",
+                      onClick: onClose,
+                      children: /* @__PURE__ */ jsx(
+                        X,
                         {
-                          type: "button",
-                          "aria-label": closeAriaLabel,
-                          className: "flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-lg text-storm-gray-400 transition-colors hover:bg-storm-gray-50 hover:text-storm-gray-600",
-                          onClick: onClose,
-                          children: /* @__PURE__ */ jsx(X, { className: "size-5", strokeWidth: 1.75 })
+                          className: "size-5",
+                          strokeWidth: 1.75
                         }
                       )
-                    ] }),
-                    headerBottom ? /* @__PURE__ */ jsx("div", { className: "border-t border-storm-gray-50 px-6", children: headerBottom }) : null
-                  ]
-                }
-              ),
+                    }
+                  )
+                ] }),
+                headerBottom ? /* @__PURE__ */ jsx("div", { className: "border-t border-storm-gray-50 px-6", children: headerBottom }) : null
+              ] }),
               /* @__PURE__ */ jsx(
                 "div",
                 {
@@ -30750,6 +30812,7 @@ function Drawer({
       ]
     }
   );
+  return typeof document !== "undefined" ? (0, import_react_dom3.createPortal)(drawer, document.body) : drawer;
 }
 function TimelineCheckIcon({ className, ...props }) {
   return /* @__PURE__ */ jsx(