@vobs/ui 0.3.0 → 1.1.0

package/dist/navigation.js

@@ -1,1707 +0,0 @@
-/** @license MIT
- * Copyright (c) 2026 vobsjs
- * @vobs/ui
- */
-import { createDialogOverlayPlans, createDialogPlans, } from './overlay.js';
-import { classNames, createUiDomPlan } from './primitives.js';
-export function createTabsPlans(options) {
-    const orientation = options.orientation ?? 'horizontal';
-    return {
-        root: createUiDomPlan('div', 'tabs', {
-            state: 'idle',
-            attrs: {
-                id: options.id,
-                role: 'tablist',
-                'aria-orientation': orientation,
-                ...options.attrs,
-            },
-        }),
-        tabs: options.items.map((item) => {
-            const selected = item.id === options.activeId;
-            return createUiDomPlan('button', 'tab', {
-                state: selected ? 'active' : item.disabled === true ? 'disabled' : 'idle',
-                ...(item.disabled === true ? { disabled: true } : {}),
-                attrs: {
-                    id: `${options.id}-${item.id}-tab`,
-                    type: 'button',
-                    role: 'tab',
-                    'aria-selected': selected ? 'true' : 'false',
-                    'aria-controls': `${options.id}-${item.id}-panel`,
-                    tabindex: selected ? 0 : -1,
-                    'data-tab-id': item.id,
-                    'data-overflow': item.overflow === true ? 'true' : undefined,
-                    'data-persisted-active': item.persistedActive === true ? 'true' : undefined,
-                    'data-disabled-reason': item.disabledReason,
-                    'aria-disabled': item.disabledReason === undefined ? undefined : 'true',
-                },
-            });
-        }),
-        panels: options.items.map((item) => {
-            const selected = item.id === options.activeId;
-            return createUiDomPlan('div', 'tabpanel', {
-                state: selected ? 'active' : 'idle',
-                attrs: {
-                    id: `${options.id}-${item.id}-panel`,
-                    role: 'tabpanel',
-                    'aria-labelledby': `${options.id}-${item.id}-tab`,
-                    tabindex: 0,
-                    hidden: selected ? undefined : true,
-                },
-            });
-        }),
-    };
-}
-export function createTabsOverflowPersistenceContract(options) {
-    const knownIds = new Set(options.items.map((item) => item.id));
-    const overflowInputIds = normalizeKnownIds(options.overflowIds, knownIds);
-    const maxVisible = options.maxVisible === undefined
-        ? options.items.length
-        : Math.max(1, Math.trunc(options.maxVisible));
-    const derivedOverflowIds = options.items.length > maxVisible ? options.items.slice(maxVisible).map((item) => item.id) : [];
-    const overflowIds = normalizeKnownIds([...overflowInputIds, ...derivedOverflowIds], knownIds);
-    const overflowIdSet = new Set(overflowIds);
-    const persistedActiveId = options.persistedActiveId !== undefined && knownIds.has(options.persistedActiveId)
-        ? options.persistedActiveId
-        : '';
-    const activeId = knownIds.has(options.activeId)
-        ? options.activeId
-        : (options.items.find((item) => item.disabled !== true)?.id ?? '');
-    const orientation = options.orientation ?? 'horizontal';
-    const items = options.items.map((item) => tabsOverflowPersistenceItemContract(item, {
-        active: item.id === activeId,
-        disabledReason: normalizedDisabledReason(options.disabledReasons?.[item.id] ?? item.disabledReason),
-        overflow: overflowIdSet.has(item.id),
-        persistedActive: item.id === persistedActiveId,
-    }));
-    const visibleIds = items.filter((item) => !item.overflow).map((item) => item.id);
-    const disabledReasonIds = items
-        .filter((item) => item.disabledReason !== '')
-        .map((item) => item.id);
-    const overflowState = items.length === 0 ? 'empty' : overflowIds.length > 0 ? 'overflow' : 'expanded';
-    const persistenceState = items.length === 0
-        ? 'empty'
-        : persistedActiveId === ''
-            ? 'clean'
-            : persistedActiveId === activeId
-                ? 'restored'
-                : 'dirty';
-    return {
-        overflowState,
-        persistenceState,
-        activeId,
-        persistedActiveId,
-        orientation,
-        itemCount: items.length,
-        visibleCount: visibleIds.length,
-        overflowCount: overflowIds.length,
-        disabledReasonCount: disabledReasonIds.length,
-        overflowIds,
-        visibleIds,
-        disabledReasonIds,
-        items,
-        attrs: {
-            'data-tabs-overflow-persistence-contract': 'true',
-            'data-tabs-overflow-state': overflowState,
-            'data-tabs-persistence-state': persistenceState,
-            'data-active-id': activeId,
-            'data-persisted-active-id': persistedActiveId,
-            'data-orientation': orientation,
-            'data-item-count': items.length,
-            'data-visible-count': visibleIds.length,
-            'data-overflow-count': overflowIds.length,
-            'data-disabled-reason-count': disabledReasonIds.length,
-            'data-overflow-ids': overflowIds.join(','),
-            'data-visible-ids': visibleIds.join(','),
-            'data-disabled-reason-ids': disabledReasonIds.join(','),
-        },
-    };
-}
-export function createCommandPalettePlans(options) {
-    const open = options.open === true;
-    const enabledItems = options.items.filter((item) => item.disabled !== true);
-    const activeId = open && enabledItems.some((item) => item.id === options.activeId)
-        ? options.activeId
-        : enabledItems[0]?.id;
-    const visibleGroups = commandPaletteGroupsForItems(options.items, options.groups ?? []);
-    return {
-        root: createUiDomPlan('div', 'command-palette', {
-            state: open ? 'open' : 'closed',
-            attrs: {
-                id: options.id,
-                role: 'dialog',
-                'aria-modal': 'true',
-                'aria-labelledby': options.labelId,
-                'aria-describedby': options.describedBy,
-                hidden: open ? undefined : true,
-                'data-count': options.items.length,
-            },
-        }),
-        input: createUiDomPlan('input', 'command-palette-input', {
-            attrs: {
-                id: `${options.id}-input`,
-                type: 'search',
-                role: 'combobox',
-                autocomplete: 'off',
-                value: options.query,
-                placeholder: options.placeholder ?? 'Search commands',
-                'aria-expanded': open ? 'true' : 'false',
-                'aria-controls': `${options.id}-listbox`,
-                'aria-activedescendant': activeId === undefined ? undefined : commandPaletteItemDomId(options.id, activeId),
-                'aria-labelledby': options.labelId,
-                'aria-describedby': options.describedBy,
-            },
-        }),
-        listbox: createUiDomPlan('div', 'command-palette-listbox', {
-            state: options.items.length === 0 ? 'empty' : 'filled',
-            attrs: {
-                id: `${options.id}-listbox`,
-                role: 'listbox',
-            },
-        }),
-        groups: visibleGroups.map((group) => createUiDomPlan('div', 'command-palette-group', {
-            attrs: {
-                role: 'group',
-                'aria-labelledby': `${options.id}-${group.id}-group-label`,
-                'data-group-id': group.id,
-            },
-        })),
-        groupLabels: visibleGroups.map((group) => createUiDomPlan('div', 'command-palette-group-label', {
-            attrs: {
-                id: `${options.id}-${group.id}-group-label`,
-                'data-label': group.label,
-            },
-        })),
-        items: options.items.map((item) => {
-            const active = item.id === activeId;
-            const selected = item.id === options.selectedId;
-            return createUiDomPlan('div', 'command-palette-item', {
-                state: item.disabled === true ? 'disabled' : active ? 'active' : selected ? 'selected' : 'idle',
-                ...(item.disabled === true ? { disabled: true } : {}),
-                attrs: {
-                    id: commandPaletteItemDomId(options.id, item.id),
-                    role: 'option',
-                    tabindex: active && item.disabled !== true ? 0 : -1,
-                    'aria-selected': selected ? 'true' : 'false',
-                    'aria-disabled': item.disabled === true ? 'true' : undefined,
-                    'data-command-id': item.id,
-                    'data-kind': item.kind ?? 'action',
-                    'data-group-id': item.groupId,
-                    'data-label': item.label,
-                    'data-description': item.description,
-                    'data-href': item.href,
-                    'data-permission': item.permission,
-                    'data-recent': item.recent === true || item.kind === 'recent' ? 'true' : undefined,
-                    'data-disabled-reason': item.disabledReason,
-                },
-            });
-        }),
-        shortcuts: options.items.map((item) => createUiDomPlan('kbd', 'command-palette-shortcut', {
-            attrs: {
-                'aria-hidden': 'true',
-                'data-shortcut': item.shortcut,
-            },
-        })),
-        empty: options.items.length === 0
-            ? createUiDomPlan('div', 'command-palette-empty', {
-                attrs: {
-                    role: 'status',
-                    'aria-live': 'polite',
-                    'data-label': 'No commands found',
-                },
-            })
-            : undefined,
-    };
-}
-export function createCommandPalettePermissionRecentContract(options) {
-    const query = options.query?.trim() ?? '';
-    const keyword = query.toLowerCase();
-    const allowedIds = normalizeCommandIds(options.allowedIds);
-    const deniedIds = normalizeCommandIds(options.deniedIds);
-    const knownIds = new Set(options.items.map((item) => item.id));
-    const recentIds = normalizeCommandPaletteRecentIds(options.recentIds ?? [], knownIds, options.maxRecent);
-    const recentOrder = new Map(recentIds.map((id, index) => [id, index]));
-    const allContracts = options.items.map((item, index) => commandPalettePermissionRecentItemContract(item, {
-        allowedIds,
-        deniedIds,
-        disabledReason: normalizedDisabledReason(options.disabledReasons?.[item.id]),
-        index,
-        recent: recentOrder.has(item.id),
-        recentGroupId: (options.recentGroup ?? defaultCommandPaletteRecentGroup).id,
-    }));
-    const visibleContracts = allContracts
-        .filter((item) => keyword === '' || commandPaletteItemMatches(item.item, keyword))
-        .filter((item) => options.hideDenied !== true || item.permission === 'allowed')
-        .sort((a, b) => commandPaletteRecentSort(a, b, recentOrder));
-    const selected = allContracts.find((item) => item.id === options.selectedId);
-    const canPersistSelected = selected !== undefined && selected.permission === 'allowed' && selected.item.disabled !== true;
-    const nextRecentIds = canPersistSelected
-        ? normalizeCommandPaletteRecentIds([selected.id, ...recentIds.filter((id) => id !== selected.id)], knownIds, options.maxRecent)
-        : recentIds;
-    const allowedCount = allContracts.filter((item) => item.permission === 'allowed').length;
-    const deniedCount = allContracts.length - allowedCount;
-    const disabledReasonCount = allContracts.filter((item) => item.disabledReason !== '').length;
-    const visibleGroups = commandPaletteGroupsForItems(visibleContracts.map((item) => item.item), [options.recentGroup ?? defaultCommandPaletteRecentGroup, ...(options.groups ?? [])]);
-    const state = commandPalettePermissionRecentState({
-        deniedCount,
-        totalCount: allContracts.length,
-        visibleCount: visibleContracts.length,
-        query,
-    });
-    return {
-        state,
-        query,
-        totalCount: allContracts.length,
-        visibleCount: visibleContracts.length,
-        allowedCount,
-        deniedCount,
-        recentCount: recentIds.length,
-        disabledReasonCount,
-        recentIds,
-        nextRecentIds,
-        groups: visibleGroups,
-        items: visibleContracts,
-        attrs: {
-            'data-command-permission-recent-contract': 'true',
-            'data-state': state,
-            'data-command-query': query,
-            'data-total-count': allContracts.length,
-            'data-visible-count': visibleContracts.length,
-            'data-allowed-count': allowedCount,
-            'data-denied-count': deniedCount,
-            'data-recent-count': recentIds.length,
-            'data-disabled-reason-count': disabledReasonCount,
-            'data-recent-ids': recentIds.join(','),
-            'data-next-recent-ids': nextRecentIds.join(','),
-        },
-    };
-}
-export function getNextTabId(items, activeId, key, orientation = 'horizontal') {
-    return getNextRovingId(items, activeId, key, orientation, false);
-}
-export function filterCommandPaletteItems(items, query, limit = items.length) {
-    const keyword = query.trim().toLowerCase();
-    const result = [];
-    for (const item of items) {
-        if (keyword === '' || commandPaletteItemMatches(item, keyword)) {
-            result.push(item);
-            if (result.length >= limit)
-                break;
-        }
-    }
-    return result;
-}
-export function getNextCommandPaletteItemId(items, activeId, key) {
-    const enabled = items.filter((item) => item.disabled !== true);
-    if (enabled.length === 0)
-        return activeId;
-    const currentIndex = Math.max(-1, enabled.findIndex((item) => item.id === activeId));
-    if (key === 'Home')
-        return enabled[0]?.id;
-    if (key === 'End')
-        return enabled.at(-1)?.id;
-    if (key === 'ArrowUp')
-        return enabled.at(currentIndex - 1)?.id ?? enabled.at(-1)?.id;
-    if (key === 'ArrowDown')
-        return enabled[(currentIndex + 1) % enabled.length]?.id;
-    return activeId;
-}
-export function shouldOpenCommandPaletteForKey(key, metaKey = false, ctrlKey = false) {
-    return key.toLowerCase() === 'k' && (metaKey || ctrlKey);
-}
-export function shouldCloseCommandPaletteForKey(key) {
-    return key === 'Escape';
-}
-export function shouldSelectCommandPaletteItem(key) {
-    return key === 'Enter';
-}
-export function createBreadcrumbPlans(items) {
-    return {
-        root: createUiDomPlan('nav', 'breadcrumb', {
-            attrs: { 'aria-label': 'Breadcrumb' },
-        }),
-        list: createUiDomPlan('ol', 'breadcrumb-list'),
-        items: items.map((item, index) => createUiDomPlan('li', 'breadcrumb-item', {
-            state: item.current === true || index === items.length - 1 ? 'current' : 'idle',
-            attrs: {
-                'data-href': item.href,
-                'aria-current': item.current === true ? 'page' : undefined,
-                'data-item-id': item.id,
-                'data-icon': item.icon === undefined ? undefined : String(item.icon),
-                'data-collapsed': item.collapsed === true ? 'true' : undefined,
-                'data-overflow': item.overflow === true ? 'true' : undefined,
-                'data-path-index': item.pathIndex,
-                'data-path-summary': item.pathSummary,
-            },
-        })),
-    };
-}
-export function createBreadcrumbResponsiveStateContract(options) {
-    const ids = breadcrumbIds(options.items);
-    const knownIds = new Set(ids);
-    const collapsedIds = normalizeKnownIds(options.collapsedIds, knownIds);
-    const iconIds = normalizeKnownIds(options.iconIds, knownIds);
-    const collapsedSet = new Set(collapsedIds);
-    const iconSet = new Set(iconIds);
-    const overflowId = options.overflowId !== undefined && knownIds.has(options.overflowId) ? options.overflowId : '';
-    const visibleLimit = options.maxVisible === undefined
-        ? options.items.length
-        : Math.max(1, Math.trunc(options.maxVisible));
-    const currentPathSummary = options.items.map((item) => item.label).join(' / ');
-    const items = options.items.map((item, index) => {
-        const id = ids[index] ?? String(index);
-        const overflow = id === overflowId;
-        const collapsed = !overflow &&
-            (collapsedSet.has(id) ||
-                (options.items.length > visibleLimit && index > 0 && index < options.items.length - 1));
-        return breadcrumbResponsiveItemContract(item, {
-            collapsed,
-            icon: iconSet.has(id) || item.icon !== undefined,
-            id,
-            overflow,
-            pathIndex: index,
-            pathSummary: currentPathSummary,
-        });
-    });
-    const visibleIds = items
-        .filter((item) => !item.collapsed || item.overflow)
-        .map((item) => item.id);
-    const state = items.length === 0
-        ? 'empty'
-        : items.some((item) => item.overflow)
-            ? 'overflow'
-            : items.some((item) => item.collapsed)
-                ? 'collapsed'
-                : 'expanded';
-    return {
-        state,
-        itemCount: items.length,
-        visibleCount: visibleIds.length,
-        collapsedCount: items.filter((item) => item.collapsed).length,
-        iconCount: items.filter((item) => item.icon).length,
-        overflowId,
-        currentPathSummary,
-        collapsedIds: items.filter((item) => item.collapsed).map((item) => item.id),
-        iconIds: items.filter((item) => item.icon).map((item) => item.id),
-        visibleIds,
-        items,
-        attrs: {
-            'data-breadcrumb-responsive-contract': 'true',
-            'data-breadcrumb-responsive-state': state,
-            'data-item-count': items.length,
-            'data-visible-count': visibleIds.length,
-            'data-collapsed-count': items.filter((item) => item.collapsed).length,
-            'data-icon-count': items.filter((item) => item.icon).length,
-            'data-overflow-id': overflowId,
-            'data-current-path-summary': currentPathSummary,
-            'data-collapsed-ids': items
-                .filter((item) => item.collapsed)
-                .map((item) => item.id)
-                .join(','),
-            'data-icon-ids': items
-                .filter((item) => item.icon)
-                .map((item) => item.id)
-                .join(','),
-            'data-visible-ids': visibleIds.join(','),
-        },
-    };
-}
-export function createMenuPlans(options) {
-    const activeId = activeMenuItemId(options.items, options.activeId);
-    const orientation = options.orientation ?? 'vertical';
-    return {
-        root: createUiDomPlan('div', 'menu', {
-            ...(options.className === undefined ? {} : { className: options.className }),
-            attrs: {
-                id: options.id,
-                role: 'menu',
-                'aria-label': options.label,
-                'aria-orientation': orientation,
-                ...options.attrs,
-                'data-orientation': orientation,
-                'data-count': options.items.length,
-            },
-        }),
-        items: options.items.map((item) => createMenuItemPlan(options.id, item, item.id === activeId)),
-        shortcuts: options.items.map((item) => item.shortcut === undefined
-            ? undefined
-            : createUiDomPlan('kbd', 'menu-item-shortcut', {
-                attrs: {
-                    'aria-hidden': 'true',
-                    'data-shortcut': item.shortcut,
-                },
-            })),
-    };
-}
-export function createMenuPermissionRemoteActionContract(options) {
-    const disabled = options.disabled === true;
-    const knownIds = new Set(options.items.map((item) => item.id));
-    const allowedInputIds = normalizeKnownIds(options.allowedIds, knownIds);
-    const deniedInputIds = normalizeKnownIds(options.deniedIds, knownIds);
-    const remoteActionInputIds = normalizeKnownIds(options.remoteActionIds, knownIds);
-    const remoteActionDisabledInputIds = normalizeKnownIds(options.remoteActionDisabledIds, knownIds);
-    const remoteActionLoadingInputIds = normalizeKnownIds(options.remoteActionLoadingIds, knownIds);
-    const submenuLoadingInputIds = normalizeKnownIds(options.submenuLoadingIds, knownIds);
-    const allowedSet = new Set(allowedInputIds);
-    const deniedSet = new Set(deniedInputIds);
-    const remoteActionSet = new Set(remoteActionInputIds);
-    const remoteActionDisabledSet = new Set(remoteActionDisabledInputIds);
-    const remoteActionLoadingSet = new Set(remoteActionLoadingInputIds);
-    const submenuLoadingSet = new Set(submenuLoadingInputIds);
-    const hasAllowedIds = options.allowedIds !== undefined;
-    const items = options.items.map((item) => menuPermissionRemoteActionItemContract(item, {
-        denied: deniedSet.has(item.id),
-        disabled,
-        disabledReason: normalizedDisabledReason(options.disabledReasons?.[item.id]),
-        hasAllowedIds,
-        allowed: allowedSet.has(item.id),
-        remoteAction: remoteActionSet.has(item.id),
-        remoteActionDisabled: remoteActionDisabledSet.has(item.id),
-        remoteActionDisabledReason: normalizedDisabledReason(options.remoteActionDisabledReasons?.[item.id]),
-        remoteActionError: normalizedDisabledReason(options.remoteActionErrors?.[item.id]),
-        remoteActionLoading: remoteActionLoadingSet.has(item.id),
-        submenuError: normalizedDisabledReason(options.submenuErrors?.[item.id]),
-        submenuItemCount: normalizedMenuItemCount(options.submenuItemCounts?.[item.id]),
-        submenuLoading: submenuLoadingSet.has(item.id),
-    }));
-    const allowedIds = items.filter((item) => item.permission === 'allowed').map((item) => item.id);
-    const deniedIds = items.filter((item) => item.permission === 'denied').map((item) => item.id);
-    const remoteActionIds = items.filter((item) => item.remoteAction).map((item) => item.id);
-    const remoteActionDisabledIds = items
-        .filter((item) => item.remoteAction && item.remoteActionState === 'disabled')
-        .map((item) => item.id);
-    const remoteActionLoadingIds = items
-        .filter((item) => item.remoteAction && item.remoteActionState === 'pending')
-        .map((item) => item.id);
-    const remoteActionErrorIds = items
-        .filter((item) => item.remoteActionError !== '')
-        .map((item) => item.id);
-    const submenuLoadingIds = items
-        .filter((item) => item.submenuState === 'loading')
-        .map((item) => item.id);
-    const submenuErrorIds = items
-        .filter((item) => item.submenuState === 'error')
-        .map((item) => item.id);
-    const disabledReasonCount = items.filter((item) => item.disabledReason !== '').length;
-    const state = menuPermissionRemoteActionState({
-        deniedCount: deniedIds.length,
-        itemCount: options.items.length,
-        remoteActionLoadingCount: remoteActionLoadingIds.length,
-        submenuErrorCount: submenuErrorIds.length,
-    });
-    return {
-        state,
-        disabled,
-        itemCount: options.items.length,
-        allowedCount: allowedIds.length,
-        deniedCount: deniedIds.length,
-        disabledReasonCount,
-        remoteActionCount: remoteActionIds.length,
-        remoteActionDisabledCount: remoteActionDisabledIds.length,
-        remoteActionLoadingCount: remoteActionLoadingIds.length,
-        remoteActionErrorCount: remoteActionErrorIds.length,
-        submenuLoadingCount: submenuLoadingIds.length,
-        submenuErrorCount: submenuErrorIds.length,
-        allowedIds,
-        deniedIds,
-        remoteActionIds,
-        remoteActionDisabledIds,
-        remoteActionLoadingIds,
-        remoteActionErrorIds,
-        submenuLoadingIds,
-        submenuErrorIds,
-        items,
-        attrs: {
-            'data-menu-permission-remote-contract': 'true',
-            'data-menu-permission-remote-state': state,
-            'data-state': state,
-            'data-disabled': disabled ? 'true' : undefined,
-            'data-item-count': options.items.length,
-            'data-allowed-count': allowedIds.length,
-            'data-denied-count': deniedIds.length,
-            'data-disabled-reason-count': disabledReasonCount,
-            'data-remote-action-count': remoteActionIds.length,
-            'data-remote-action-disabled-count': remoteActionDisabledIds.length,
-            'data-remote-action-loading-count': remoteActionLoadingIds.length,
-            'data-remote-action-error-count': remoteActionErrorIds.length,
-            'data-submenu-loading-count': submenuLoadingIds.length,
-            'data-submenu-error-count': submenuErrorIds.length,
-            'data-allowed-ids': allowedIds.join(','),
-            'data-denied-ids': deniedIds.join(','),
-            'data-remote-action-ids': remoteActionIds.join(','),
-            'data-remote-action-disabled-ids': remoteActionDisabledIds.join(','),
-            'data-remote-action-loading-ids': remoteActionLoadingIds.join(','),
-            'data-remote-action-error-ids': remoteActionErrorIds.join(','),
-            'data-submenu-loading-ids': submenuLoadingIds.join(','),
-            'data-submenu-error-ids': submenuErrorIds.join(','),
-            'aria-busy': remoteActionLoadingIds.length > 0 || submenuLoadingIds.length > 0 ? 'true' : undefined,
-        },
-    };
-}
-export function createMenuSubmenuPortalStateContract(options) {
-    const submenuIds = new Set(options.items.filter((item) => item.kind === 'submenu').map((item) => item.id));
-    const openPathIds = normalizeKnownIds(options.openPathIds, submenuIds);
-    const mountedInputIds = normalizeKnownIds(options.mountedIds, submenuIds);
-    const openSet = new Set(openPathIds);
-    const mountedSet = new Set(mountedInputIds);
-    const items = options.items
-        .filter((item) => item.kind === 'submenu')
-        .map((item) => menuSubmenuPortalItemContract(item, {
-        focusReturnId: normalizedDisabledReason(options.focusReturnIds?.[item.id]),
-        mounted: mountedSet.has(item.id),
-        openPathIndex: openPathIds.indexOf(item.id),
-        parentOverlayId: normalizedDisabledReason(options.parentOverlayIds?.[item.id]),
-        placement: options.placements?.[item.id],
-        portalTargetId: normalizedDisabledReason(options.portalTargetIds?.[item.id]),
-        open: openSet.has(item.id),
-    }));
-    const mountedIds = items.filter((item) => item.mounted).map((item) => item.id);
-    const portalMissingIds = items
-        .filter((item) => item.state === 'portal-missing')
-        .map((item) => item.id);
-    const portalTargetIds = items
-        .map((item) => item.portalTargetId)
-        .filter((id, index, ids) => id !== '' && ids.indexOf(id) === index);
-    const state = menuSubmenuPortalContractState({
-        mountedCount: mountedIds.length,
-        openCount: openPathIds.length,
-        portalMissingCount: portalMissingIds.length,
-        submenuCount: items.length,
-    });
-    return {
-        state,
-        submenuCount: items.length,
-        openCount: openPathIds.length,
-        mountedCount: mountedIds.length,
-        portalMissingCount: portalMissingIds.length,
-        openPathIds,
-        mountedIds,
-        portalMissingIds,
-        portalTargetIds,
-        items,
-        attrs: {
-            'data-menu-submenu-portal-contract': 'true',
-            'data-menu-submenu-portal-state': state,
-            'data-submenu-count': items.length,
-            'data-open-submenu-count': openPathIds.length,
-            'data-mounted-submenu-count': mountedIds.length,
-            'data-portal-missing-count': portalMissingIds.length,
-            'data-open-path-ids': openPathIds.join(','),
-            'data-mounted-submenu-ids': mountedIds.join(','),
-            'data-portal-missing-ids': portalMissingIds.join(','),
-            'data-portal-target-ids': portalTargetIds.join(','),
-        },
-    };
-}
-export function getNextMenuItemId(items, activeId, key) {
-    return getNextRovingId(menuFocusableItems(items), activeId, key, 'vertical', true);
-}
-export function createDrawerOverlayPlans(options) {
-    const side = options.side ?? 'right';
-    const size = options.size ?? 'md';
-    const plans = createDialogOverlayPlans({ ...options, modal: true });
-    return {
-        ...plans,
-        surface: {
-            ...plans.surface,
-            className: classNames(plans.surface.className, 'kui-drawer', `kui-drawer--${side}`, `kui-drawer--${size}`, options.className),
-            attrs: {
-                ...plans.surface.attrs,
-                ...options.attrs,
-                'data-side': side,
-                'data-size': size,
-                'data-long-content': options.longContent === true ? 'true' : undefined,
-            },
-        },
-    };
-}
-export function createDrawerPlans(options) {
-    const side = options.side ?? 'right';
-    const size = options.size ?? 'md';
-    const plans = createDialogPlans({
-        id: options.id,
-        titleId: options.titleId,
-        modal: true,
-        size: size === 'full' ? 'lg' : size,
-        ...(options.descriptionId === undefined ? {} : { descriptionId: options.descriptionId }),
-        ...(options.closeLabel === undefined ? {} : { closeLabel: options.closeLabel }),
-    });
-    return {
-        ...plans,
-        side,
-        surface: {
-            ...plans.surface,
-            className: classNames(plans.surface.className, 'kui-drawer', `kui-drawer--${side}`, `kui-drawer--${size}`, options.className),
-            attrs: {
-                ...plans.surface.attrs,
-                ...options.attrs,
-                'data-side': side,
-                'data-size': size,
-                'data-long-content': options.longContent === true ? 'true' : undefined,
-            },
-        },
-    };
-}
-export function createDrawerNestedOverlayCoordinationContract(options) {
-    const nestedOverlayIds = normalizeUniqueIds(options.nestedOverlayIds);
-    const nestedOverlaySet = new Set(nestedOverlayIds);
-    const nestedModalIds = normalizeKnownIds(options.nestedModalIds, nestedOverlaySet);
-    const focusReturnId = normalizedDisabledReason(options.focusReturnId);
-    const activeOverlayId = normalizedDisabledReason(options.activeOverlayId) || nestedOverlayIds.at(-1) || '';
-    const scrollContainerId = normalizedDisabledReason(options.scrollContainerId);
-    const scrollContained = options.scrollContained === true || scrollContainerId !== '' || nestedOverlayIds.length > 0;
-    const actions = drawerPinnedActionContracts(options);
-    const pinnedActionIds = actions.map((action) => action.id);
-    const pendingActionIds = actions
-        .filter((action) => action.state === 'pending')
-        .map((action) => action.id);
-    const disabledActionIds = actions
-        .filter((action) => action.state === 'disabled')
-        .map((action) => action.id);
-    const state = drawerNestedOverlayCoordinationState({
-        focusReturnId,
-        nestedOverlayCount: nestedOverlayIds.length,
-        pendingActionCount: pendingActionIds.length,
-    });
-    return {
-        state,
-        nestedOverlayCount: nestedOverlayIds.length,
-        nestedModalCount: nestedModalIds.length,
-        pinnedActionCount: actions.length,
-        pendingActionCount: pendingActionIds.length,
-        disabledActionCount: disabledActionIds.length,
-        activeOverlayId,
-        focusReturnId,
-        scrollContainerId,
-        scrollContained,
-        nestedOverlayIds,
-        nestedModalIds,
-        pinnedActionIds,
-        pendingActionIds,
-        disabledActionIds,
-        actions,
-        attrs: {
-            'data-drawer-nested-overlay-contract': 'true',
-            'data-drawer-coordination-state': state,
-            'data-nested-overlay-count': nestedOverlayIds.length,
-            'data-nested-modal-count': nestedModalIds.length,
-            'data-active-overlay-id': activeOverlayId,
-            'data-nested-overlay-ids': nestedOverlayIds.join(','),
-            'data-nested-modal-ids': nestedModalIds.join(','),
-            'data-focus-return-id': focusReturnId,
-            'data-scroll-container-id': scrollContainerId,
-            'data-scroll-contained': scrollContained ? 'true' : undefined,
-            'data-pinned-action-count': actions.length,
-            'data-pending-action-count': pendingActionIds.length,
-            'data-disabled-action-count': disabledActionIds.length,
-            'data-pinned-action-ids': pinnedActionIds.join(','),
-            'data-pending-action-ids': pendingActionIds.join(','),
-            'data-disabled-action-ids': disabledActionIds.join(','),
-            'aria-busy': pendingActionIds.length > 0 ? 'true' : undefined,
-        },
-    };
-}
-export function createStepsPlans(options) {
-    const orientation = options.orientation ?? 'horizontal';
-    const currentId = options.currentId ?? options.items.find((item) => item.disabled !== true)?.id;
-    return {
-        root: createUiDomPlan('nav', 'steps', {
-            ...(options.className === undefined ? {} : { className: options.className }),
-            attrs: {
-                id: options.id,
-                'aria-label': options.label ?? 'Steps',
-                ...options.attrs,
-                'data-orientation': orientation,
-                'data-current-id': currentId,
-                'data-count': options.items.length,
-            },
-        }),
-        list: createUiDomPlan('ol', 'steps-list', { attrs: { role: 'list' } }),
-        items: options.items.map((item, index) => createUiDomPlan('li', 'step', {
-            state: stepStatus(item, currentId),
-            attrs: {
-                'data-step-id': item.id,
-                'data-index': index,
-                'data-status': stepStatus(item, currentId),
-                'data-timeline-index': item.timelineIndex,
-                'data-timeline-state': item.timelineState,
-                'data-previous-step-id': item.previousStepId,
-                'data-next-step-id': item.nextStepId,
-                'data-validation-state': item.validationState,
-                'data-blocking-reason': item.blockingReason,
-                'data-return-state': item.returnState,
-                'data-returnable': item.returnable === true ? 'true' : undefined,
-                'aria-invalid': item.validationState === 'invalid' ? 'true' : undefined,
-            },
-        })),
-        indicators: options.items.map((item, index) => createUiDomPlan('span', 'step-indicator', {
-            attrs: {
-                'aria-hidden': 'true',
-                'data-step-id': item.id,
-                'data-index': index + 1,
-                'data-status': stepStatus(item, currentId),
-            },
-        })),
-        triggers: options.items.map((item) => createStepTriggerPlan(item, currentId, options.clickable)),
-        descriptions: options.items.map((item) => item.description === undefined
-            ? undefined
-            : createUiDomPlan('p', 'step-description', {
-                attrs: { 'data-description': item.description },
-            })),
-    };
-}
-export function getNextStepId(items, activeId, key, orientation = 'horizontal') {
-    return getNextRovingId(items, activeId, key, orientation, false);
-}
-export function createStepsTimelineValidationContract(options) {
-    const knownIds = new Set(options.items.map((item) => item.id));
-    const completedIds = normalizeKnownIds(options.completedIds, knownIds);
-    const returnableInputIds = normalizeKnownIds(options.returnableIds, knownIds);
-    const completedSet = new Set(completedIds);
-    const returnableSet = new Set(returnableInputIds);
-    const currentId = options.currentId !== undefined && knownIds.has(options.currentId)
-        ? options.currentId
-        : (options.items.find((item) => item.disabled !== true)?.id ?? '');
-    const currentIndex = options.items.findIndex((item) => item.id === currentId);
-    const items = options.items.map((item, index) => stepsTimelineValidationItemContract(item, {
-        blockingReason: normalizedDisabledReason(options.blockingReasons?.[item.id]),
-        completed: completedSet.has(item.id),
-        current: item.id === currentId,
-        currentIndex,
-        index,
-        nextStepId: options.items[index + 1]?.id ?? '',
-        previousStepId: options.items[index - 1]?.id ?? '',
-        returnable: returnableSet.has(item.id),
-        validationState: options.validationStates?.[item.id],
-    }));
-    const returnableIds = items
-        .filter((item) => item.returnState === 'returnable')
-        .map((item) => item.id);
-    const blockedIds = items
-        .filter((item) => item.validationState === 'blocked')
-        .map((item) => item.id);
-    const invalidIds = items
-        .filter((item) => item.validationState === 'invalid')
-        .map((item) => item.id);
-    const warningIds = items
-        .filter((item) => item.validationState === 'warning')
-        .map((item) => item.id);
-    const state = stepsTimelineValidationState({
-        blockedCount: blockedIds.length,
-        invalidCount: invalidIds.length,
-        stepCount: options.items.length,
-        warningCount: warningIds.length,
-    });
-    return {
-        state,
-        currentId,
-        stepCount: options.items.length,
-        completedCount: completedIds.length,
-        returnableCount: returnableIds.length,
-        blockedCount: blockedIds.length,
-        invalidCount: invalidIds.length,
-        warningCount: warningIds.length,
-        completedIds,
-        returnableIds,
-        blockedIds,
-        invalidIds,
-        warningIds,
-        items,
-        attrs: {
-            'data-steps-timeline-validation-contract': 'true',
-            'data-steps-validation-state': state,
-            'data-current-step-id': currentId,
-            'data-step-count': options.items.length,
-            'data-completed-step-count': completedIds.length,
-            'data-returnable-step-count': returnableIds.length,
-            'data-blocked-step-count': blockedIds.length,
-            'data-invalid-step-count': invalidIds.length,
-            'data-warning-step-count': warningIds.length,
-            'data-completed-step-ids': completedIds.join(','),
-            'data-returnable-step-ids': returnableIds.join(','),
-            'data-blocked-step-ids': blockedIds.join(','),
-            'data-invalid-step-ids': invalidIds.join(','),
-            'data-warning-step-ids': warningIds.join(','),
-        },
-    };
-}
-export function createCollapsePlans(options) {
-    const mode = options.mode ?? 'multiple';
-    const openIds = normalizedOpenIds(options.openIds);
-    const effectiveOpenIds = mode === 'accordion' ? new Set([...openIds].slice(0, 1)) : new Set(openIds);
-    return {
-        root: createUiDomPlan('div', 'collapse', {
-            ...(options.className === undefined ? {} : { className: options.className }),
-            attrs: {
-                id: options.id,
-                role: mode === 'accordion' ? 'presentation' : undefined,
-                'aria-label': options.label,
-                ...options.attrs,
-                'data-mode': mode,
-                'data-open-count': effectiveOpenIds.size,
-                'data-animated': options.animated === true ? 'true' : undefined,
-            },
-        }),
-        items: options.items.map((item) => {
-            const open = effectiveOpenIds.has(item.id);
-            return createUiDomPlan('div', 'collapse-item', {
-                state: item.disabled === true ? 'disabled' : open ? 'open' : 'closed',
-                ...(item.disabled === undefined ? {} : { disabled: item.disabled }),
-                attrs: {
-                    'data-item-id': item.id,
-                    'data-open': open ? 'true' : 'false',
-                    'data-lazy-state': item.lazyState,
-                    'data-lazy-error': item.lazyError,
-                    'data-persisted-open': item.persistedOpen === true ? 'true' : undefined,
-                    'data-nested-level': item.nestedLevel,
-                    'data-parent-panel-id': item.parentPanelId,
-                    'data-disabled-reason': item.disabledReason,
-                },
-            });
-        }),
-        triggers: options.items.map((item) => {
-            const open = effectiveOpenIds.has(item.id);
-            return createUiDomPlan('button', 'collapse-trigger', {
-                state: item.disabled === true ? 'disabled' : open ? 'open' : 'closed',
-                ...(item.disabled === undefined ? {} : { disabled: item.disabled }),
-                attrs: {
-                    id: `${options.id}-${item.id}-trigger`,
-                    type: 'button',
-                    'aria-expanded': open ? 'true' : 'false',
-                    'aria-controls': `${options.id}-${item.id}-panel`,
-                    'data-item-id': item.id,
-                    'data-title': item.title,
-                    'data-lazy-state': item.lazyState,
-                    'data-lazy-error': item.lazyError,
-                    'data-persisted-open': item.persistedOpen === true ? 'true' : undefined,
-                    'data-nested-level': item.nestedLevel,
-                    'data-parent-panel-id': item.parentPanelId,
-                    'data-disabled-reason': item.disabledReason,
-                    'aria-busy': item.lazyState === 'loading' ? 'true' : undefined,
-                },
-            });
-        }),
-        indicators: options.items.map((item) => createUiDomPlan('span', 'collapse-indicator', {
-            attrs: {
-                'aria-hidden': 'true',
-                'data-item-id': item.id,
-                'data-open': effectiveOpenIds.has(item.id) ? 'true' : 'false',
-                'data-lazy-state': item.lazyState,
-            },
-        })),
-        panels: options.items.map((item) => {
-            const open = effectiveOpenIds.has(item.id);
-            return createUiDomPlan('div', 'collapse-panel', {
-                state: open ? 'open' : 'closed',
-                attrs: {
-                    id: `${options.id}-${item.id}-panel`,
-                    role: 'region',
-                    'aria-labelledby': `${options.id}-${item.id}-trigger`,
-                    hidden: open ? undefined : true,
-                    'data-item-id': item.id,
-                    'data-description': item.description,
-                    'data-lazy-state': item.lazyState,
-                    'data-lazy-error': item.lazyError,
-                    'data-persisted-open': item.persistedOpen === true ? 'true' : undefined,
-                    'data-nested-level': item.nestedLevel,
-                    'data-parent-panel-id': item.parentPanelId,
-                    'aria-busy': item.lazyState === 'loading' ? 'true' : undefined,
-                },
-            });
-        }),
-    };
-}
-export function createCollapseLazyPersistenceContract(options) {
-    const knownIds = new Set(options.items.map((item) => item.id));
-    const openIds = normalizeKnownIds(options.openIds, knownIds);
-    const persistedOpenIds = normalizeKnownIds(options.persistedOpenIds, knownIds);
-    const lazyLoadingIds = normalizeKnownIds(options.lazyLoadingIds, knownIds);
-    const lazyLoadedIds = normalizeKnownIds(options.lazyLoadedIds, knownIds);
-    const persistedOpenSet = new Set(persistedOpenIds);
-    const lazyLoadingSet = new Set(lazyLoadingIds);
-    const lazyLoadedSet = new Set(lazyLoadedIds);
-    const items = options.items.map((item) => collapseLazyPersistenceItemContract(item, {
-        disabledReason: normalizedDisabledReason(options.disabledReasons?.[item.id]),
-        lazyError: normalizedDisabledReason(options.lazyErrors?.[item.id]),
-        lazyLoaded: lazyLoadedSet.has(item.id),
-        lazyLoading: lazyLoadingSet.has(item.id),
-        nestedLevel: normalizedMenuItemCount(options.nestedLevels?.[item.id]) ?? 0,
-        parentPanelId: normalizedDisabledReason(options.nestedParents?.[item.id]),
-        persistedOpen: persistedOpenSet.has(item.id),
-    }));
-    const lazyErrorIds = items.filter((item) => item.lazyState === 'error').map((item) => item.id);
-    const disabledReasonIds = items
-        .filter((item) => item.disabledReason !== '')
-        .map((item) => item.id);
-    const nestedIds = items.filter((item) => item.nestedLevel > 0).map((item) => item.id);
-    const state = lazyLoadingIds.length > 0
-        ? 'loading'
-        : lazyErrorIds.length > 0
-            ? 'lazy-error'
-            : disabledReasonIds.length > 0
-                ? 'disabled-limited'
-                : 'ready';
-    const persistenceState = persistedOpenIds.length === 0
-        ? 'empty'
-        : arraysEqual(openIds, persistedOpenIds)
-            ? 'restored'
-            : 'dirty';
-    return {
-        state,
-        persistenceState,
-        itemCount: items.length,
-        lazyLoadingCount: lazyLoadingIds.length,
-        lazyLoadedCount: lazyLoadedIds.length,
-        lazyErrorCount: lazyErrorIds.length,
-        persistedOpenCount: persistedOpenIds.length,
-        disabledReasonCount: disabledReasonIds.length,
-        nestedCount: nestedIds.length,
-        openIds,
-        persistedOpenIds,
-        lazyLoadingIds,
-        lazyLoadedIds,
-        lazyErrorIds,
-        disabledReasonIds,
-        nestedIds,
-        items,
-        attrs: {
-            'data-collapse-lazy-persistence-contract': 'true',
-            'data-collapse-advanced-state': state,
-            'data-collapse-persistence-state': persistenceState,
-            'data-item-count': items.length,
-            'data-lazy-loading-count': lazyLoadingIds.length,
-            'data-lazy-loaded-count': lazyLoadedIds.length,
-            'data-lazy-error-count': lazyErrorIds.length,
-            'data-persisted-open-count': persistedOpenIds.length,
-            'data-disabled-reason-count': disabledReasonIds.length,
-            'data-nested-count': nestedIds.length,
-            'data-open-ids': openIds.join(','),
-            'data-persisted-open-ids': persistedOpenIds.join(','),
-            'data-lazy-loading-ids': lazyLoadingIds.join(','),
-            'data-lazy-loaded-ids': lazyLoadedIds.join(','),
-            'data-lazy-error-ids': lazyErrorIds.join(','),
-            'data-disabled-reason-ids': disabledReasonIds.join(','),
-            'data-nested-ids': nestedIds.join(','),
-            'aria-busy': lazyLoadingIds.length > 0 ? 'true' : undefined,
-        },
-    };
-}
-export function getNextCollapseTriggerId(items, activeId, key) {
-    return getNextRovingId(items.map((item) => ({
-        id: item.id,
-        label: item.title,
-        ...(item.disabled === undefined ? {} : { disabled: item.disabled }),
-    })), activeId, key, 'vertical', true);
-}
-export function getNextAccordionOpenIds(openIds, itemId) {
-    return openIds.has(itemId) ? new Set() : new Set([itemId]);
-}
-export function getNextCollapseOpenIds(openIds, itemId) {
-    const next = new Set(openIds);
-    if (next.has(itemId)) {
-        next.delete(itemId);
-    }
-    else {
-        next.add(itemId);
-    }
-    return next;
-}
-function commandPaletteItemDomId(rootId, itemId) {
-    return `${rootId}-${itemId}-command`;
-}
-const defaultCommandPaletteRecentGroup = { id: 'recent', label: 'Recent' };
-function commandPalettePermissionRecentItemContract(item, options) {
-    const permission = options.deniedIds.has(item.id) ||
-        (options.allowedIds.size > 0 && !options.allowedIds.has(item.id))
-        ? 'denied'
-        : 'allowed';
-    const disabledReason = permission === 'denied' && options.disabledReason === ''
-        ? 'Permission required'
-        : options.disabledReason;
-    const disabled = item.disabled === true || permission === 'denied';
-    const contractItem = {
-        ...item,
-        ...(options.recent ? { groupId: options.recentGroupId, kind: 'recent', recent: true } : {}),
-        disabled,
-        ...(disabledReason === '' ? {} : { disabledReason }),
-        permission,
-    };
-    return {
-        id: item.id,
-        index: options.index,
-        item: contractItem,
-        permission,
-        recent: options.recent,
-        disabledReason,
-        attrs: {
-            'data-command-id': item.id,
-            'data-permission': permission,
-            'data-recent': options.recent ? 'true' : undefined,
-            'data-disabled-reason': disabledReason,
-            'aria-disabled': disabled ? 'true' : undefined,
-        },
-    };
-}
-function commandPaletteGroupsForItems(items, groups) {
-    const seen = new Set();
-    const result = [];
-    for (const item of items) {
-        const groupId = item.groupId;
-        if (groupId === undefined || seen.has(groupId))
-            continue;
-        seen.add(groupId);
-        result.push(groups.find((group) => group.id === groupId) ?? { id: groupId, label: groupId });
-    }
-    return result;
-}
-function commandPaletteItemMatches(item, keyword) {
-    return (item.label.toLowerCase().includes(keyword) ||
-        item.description?.toLowerCase().includes(keyword) === true ||
-        item.href?.toLowerCase().includes(keyword) === true ||
-        item.keywords?.some((value) => value.toLowerCase().includes(keyword)) === true);
-}
-function commandPaletteRecentSort(a, b, recentOrder) {
-    const aRecent = recentOrder.get(a.id);
-    const bRecent = recentOrder.get(b.id);
-    if (aRecent !== undefined && bRecent !== undefined)
-        return aRecent - bRecent;
-    if (aRecent !== undefined)
-        return -1;
-    if (bRecent !== undefined)
-        return 1;
-    return a.index - b.index;
-}
-function commandPalettePermissionRecentState(options) {
-    if (options.totalCount === 0)
-        return 'empty';
-    if (options.visibleCount === 0)
-        return 'filtered';
-    if (options.deniedCount > 0)
-        return 'permission-limited';
-    return 'ready';
-}
-function normalizeCommandIds(value) {
-    if (value === undefined)
-        return new Set();
-    const values = Array.isArray(value)
-        ? value
-        : [...value];
-    return new Set(values.filter((id) => id.length > 0));
-}
-function normalizeUniqueIds(value) {
-    if (value === undefined)
-        return [];
-    const result = [];
-    for (const id of value) {
-        if (id === '' || result.includes(id))
-            continue;
-        result.push(id);
-    }
-    return result;
-}
-function normalizeKnownIds(value, knownIds) {
-    if (value === undefined)
-        return [];
-    const values = Array.isArray(value)
-        ? value
-        : [...value];
-    const result = [];
-    for (const id of values) {
-        if (!knownIds.has(id) || result.includes(id))
-            continue;
-        result.push(id);
-    }
-    return result;
-}
-function normalizeCommandPaletteRecentIds(value, knownIds, maxRecent = value.length) {
-    const limit = Math.max(0, Math.trunc(maxRecent));
-    if (limit === 0)
-        return [];
-    const result = [];
-    for (const id of value) {
-        if (!knownIds.has(id) || result.includes(id))
-            continue;
-        result.push(id);
-        if (result.length >= limit)
-            break;
-    }
-    return result;
-}
-function normalizedDisabledReason(value) {
-    return value?.trim() ?? '';
-}
-function normalizedMenuItemCount(value) {
-    if (value === undefined || !Number.isFinite(value))
-        return undefined;
-    return Math.max(0, Math.trunc(value));
-}
-function drawerPinnedActionContracts(options) {
-    const actions = options.pinnedActions ?? [];
-    const knownIds = new Set(actions.map((action) => action.id));
-    const pendingIds = new Set(normalizeKnownIds(options.pendingActionIds, knownIds));
-    const disabledIds = new Set(normalizeKnownIds(options.disabledActionIds, knownIds));
-    return actions
-        .filter((action, index) => action.id !== '' && actions.findIndex((item) => item.id === action.id) === index)
-        .map((action) => drawerPinnedActionContract(action, {
-        disabled: disabledIds.has(action.id),
-        disabledReason: normalizedDisabledReason(options.disabledReasons?.[action.id]),
-        pending: pendingIds.has(action.id),
-    }));
-}
-function drawerPinnedActionContract(action, options) {
-    const pending = options.pending || action.pending === true;
-    const disabled = options.disabled || action.disabled === true;
-    const disabledReason = options.disabledReason || normalizedDisabledReason(action.disabledReason);
-    const state = pending ? 'pending' : disabled ? 'disabled' : 'available';
-    const contractAction = {
-        ...action,
-        ...(disabled ? { disabled: true } : {}),
-        ...(pending ? { pending: true } : {}),
-        ...(disabledReason === '' ? {} : { disabledReason }),
-    };
-    return {
-        id: action.id,
-        action: contractAction,
-        state,
-        disabledReason,
-        attrs: {
-            'data-action-id': action.id,
-            'data-pinned-action-state': state,
-            'data-disabled-reason': disabledReason,
-            'aria-disabled': state === 'disabled' ? 'true' : undefined,
-            'aria-busy': state === 'pending' ? 'true' : undefined,
-        },
-    };
-}
-function drawerNestedOverlayCoordinationState(options) {
-    if (options.pendingActionCount > 0)
-        return 'action-pending';
-    if (options.nestedOverlayCount > 0)
-        return 'nested-overlay-open';
-    if (options.focusReturnId !== '')
-        return 'focus-return-ready';
-    return 'idle';
-}
-function collapseLazyPersistenceItemContract(item, options) {
-    const lazyState = options.lazyLoading && options.lazyError === ''
-        ? 'loading'
-        : options.lazyError !== ''
-            ? 'error'
-            : options.lazyLoaded
-                ? 'loaded'
-                : (item.lazyState ?? 'idle');
-    const disabledReason = options.disabledReason || normalizedDisabledReason(item.disabledReason);
-    const nestedLevel = Math.max(0, options.nestedLevel);
-    const contractItem = {
-        ...item,
-        lazyState,
-        ...(options.lazyError === '' ? {} : { lazyError: options.lazyError }),
-        ...(options.persistedOpen ? { persistedOpen: true } : {}),
-        ...(nestedLevel === 0 ? {} : { nestedLevel }),
-        ...(options.parentPanelId === '' ? {} : { parentPanelId: options.parentPanelId }),
-        ...(disabledReason === '' ? {} : { disabled: true, disabledReason }),
-    };
-    return {
-        id: item.id,
-        item: contractItem,
-        lazyState,
-        lazyError: options.lazyError,
-        persistedOpen: options.persistedOpen,
-        disabledReason,
-        nestedLevel,
-        parentPanelId: options.parentPanelId,
-        attrs: {
-            'data-item-id': item.id,
-            'data-lazy-state': lazyState,
-            'data-lazy-error': options.lazyError,
-            'data-persisted-open': options.persistedOpen ? 'true' : undefined,
-            'data-nested-level': nestedLevel,
-            'data-parent-panel-id': options.parentPanelId,
-            'data-disabled-reason': disabledReason,
-            'aria-disabled': disabledReason !== '' ? 'true' : undefined,
-            'aria-busy': lazyState === 'loading' ? 'true' : undefined,
-        },
-    };
-}
-function breadcrumbIds(items) {
-    return items.map((item, index) => item.id ?? item.href ?? String(index));
-}
-function breadcrumbResponsiveItemContract(item, options) {
-    const contractItem = {
-        ...item,
-        id: options.id,
-        ...(options.icon ? { icon: item.icon ?? true } : {}),
-        ...(options.collapsed ? { collapsed: true } : {}),
-        ...(options.overflow ? { overflow: true } : {}),
-        pathIndex: options.pathIndex,
-        pathSummary: options.pathSummary,
-    };
-    return {
-        id: options.id,
-        item: contractItem,
-        collapsed: options.collapsed,
-        icon: options.icon,
-        overflow: options.overflow,
-        pathIndex: options.pathIndex,
-        pathSummary: options.pathSummary,
-        attrs: {
-            'data-item-id': options.id,
-            'data-icon': options.icon ? String(contractItem.icon ?? true) : undefined,
-            'data-collapsed': options.collapsed ? 'true' : undefined,
-            'data-overflow': options.overflow ? 'true' : undefined,
-            'data-path-index': options.pathIndex,
-            'data-path-summary': options.pathSummary,
-            'aria-hidden': options.collapsed && !options.overflow ? 'true' : undefined,
-        },
-    };
-}
-function tabsOverflowPersistenceItemContract(item, options) {
-    const contractItem = {
-        ...item,
-        ...(options.disabledReason === ''
-            ? {}
-            : { disabled: true, disabledReason: options.disabledReason }),
-        ...(options.overflow ? { overflow: true } : {}),
-        ...(options.persistedActive ? { persistedActive: true } : {}),
-    };
-    return {
-        id: item.id,
-        item: contractItem,
-        active: options.active,
-        overflow: options.overflow,
-        persistedActive: options.persistedActive,
-        disabledReason: options.disabledReason,
-        attrs: {
-            'data-tab-id': item.id,
-            'data-overflow': options.overflow ? 'true' : undefined,
-            'data-persisted-active': options.persistedActive ? 'true' : undefined,
-            'data-disabled-reason': options.disabledReason,
-            'aria-disabled': options.disabledReason !== '' ? 'true' : undefined,
-        },
-    };
-}
-function arraysEqual(a, b) {
-    if (a.length !== b.length)
-        return false;
-    return a.every((value, index) => value === b[index]);
-}
-function getNextRovingId(items, activeId, key, orientation, verticalKeys) {
-    const enabled = items.filter((item) => item.disabled !== true);
-    if (enabled.length === 0)
-        return activeId;
-    const currentIndex = Math.max(0, enabled.findIndex((item) => item.id === activeId));
-    const previousKey = orientation === 'vertical' || verticalKeys ? 'ArrowUp' : 'ArrowLeft';
-    const nextKey = orientation === 'vertical' || verticalKeys ? 'ArrowDown' : 'ArrowRight';
-    if (key === 'Home')
-        return enabled[0]?.id ?? activeId;
-    if (key === 'End')
-        return enabled.at(-1)?.id ?? activeId;
-    if (key === previousKey)
-        return enabled.at(currentIndex - 1)?.id ?? enabled.at(-1)?.id ?? activeId;
-    if (key === nextKey)
-        return enabled[(currentIndex + 1) % enabled.length]?.id ?? activeId;
-    return activeId;
-}
-function menuFocusableItems(items) {
-    return items.filter((item) => item.disabled !== true && menuItemFocusable(item));
-}
-function activeMenuItemId(items, activeId) {
-    const focusable = menuFocusableItems(items);
-    return focusable.some((item) => item.id === activeId) ? activeId : focusable[0]?.id;
-}
-function menuItemFocusable(item) {
-    return item.kind !== 'separator' && item.kind !== 'section';
-}
-function createMenuItemPlan(rootId, item, active) {
-    const kind = item.kind ?? 'item';
-    const separator = kind === 'separator';
-    const section = kind === 'section';
-    const submenuState = menuItemSubmenuState(item);
-    const remoteActionState = menuItemRemoteActionState(item);
-    return createUiDomPlan('div', section ? 'menu-section' : 'menu-item', {
-        state: item.disabled === true
-            ? 'disabled'
-            : active
-                ? 'active'
-                : item.checked === true
-                    ? 'checked'
-                    : 'idle',
-        ...(item.disabled === undefined ? {} : { disabled: item.disabled }),
-        ...(item.danger === true ? { className: 'kui-menu-item--danger' } : {}),
-        attrs: {
-            id: `${rootId}-${item.id}`,
-            role: separator ? 'separator' : section ? 'presentation' : menuItemRole(kind),
-            tabindex: menuItemFocusable(item) ? (active ? 0 : -1) : undefined,
-            'aria-checked': kind === 'checkbox' || kind === 'radio'
-                ? item.checked === true
-                    ? 'true'
-                    : 'false'
-                : undefined,
-            'aria-haspopup': kind === 'submenu' ? 'menu' : undefined,
-            'aria-expanded': kind === 'submenu' ? (item.expanded === true ? 'true' : 'false') : undefined,
-            'aria-disabled': item.disabled === true ? 'true' : undefined,
-            'aria-busy': item.remoteActionLoading === true || item.submenuLoading === true ? 'true' : undefined,
-            'data-menu-id': rootId,
-            'data-item-id': item.id,
-            'data-kind': kind,
-            'data-label': item.label,
-            'data-shortcut': item.shortcut,
-            'data-section-id': item.sectionId,
-            'data-danger': item.danger === true ? 'true' : undefined,
-            'data-permission': item.permission,
-            'data-disabled-reason': item.disabledReason,
-            'data-remote-action': item.remoteAction === true ? 'true' : undefined,
-            'data-remote-action-state': remoteActionState,
-            'data-remote-action-disabled-reason': item.remoteActionDisabledReason,
-            'data-remote-action-error': item.remoteActionError,
-            'data-can-invoke-remote-action': remoteActionState === 'available' && item.disabled !== true ? 'true' : undefined,
-            'data-submenu-state': submenuState,
-            'data-submenu-error': item.submenuError,
-            'data-submenu-item-count': item.submenuItemCount,
-            'data-submenu-portal-state': item.submenuPortalState,
-            'data-submenu-portal-target': item.submenuPortalTargetId,
-            'data-submenu-open-path-index': item.submenuOpenPathIndex,
-            'data-submenu-focus-return': item.submenuFocusReturnId,
-            'data-submenu-parent-overlay': item.submenuParentOverlayId,
-            'data-submenu-placement': item.submenuPlacement,
-            'aria-controls': item.submenuPortalTargetId,
-        },
-    });
-}
-function menuSubmenuPortalItemContract(item, options) {
-    const mounted = options.mounted || options.open;
-    const state = options.open && options.portalTargetId === ''
-        ? 'portal-missing'
-        : options.open
-            ? 'open'
-            : mounted
-                ? 'mounted'
-                : 'closed';
-    const openPathIndex = options.openPathIndex < 0 ? undefined : options.openPathIndex;
-    const contractItem = {
-        ...item,
-        ...(options.open ? { expanded: true } : {}),
-        submenuPortalState: state,
-        ...(options.portalTargetId === '' ? {} : { submenuPortalTargetId: options.portalTargetId }),
-        ...(openPathIndex === undefined ? {} : { submenuOpenPathIndex: openPathIndex }),
-        ...(options.focusReturnId === '' ? {} : { submenuFocusReturnId: options.focusReturnId }),
-        ...(options.parentOverlayId === '' ? {} : { submenuParentOverlayId: options.parentOverlayId }),
-        ...(options.placement === undefined ? {} : { submenuPlacement: options.placement }),
-    };
-    return {
-        id: item.id,
-        item: contractItem,
-        state,
-        open: options.open,
-        mounted,
-        portalTargetId: options.portalTargetId,
-        focusReturnId: options.focusReturnId,
-        parentOverlayId: options.parentOverlayId,
-        placement: options.placement,
-        openPathIndex,
-        attrs: {
-            'data-item-id': item.id,
-            'data-submenu-portal-state': state,
-            'data-submenu-portal-target': options.portalTargetId,
-            'data-submenu-open-path-index': openPathIndex,
-            'data-submenu-focus-return': options.focusReturnId,
-            'data-submenu-parent-overlay': options.parentOverlayId,
-            'data-submenu-placement': options.placement,
-            'aria-controls': options.portalTargetId === '' ? undefined : options.portalTargetId,
-            'aria-expanded': options.open ? 'true' : item.expanded === true ? 'true' : 'false',
-        },
-    };
-}
-function menuPermissionRemoteActionItemContract(item, options) {
-    const permission = options.denied || (options.hasAllowedIds && !options.allowed) ? 'denied' : 'allowed';
-    const baseDisabledReason = options.disabledReason || normalizedDisabledReason(item.disabledReason);
-    const disabledReason = permission === 'denied' && baseDisabledReason === ''
-        ? 'Permission required'
-        : baseDisabledReason;
-    const disabled = options.disabled || item.disabled === true || permission === 'denied';
-    const remoteAction = options.remoteAction ||
-        options.remoteActionDisabled ||
-        options.remoteActionLoading ||
-        options.remoteActionError !== '' ||
-        item.remoteAction === true ||
-        item.remoteActionDisabled === true ||
-        item.remoteActionLoading === true ||
-        normalizedDisabledReason(item.remoteActionError) !== '';
-    const remoteActionError = options.remoteActionError || normalizedDisabledReason(item.remoteActionError);
-    const remoteActionDisabled = options.remoteActionDisabled || item.remoteActionDisabled === true;
-    const remoteActionLoading = options.remoteActionLoading || item.remoteActionLoading === true;
-    const remoteActionDisabledReason = options.remoteActionDisabledReason || normalizedDisabledReason(item.remoteActionDisabledReason);
-    const remoteActionState = remoteActionLoading && remoteActionError === ''
-        ? 'pending'
-        : remoteActionDisabled || disabled || remoteActionError !== ''
-            ? 'disabled'
-            : 'available';
-    const submenuError = options.submenuError || normalizedDisabledReason(item.submenuError);
-    const submenuLoading = options.submenuLoading || item.submenuLoading === true;
-    const submenuItemCount = options.submenuItemCount ?? item.submenuItemCount;
-    const contractItem = {
-        ...item,
-        disabled,
-        ...(disabledReason === '' ? {} : { disabledReason }),
-        permission,
-        ...(remoteAction ? { remoteAction: true } : {}),
-        ...(remoteActionState === 'disabled' ? { remoteActionDisabled: true } : {}),
-        ...(remoteActionState === 'pending' ? { remoteActionLoading: true } : {}),
-        ...(remoteActionDisabledReason === '' ? {} : { remoteActionDisabledReason }),
-        ...(remoteActionError === '' ? {} : { remoteActionError }),
-        ...(submenuError === '' ? {} : { submenuError }),
-        ...(submenuItemCount === undefined ? {} : { submenuItemCount }),
-        ...(submenuLoading ? { submenuLoading: true } : {}),
-    };
-    const submenuState = menuItemSubmenuState(contractItem);
-    return {
-        id: item.id,
-        item: contractItem,
-        permission,
-        disabled,
-        disabledReason,
-        remoteAction,
-        remoteActionState,
-        remoteActionDisabledReason,
-        remoteActionError,
-        submenuState,
-        submenuError,
-        submenuItemCount,
-        attrs: {
-            'data-item-id': item.id,
-            'data-permission': permission,
-            'data-disabled-reason': disabledReason,
-            'data-remote-action': remoteAction ? 'true' : undefined,
-            'data-remote-action-state': remoteAction ? remoteActionState : undefined,
-            'data-remote-action-disabled-reason': remoteActionDisabledReason,
-            'data-remote-action-error': remoteActionError,
-            'data-can-invoke-remote-action': remoteAction && remoteActionState === 'available' && !disabled ? 'true' : undefined,
-            'data-submenu-state': submenuState,
-            'data-submenu-error': submenuError,
-            'data-submenu-item-count': submenuItemCount,
-            'aria-disabled': disabled ? 'true' : undefined,
-            'aria-busy': remoteActionState === 'pending' || submenuState === 'loading' ? 'true' : undefined,
-        },
-    };
-}
-function menuPermissionRemoteActionState(options) {
-    if (options.itemCount === 0)
-        return 'empty';
-    if (options.remoteActionLoadingCount > 0)
-        return 'remote-pending';
-    if (options.submenuErrorCount > 0)
-        return 'submenu-error';
-    if (options.deniedCount > 0)
-        return 'permission-limited';
-    return 'ready';
-}
-function menuSubmenuPortalContractState(options) {
-    if (options.submenuCount === 0)
-        return 'empty';
-    if (options.portalMissingCount > 0)
-        return 'portal-missing';
-    if (options.openCount > 0)
-        return 'open';
-    if (options.mountedCount > 0)
-        return 'mounted';
-    return 'closed';
-}
-function menuItemRemoteActionState(item) {
-    if (item.remoteAction !== true)
-        return undefined;
-    if (item.remoteActionLoading === true &&
-        normalizedDisabledReason(item.remoteActionError) === '') {
-        return 'pending';
-    }
-    if (item.remoteActionDisabled === true ||
-        item.disabled === true ||
-        normalizedDisabledReason(item.remoteActionError) !== '') {
-        return 'disabled';
-    }
-    return 'available';
-}
-function menuItemSubmenuState(item) {
-    if (item.kind !== 'submenu')
-        return undefined;
-    if (item.submenuLoading === true)
-        return 'loading';
-    if (normalizedDisabledReason(item.submenuError) !== '')
-        return 'error';
-    if (item.expanded === true)
-        return 'open';
-    if ((item.submenuItemCount ?? 0) > 0)
-        return 'ready';
-    return 'closed';
-}
-function menuItemRole(kind) {
-    if (kind === 'checkbox')
-        return 'menuitemcheckbox';
-    if (kind === 'radio')
-        return 'menuitemradio';
-    return 'menuitem';
-}
-function stepStatus(item, currentId) {
-    if (item.disabled === true)
-        return 'disabled';
-    if (item.status !== undefined)
-        return item.status;
-    if (item.id === currentId)
-        return 'current';
-    return 'pending';
-}
-function stepsTimelineValidationItemContract(item, options) {
-    const timelineState = options.current
-        ? 'current'
-        : options.currentIndex >= 0 && options.index < options.currentIndex
-            ? 'past'
-            : options.completed
-                ? 'past'
-                : 'future';
-    const blockingReason = options.blockingReason || normalizedDisabledReason(item.blockingReason);
-    const validationState = blockingReason !== ''
-        ? 'blocked'
-        : (options.validationState ??
-            item.validationState ??
-            (options.completed ? 'valid' : 'unchecked'));
-    const returnable = options.returnable && !options.current && item.disabled !== true;
-    const returnState = options.current
-        ? 'current'
-        : returnable
-            ? 'returnable'
-            : 'locked';
-    const contractItem = {
-        ...item,
-        timelineIndex: options.index,
-        timelineState,
-        validationState,
-        ...(blockingReason === '' ? {} : { blockingReason }),
-        returnState,
-        ...(returnable ? { returnable: true } : {}),
-        ...(options.previousStepId === '' ? {} : { previousStepId: options.previousStepId }),
-        ...(options.nextStepId === '' ? {} : { nextStepId: options.nextStepId }),
-        ...(validationState === 'blocked' ? { disabled: true } : {}),
-        ...(validationState === 'blocked' || validationState === 'invalid'
-            ? { status: validationState === 'invalid' ? 'error' : 'disabled' }
-            : {}),
-    };
-    return {
-        id: item.id,
-        item: contractItem,
-        timelineIndex: options.index,
-        timelineState,
-        validationState,
-        blockingReason,
-        returnState,
-        previousStepId: options.previousStepId,
-        nextStepId: options.nextStepId,
-        attrs: {
-            'data-step-id': item.id,
-            'data-timeline-index': options.index,
-            'data-timeline-state': timelineState,
-            'data-previous-step-id': options.previousStepId,
-            'data-next-step-id': options.nextStepId,
-            'data-validation-state': validationState,
-            'data-blocking-reason': blockingReason,
-            'data-return-state': returnState,
-            'data-returnable': returnable ? 'true' : undefined,
-            'aria-invalid': validationState === 'invalid' ? 'true' : undefined,
-            'aria-disabled': validationState === 'blocked' ? 'true' : undefined,
-        },
-    };
-}
-function stepsTimelineValidationState(options) {
-    if (options.stepCount === 0)
-        return 'empty';
-    if (options.blockedCount > 0)
-        return 'blocked';
-    if (options.invalidCount > 0)
-        return 'invalid';
-    if (options.warningCount > 0)
-        return 'warning';
-    return 'ready';
-}
-function createStepTriggerPlan(item, currentId, clickable = false) {
-    const status = stepStatus(item, currentId);
-    const active = item.id === currentId;
-    const interactive = clickable && item.disabled !== true;
-    const tag = interactive ? (item.href === undefined ? 'button' : 'a') : 'span';
-    return createUiDomPlan(tag, 'step-trigger', {
-        ...(item.disabled === undefined ? {} : { disabled: item.disabled }),
-        state: status,
-        attrs: {
-            type: tag === 'button' ? 'button' : undefined,
-            href: tag === 'a' ? item.href : undefined,
-            tabindex: interactive ? 0 : undefined,
-            'aria-current': active ? 'step' : undefined,
-            'aria-disabled': item.disabled === true ? 'true' : undefined,
-            'data-step-id': item.id,
-            'data-label': item.label,
-            'data-status': status,
-            'data-clickable': interactive ? 'true' : undefined,
-            'data-timeline-index': item.timelineIndex,
-            'data-timeline-state': item.timelineState,
-            'data-previous-step-id': item.previousStepId,
-            'data-next-step-id': item.nextStepId,
-            'data-validation-state': item.validationState,
-            'data-blocking-reason': item.blockingReason,
-            'data-return-state': item.returnState,
-            'data-returnable': item.returnable === true ? 'true' : undefined,
-            'aria-invalid': item.validationState === 'invalid' ? 'true' : undefined,
-        },
-    });
-}
-function normalizedOpenIds(value) {
-    if (value === undefined)
-        return new Set();
-    return value instanceof Set ? value : new Set(value);
-}
-export function createNavListPlans(options) {
-    const groups = options.groups.map((group) => {
-        const items = group.items.map((item) => {
-            const state = item.disabled === true ? 'disabled' : item.active === true ? 'active' : 'idle';
-            const plan = createUiDomPlan(item.href === undefined ? 'button' : 'a', 'nav-list-item', {
-                state,
-                ...(item.disabled === undefined ? {} : { disabled: item.disabled }),
-                ...(item.href === undefined ? {} : { attrs: { href: item.href } }),
-            });
-            return {
-                ...plan,
-                itemId: item.id,
-                state,
-                ...(item.icon === undefined
-                    ? {}
-                    : {
-                        icon: createUiDomPlan('img', 'nav-list-icon', {
-                            attrs: { alt: '', 'data-icon': item.icon },
-                        }),
-                    }),
-                label: createUiDomPlan('span', 'nav-list-label', {
-                    ...(item.label === undefined ? {} : { attrs: { 'data-label': item.label } }),
-                }),
-                ...(item.badge === undefined
-                    ? {}
-                    : {
-                        badge: createUiDomPlan('span', 'nav-list-badge', {
-                            attrs: { 'data-label': String(item.badge) },
-                        }),
-                    }),
-            };
-        });
-        return {
-            ...createUiDomPlan('div', 'nav-list-group', {
-                attrs: { id: `${options.id}-group-${group.id}` },
-            }),
-            groupId: group.id,
-            title: createUiDomPlan('div', 'nav-list-group-title', {
-                attrs: { id: `${options.id}-group-${group.id}-title`, 'data-label': group.title },
-            }),
-            items,
-        };
-    });
-    return {
-        root: createUiDomPlan('nav', 'nav-list', {
-            ...(options.className === undefined ? {} : { className: options.className }),
-            attrs: { id: `${options.id}-nav`, ...options.attrs },
-        }),
-        groups,
-    };
-}