@viax.io/uxm 4.43.2 → 4.45.0

package/dist/ui/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"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"}

package/dist/ui/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ui/index.ts"],"sourcesContent":["export { AppSidebar, DEFAULT_SIDEBAR_ICON_COLORS } from './app-sidebar';\nexport type {\n  AppSidebarBrand,\n  AppSidebarIconColor,\n  AppSidebarNavItem,\n  AppSidebarProps,\n  AppSidebarSection,\n} from './app-sidebar';\nexport { AppTopBar } from './app-top-bar';\nexport type { AppTopBarProps } from './app-top-bar';\nexport { Avatar } from './avatar';\nexport type { AvatarProps, AvatarSize, AvatarType } from './avatar';\nexport { BackLink } from './back-link';\nexport type { BackLinkProps } from './back-link';\nexport { Badge } from './badge';\nexport type { BadgeMode, BadgeProps, BadgeType } from './badge';\nexport { Banner } from './banner';\nexport type { BannerProps, BannerVariant } from './banner';\nexport { BulkActionBar } from './bulk-action-bar';\nexport type { BulkAction, BulkActionBarProps } from './bulk-action-bar';\nexport { Breadcrumb } from './breadcrumb';\nexport type { BreadcrumbCrumb, BreadcrumbProps, BreadcrumbSeparator } from './breadcrumb';\nexport { ButtonDanger, ButtonGhost, ButtonPrimary, ButtonSecondary, ButtonTertiary } from './button';\nexport type { ButtonProps } from './button';\nexport { ButtonGroup } from './button-group';\nexport type { ButtonGroupOption, ButtonGroupProps } from './button-group';\nexport { ButtonIcon } from './button-icon';\nexport type { ButtonIconProps } from './button-icon';\nexport { ButtonWithIcon } from './button-with-icon';\nexport type { ButtonWithIconProps } from './button-with-icon';\nexport { Calendar } from './calendar';\nexport type { CalendarProps, CalendarValue } from './calendar';\nexport { Card } from './card';\nexport type { CardProps } from './card';\nexport { Checkbox } from './checkbox';\nexport type { CheckboxProps } from './checkbox';\nexport { Chip } from './chip';\nexport type { ChipMode, ChipProps } from './chip';\nexport { Cluster } from './cluster';\nexport type { ClusterProps } from './cluster';\nexport { CodeBlock, CodeEditor } from './code-editor';\nexport type { CodeBlockProps, CodeEditorProps } from './code-editor';\nexport { ComponentRow } from './component-row';\nexport type { ComponentRowProps } from './component-row';\nexport { ConfigComponentRow } from './config-component-row';\nexport type { ConfigComponentRowProps } from './config-component-row';\nexport { ConfigSegmentItem } from './config-segment-item';\nexport type { ConfigSegmentItemProps } from './config-segment-item';\nexport { ContentTooltip, Tooltip } from './tooltip';\nexport type { ContentTooltipProps, TooltipPlacement, TooltipProps } from './tooltip';\nexport { DataTable } from './data-table';\nexport type { DataTableColumn, DataTableDensity, DataTableProps } from './data-table';\nexport { DateInput } from './date-input';\nexport type { DateInputFormat, DateInputMode, DateInputProps } from './date-input';\nexport { DetailSection } from './detail-section';\nexport type { DetailSectionProps } from './detail-section';\nexport { Dialog } from './dialog';\nexport type { DialogProps } from './dialog';\nexport { Disclosure } from './disclosure';\nexport type { DisclosureProps } from './disclosure';\nexport { Divider } from './divider';\nexport type { DividerProps } from './divider';\nexport { EditableCell } from './editable-cell';\nexport type { EditableCellAlign, EditableCellOption, EditableCellProps, EditableCellSize, EditableCellType, EditableCellValue } from './editable-cell';\nexport { EmptyState } from './empty-state';\nexport type { EmptyStateProps } from './empty-state';\nexport { ErrorPage } from './error-page';\nexport type { ErrorPageProps } from './error-page';\nexport { ExplorerListItem } from './explorer-list-item';\nexport type { ExplorerListItemProps } from './explorer-list-item';\nexport { ExplorerSection } from './explorer-section';\nexport type { ExplorerSectionProps } from './explorer-section';\nexport { FieldError } from './field-error';\nexport type { FieldErrorProps } from './field-error';\nexport { FilterTabs } from './filter-tabs';\nexport type { FilterTabsOption, FilterTabsProps } from './filter-tabs';\nexport { Icon } from './icon';\nexport type { IconProps } from './icon';\nexport { IconButton } from './icon-button';\nexport type { IconButtonProps, IconButtonVariant } from './icon-button';\nexport { IconTile } from './icon-tile';\nexport type { IconTileProps } from './icon-tile';\nexport { LifecycleConnector } from './lifecycle-connector';\nexport type {\n  LifecycleConnectorArrowhead,\n  LifecycleConnectorProps,\n  LifecycleConnectorRouting,\n  LifecycleConnectorState,\n} from './lifecycle-connector';\nexport { LifecycleDropSlot } from './lifecycle-drop-slot';\nexport type {\n  LifecycleDropSlotProps,\n  LifecycleDropSlotShape,\n} from './lifecycle-drop-slot';\nexport { LifecycleEdgeLabel } from './lifecycle-edge-label';\nexport type {\n  LifecycleEdgeLabelProps,\n  LifecycleEdgeLabelVariant,\n} from './lifecycle-edge-label';\nexport { LifecycleGroupBox } from './lifecycle-group-box';\nexport type { LifecycleGroupBoxProps } from './lifecycle-group-box';\nexport { LifecycleMinimap } from './lifecycle-minimap';\nexport type {\n  LifecycleMinimapNode,\n  LifecycleMinimapProps,\n  LifecycleMinimapViewport,\n} from './lifecycle-minimap';\nexport { LifecycleNodeCard } from './lifecycle-node-card';\nexport type {\n  LifecycleNodeCardProps,\n  LifecycleNodeKind,\n} from './lifecycle-node-card';\nexport { LifecycleTerminal } from './lifecycle-terminal';\nexport type { LifecycleTerminalProps } from './lifecycle-terminal';\nexport { LifecycleZoomControl } from './lifecycle-zoom-control';\nexport type { LifecycleZoomControlProps } from './lifecycle-zoom-control';\nexport { MetaRow } from './meta-row';\nexport type { MetaRowProps } from './meta-row';\nexport { Modal } from './modal';\nexport type { ModalHeaderProps, ModalProps, ModalSectionProps, ModalSize } from './modal';\nexport { InlineAction } from './inline-action';\nexport type { InlineActionProps } from './inline-action';\nexport { InlineFilter } from './inline-filter';\nexport type { InlineFilterProps } from './inline-filter';\nexport { ColorInput, ColorInputPopover } from './color-input';\nexport type { ColorFormat, ColorInputPopoverProps, ColorInputProps } from './color-input';\nexport { InputWithIcon } from './input-with-icon';\nexport type { InputWithIconProps } from './input-with-icon';\nexport { Select, Textarea, TextInput } from './input';\nexport type { SelectProps, SelectSingleProps, SelectMultiProps, TextareaProps, TextInputProps } from './input';\nexport { LanguageSwitcher } from './language-switcher';\nexport type { LanguageSwitcherProps, LanguageSwitcherVariant } from './language-switcher';\nexport { Link } from './link';\nexport type { LinkProps, LinkUnderline } from './link';\nexport { List, ListItem } from './list';\nexport type { ListItemProps, ListProps } from './list';\nexport { SEARCHABLE_AUTO_THRESHOLD, Listbox, MultiListbox } from './listbox';\nexport type {\n  ListboxProps,\n  ListboxRenderItemState,\n  ListboxRenderTriggerState,\n  ListboxTriggerProps,\n  MultiListboxProps,\n} from './listbox';\nexport { DEFAULT_UXM_LOCALE, UxmLocaleProvider, useUxmLocale } from './locale';\nexport type { UxmLocaleProviderProps } from './locale';\nexport { Loader } from './loader';\nexport type { LoaderLayout, LoaderProps, LoaderVariant } from './loader';\nexport { Menu } from './menu';\nexport type {\n  MenuProps,\n  MenuItem,\n  MenuSeparator,\n  MenuEntry,\n  MenuTriggerProps,\n} from './menu';\nexport { NumberStepper } from './number-stepper';\nexport type { NumberStepperProps } from './number-stepper';\nexport { PageHeader } from './page-header';\nexport type { PageHeaderProps } from './page-header';\nexport { PageShell } from './page-shell';\nexport type { PageShellProps, PageShellVariant } from './page-shell';\nexport { CurrencyInput } from './currency-input';\nexport type { CurrencyInputProps, CurrencyValue } from './currency-input';\nexport { FileUpload } from './file-upload';\nexport type {\n  FileStatus,\n  FileUploadFileMeta,\n  FileUploadLabels,\n  FileUploadProps,\n  FileUploadState,\n} from './file-upload';\nexport { FormField } from './form-field';\nexport type { FormFieldLabelPosition, FormFieldLabelTint, FormFieldLabelVariant, FormFieldProps } from './form-field';\nexport { HoverTooltip } from './hover-tooltip';\nexport type { HoverTooltipProps } from './hover-tooltip';\nexport { NumberInput } from './number-input';\nexport type { NumberInputProps } from './number-input';\nexport { PasswordInput } from './password-input';\nexport type { PasswordInputProps } from './password-input';\nexport { PhoneInput } from './phone-input';\nexport type { PhoneInputProps, PhoneValue } from './phone-input';\nexport { TimeInput } from './time-input';\nexport type { TimeInputFormat, TimeInputProps } from './time-input';\nexport { PillSelect } from './pill-select';\nexport type { PillSelectProps } from './pill-select';\nexport { Popover } from './popover';\nexport type { PopoverPlacement, PopoverProps } from './popover';\nexport { ProgressBar } from './progress-bar';\nexport type { ProgressBarProps, ProgressBarVariant } from './progress-bar';\nexport { PropertyField, PropertyGrid } from './property-field';\nexport type { PropertyFieldProps, PropertyGridProps } from './property-field';\nexport { RadioGroup, RadioOption } from './radio-group';\nexport type { RadioGroupDirection, RadioGroupProps, RadioOptionProps } from './radio-group';\nexport { RangeSlider } from './range-slider';\nexport type { RangeSliderProps } from './range-slider';\nexport { ResponsiveGrid } from './responsive-grid';\nexport type { ResponsiveGridProps } from './responsive-grid';\nexport { SearchDropdown } from './search-dropdown';\nexport type { SearchDropdownOption, SearchDropdownProps } from './search-dropdown';\nexport { SideFlexpane } from './side-flexpane';\nexport type { SideFlexpaneProps } from './side-flexpane';\nexport { SectionHeader } from './section-header';\nexport type { SectionHeaderProps } from './section-header';\nexport { SegmentCard } from './segment-card';\nexport type { SegmentCardProps } from './segment-card';\nexport { SegmentRow } from './segment-row';\nexport type { SegmentRowProps } from './segment-row';\nexport { OptionList } from './option-list';\nexport type { OptionListItem, OptionListProps } from './option-list';\nexport { SidebarNavItem } from './sidebar-nav-item';\nexport type { SidebarNavItemProps } from './sidebar-nav-item';\nexport { SidebarNavTrigger } from './sidebar-nav-trigger';\nexport type {\n  SidebarNavTriggerCaptionPlacement,\n  SidebarNavTriggerProps,\n  SidebarNavTriggerVariant,\n} from './sidebar-nav-trigger';\nexport { Slider } from './slider';\nexport type { SliderProps } from './slider';\nexport { Stack } from './stack';\nexport type { StackProps } from './stack';\nexport { StatCard } from './stat-card';\nexport type { StatCardProps, StatCardTrend } from './stat-card';\nexport { Tabs } from './tabs';\nexport type { TabsOption, TabsProps } from './tabs';\nexport { TabsUnderline } from './tabs-underline';\nexport type { TabsUnderlineOption, TabsUnderlineProps } from './tabs-underline';\nexport { Tag } from './tag';\nexport type { TagProps, TagSize, TagType } from './tag';\nexport { Thumbnail } from './thumbnail';\nexport type { ThumbnailFit, ThumbnailProps } from './thumbnail';\nexport { TimelineEntry } from './timeline-entry';\nexport type { TimelineDotState, TimelineEntryProps } from './timeline-entry';\nexport { Toast, Toaster, toast } from './toast';\nexport type {\n  ToastPosition,\n  ToasterProps,\n  ToastProps,\n  ToastVariant,\n} from './toast';\nexport { TypeOverviewCard } from './type-overview-card';\nexport type { TypeOverviewCardProps } from './type-overview-card';\nexport { ToggleSwitch } from './toggle-switch';\nexport type { ToggleSwitchProps } from './toggle-switch';\nexport { ViewSwitcher } from './view-switcher';\nexport type { ViewSwitcherOption, ViewSwitcherProps } from './view-switcher';\n\n// Icon registry — useful for shell-style tooling that needs to enumerate icons,\n// surface them in a picker, or look one up by id.\nexport { ICONS, ICON_OPTIONS, getIcon } from '../lib/icons';\nexport type { IconDef } from '../lib/icons';\n"],"mappings":"AAAA,SAAS,YAAY,mCAAmC;AAQxD,SAAS,iBAAiB;AAE1B,SAAS,cAAc;AAEvB,SAAS,gBAAgB;AAEzB,SAAS,aAAa;AAEtB,SAAS,cAAc;AAEvB,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAE3B,SAAS,cAAc,aAAa,eAAe,iBAAiB,sBAAsB;AAE1F,SAAS,mBAAmB;AAE5B,SAAS,kBAAkB;AAE3B,SAAS,sBAAsB;AAE/B,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AAErB,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AAErB,SAAS,eAAe;AAExB,SAAS,WAAW,kBAAkB;AAEtC,SAAS,oBAAoB;AAE7B,SAAS,0BAA0B;AAEnC,SAAS,yBAAyB;AAElC,SAAS,gBAAgB,eAAe;AAExC,SAAS,iBAAiB;AAE1B,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAE9B,SAAS,cAAc;AAEvB,SAAS,kBAAkB;AAE3B,SAAS,eAAe;AAExB,SAAS,oBAAoB;AAE7B,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,SAAS,uBAAuB;AAEhC,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AAErB,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AAEzB,SAAS,0BAA0B;AAOnC,SAAS,yBAAyB;AAKlC,SAAS,0BAA0B;AAKnC,SAAS,yBAAyB;AAElC,SAAS,wBAAwB;AAMjC,SAAS,yBAAyB;AAKlC,SAAS,yBAAyB;AAElC,SAAS,4BAA4B;AAErC,SAAS,eAAe;AAExB,SAAS,aAAa;AAEtB,SAAS,oBAAoB;AAE7B,SAAS,oBAAoB;AAE7B,SAAS,YAAY,yBAAyB;AAE9C,SAAS,qBAAqB;AAE9B,SAAS,QAAQ,UAAU,iBAAiB;AAE5C,SAAS,wBAAwB;AAEjC,SAAS,YAAY;AAErB,SAAS,MAAM,gBAAgB;AAE/B,SAAS,2BAA2B,SAAS,oBAAoB;AAQjE,SAAS,oBAAoB,mBAAmB,oBAAoB;AAEpE,SAAS,cAAc;AAEvB,SAAS,YAAY;AAQrB,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAQ3B,SAAS,iBAAiB;AAE1B,SAAS,oBAAoB;AAE7B,SAAS,mBAAmB;AAE5B,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB;AAE1B,SAAS,kBAAkB;AAE3B,SAAS,eAAe;AAExB,SAAS,mBAAmB;AAE5B,SAAS,eAAe,oBAAoB;AAE5C,SAAS,YAAY,mBAAmB;AAExC,SAAS,mBAAmB;AAE5B,SAAS,sBAAsB;AAE/B,SAAS,sBAAsB;AAE/B,SAAS,oBAAoB;AAE7B,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAE5B,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,sBAAsB;AAE/B,SAAS,yBAAyB;AAMlC,SAAS,cAAc;AAEvB,SAAS,aAAa;AAEtB,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AAErB,SAAS,qBAAqB;AAE9B,SAAS,WAAW;AAEpB,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAE9B,SAAS,OAAO,SAAS,aAAa;AAOtC,SAAS,wBAAwB;AAEjC,SAAS,oBAAoB;AAE7B,SAAS,oBAAoB;AAK7B,SAAS,OAAO,cAAc,eAAe;","names":[]}
+{"version":3,"sources":["../../src/ui/index.ts"],"sourcesContent":["export { AppSidebar, DEFAULT_SIDEBAR_ICON_COLORS } from './app-sidebar';\nexport type {\n  AppSidebarBrand,\n  AppSidebarIconColor,\n  AppSidebarNavItem,\n  AppSidebarProps,\n  AppSidebarSection,\n} from './app-sidebar';\nexport { AppTopBar } from './app-top-bar';\nexport type { AppTopBarProps } from './app-top-bar';\nexport { Avatar } from './avatar';\nexport type { AvatarProps, AvatarSize, AvatarType } from './avatar';\nexport { BackLink } from './back-link';\nexport type { BackLinkProps } from './back-link';\nexport { Badge } from './badge';\nexport type { BadgeMode, BadgeProps, BadgeType } from './badge';\nexport { Banner } from './banner';\nexport type { BannerProps, BannerVariant } from './banner';\nexport { BulkActionBar } from './bulk-action-bar';\nexport type { BulkAction, BulkActionBarProps } from './bulk-action-bar';\nexport { Breadcrumb } from './breadcrumb';\nexport type { BreadcrumbCrumb, BreadcrumbProps, BreadcrumbSeparator } from './breadcrumb';\nexport { ButtonDanger, ButtonGhost, ButtonPrimary, ButtonSecondary, ButtonTertiary } from './button';\nexport type { ButtonProps } from './button';\nexport { ButtonGroup } from './button-group';\nexport type { ButtonGroupOption, ButtonGroupProps } from './button-group';\nexport { ButtonIcon } from './button-icon';\nexport type { ButtonIconProps } from './button-icon';\nexport { ButtonWithIcon } from './button-with-icon';\nexport type { ButtonWithIconProps } from './button-with-icon';\nexport { Calendar } from './calendar';\nexport type { CalendarProps, CalendarValue } from './calendar';\nexport { Card } from './card';\nexport type { CardProps } from './card';\nexport { Checkbox } from './checkbox';\nexport type { CheckboxProps } from './checkbox';\nexport { Chip } from './chip';\nexport type { ChipMode, ChipProps } from './chip';\nexport { Cluster } from './cluster';\nexport type { ClusterProps } from './cluster';\nexport { CodeBlock, CodeEditor } from './code-editor';\nexport type { CodeBlockProps, CodeEditorProps } from './code-editor';\nexport { ComponentRow } from './component-row';\nexport type { ComponentRowProps } from './component-row';\nexport { ConfigComponentRow } from './config-component-row';\nexport type { ConfigComponentRowProps } from './config-component-row';\nexport { ConfigSegmentItem } from './config-segment-item';\nexport type { ConfigSegmentItemProps } from './config-segment-item';\nexport { ContentTooltip, Tooltip } from './tooltip';\nexport type { ContentTooltipProps, TooltipPlacement, TooltipProps } from './tooltip';\nexport { DataTable } from './data-table';\nexport type { DataTableColumn, DataTableDensity, DataTableProps } from './data-table';\nexport { DateInput } from './date-input';\nexport type { DateInputFormat, DateInputMode, DateInputProps } from './date-input';\nexport { DetailSection } from './detail-section';\nexport type { DetailSectionProps } from './detail-section';\nexport { Dialog } from './dialog';\nexport type { DialogProps } from './dialog';\nexport { Disclosure } from './disclosure';\nexport type { DisclosureProps } from './disclosure';\nexport { Divider } from './divider';\nexport type { DividerProps } from './divider';\nexport { EditableCell } from './editable-cell';\nexport type { EditableCellAlign, EditableCellOption, EditableCellProps, EditableCellSize, EditableCellType, EditableCellValue } from './editable-cell';\nexport { EmptyState } from './empty-state';\nexport type { EmptyStateProps } from './empty-state';\nexport { ErrorPage } from './error-page';\nexport type { ErrorPageProps } from './error-page';\nexport { ExplorerListItem } from './explorer-list-item';\nexport type { ExplorerListItemProps } from './explorer-list-item';\nexport { ExplorerSection } from './explorer-section';\nexport type { ExplorerSectionProps } from './explorer-section';\nexport { FieldError } from './field-error';\nexport type { FieldErrorProps } from './field-error';\nexport { FilterTabs } from './filter-tabs';\nexport type { FilterTabsOption, FilterTabsProps } from './filter-tabs';\nexport { Icon } from './icon';\nexport type { IconProps } from './icon';\nexport { IconButton } from './icon-button';\nexport type { IconButtonProps, IconButtonVariant } from './icon-button';\nexport { IconTile } from './icon-tile';\nexport type { IconTileProps } from './icon-tile';\nexport { LifecycleConnector } from './lifecycle-connector';\nexport type {\n  LifecycleConnectorArrowhead,\n  LifecycleConnectorProps,\n  LifecycleConnectorRouting,\n  LifecycleConnectorState,\n} from './lifecycle-connector';\nexport { LifecycleDropSlot } from './lifecycle-drop-slot';\nexport type {\n  LifecycleDropSlotProps,\n  LifecycleDropSlotShape,\n} from './lifecycle-drop-slot';\nexport { LifecycleEdgeLabel } from './lifecycle-edge-label';\nexport type {\n  LifecycleEdgeLabelProps,\n  LifecycleEdgeLabelVariant,\n} from './lifecycle-edge-label';\nexport { LifecycleGroupBox } from './lifecycle-group-box';\nexport type { LifecycleGroupBoxProps } from './lifecycle-group-box';\nexport { LifecycleMinimap } from './lifecycle-minimap';\nexport type {\n  LifecycleMinimapNode,\n  LifecycleMinimapProps,\n  LifecycleMinimapViewport,\n} from './lifecycle-minimap';\nexport { LifecycleNodeCard } from './lifecycle-node-card';\nexport type {\n  LifecycleNodeCardProps,\n  LifecycleNodeKind,\n} from './lifecycle-node-card';\nexport { LifecycleTerminal } from './lifecycle-terminal';\nexport type { LifecycleTerminalProps } from './lifecycle-terminal';\nexport { LifecycleZoomControl } from './lifecycle-zoom-control';\nexport type { LifecycleZoomControlProps } from './lifecycle-zoom-control';\nexport { MetaRow } from './meta-row';\nexport type { MetaRowProps } from './meta-row';\nexport { Modal } from './modal';\nexport type { ModalHeaderProps, ModalProps, ModalSectionProps, ModalSize } from './modal';\nexport { InlineAction } from './inline-action';\nexport type { InlineActionProps } from './inline-action';\nexport { InlineFilter } from './inline-filter';\nexport type { InlineFilterProps } from './inline-filter';\nexport { ColorInput, ColorInputPopover } from './color-input';\nexport type { ColorFormat, ColorInputPopoverProps, ColorInputProps } from './color-input';\nexport { InputWithIcon } from './input-with-icon';\nexport type { InputWithIconProps } from './input-with-icon';\nexport { Select, Textarea, TextInput } from './input';\nexport type { SelectProps, SelectSingleProps, SelectMultiProps, TextareaProps, TextInputProps } from './input';\nexport { LanguageSwitcher } from './language-switcher';\nexport type { LanguageSwitcherProps, LanguageSwitcherVariant } from './language-switcher';\nexport { Link } from './link';\nexport type { LinkProps, LinkUnderline } from './link';\nexport { List, ListItem } from './list';\nexport type { ListItemProps, ListProps, ListVariant } from './list';\nexport { SEARCHABLE_AUTO_THRESHOLD, Listbox, MultiListbox } from './listbox';\nexport type {\n  ListboxProps,\n  ListboxRenderItemState,\n  ListboxRenderTriggerState,\n  ListboxTriggerProps,\n  MultiListboxProps,\n} from './listbox';\nexport { DEFAULT_UXM_LOCALE, UxmLocaleProvider, useUxmLocale } from './locale';\nexport type { UxmLocaleProviderProps } from './locale';\nexport { Loader } from './loader';\nexport type { LoaderLayout, LoaderProps, LoaderVariant } from './loader';\nexport { Menu } from './menu';\nexport type {\n  MenuProps,\n  MenuItem,\n  MenuSeparator,\n  MenuEntry,\n  MenuTriggerProps,\n} from './menu';\nexport { NumberStepper } from './number-stepper';\nexport type { NumberStepperProps } from './number-stepper';\nexport { PageHeader } from './page-header';\nexport type { PageHeaderProps } from './page-header';\nexport { PageShell } from './page-shell';\nexport type { PageShellProps, PageShellVariant } from './page-shell';\nexport { CurrencyInput } from './currency-input';\nexport type { CurrencyInputProps, CurrencyValue } from './currency-input';\nexport { FileUpload } from './file-upload';\nexport type {\n  FileStatus,\n  FileUploadFileMeta,\n  FileUploadLabels,\n  FileUploadProps,\n  FileUploadState,\n} from './file-upload';\nexport { FormField } from './form-field';\nexport type { FormFieldLabelPosition, FormFieldLabelTint, FormFieldLabelVariant, FormFieldProps } from './form-field';\nexport { HoverTooltip } from './hover-tooltip';\nexport type { HoverTooltipProps } from './hover-tooltip';\nexport { NumberInput } from './number-input';\nexport type { NumberInputProps } from './number-input';\nexport { PasswordInput } from './password-input';\nexport type { PasswordInputProps } from './password-input';\nexport { PhoneInput } from './phone-input';\nexport type { PhoneInputProps, PhoneValue } from './phone-input';\nexport { TimeInput } from './time-input';\nexport type { TimeInputFormat, TimeInputProps } from './time-input';\nexport { PillSelect } from './pill-select';\nexport type { PillSelectProps } from './pill-select';\nexport { Popover } from './popover';\nexport type { PopoverPlacement, PopoverProps } from './popover';\nexport { ProgressBar } from './progress-bar';\nexport type { ProgressBarProps, ProgressBarVariant } from './progress-bar';\nexport { PropertyField, PropertyGrid } from './property-field';\nexport type { PropertyFieldProps, PropertyGridProps } from './property-field';\nexport { RadioGroup, RadioOption } from './radio-group';\nexport type { RadioGroupDirection, RadioGroupProps, RadioOptionProps } from './radio-group';\nexport { RangeSlider } from './range-slider';\nexport type { RangeSliderProps } from './range-slider';\nexport { ResponsiveGrid } from './responsive-grid';\nexport type { ResponsiveGridProps } from './responsive-grid';\nexport { SearchDropdown } from './search-dropdown';\nexport type { SearchDropdownOption, SearchDropdownProps } from './search-dropdown';\nexport { SideFlexpane } from './side-flexpane';\nexport type { SideFlexpaneProps } from './side-flexpane';\nexport { SectionHeader } from './section-header';\nexport type { SectionHeaderProps } from './section-header';\nexport { SegmentCard } from './segment-card';\nexport type { SegmentCardProps } from './segment-card';\nexport { SegmentRow } from './segment-row';\nexport type { SegmentRowProps } from './segment-row';\nexport { OptionList } from './option-list';\nexport type { OptionListItem, OptionListProps } from './option-list';\nexport { SidebarNavItem } from './sidebar-nav-item';\nexport type { SidebarNavItemProps } from './sidebar-nav-item';\nexport { SidebarNavTrigger } from './sidebar-nav-trigger';\nexport type {\n  SidebarNavTriggerCaptionPlacement,\n  SidebarNavTriggerProps,\n  SidebarNavTriggerVariant,\n} from './sidebar-nav-trigger';\nexport { Slider } from './slider';\nexport type { SliderProps } from './slider';\nexport { Stack } from './stack';\nexport type { StackProps } from './stack';\nexport { StatCard } from './stat-card';\nexport type { StatCardProps, StatCardTrend } from './stat-card';\nexport { Tabs } from './tabs';\nexport type { TabsOption, TabsProps } from './tabs';\nexport { TabsUnderline } from './tabs-underline';\nexport type { TabsUnderlineOption, TabsUnderlineProps } from './tabs-underline';\nexport { Tag } from './tag';\nexport type { TagProps, TagSize, TagType } from './tag';\nexport { Thumbnail } from './thumbnail';\nexport type { ThumbnailFit, ThumbnailProps } from './thumbnail';\nexport { TimelineEntry } from './timeline-entry';\nexport type { TimelineDotState, TimelineEntryProps } from './timeline-entry';\nexport { Toast, Toaster, toast } from './toast';\nexport type {\n  ToastPosition,\n  ToasterProps,\n  ToastProps,\n  ToastVariant,\n} from './toast';\nexport { TypeOverviewCard } from './type-overview-card';\nexport type { TypeOverviewCardProps } from './type-overview-card';\nexport { ToggleSwitch } from './toggle-switch';\nexport type { ToggleSwitchProps } from './toggle-switch';\nexport { ViewSwitcher } from './view-switcher';\nexport type { ViewSwitcherOption, ViewSwitcherProps } from './view-switcher';\n\n// Icon registry — useful for shell-style tooling that needs to enumerate icons,\n// surface them in a picker, or look one up by id.\nexport { ICONS, ICON_OPTIONS, getIcon } from '../lib/icons';\nexport type { IconDef } from '../lib/icons';\n"],"mappings":"AAAA,SAAS,YAAY,mCAAmC;AAQxD,SAAS,iBAAiB;AAE1B,SAAS,cAAc;AAEvB,SAAS,gBAAgB;AAEzB,SAAS,aAAa;AAEtB,SAAS,cAAc;AAEvB,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAE3B,SAAS,cAAc,aAAa,eAAe,iBAAiB,sBAAsB;AAE1F,SAAS,mBAAmB;AAE5B,SAAS,kBAAkB;AAE3B,SAAS,sBAAsB;AAE/B,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AAErB,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AAErB,SAAS,eAAe;AAExB,SAAS,WAAW,kBAAkB;AAEtC,SAAS,oBAAoB;AAE7B,SAAS,0BAA0B;AAEnC,SAAS,yBAAyB;AAElC,SAAS,gBAAgB,eAAe;AAExC,SAAS,iBAAiB;AAE1B,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAE9B,SAAS,cAAc;AAEvB,SAAS,kBAAkB;AAE3B,SAAS,eAAe;AAExB,SAAS,oBAAoB;AAE7B,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,SAAS,uBAAuB;AAEhC,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AAErB,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AAEzB,SAAS,0BAA0B;AAOnC,SAAS,yBAAyB;AAKlC,SAAS,0BAA0B;AAKnC,SAAS,yBAAyB;AAElC,SAAS,wBAAwB;AAMjC,SAAS,yBAAyB;AAKlC,SAAS,yBAAyB;AAElC,SAAS,4BAA4B;AAErC,SAAS,eAAe;AAExB,SAAS,aAAa;AAEtB,SAAS,oBAAoB;AAE7B,SAAS,oBAAoB;AAE7B,SAAS,YAAY,yBAAyB;AAE9C,SAAS,qBAAqB;AAE9B,SAAS,QAAQ,UAAU,iBAAiB;AAE5C,SAAS,wBAAwB;AAEjC,SAAS,YAAY;AAErB,SAAS,MAAM,gBAAgB;AAE/B,SAAS,2BAA2B,SAAS,oBAAoB;AAQjE,SAAS,oBAAoB,mBAAmB,oBAAoB;AAEpE,SAAS,cAAc;AAEvB,SAAS,YAAY;AAQrB,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAQ3B,SAAS,iBAAiB;AAE1B,SAAS,oBAAoB;AAE7B,SAAS,mBAAmB;AAE5B,SAAS,qBAAqB;AAE9B,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB;AAE1B,SAAS,kBAAkB;AAE3B,SAAS,eAAe;AAExB,SAAS,mBAAmB;AAE5B,SAAS,eAAe,oBAAoB;AAE5C,SAAS,YAAY,mBAAmB;AAExC,SAAS,mBAAmB;AAE5B,SAAS,sBAAsB;AAE/B,SAAS,sBAAsB;AAE/B,SAAS,oBAAoB;AAE7B,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAE5B,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAE3B,SAAS,sBAAsB;AAE/B,SAAS,yBAAyB;AAMlC,SAAS,cAAc;AAEvB,SAAS,aAAa;AAEtB,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AAErB,SAAS,qBAAqB;AAE9B,SAAS,WAAW;AAEpB,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAE9B,SAAS,OAAO,SAAS,aAAa;AAOtC,SAAS,wBAAwB;AAEjC,SAAS,oBAAoB;AAE7B,SAAS,oBAAoB;AAK7B,SAAS,OAAO,cAAc,eAAe;","names":[]}

package/dist/ui/list/list-item-preview.cjs

@@ -69,7 +69,8 @@ function StaticShowcase({
   mode,
   state,
   showValue,
-  leading
+  leading,
+  container
 }) {
   const isInteractive = mode === "interactive";
   const isActive = isInteractive && state === "active";
@@ -82,7 +83,7 @@ function StaticShowcase({
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uxm-list-item__trailing", children: trailingForMode(mode, "Verified", "success") })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui2.List, { children: isInteractive ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui2.List, { variant: container, children: isInteractive ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "button",
     {
       type: "button",
@@ -121,6 +122,7 @@ function ListItemPreview({ styles, variants }) {
   const state = variants.state ?? "default";
   const showValue = (variants.value ?? "shown") === "shown";
   const leading = variants.leading ?? "icon";
+  const container = variants.container ?? "card";
   const [activeKey, setActiveKey] = (0, import_react.useState)("plan");
   const cssVars = buildVars(styles);
   const sectionLabel = {
@@ -136,11 +138,11 @@ function ListItemPreview({ styles, variants }) {
         state,
         " state"
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StaticShowcase, { mode, state, showValue, leading })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StaticShowcase, { mode, state, showValue, leading, container })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { borderTop: "1px solid var(--color-border)", paddingTop: 16 }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: sectionLabel, children: mode === "interactive" ? "Interactive" : "Static" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui2.List, { children: ROWS.map((row, i) => {
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui2.List, { variant: container, children: ROWS.map((row, i) => {
         const isInteractive = mode === "interactive";
         return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_ui2.ListItem,

package/dist/ui/list/list-item-preview.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/ui/list/list-item-preview.tsx"],"sourcesContent":["import { useState, type CSSProperties, type ReactNode } from 'react';\n\nimport { cn } from '@/helpers';\nimport type { PreviewProps } from '@/previews/types';\nimport { Icon, IconTile } from '@/ui';\nimport { List, ListItem } from '@/ui';\nimport { Tag, type TagType } from '@/ui';\nimport { Thumbnail } from '@/ui';\n\nimport { LIST_ITEM_ICON_TILE_STYLE, LIST_ITEM_MEDIA_STYLE } from './list';\n\ntype Styles = PreviewProps['styles'];\ntype Mode = 'static' | 'interactive';\ntype Leading = 'icon' | 'media';\n\n/**\n * Project every registry knob as a `--uxm-list-item-*` custom property\n * on the wrapper. Both the static showcase and the interactive list\n * below read from the same vars; the showcase forces a state via the\n * `--state-*` modifier class while the interactive list exercises the\n * production `:hover` / `:focus-visible` / `:disabled` rules on real\n * pointer + keyboard.\n */\nfunction buildVars(styles: Styles): CSSProperties {\n  return {\n    '--uxm-list-item-inactive-bg': styles.inactiveBg as string,\n    '--uxm-list-item-inactive-text': styles.inactiveText as string,\n    '--uxm-list-item-hover-bg': styles.hoverBg as string,\n    '--uxm-list-item-hover-text': styles.hoverText as string,\n    '--uxm-list-item-focus-text': styles.focusText as string,\n    '--uxm-list-item-focus-ring': styles.focusRing as string,\n    '--uxm-list-item-active-bg': styles.activeBg as string,\n    '--uxm-list-item-active-text': styles.activeText as string,\n    '--uxm-list-item-disabled-bg': styles.disabledBg as string,\n    '--uxm-list-item-disabled-text': styles.disabledText as string,\n    '--uxm-list-item-disabled-opacity':\n      styles.disabledOpacity != null ? String(styles.disabledOpacity) : undefined,\n    '--uxm-list-item-border-color': styles.borderColor as string,\n    '--uxm-list-item-border-radius': `${styles.borderRadius}px`,\n    '--uxm-list-item-padding-x': `${styles.paddingX}px`,\n    '--uxm-list-item-padding-y': `${styles.paddingY}px`,\n    '--uxm-list-item-gap': `${styles.gap}px`,\n    '--uxm-list-item-font-size': `${styles.fontSize}px`,\n    '--uxm-list-item-value-color': styles.valueColor as string,\n    '--uxm-list-item-value-size': `${styles.valueSize}px`,\n    '--uxm-list-item-icon-bg': styles.iconBg as string,\n    '--uxm-list-item-icon-color': styles.iconColor as string,\n    '--uxm-list-item-icon-size': `${styles.iconSize}px`,\n    '--uxm-list-item-icon-radius': `${styles.iconRadius}px`,\n    '--uxm-list-item-media-size': `${styles.mediaSize}px`,\n    '--uxm-list-item-chevron-color': styles.chevronColor as string,\n  } as CSSProperties;\n}\n\n/**\n * The demo media node for the `leading: \"media\"` variant — a `Thumbnail`\n * with no `src`, so it renders the atom's own placeholder instead of\n * reaching for a network image the canvas may not be able to load. It\n * tracks the Media Size knob because the slot forwards\n * `--uxm-list-item-media-size` into `--uxm-thumbnail-size`\n * (`LIST_ITEM_MEDIA_STYLE`), so the frame AND its placeholder glyph scale\n * together — the row owns the leading geometry, the media owns its surface.\n * `alt=\"\"` because the row's title is the accessible name; a described\n * image here would be concatenated into it.\n */\nconst DEMO_MEDIA = <Thumbnail alt=\"\" />;\n\n/**\n * Pick the canonical trailing element for the given mode. The trailing\n * slot is `ReactNode` on the atom — consumers can pass anything (Tag,\n * Badge, Avatar, custom node). The preview demos the canonical patterns:\n *   - interactive → chevron icon (the \"tap to drill in\" affordance)\n *   - static → Tag (status indicator for an info row)\n */\nfunction trailingForMode(\n  mode: Mode,\n  meta: string,\n  tagType: TagType,\n): ReactNode {\n  if (mode === 'interactive') {\n    // Color inherits via `currentColor` from `.uxm-list-item__trailing`,\n    // which reads `--uxm-list-item-chevron-color`. Keeps saves working\n    // (the var has a single source of truth instead of an inline JS\n    // override that would shadow it after save).\n    return <Icon glyph=\"chevron-right\" size={16} />;\n  }\n  return <Tag type={tagType}>{meta}</Tag>;\n}\n\n/**\n * Static showcase — ONE row, rendering matches the `mode` variant.\n *   - `interactive` → `<button>` with the forced-state class so all\n *     state CSS rules can apply (inert via pointer-events: none and\n *     tabIndex={-1}, so the forced state isn't overridden by real\n *     input).\n *   - `static` → `<div>` with no state class. State CSS rules are\n *     scoped to button/anchor element selectors and don't fire on\n *     divs, so the static row stays truly static.\n *\n * Hand-rendered because the atom doesn't expose a way to set the\n * showcase-only `--state-*` modifier class.\n */\nfunction StaticShowcase({\n  mode,\n  state,\n  showValue,\n  leading,\n}: {\n  mode: Mode;\n  state: string;\n  showValue: boolean;\n  leading: Leading;\n}) {\n  const isInteractive = mode === 'interactive';\n  const isActive = isInteractive && state === 'active';\n  const isDisabled = state === 'disabled';\n  const inner = (\n    <>\n      {/* Mirrors the atom's leading slot: an IconTile sized/coloured from the\n          same forwarded knob vars (glyph size comes from the tile var), or the\n          un-tiled media span when the Leading variant selects it. */}\n      {leading === 'media' ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {DEMO_MEDIA}\n        </span>\n      ) : (\n        <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n          <Icon glyph=\"square\" />\n        </IconTile>\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">Owner</span>\n        {showValue && <span className=\"uxm-list-item__value\">Alex Morgan</span>}\n      </span>\n      <span className=\"uxm-list-item__trailing\">\n        {trailingForMode(mode, 'Verified', 'success')}\n      </span>\n    </>\n  );\n\n  return (\n    <List>\n      {isInteractive ? (\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          disabled={isDisabled}\n          aria-pressed={isActive}\n          className={cn(\n            'uxm-list-item',\n            isActive && 'uxm-list-item--active',\n            state === 'hover' && 'uxm-list-item--state-hover',\n            state === 'focus' && 'uxm-list-item--state-focus',\n          )}\n          style={{ pointerEvents: 'none' }}\n        >\n          {inner}\n        </button>\n      ) : (\n        <div\n          className=\"uxm-list-item\"\n          {...(isDisabled ? { 'aria-disabled': true } : {})}\n        >\n          {inner}\n        </div>\n      )}\n    </List>\n  );\n}\n\nconst ROWS: Array<{\n  key: string;\n  title: string;\n  value: string;\n  meta: string;\n  tagType: TagType;\n}> = [\n  // One row per Tag type, with a label that matches the type's\n  // semantic meaning — so two tags never read the same word with\n  // different visual treatments.\n  { key: 'plan', title: 'Plan', value: 'Enterprise', meta: 'Pro', tagType: 'accent' },\n  { key: 'billing', title: 'Billing', value: 'Visa •• 4242', meta: 'Action needed', tagType: 'warning' },\n  { key: 'owner', title: 'Owner', value: 'Alex Morgan', meta: 'Verified', tagType: 'success' },\n  { key: 'activity', title: 'Last activity', value: '2 hours ago', meta: 'Recent', tagType: 'neutral' },\n];\n\nexport function ListItemPreview({ styles, variants }: PreviewProps) {\n  const mode = ((variants.mode as string) ?? 'interactive') as Mode;\n  const state = (variants.state as string) ?? 'default';\n  const showValue = ((variants.value as string) ?? 'shown') === 'shown';\n  const leading = ((variants.leading as string) ?? 'icon') as Leading;\n  const [activeKey, setActiveKey] = useState<string>('plan');\n  const cssVars = buildVars(styles);\n\n  const sectionLabel = {\n    fontSize: 11,\n    color: 'var(--color-text-muted)',\n    marginBottom: 12,\n    letterSpacing: 0.5,\n    textTransform: 'uppercase' as const,\n  };\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 32, minWidth: 380, ...cssVars } as CSSProperties}>\n      <div>\n        <div style={sectionLabel}>{state} state</div>\n        <StaticShowcase mode={mode} state={state} showValue={showValue} leading={leading} />\n      </div>\n\n      {/* List — interactivity is driven by the `mode` variant. Trailing\n          slot is set by the preview to the canonical example for each\n          mode: chevron for interactive (the \"tap to drill in\" cue),\n          Tag for static (status indicator).\n          interactive → all rows render as <button>; the State dropdown\n          carries through to `disabled` (applied to the second row),\n          and real `:hover` / `:focus-visible` exercise the production\n          CSS via the projected vars above.\n          static → all rows render as <div>; the interactive states\n          (hover / focus / active) are filtered out of the State picker\n          via the registry's showWhen. `disabled` still applies to divs\n          via `[aria-disabled]`. */}\n      <div style={{ borderTop: '1px solid var(--color-border)', paddingTop: 16 }}>\n        <div style={sectionLabel}>{mode === 'interactive' ? 'Interactive' : 'Static'}</div>\n        <List>\n          {ROWS.map((row, i) => {\n            const isInteractive = mode === 'interactive';\n            return (\n              <ListItem\n                key={row.key}\n                interactive={isInteractive}\n                active={isInteractive && row.key === activeKey}\n                // Disabled is a visual treatment that applies to both\n                // interactive rows (CSS `:disabled` / `[aria-disabled]`)\n                // and static rows (`[aria-disabled]` on `<div>`).\n                disabled={state === 'disabled' && i === 1}\n                {...(leading === 'media'\n                  ? { media: DEMO_MEDIA }\n                  : { icon: <Icon glyph=\"square\" /> })}\n                value={showValue ? row.value : undefined}\n                trailing={trailingForMode(mode, row.meta, row.tagType)}\n                onClick={isInteractive ? () => setActiveKey(row.key) : undefined}\n              >\n                {row.title}\n              </ListItem>\n            );\n          })}\n        </List>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiEmB;AAjEnB,mBAA6D;AAE7D,qBAAmB;AAEnB,gBAA+B;AAC/B,IAAAA,aAA+B;AAC/B,IAAAA,aAAkC;AAClC,IAAAA,aAA0B;AAE1B,kBAAiE;AAcjE,SAAS,UAAU,QAA+B;AAChD,SAAO;AAAA,IACL,+BAA+B,OAAO;AAAA,IACtC,iCAAiC,OAAO;AAAA,IACxC,4BAA4B,OAAO;AAAA,IACnC,8BAA8B,OAAO;AAAA,IACrC,8BAA8B,OAAO;AAAA,IACrC,8BAA8B,OAAO;AAAA,IACrC,6BAA6B,OAAO;AAAA,IACpC,+BAA+B,OAAO;AAAA,IACtC,+BAA+B,OAAO;AAAA,IACtC,iCAAiC,OAAO;AAAA,IACxC,oCACE,OAAO,mBAAmB,OAAO,OAAO,OAAO,eAAe,IAAI;AAAA,IACpE,gCAAgC,OAAO;AAAA,IACvC,iCAAiC,GAAG,OAAO,YAAY;AAAA,IACvD,6BAA6B,GAAG,OAAO,QAAQ;AAAA,IAC/C,6BAA6B,GAAG,OAAO,QAAQ;AAAA,IAC/C,uBAAuB,GAAG,OAAO,GAAG;AAAA,IACpC,6BAA6B,GAAG,OAAO,QAAQ;AAAA,IAC/C,+BAA+B,OAAO;AAAA,IACtC,8BAA8B,GAAG,OAAO,SAAS;AAAA,IACjD,2BAA2B,OAAO;AAAA,IAClC,8BAA8B,OAAO;AAAA,IACrC,6BAA6B,GAAG,OAAO,QAAQ;AAAA,IAC/C,+BAA+B,GAAG,OAAO,UAAU;AAAA,IACnD,8BAA8B,GAAG,OAAO,SAAS;AAAA,IACjD,iCAAiC,OAAO;AAAA,EAC1C;AACF;AAaA,MAAM,aAAa,4CAAC,wBAAU,KAAI,IAAG;AASrC,SAAS,gBACP,MACA,MACA,SACW;AACX,MAAI,SAAS,eAAe;AAK1B,WAAO,4CAAC,kBAAK,OAAM,iBAAgB,MAAM,IAAI;AAAA,EAC/C;AACA,SAAO,4CAAC,kBAAI,MAAM,SAAU,gBAAK;AACnC;AAeA,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,QAAM,gBAAgB,SAAS;AAC/B,QAAM,WAAW,iBAAiB,UAAU;AAC5C,QAAM,aAAa,UAAU;AAC7B,QAAM,QACJ,4EAIG;AAAA,gBAAY,UACX,4CAAC,UAAK,WAAU,wBAAuB,OAAO,mCAC3C,sBACH,IAEA,4CAAC,sBAAS,WAAU,uBAAsB,OAAO,uCAC/C,sDAAC,kBAAK,OAAM,UAAS,GACvB;AAAA,IAEF,6CAAC,UAAK,WAAU,0BACd;AAAA,kDAAC,UAAK,WAAU,wBAAuB,mBAAK;AAAA,MAC3C,aAAa,4CAAC,UAAK,WAAU,wBAAuB,yBAAW;AAAA,OAClE;AAAA,IACA,4CAAC,UAAK,WAAU,2BACb,0BAAgB,MAAM,YAAY,SAAS,GAC9C;AAAA,KACF;AAGF,SACE,4CAAC,mBACE,0BACC;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAU;AAAA,MACV,UAAU;AAAA,MACV,gBAAc;AAAA,MACd,eAAW;AAAA,QACT;AAAA,QACA,YAAY;AAAA,QACZ,UAAU,WAAW;AAAA,QACrB,UAAU,WAAW;AAAA,MACvB;AAAA,MACA,OAAO,EAAE,eAAe,OAAO;AAAA,MAE9B;AAAA;AAAA,EACH,IAEA;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACT,GAAI,aAAa,EAAE,iBAAiB,KAAK,IAAI,CAAC;AAAA,MAE9C;AAAA;AAAA,EACH,GAEJ;AAEJ;AAEA,MAAM,OAMD;AAAA;AAAA;AAAA;AAAA,EAIH,EAAE,KAAK,QAAQ,OAAO,QAAQ,OAAO,cAAc,MAAM,OAAO,SAAS,SAAS;AAAA,EAClF,EAAE,KAAK,WAAW,OAAO,WAAW,OAAO,0BAAgB,MAAM,iBAAiB,SAAS,UAAU;AAAA,EACrG,EAAE,KAAK,SAAS,OAAO,SAAS,OAAO,eAAe,MAAM,YAAY,SAAS,UAAU;AAAA,EAC3F,EAAE,KAAK,YAAY,OAAO,iBAAiB,OAAO,eAAe,MAAM,UAAU,SAAS,UAAU;AACtG;AAEO,SAAS,gBAAgB,EAAE,QAAQ,SAAS,GAAiB;AAClE,QAAM,OAAS,SAAS,QAAmB;AAC3C,QAAM,QAAS,SAAS,SAAoB;AAC5C,QAAM,aAAc,SAAS,SAAoB,aAAa;AAC9D,QAAM,UAAY,SAAS,WAAsB;AACjD,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAiB,MAAM;AACzD,QAAM,UAAU,UAAU,MAAM;AAEhC,QAAM,eAAe;AAAA,IACnB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,cAAc;AAAA,IACd,eAAe;AAAA,IACf,eAAe;AAAA,EACjB;AAEA,SACE,6CAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,eAAe,UAAU,KAAK,IAAI,UAAU,KAAK,GAAG,QAAQ,GACzF;AAAA,iDAAC,SACC;AAAA,mDAAC,SAAI,OAAO,cAAe;AAAA;AAAA,QAAM;AAAA,SAAM;AAAA,MACvC,4CAAC,kBAAe,MAAY,OAAc,WAAsB,SAAkB;AAAA,OACpF;AAAA,IAcA,6CAAC,SAAI,OAAO,EAAE,WAAW,iCAAiC,YAAY,GAAG,GACvE;AAAA,kDAAC,SAAI,OAAO,cAAe,mBAAS,gBAAgB,gBAAgB,UAAS;AAAA,MAC7E,4CAAC,mBACE,eAAK,IAAI,CAAC,KAAK,MAAM;AACpB,cAAM,gBAAgB,SAAS;AAC/B,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,aAAa;AAAA,YACb,QAAQ,iBAAiB,IAAI,QAAQ;AAAA,YAIrC,UAAU,UAAU,cAAc,MAAM;AAAA,YACvC,GAAI,YAAY,UACb,EAAE,OAAO,WAAW,IACpB,EAAE,MAAM,4CAAC,kBAAK,OAAM,UAAS,EAAG;AAAA,YACpC,OAAO,YAAY,IAAI,QAAQ;AAAA,YAC/B,UAAU,gBAAgB,MAAM,IAAI,MAAM,IAAI,OAAO;AAAA,YACrD,SAAS,gBAAgB,MAAM,aAAa,IAAI,GAAG,IAAI;AAAA,YAEtD,cAAI;AAAA;AAAA,UAdA,IAAI;AAAA,QAeX;AAAA,MAEJ,CAAC,GACH;AAAA,OACF;AAAA,KACF;AAEJ;","names":["import_ui"]}
+{"version":3,"sources":["../../../src/ui/list/list-item-preview.tsx"],"sourcesContent":["import { useState, type CSSProperties, type ReactNode } from 'react';\n\nimport { cn } from '@/helpers';\nimport type { PreviewProps } from '@/previews/types';\nimport { Icon, IconTile } from '@/ui';\nimport { List, ListItem, type ListVariant } from '@/ui';\nimport { Tag, type TagType } from '@/ui';\nimport { Thumbnail } from '@/ui';\n\nimport { LIST_ITEM_ICON_TILE_STYLE, LIST_ITEM_MEDIA_STYLE } from './list';\n\ntype Styles = PreviewProps['styles'];\ntype Mode = 'static' | 'interactive';\ntype Leading = 'icon' | 'media';\n\n/**\n * Project every registry knob as a `--uxm-list-item-*` custom property\n * on the wrapper. Both the static showcase and the interactive list\n * below read from the same vars; the showcase forces a state via the\n * `--state-*` modifier class while the interactive list exercises the\n * production `:hover` / `:focus-visible` / `:disabled` rules on real\n * pointer + keyboard.\n */\nfunction buildVars(styles: Styles): CSSProperties {\n  return {\n    '--uxm-list-item-inactive-bg': styles.inactiveBg as string,\n    '--uxm-list-item-inactive-text': styles.inactiveText as string,\n    '--uxm-list-item-hover-bg': styles.hoverBg as string,\n    '--uxm-list-item-hover-text': styles.hoverText as string,\n    '--uxm-list-item-focus-text': styles.focusText as string,\n    '--uxm-list-item-focus-ring': styles.focusRing as string,\n    '--uxm-list-item-active-bg': styles.activeBg as string,\n    '--uxm-list-item-active-text': styles.activeText as string,\n    '--uxm-list-item-disabled-bg': styles.disabledBg as string,\n    '--uxm-list-item-disabled-text': styles.disabledText as string,\n    '--uxm-list-item-disabled-opacity':\n      styles.disabledOpacity != null ? String(styles.disabledOpacity) : undefined,\n    '--uxm-list-item-border-color': styles.borderColor as string,\n    '--uxm-list-item-border-radius': `${styles.borderRadius}px`,\n    '--uxm-list-item-padding-x': `${styles.paddingX}px`,\n    '--uxm-list-item-padding-y': `${styles.paddingY}px`,\n    '--uxm-list-item-gap': `${styles.gap}px`,\n    '--uxm-list-item-font-size': `${styles.fontSize}px`,\n    '--uxm-list-item-value-color': styles.valueColor as string,\n    '--uxm-list-item-value-size': `${styles.valueSize}px`,\n    '--uxm-list-item-icon-bg': styles.iconBg as string,\n    '--uxm-list-item-icon-color': styles.iconColor as string,\n    '--uxm-list-item-icon-size': `${styles.iconSize}px`,\n    '--uxm-list-item-icon-radius': `${styles.iconRadius}px`,\n    '--uxm-list-item-media-size': `${styles.mediaSize}px`,\n    '--uxm-list-item-chevron-color': styles.chevronColor as string,\n  } as CSSProperties;\n}\n\n/**\n * The demo media node for the `leading: \"media\"` variant — a `Thumbnail`\n * with no `src`, so it renders the atom's own placeholder instead of\n * reaching for a network image the canvas may not be able to load. It\n * tracks the Media Size knob because the slot forwards\n * `--uxm-list-item-media-size` into `--uxm-thumbnail-size`\n * (`LIST_ITEM_MEDIA_STYLE`), so the frame AND its placeholder glyph scale\n * together — the row owns the leading geometry, the media owns its surface.\n * `alt=\"\"` because the row's title is the accessible name; a described\n * image here would be concatenated into it.\n */\nconst DEMO_MEDIA = <Thumbnail alt=\"\" />;\n\n/**\n * Pick the canonical trailing element for the given mode. The trailing\n * slot is `ReactNode` on the atom — consumers can pass anything (Tag,\n * Badge, Avatar, custom node). The preview demos the canonical patterns:\n *   - interactive → chevron icon (the \"tap to drill in\" affordance)\n *   - static → Tag (status indicator for an info row)\n */\nfunction trailingForMode(\n  mode: Mode,\n  meta: string,\n  tagType: TagType,\n): ReactNode {\n  if (mode === 'interactive') {\n    // Color inherits via `currentColor` from `.uxm-list-item__trailing`,\n    // which reads `--uxm-list-item-chevron-color`. Keeps saves working\n    // (the var has a single source of truth instead of an inline JS\n    // override that would shadow it after save).\n    return <Icon glyph=\"chevron-right\" size={16} />;\n  }\n  return <Tag type={tagType}>{meta}</Tag>;\n}\n\n/**\n * Static showcase — ONE row, rendering matches the `mode` variant.\n *   - `interactive` → `<button>` with the forced-state class so all\n *     state CSS rules can apply (inert via pointer-events: none and\n *     tabIndex={-1}, so the forced state isn't overridden by real\n *     input).\n *   - `static` → `<div>` with no state class. State CSS rules are\n *     scoped to button/anchor element selectors and don't fire on\n *     divs, so the static row stays truly static.\n *\n * Hand-rendered because the atom doesn't expose a way to set the\n * showcase-only `--state-*` modifier class.\n */\nfunction StaticShowcase({\n  mode,\n  state,\n  showValue,\n  leading,\n  container,\n}: {\n  mode: Mode;\n  state: string;\n  showValue: boolean;\n  leading: Leading;\n  container: ListVariant;\n}) {\n  const isInteractive = mode === 'interactive';\n  const isActive = isInteractive && state === 'active';\n  const isDisabled = state === 'disabled';\n  const inner = (\n    <>\n      {/* Mirrors the atom's leading slot: an IconTile sized/coloured from the\n          same forwarded knob vars (glyph size comes from the tile var), or the\n          un-tiled media span when the Leading variant selects it. */}\n      {leading === 'media' ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {DEMO_MEDIA}\n        </span>\n      ) : (\n        <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n          <Icon glyph=\"square\" />\n        </IconTile>\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">Owner</span>\n        {showValue && <span className=\"uxm-list-item__value\">Alex Morgan</span>}\n      </span>\n      <span className=\"uxm-list-item__trailing\">\n        {trailingForMode(mode, 'Verified', 'success')}\n      </span>\n    </>\n  );\n\n  return (\n    <List variant={container}>\n      {isInteractive ? (\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          disabled={isDisabled}\n          aria-pressed={isActive}\n          className={cn(\n            'uxm-list-item',\n            isActive && 'uxm-list-item--active',\n            state === 'hover' && 'uxm-list-item--state-hover',\n            state === 'focus' && 'uxm-list-item--state-focus',\n          )}\n          style={{ pointerEvents: 'none' }}\n        >\n          {inner}\n        </button>\n      ) : (\n        <div\n          className=\"uxm-list-item\"\n          {...(isDisabled ? { 'aria-disabled': true } : {})}\n        >\n          {inner}\n        </div>\n      )}\n    </List>\n  );\n}\n\nconst ROWS: Array<{\n  key: string;\n  title: string;\n  value: string;\n  meta: string;\n  tagType: TagType;\n}> = [\n  // One row per Tag type, with a label that matches the type's\n  // semantic meaning — so two tags never read the same word with\n  // different visual treatments.\n  { key: 'plan', title: 'Plan', value: 'Enterprise', meta: 'Pro', tagType: 'accent' },\n  { key: 'billing', title: 'Billing', value: 'Visa •• 4242', meta: 'Action needed', tagType: 'warning' },\n  { key: 'owner', title: 'Owner', value: 'Alex Morgan', meta: 'Verified', tagType: 'success' },\n  { key: 'activity', title: 'Last activity', value: '2 hours ago', meta: 'Recent', tagType: 'neutral' },\n];\n\nexport function ListItemPreview({ styles, variants }: PreviewProps) {\n  const mode = ((variants.mode as string) ?? 'interactive') as Mode;\n  const state = (variants.state as string) ?? 'default';\n  const showValue = ((variants.value as string) ?? 'shown') === 'shown';\n  const leading = ((variants.leading as string) ?? 'icon') as Leading;\n  const container = ((variants.container as string) ?? 'card') as ListVariant;\n  const [activeKey, setActiveKey] = useState<string>('plan');\n  const cssVars = buildVars(styles);\n\n  const sectionLabel = {\n    fontSize: 11,\n    color: 'var(--color-text-muted)',\n    marginBottom: 12,\n    letterSpacing: 0.5,\n    textTransform: 'uppercase' as const,\n  };\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 32, minWidth: 380, ...cssVars } as CSSProperties}>\n      <div>\n        <div style={sectionLabel}>{state} state</div>\n        <StaticShowcase mode={mode} state={state} showValue={showValue} leading={leading} container={container} />\n      </div>\n\n      {/* List — interactivity is driven by the `mode` variant. Trailing\n          slot is set by the preview to the canonical example for each\n          mode: chevron for interactive (the \"tap to drill in\" cue),\n          Tag for static (status indicator).\n          interactive → all rows render as <button>; the State dropdown\n          carries through to `disabled` (applied to the second row),\n          and real `:hover` / `:focus-visible` exercise the production\n          CSS via the projected vars above.\n          static → all rows render as <div>; the interactive states\n          (hover / focus / active) are filtered out of the State picker\n          via the registry's showWhen. `disabled` still applies to divs\n          via `[aria-disabled]`. */}\n      <div style={{ borderTop: '1px solid var(--color-border)', paddingTop: 16 }}>\n        <div style={sectionLabel}>{mode === 'interactive' ? 'Interactive' : 'Static'}</div>\n        <List variant={container}>\n          {ROWS.map((row, i) => {\n            const isInteractive = mode === 'interactive';\n            return (\n              <ListItem\n                key={row.key}\n                interactive={isInteractive}\n                active={isInteractive && row.key === activeKey}\n                // Disabled is a visual treatment that applies to both\n                // interactive rows (CSS `:disabled` / `[aria-disabled]`)\n                // and static rows (`[aria-disabled]` on `<div>`).\n                disabled={state === 'disabled' && i === 1}\n                {...(leading === 'media'\n                  ? { media: DEMO_MEDIA }\n                  : { icon: <Icon glyph=\"square\" /> })}\n                value={showValue ? row.value : undefined}\n                trailing={trailingForMode(mode, row.meta, row.tagType)}\n                onClick={isInteractive ? () => setActiveKey(row.key) : undefined}\n              >\n                {row.title}\n              </ListItem>\n            );\n          })}\n        </List>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":["import_ui"]}

package/dist/ui/list/list-item-preview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list-item-preview.d.ts","sourceRoot":"","sources":["../../../src/ui/list/list-item-preview.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAuLrD,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,YAAY,+BAgEjE"}
+{"version":3,"file":"list-item-preview.d.ts","sourceRoot":"","sources":["../../../src/ui/list/list-item-preview.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAyLrD,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,YAAY,+BAiEjE"}

package/dist/ui/list/list-item-preview.js

@@ -46,7 +46,8 @@ function StaticShowcase({
   mode,
   state,
   showValue,
-  leading
+  leading,
+  container
 }) {
   const isInteractive = mode === "interactive";
   const isActive = isInteractive && state === "active";
@@ -59,7 +60,7 @@ function StaticShowcase({
     ] }),
     /* @__PURE__ */ jsx("span", { className: "uxm-list-item__trailing", children: trailingForMode(mode, "Verified", "success") })
   ] });
-  return /* @__PURE__ */ jsx(List, { children: isInteractive ? /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(List, { variant: container, children: isInteractive ? /* @__PURE__ */ jsx(
     "button",
     {
       type: "button",
@@ -98,6 +99,7 @@ function ListItemPreview({ styles, variants }) {
   const state = variants.state ?? "default";
   const showValue = (variants.value ?? "shown") === "shown";
   const leading = variants.leading ?? "icon";
+  const container = variants.container ?? "card";
   const [activeKey, setActiveKey] = useState("plan");
   const cssVars = buildVars(styles);
   const sectionLabel = {
@@ -113,11 +115,11 @@ function ListItemPreview({ styles, variants }) {
         state,
         " state"
       ] }),
-      /* @__PURE__ */ jsx(StaticShowcase, { mode, state, showValue, leading })
+      /* @__PURE__ */ jsx(StaticShowcase, { mode, state, showValue, leading, container })
     ] }),
     /* @__PURE__ */ jsxs("div", { style: { borderTop: "1px solid var(--color-border)", paddingTop: 16 }, children: [
       /* @__PURE__ */ jsx("div", { style: sectionLabel, children: mode === "interactive" ? "Interactive" : "Static" }),
-      /* @__PURE__ */ jsx(List, { children: ROWS.map((row, i) => {
+      /* @__PURE__ */ jsx(List, { variant: container, children: ROWS.map((row, i) => {
         const isInteractive = mode === "interactive";
         return /* @__PURE__ */ jsx(
           ListItem,

package/dist/ui/list/list-item-preview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/ui/list/list-item-preview.tsx"],"sourcesContent":["import { useState, type CSSProperties, type ReactNode } from 'react';\n\nimport { cn } from '@/helpers';\nimport type { PreviewProps } from '@/previews/types';\nimport { Icon, IconTile } from '@/ui';\nimport { List, ListItem } from '@/ui';\nimport { Tag, type TagType } from '@/ui';\nimport { Thumbnail } from '@/ui';\n\nimport { LIST_ITEM_ICON_TILE_STYLE, LIST_ITEM_MEDIA_STYLE } from './list';\n\ntype Styles = PreviewProps['styles'];\ntype Mode = 'static' | 'interactive';\ntype Leading = 'icon' | 'media';\n\n/**\n * Project every registry knob as a `--uxm-list-item-*` custom property\n * on the wrapper. Both the static showcase and the interactive list\n * below read from the same vars; the showcase forces a state via the\n * `--state-*` modifier class while the interactive list exercises the\n * production `:hover` / `:focus-visible` / `:disabled` rules on real\n * pointer + keyboard.\n */\nfunction buildVars(styles: Styles): CSSProperties {\n  return {\n    '--uxm-list-item-inactive-bg': styles.inactiveBg as string,\n    '--uxm-list-item-inactive-text': styles.inactiveText as string,\n    '--uxm-list-item-hover-bg': styles.hoverBg as string,\n    '--uxm-list-item-hover-text': styles.hoverText as string,\n    '--uxm-list-item-focus-text': styles.focusText as string,\n    '--uxm-list-item-focus-ring': styles.focusRing as string,\n    '--uxm-list-item-active-bg': styles.activeBg as string,\n    '--uxm-list-item-active-text': styles.activeText as string,\n    '--uxm-list-item-disabled-bg': styles.disabledBg as string,\n    '--uxm-list-item-disabled-text': styles.disabledText as string,\n    '--uxm-list-item-disabled-opacity':\n      styles.disabledOpacity != null ? String(styles.disabledOpacity) : undefined,\n    '--uxm-list-item-border-color': styles.borderColor as string,\n    '--uxm-list-item-border-radius': `${styles.borderRadius}px`,\n    '--uxm-list-item-padding-x': `${styles.paddingX}px`,\n    '--uxm-list-item-padding-y': `${styles.paddingY}px`,\n    '--uxm-list-item-gap': `${styles.gap}px`,\n    '--uxm-list-item-font-size': `${styles.fontSize}px`,\n    '--uxm-list-item-value-color': styles.valueColor as string,\n    '--uxm-list-item-value-size': `${styles.valueSize}px`,\n    '--uxm-list-item-icon-bg': styles.iconBg as string,\n    '--uxm-list-item-icon-color': styles.iconColor as string,\n    '--uxm-list-item-icon-size': `${styles.iconSize}px`,\n    '--uxm-list-item-icon-radius': `${styles.iconRadius}px`,\n    '--uxm-list-item-media-size': `${styles.mediaSize}px`,\n    '--uxm-list-item-chevron-color': styles.chevronColor as string,\n  } as CSSProperties;\n}\n\n/**\n * The demo media node for the `leading: \"media\"` variant — a `Thumbnail`\n * with no `src`, so it renders the atom's own placeholder instead of\n * reaching for a network image the canvas may not be able to load. It\n * tracks the Media Size knob because the slot forwards\n * `--uxm-list-item-media-size` into `--uxm-thumbnail-size`\n * (`LIST_ITEM_MEDIA_STYLE`), so the frame AND its placeholder glyph scale\n * together — the row owns the leading geometry, the media owns its surface.\n * `alt=\"\"` because the row's title is the accessible name; a described\n * image here would be concatenated into it.\n */\nconst DEMO_MEDIA = <Thumbnail alt=\"\" />;\n\n/**\n * Pick the canonical trailing element for the given mode. The trailing\n * slot is `ReactNode` on the atom — consumers can pass anything (Tag,\n * Badge, Avatar, custom node). The preview demos the canonical patterns:\n *   - interactive → chevron icon (the \"tap to drill in\" affordance)\n *   - static → Tag (status indicator for an info row)\n */\nfunction trailingForMode(\n  mode: Mode,\n  meta: string,\n  tagType: TagType,\n): ReactNode {\n  if (mode === 'interactive') {\n    // Color inherits via `currentColor` from `.uxm-list-item__trailing`,\n    // which reads `--uxm-list-item-chevron-color`. Keeps saves working\n    // (the var has a single source of truth instead of an inline JS\n    // override that would shadow it after save).\n    return <Icon glyph=\"chevron-right\" size={16} />;\n  }\n  return <Tag type={tagType}>{meta}</Tag>;\n}\n\n/**\n * Static showcase — ONE row, rendering matches the `mode` variant.\n *   - `interactive` → `<button>` with the forced-state class so all\n *     state CSS rules can apply (inert via pointer-events: none and\n *     tabIndex={-1}, so the forced state isn't overridden by real\n *     input).\n *   - `static` → `<div>` with no state class. State CSS rules are\n *     scoped to button/anchor element selectors and don't fire on\n *     divs, so the static row stays truly static.\n *\n * Hand-rendered because the atom doesn't expose a way to set the\n * showcase-only `--state-*` modifier class.\n */\nfunction StaticShowcase({\n  mode,\n  state,\n  showValue,\n  leading,\n}: {\n  mode: Mode;\n  state: string;\n  showValue: boolean;\n  leading: Leading;\n}) {\n  const isInteractive = mode === 'interactive';\n  const isActive = isInteractive && state === 'active';\n  const isDisabled = state === 'disabled';\n  const inner = (\n    <>\n      {/* Mirrors the atom's leading slot: an IconTile sized/coloured from the\n          same forwarded knob vars (glyph size comes from the tile var), or the\n          un-tiled media span when the Leading variant selects it. */}\n      {leading === 'media' ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {DEMO_MEDIA}\n        </span>\n      ) : (\n        <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n          <Icon glyph=\"square\" />\n        </IconTile>\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">Owner</span>\n        {showValue && <span className=\"uxm-list-item__value\">Alex Morgan</span>}\n      </span>\n      <span className=\"uxm-list-item__trailing\">\n        {trailingForMode(mode, 'Verified', 'success')}\n      </span>\n    </>\n  );\n\n  return (\n    <List>\n      {isInteractive ? (\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          disabled={isDisabled}\n          aria-pressed={isActive}\n          className={cn(\n            'uxm-list-item',\n            isActive && 'uxm-list-item--active',\n            state === 'hover' && 'uxm-list-item--state-hover',\n            state === 'focus' && 'uxm-list-item--state-focus',\n          )}\n          style={{ pointerEvents: 'none' }}\n        >\n          {inner}\n        </button>\n      ) : (\n        <div\n          className=\"uxm-list-item\"\n          {...(isDisabled ? { 'aria-disabled': true } : {})}\n        >\n          {inner}\n        </div>\n      )}\n    </List>\n  );\n}\n\nconst ROWS: Array<{\n  key: string;\n  title: string;\n  value: string;\n  meta: string;\n  tagType: TagType;\n}> = [\n  // One row per Tag type, with a label that matches the type's\n  // semantic meaning — so two tags never read the same word with\n  // different visual treatments.\n  { key: 'plan', title: 'Plan', value: 'Enterprise', meta: 'Pro', tagType: 'accent' },\n  { key: 'billing', title: 'Billing', value: 'Visa •• 4242', meta: 'Action needed', tagType: 'warning' },\n  { key: 'owner', title: 'Owner', value: 'Alex Morgan', meta: 'Verified', tagType: 'success' },\n  { key: 'activity', title: 'Last activity', value: '2 hours ago', meta: 'Recent', tagType: 'neutral' },\n];\n\nexport function ListItemPreview({ styles, variants }: PreviewProps) {\n  const mode = ((variants.mode as string) ?? 'interactive') as Mode;\n  const state = (variants.state as string) ?? 'default';\n  const showValue = ((variants.value as string) ?? 'shown') === 'shown';\n  const leading = ((variants.leading as string) ?? 'icon') as Leading;\n  const [activeKey, setActiveKey] = useState<string>('plan');\n  const cssVars = buildVars(styles);\n\n  const sectionLabel = {\n    fontSize: 11,\n    color: 'var(--color-text-muted)',\n    marginBottom: 12,\n    letterSpacing: 0.5,\n    textTransform: 'uppercase' as const,\n  };\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 32, minWidth: 380, ...cssVars } as CSSProperties}>\n      <div>\n        <div style={sectionLabel}>{state} state</div>\n        <StaticShowcase mode={mode} state={state} showValue={showValue} leading={leading} />\n      </div>\n\n      {/* List — interactivity is driven by the `mode` variant. Trailing\n          slot is set by the preview to the canonical example for each\n          mode: chevron for interactive (the \"tap to drill in\" cue),\n          Tag for static (status indicator).\n          interactive → all rows render as <button>; the State dropdown\n          carries through to `disabled` (applied to the second row),\n          and real `:hover` / `:focus-visible` exercise the production\n          CSS via the projected vars above.\n          static → all rows render as <div>; the interactive states\n          (hover / focus / active) are filtered out of the State picker\n          via the registry's showWhen. `disabled` still applies to divs\n          via `[aria-disabled]`. */}\n      <div style={{ borderTop: '1px solid var(--color-border)', paddingTop: 16 }}>\n        <div style={sectionLabel}>{mode === 'interactive' ? 'Interactive' : 'Static'}</div>\n        <List>\n          {ROWS.map((row, i) => {\n            const isInteractive = mode === 'interactive';\n            return (\n              <ListItem\n                key={row.key}\n                interactive={isInteractive}\n                active={isInteractive && row.key === activeKey}\n                // Disabled is a visual treatment that applies to both\n                // interactive rows (CSS `:disabled` / `[aria-disabled]`)\n                // and static rows (`[aria-disabled]` on `<div>`).\n                disabled={state === 'disabled' && i === 1}\n                {...(leading === 'media'\n                  ? { media: DEMO_MEDIA }\n                  : { icon: <Icon glyph=\"square\" /> })}\n                value={showValue ? row.value : undefined}\n                trailing={trailingForMode(mode, row.meta, row.tagType)}\n                onClick={isInteractive ? () => setActiveKey(row.key) : undefined}\n              >\n                {row.title}\n              </ListItem>\n            );\n          })}\n        </List>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/ui/list/list-item-preview.tsx"],"sourcesContent":["import { useState, type CSSProperties, type ReactNode } from 'react';\n\nimport { cn } from '@/helpers';\nimport type { PreviewProps } from '@/previews/types';\nimport { Icon, IconTile } from '@/ui';\nimport { List, ListItem, type ListVariant } from '@/ui';\nimport { Tag, type TagType } from '@/ui';\nimport { Thumbnail } from '@/ui';\n\nimport { LIST_ITEM_ICON_TILE_STYLE, LIST_ITEM_MEDIA_STYLE } from './list';\n\ntype Styles = PreviewProps['styles'];\ntype Mode = 'static' | 'interactive';\ntype Leading = 'icon' | 'media';\n\n/**\n * Project every registry knob as a `--uxm-list-item-*` custom property\n * on the wrapper. Both the static showcase and the interactive list\n * below read from the same vars; the showcase forces a state via the\n * `--state-*` modifier class while the interactive list exercises the\n * production `:hover` / `:focus-visible` / `:disabled` rules on real\n * pointer + keyboard.\n */\nfunction buildVars(styles: Styles): CSSProperties {\n  return {\n    '--uxm-list-item-inactive-bg': styles.inactiveBg as string,\n    '--uxm-list-item-inactive-text': styles.inactiveText as string,\n    '--uxm-list-item-hover-bg': styles.hoverBg as string,\n    '--uxm-list-item-hover-text': styles.hoverText as string,\n    '--uxm-list-item-focus-text': styles.focusText as string,\n    '--uxm-list-item-focus-ring': styles.focusRing as string,\n    '--uxm-list-item-active-bg': styles.activeBg as string,\n    '--uxm-list-item-active-text': styles.activeText as string,\n    '--uxm-list-item-disabled-bg': styles.disabledBg as string,\n    '--uxm-list-item-disabled-text': styles.disabledText as string,\n    '--uxm-list-item-disabled-opacity':\n      styles.disabledOpacity != null ? String(styles.disabledOpacity) : undefined,\n    '--uxm-list-item-border-color': styles.borderColor as string,\n    '--uxm-list-item-border-radius': `${styles.borderRadius}px`,\n    '--uxm-list-item-padding-x': `${styles.paddingX}px`,\n    '--uxm-list-item-padding-y': `${styles.paddingY}px`,\n    '--uxm-list-item-gap': `${styles.gap}px`,\n    '--uxm-list-item-font-size': `${styles.fontSize}px`,\n    '--uxm-list-item-value-color': styles.valueColor as string,\n    '--uxm-list-item-value-size': `${styles.valueSize}px`,\n    '--uxm-list-item-icon-bg': styles.iconBg as string,\n    '--uxm-list-item-icon-color': styles.iconColor as string,\n    '--uxm-list-item-icon-size': `${styles.iconSize}px`,\n    '--uxm-list-item-icon-radius': `${styles.iconRadius}px`,\n    '--uxm-list-item-media-size': `${styles.mediaSize}px`,\n    '--uxm-list-item-chevron-color': styles.chevronColor as string,\n  } as CSSProperties;\n}\n\n/**\n * The demo media node for the `leading: \"media\"` variant — a `Thumbnail`\n * with no `src`, so it renders the atom's own placeholder instead of\n * reaching for a network image the canvas may not be able to load. It\n * tracks the Media Size knob because the slot forwards\n * `--uxm-list-item-media-size` into `--uxm-thumbnail-size`\n * (`LIST_ITEM_MEDIA_STYLE`), so the frame AND its placeholder glyph scale\n * together — the row owns the leading geometry, the media owns its surface.\n * `alt=\"\"` because the row's title is the accessible name; a described\n * image here would be concatenated into it.\n */\nconst DEMO_MEDIA = <Thumbnail alt=\"\" />;\n\n/**\n * Pick the canonical trailing element for the given mode. The trailing\n * slot is `ReactNode` on the atom — consumers can pass anything (Tag,\n * Badge, Avatar, custom node). The preview demos the canonical patterns:\n *   - interactive → chevron icon (the \"tap to drill in\" affordance)\n *   - static → Tag (status indicator for an info row)\n */\nfunction trailingForMode(\n  mode: Mode,\n  meta: string,\n  tagType: TagType,\n): ReactNode {\n  if (mode === 'interactive') {\n    // Color inherits via `currentColor` from `.uxm-list-item__trailing`,\n    // which reads `--uxm-list-item-chevron-color`. Keeps saves working\n    // (the var has a single source of truth instead of an inline JS\n    // override that would shadow it after save).\n    return <Icon glyph=\"chevron-right\" size={16} />;\n  }\n  return <Tag type={tagType}>{meta}</Tag>;\n}\n\n/**\n * Static showcase — ONE row, rendering matches the `mode` variant.\n *   - `interactive` → `<button>` with the forced-state class so all\n *     state CSS rules can apply (inert via pointer-events: none and\n *     tabIndex={-1}, so the forced state isn't overridden by real\n *     input).\n *   - `static` → `<div>` with no state class. State CSS rules are\n *     scoped to button/anchor element selectors and don't fire on\n *     divs, so the static row stays truly static.\n *\n * Hand-rendered because the atom doesn't expose a way to set the\n * showcase-only `--state-*` modifier class.\n */\nfunction StaticShowcase({\n  mode,\n  state,\n  showValue,\n  leading,\n  container,\n}: {\n  mode: Mode;\n  state: string;\n  showValue: boolean;\n  leading: Leading;\n  container: ListVariant;\n}) {\n  const isInteractive = mode === 'interactive';\n  const isActive = isInteractive && state === 'active';\n  const isDisabled = state === 'disabled';\n  const inner = (\n    <>\n      {/* Mirrors the atom's leading slot: an IconTile sized/coloured from the\n          same forwarded knob vars (glyph size comes from the tile var), or the\n          un-tiled media span when the Leading variant selects it. */}\n      {leading === 'media' ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {DEMO_MEDIA}\n        </span>\n      ) : (\n        <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n          <Icon glyph=\"square\" />\n        </IconTile>\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">Owner</span>\n        {showValue && <span className=\"uxm-list-item__value\">Alex Morgan</span>}\n      </span>\n      <span className=\"uxm-list-item__trailing\">\n        {trailingForMode(mode, 'Verified', 'success')}\n      </span>\n    </>\n  );\n\n  return (\n    <List variant={container}>\n      {isInteractive ? (\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          disabled={isDisabled}\n          aria-pressed={isActive}\n          className={cn(\n            'uxm-list-item',\n            isActive && 'uxm-list-item--active',\n            state === 'hover' && 'uxm-list-item--state-hover',\n            state === 'focus' && 'uxm-list-item--state-focus',\n          )}\n          style={{ pointerEvents: 'none' }}\n        >\n          {inner}\n        </button>\n      ) : (\n        <div\n          className=\"uxm-list-item\"\n          {...(isDisabled ? { 'aria-disabled': true } : {})}\n        >\n          {inner}\n        </div>\n      )}\n    </List>\n  );\n}\n\nconst ROWS: Array<{\n  key: string;\n  title: string;\n  value: string;\n  meta: string;\n  tagType: TagType;\n}> = [\n  // One row per Tag type, with a label that matches the type's\n  // semantic meaning — so two tags never read the same word with\n  // different visual treatments.\n  { key: 'plan', title: 'Plan', value: 'Enterprise', meta: 'Pro', tagType: 'accent' },\n  { key: 'billing', title: 'Billing', value: 'Visa •• 4242', meta: 'Action needed', tagType: 'warning' },\n  { key: 'owner', title: 'Owner', value: 'Alex Morgan', meta: 'Verified', tagType: 'success' },\n  { key: 'activity', title: 'Last activity', value: '2 hours ago', meta: 'Recent', tagType: 'neutral' },\n];\n\nexport function ListItemPreview({ styles, variants }: PreviewProps) {\n  const mode = ((variants.mode as string) ?? 'interactive') as Mode;\n  const state = (variants.state as string) ?? 'default';\n  const showValue = ((variants.value as string) ?? 'shown') === 'shown';\n  const leading = ((variants.leading as string) ?? 'icon') as Leading;\n  const container = ((variants.container as string) ?? 'card') as ListVariant;\n  const [activeKey, setActiveKey] = useState<string>('plan');\n  const cssVars = buildVars(styles);\n\n  const sectionLabel = {\n    fontSize: 11,\n    color: 'var(--color-text-muted)',\n    marginBottom: 12,\n    letterSpacing: 0.5,\n    textTransform: 'uppercase' as const,\n  };\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 32, minWidth: 380, ...cssVars } as CSSProperties}>\n      <div>\n        <div style={sectionLabel}>{state} state</div>\n        <StaticShowcase mode={mode} state={state} showValue={showValue} leading={leading} container={container} />\n      </div>\n\n      {/* List — interactivity is driven by the `mode` variant. Trailing\n          slot is set by the preview to the canonical example for each\n          mode: chevron for interactive (the \"tap to drill in\" cue),\n          Tag for static (status indicator).\n          interactive → all rows render as <button>; the State dropdown\n          carries through to `disabled` (applied to the second row),\n          and real `:hover` / `:focus-visible` exercise the production\n          CSS via the projected vars above.\n          static → all rows render as <div>; the interactive states\n          (hover / focus / active) are filtered out of the State picker\n          via the registry's showWhen. `disabled` still applies to divs\n          via `[aria-disabled]`. */}\n      <div style={{ borderTop: '1px solid var(--color-border)', paddingTop: 16 }}>\n        <div style={sectionLabel}>{mode === 'interactive' ? 'Interactive' : 'Static'}</div>\n        <List variant={container}>\n          {ROWS.map((row, i) => {\n            const isInteractive = mode === 'interactive';\n            return (\n              <ListItem\n                key={row.key}\n                interactive={isInteractive}\n                active={isInteractive && row.key === activeKey}\n                // Disabled is a visual treatment that applies to both\n                // interactive rows (CSS `:disabled` / `[aria-disabled]`)\n                // and static rows (`[aria-disabled]` on `<div>`).\n                disabled={state === 'disabled' && i === 1}\n                {...(leading === 'media'\n                  ? { media: DEMO_MEDIA }\n                  : { icon: <Icon glyph=\"square\" /> })}\n                value={showValue ? row.value : undefined}\n                trailing={trailingForMode(mode, row.meta, row.tagType)}\n                onClick={isInteractive ? () => setActiveKey(row.key) : undefined}\n              >\n                {row.title}\n              </ListItem>\n            );\n          })}\n        </List>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/ui/list/list.cjs

@@ -39,8 +39,15 @@ const LIST_ITEM_MEDIA_STYLE = {
   "--uxm-avatar-size": "var(--uxm-list-item-media-size, 36px)",
   "--uxm-avatar-small-size": "var(--uxm-list-item-media-size, 36px)"
 };
-function List({ children, className, ...rest }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_helpers.cn)("uxm-list", className), ...rest, children });
+function List({ children, className, variant = "card", ...rest }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: (0, import_helpers.cn)("uxm-list", variant === "plain" && "uxm-list--plain", className),
+      ...rest,
+      children
+    }
+  );
 }
 function ListItem({
   icon,

package/dist/ui/list/list.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/ui/list/list.tsx"],"sourcesContent":["import { cn } from '@/helpers';\n\nimport { IconTile } from '../icon-tile';\n\nimport type {\n  AnchorHTMLAttributes,\n  ButtonHTMLAttributes,\n  CSSProperties,\n  HTMLAttributes,\n  ReactNode,\n} from 'react';\n\n/**\n * Forward the studio icon knobs (projected as `--uxm-list-item-icon-*` on the\n * row) into the `IconTile` atom's own var namespace, so the accent-tile\n * pattern lives in one place — the `IconTile` atom — instead of being\n * re-implemented in `list.scss`. The glyph tracks the tile at 0.6× (the\n * row-icon proportion used across the design system). Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_ICON_TILE_STYLE = {\n  '--uxm-icon-tile-bg': 'var(--uxm-list-item-icon-bg, var(--color-accent))',\n  '--uxm-icon-tile-color': 'var(--uxm-list-item-icon-color, var(--color-card))',\n  '--uxm-icon-tile-size': 'var(--uxm-list-item-icon-size, 24px)',\n  '--uxm-icon-tile-radius': 'var(--uxm-list-item-icon-radius, 6px)',\n  '--uxm-icon-tile-icon-size': 'calc(var(--uxm-list-item-icon-size, 24px) * 0.6)',\n} as CSSProperties;\n\n/**\n * Forward the row's media-size knob into the size vars of the atoms that\n * plausibly fill the `media` slot, so each one sizes itself through its OWN\n * machinery — frame, border, radius and inner glyph / initials all scale with\n * it — instead of being stretched from the outside. Mirrors\n * `LIST_ITEM_ICON_TILE_STYLE` above, and is the only order-independent fix:\n * both `Thumbnail` (`.uxm-thumbnail`, 0,1,0 but imported AFTER list in\n * `styles.css`) and `Avatar` (double-class size presets at 0,2,0, deliberately\n * so per its own note) would otherwise win or lose the cascade against a slot\n * rule purely on stylesheet order. The generic `> *` stretch in `list.scss`\n * stays as the fallback for a bare `<img>` / `<svg>` or any atom with no size\n * var of its own; both mechanisms resolve to the same number. Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_MEDIA_STYLE = {\n  '--uxm-thumbnail-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-small-size': 'var(--uxm-list-item-media-size, 36px)',\n} as CSSProperties;\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n}\n\nexport function List({ children, className, ...rest }: ListProps) {\n  return (\n    <div className={cn('uxm-list', className)} {...rest}>\n      {children}\n    </div>\n  );\n}\n\n/**\n * ListItem renders as one of three element types depending on `interactive`:\n *   - `<div>` (default) — display row, no state styling, not focusable\n *   - `<button>` — interactive without navigation; emits click events\n *   - `<a>` — interactive with navigation; pass `href`\n *\n * The state knobs (hover / focus / active / disabled) in the `list-item`\n * registry only paint when the row renders as button or anchor — the CSS\n * scopes them to element-type selectors so display-only divs stay inert.\n */\nexport interface ListItemProps {\n  /** Leading icon — typically <Icon ... /> from @modo/uxm/ui. */\n  icon?: ReactNode;\n  /** Leading media rendered as-is (a <Thumbnail>, <img>, avatar…) — NOT\n   *  wrapped in the accent `IconTile` the `icon` slot uses. Mutually\n   *  exclusive with `icon`: when both are passed, `media` wins. The slot\n   *  box is `--uxm-list-item-media-size` (36px) square; a `Thumbnail` or\n   *  `Avatar` gets that size forwarded into its own size var (see\n   *  `LIST_ITEM_MEDIA_STYLE`) and anything else is stretched to fill, so\n   *  rows stay on one leading grid either way.\n   *\n   *  Prefer decorative media in a row whose title already names the thing\n   *  (`alt=\"\"`): the slot sits INSIDE the row's `<button>`/`<a>`, so a\n   *  described image is concatenated into the row's accessible name.\n   *\n   *  Note: this shadows the native `media` attribute of `<a>` for the\n   *  anchor form of the row — pass it through `className`/a wrapper if\n   *  you genuinely need the HTML attribute. */\n  media?: ReactNode;\n  /** Secondary text shown under the title (e.g. a value). */\n  value?: ReactNode;\n  /** Trailing content — meta text, chevron icon, or a custom node. */\n  trailing?: ReactNode;\n  /** Primary label. */\n  children: ReactNode;\n  /** Render as a clickable element. When false (default), renders as a\n   *  static `<div>` with no state styling. When true, renders as\n   *  `<button>` (or `<a>` if `href` is also passed). */\n  interactive?: boolean;\n  /** Show the selected/active treatment (only meaningful when\n   *  `interactive` is true). Adds the `--active` modifier class. */\n  active?: boolean;\n  /** Disable interaction — only meaningful when `interactive`.\n   *  Forwards to the native `disabled` attribute on `<button>`, or\n   *  sets `aria-disabled` on `<a>`. */\n  disabled?: boolean;\n  /** Navigate to this URL on click. Implies `interactive`. */\n  href?: string;\n  className?: string;\n}\n\ntype AnchorRest = Omit<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof ListItemProps\n>;\ntype ButtonRest = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  keyof ListItemProps\n>;\ntype DivRest = Omit<HTMLAttributes<HTMLDivElement>, keyof ListItemProps>;\n\nexport function ListItem({\n  icon,\n  media,\n  value,\n  trailing,\n  children,\n  interactive,\n  active,\n  disabled,\n  href,\n  className,\n  ...rest\n}: ListItemProps & (AnchorRest | ButtonRest | DivRest)) {\n  const classes = cn(\n    'uxm-list-item',\n    active && 'uxm-list-item--active',\n    className,\n  );\n  const isInteractive = interactive || href !== undefined;\n  const inner = (\n    <>\n      {/* Leading slot. `media` renders as-is so a product photo / avatar\n          keeps its own frame; `icon` keeps the accent IconTile treatment.\n          `media` wins when both are passed — a row has one leading grid\n          position, and the as-is rendering is the more specific intent. */}\n      {media ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {media}\n        </span>\n      ) : (\n        icon && (\n          <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n            {icon}\n          </IconTile>\n        )\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">{children}</span>\n        {value !== undefined && value !== null && (\n          <span className=\"uxm-list-item__value\">{value}</span>\n        )}\n      </span>\n      {trailing && <span className=\"uxm-list-item__trailing\">{trailing}</span>}\n    </>\n  );\n\n  if (href !== undefined) {\n    return (\n      <a\n        href={href}\n        className={classes}\n        {...(disabled ? { 'aria-disabled': true as const, tabIndex: -1 } : {})}\n        {...(rest as AnchorRest)}\n      >\n        {inner}\n      </a>\n    );\n  }\n  if (isInteractive) {\n    return (\n      <button\n        type=\"button\"\n        className={classes}\n        disabled={disabled}\n        aria-pressed={active}\n        {...(rest as ButtonRest)}\n      >\n        {inner}\n      </button>\n    );\n  }\n  return (\n    <div\n      className={classes}\n      {...(disabled ? { 'aria-disabled': true as const } : {})}\n      {...(rest as DivRest)}\n    >\n      {inner}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsDI;AAtDJ,qBAAmB;AAEnB,uBAAyB;AAkBlB,MAAM,4BAA4B;AAAA,EACvC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,6BAA6B;AAC/B;AAgBO,MAAM,wBAAwB;AAAA,EACnC,wBAAwB;AAAA,EACxB,qBAAqB;AAAA,EACrB,2BAA2B;AAC7B;AAMO,SAAS,KAAK,EAAE,UAAU,WAAW,GAAG,KAAK,GAAc;AAChE,SACE,4CAAC,SAAI,eAAW,mBAAG,YAAY,SAAS,GAAI,GAAG,MAC5C,UACH;AAEJ;AA+DO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAwD;AACtD,QAAM,cAAU;AAAA,IACd;AAAA,IACA,UAAU;AAAA,IACV;AAAA,EACF;AACA,QAAM,gBAAgB,eAAe,SAAS;AAC9C,QAAM,QACJ,4EAKG;AAAA,YACC,4CAAC,UAAK,WAAU,wBAAuB,OAAO,uBAC3C,iBACH,IAEA,QACE,4CAAC,6BAAS,WAAU,uBAAsB,OAAO,2BAC9C,gBACH;AAAA,IAGJ,6CAAC,UAAK,WAAU,0BACd;AAAA,kDAAC,UAAK,WAAU,wBAAwB,UAAS;AAAA,MAChD,UAAU,UAAa,UAAU,QAChC,4CAAC,UAAK,WAAU,wBAAwB,iBAAM;AAAA,OAElD;AAAA,IACC,YAAY,4CAAC,UAAK,WAAU,2BAA2B,oBAAS;AAAA,KACnE;AAGF,MAAI,SAAS,QAAW;AACtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACV,GAAI,WAAW,EAAE,iBAAiB,MAAe,UAAU,GAAG,IAAI,CAAC;AAAA,QACnE,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,MAAI,eAAe;AACjB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW;AAAA,QACX;AAAA,QACA,gBAAc;AAAA,QACb,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACV,GAAI,WAAW,EAAE,iBAAiB,KAAc,IAAI,CAAC;AAAA,MACrD,GAAI;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/ui/list/list.tsx"],"sourcesContent":["import { cn } from '@/helpers';\n\nimport { IconTile } from '../icon-tile';\n\nimport type {\n  AnchorHTMLAttributes,\n  ButtonHTMLAttributes,\n  CSSProperties,\n  HTMLAttributes,\n  ReactNode,\n} from 'react';\n\n/**\n * Forward the studio icon knobs (projected as `--uxm-list-item-icon-*` on the\n * row) into the `IconTile` atom's own var namespace, so the accent-tile\n * pattern lives in one place — the `IconTile` atom — instead of being\n * re-implemented in `list.scss`. The glyph tracks the tile at 0.6× (the\n * row-icon proportion used across the design system). Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_ICON_TILE_STYLE = {\n  '--uxm-icon-tile-bg': 'var(--uxm-list-item-icon-bg, var(--color-accent))',\n  '--uxm-icon-tile-color': 'var(--uxm-list-item-icon-color, var(--color-card))',\n  '--uxm-icon-tile-size': 'var(--uxm-list-item-icon-size, 24px)',\n  '--uxm-icon-tile-radius': 'var(--uxm-list-item-icon-radius, 6px)',\n  '--uxm-icon-tile-icon-size': 'calc(var(--uxm-list-item-icon-size, 24px) * 0.6)',\n} as CSSProperties;\n\n/**\n * Forward the row's media-size knob into the size vars of the atoms that\n * plausibly fill the `media` slot, so each one sizes itself through its OWN\n * machinery — frame, border, radius and inner glyph / initials all scale with\n * it — instead of being stretched from the outside. Mirrors\n * `LIST_ITEM_ICON_TILE_STYLE` above, and is the only order-independent fix:\n * both `Thumbnail` (`.uxm-thumbnail`, 0,1,0 but imported AFTER list in\n * `styles.css`) and `Avatar` (double-class size presets at 0,2,0, deliberately\n * so per its own note) would otherwise win or lose the cascade against a slot\n * rule purely on stylesheet order. The generic `> *` stretch in `list.scss`\n * stays as the fallback for a bare `<img>` / `<svg>` or any atom with no size\n * var of its own; both mechanisms resolve to the same number. Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_MEDIA_STYLE = {\n  '--uxm-thumbnail-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-small-size': 'var(--uxm-list-item-media-size, 36px)',\n} as CSSProperties;\n\n/** Container presentation. See `ListProps.variant`. */\nexport type ListVariant = 'card' | 'plain';\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n  /**\n   * Container presentation. `card` (default) keeps the bordered, rounded\n   * surface — right for a free-standing list on a page ground. `plain` drops\n   * the background, border and radius for a list that is ALREADY inside a\n   * surface (a flexpane body, a card body, a disclosure section), where a card\n   * container reads as a card inside a card.\n   *\n   * `plain` also releases `overflow` to `visible`. The card has to clip so rows\n   * cannot spill past its radius; with no radius there is nothing to clip to,\n   * and `hidden` would only crop what a row deliberately renders OUTSIDE the\n   * container box — an overhanging corner control, a focus ring with a positive\n   * offset. Clipped, those are neither painted nor hit-testable.\n   *\n   * Row styling is untouched — every `--uxm-list-item-*` knob behaves\n   * identically in both.\n   */\n  variant?: ListVariant;\n}\n\nexport function List({ children, className, variant = 'card', ...rest }: ListProps) {\n  return (\n    <div\n      className={cn('uxm-list', variant === 'plain' && 'uxm-list--plain', className)}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n}\n\n/**\n * ListItem renders as one of three element types depending on `interactive`:\n *   - `<div>` (default) — display row, no state styling, not focusable\n *   - `<button>` — interactive without navigation; emits click events\n *   - `<a>` — interactive with navigation; pass `href`\n *\n * The state knobs (hover / focus / active / disabled) in the `list-item`\n * registry only paint when the row renders as button or anchor — the CSS\n * scopes them to element-type selectors so display-only divs stay inert.\n */\nexport interface ListItemProps {\n  /** Leading icon — typically <Icon ... /> from @modo/uxm/ui. */\n  icon?: ReactNode;\n  /** Leading media rendered as-is (a <Thumbnail>, <img>, avatar…) — NOT\n   *  wrapped in the accent `IconTile` the `icon` slot uses. Mutually\n   *  exclusive with `icon`: when both are passed, `media` wins. The slot\n   *  box is `--uxm-list-item-media-size` (36px) square; a `Thumbnail` or\n   *  `Avatar` gets that size forwarded into its own size var (see\n   *  `LIST_ITEM_MEDIA_STYLE`) and anything else is stretched to fill, so\n   *  rows stay on one leading grid either way.\n   *\n   *  Prefer decorative media in a row whose title already names the thing\n   *  (`alt=\"\"`): the slot sits INSIDE the row's `<button>`/`<a>`, so a\n   *  described image is concatenated into the row's accessible name.\n   *\n   *  Note: this shadows the native `media` attribute of `<a>` for the\n   *  anchor form of the row — pass it through `className`/a wrapper if\n   *  you genuinely need the HTML attribute. */\n  media?: ReactNode;\n  /** Secondary text shown under the title (e.g. a value). */\n  value?: ReactNode;\n  /** Trailing content — meta text, chevron icon, or a custom node. */\n  trailing?: ReactNode;\n  /** Primary label. */\n  children: ReactNode;\n  /** Render as a clickable element. When false (default), renders as a\n   *  static `<div>` with no state styling. When true, renders as\n   *  `<button>` (or `<a>` if `href` is also passed). */\n  interactive?: boolean;\n  /** Show the selected/active treatment (only meaningful when\n   *  `interactive` is true). Adds the `--active` modifier class. */\n  active?: boolean;\n  /** Disable interaction — only meaningful when `interactive`.\n   *  Forwards to the native `disabled` attribute on `<button>`, or\n   *  sets `aria-disabled` on `<a>`. */\n  disabled?: boolean;\n  /** Navigate to this URL on click. Implies `interactive`. */\n  href?: string;\n  className?: string;\n}\n\ntype AnchorRest = Omit<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof ListItemProps\n>;\ntype ButtonRest = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  keyof ListItemProps\n>;\ntype DivRest = Omit<HTMLAttributes<HTMLDivElement>, keyof ListItemProps>;\n\nexport function ListItem({\n  icon,\n  media,\n  value,\n  trailing,\n  children,\n  interactive,\n  active,\n  disabled,\n  href,\n  className,\n  ...rest\n}: ListItemProps & (AnchorRest | ButtonRest | DivRest)) {\n  const classes = cn(\n    'uxm-list-item',\n    active && 'uxm-list-item--active',\n    className,\n  );\n  const isInteractive = interactive || href !== undefined;\n  const inner = (\n    <>\n      {/* Leading slot. `media` renders as-is so a product photo / avatar\n          keeps its own frame; `icon` keeps the accent IconTile treatment.\n          `media` wins when both are passed — a row has one leading grid\n          position, and the as-is rendering is the more specific intent. */}\n      {media ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {media}\n        </span>\n      ) : (\n        icon && (\n          <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n            {icon}\n          </IconTile>\n        )\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">{children}</span>\n        {value !== undefined && value !== null && (\n          <span className=\"uxm-list-item__value\">{value}</span>\n        )}\n      </span>\n      {trailing && <span className=\"uxm-list-item__trailing\">{trailing}</span>}\n    </>\n  );\n\n  if (href !== undefined) {\n    return (\n      <a\n        href={href}\n        className={classes}\n        {...(disabled ? { 'aria-disabled': true as const, tabIndex: -1 } : {})}\n        {...(rest as AnchorRest)}\n      >\n        {inner}\n      </a>\n    );\n  }\n  if (isInteractive) {\n    return (\n      <button\n        type=\"button\"\n        className={classes}\n        disabled={disabled}\n        aria-pressed={active}\n        {...(rest as ButtonRest)}\n      >\n        {inner}\n      </button>\n    );\n  }\n  return (\n    <div\n      className={classes}\n      {...(disabled ? { 'aria-disabled': true as const } : {})}\n      {...(rest as DivRest)}\n    >\n      {inner}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0EI;AA1EJ,qBAAmB;AAEnB,uBAAyB;AAkBlB,MAAM,4BAA4B;AAAA,EACvC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,6BAA6B;AAC/B;AAgBO,MAAM,wBAAwB;AAAA,EACnC,wBAAwB;AAAA,EACxB,qBAAqB;AAAA,EACrB,2BAA2B;AAC7B;AA0BO,SAAS,KAAK,EAAE,UAAU,WAAW,UAAU,QAAQ,GAAG,KAAK,GAAc;AAClF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,mBAAG,YAAY,YAAY,WAAW,mBAAmB,SAAS;AAAA,MAC5E,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AA+DO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAwD;AACtD,QAAM,cAAU;AAAA,IACd;AAAA,IACA,UAAU;AAAA,IACV;AAAA,EACF;AACA,QAAM,gBAAgB,eAAe,SAAS;AAC9C,QAAM,QACJ,4EAKG;AAAA,YACC,4CAAC,UAAK,WAAU,wBAAuB,OAAO,uBAC3C,iBACH,IAEA,QACE,4CAAC,6BAAS,WAAU,uBAAsB,OAAO,2BAC9C,gBACH;AAAA,IAGJ,6CAAC,UAAK,WAAU,0BACd;AAAA,kDAAC,UAAK,WAAU,wBAAwB,UAAS;AAAA,MAChD,UAAU,UAAa,UAAU,QAChC,4CAAC,UAAK,WAAU,wBAAwB,iBAAM;AAAA,OAElD;AAAA,IACC,YAAY,4CAAC,UAAK,WAAU,2BAA2B,oBAAS;AAAA,KACnE;AAGF,MAAI,SAAS,QAAW;AACtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACV,GAAI,WAAW,EAAE,iBAAiB,MAAe,UAAU,GAAG,IAAI,CAAC;AAAA,QACnE,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,MAAI,eAAe;AACjB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW;AAAA,QACX;AAAA,QACA,gBAAc;AAAA,QACb,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACV,GAAI,WAAW,EAAE,iBAAiB,KAAc,IAAI,CAAC;AAAA,MACrD,GAAI;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/ui/list/list.css

@@ -4,6 +4,22 @@
   border: 1px solid var(--color-border);
   border-radius: var(--uxm-list-item-border-radius, 8px);
   overflow: hidden;
+  /* For a list already sitting on a surface. Purely subtractive — it paints
+     nothing of its own, so there is no colour or token here to keep in step
+     with the card above.
+
+     `overflow` goes back to visible deliberately. The card clips so rows cannot
+     spill past its radius; with no radius there is nothing to clip to, and the
+     clip's only remaining effect is to crop what a row renders OUTSIDE the
+     container box. Measured: a control overhanging a row's corner is not even
+     hit-testable through a card container (`elementFromPoint` there returns the
+     row), and is under `plain`. */
+}
+.uxm-list--plain {
+  background-color: transparent;
+  border: none;
+  border-radius: 0;
+  overflow: visible;
 }
 
 .uxm-list-item {

package/dist/ui/list/list.d.ts

@@ -23,10 +23,29 @@ export declare const LIST_ITEM_ICON_TILE_STYLE: CSSProperties;
  * constant so the studio preview can reuse the exact same forwarding.
  */
 export declare const LIST_ITEM_MEDIA_STYLE: CSSProperties;
+/** Container presentation. See `ListProps.variant`. */
+export type ListVariant = 'card' | 'plain';
 export interface ListProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
+    /**
+     * Container presentation. `card` (default) keeps the bordered, rounded
+     * surface — right for a free-standing list on a page ground. `plain` drops
+     * the background, border and radius for a list that is ALREADY inside a
+     * surface (a flexpane body, a card body, a disclosure section), where a card
+     * container reads as a card inside a card.
+     *
+     * `plain` also releases `overflow` to `visible`. The card has to clip so rows
+     * cannot spill past its radius; with no radius there is nothing to clip to,
+     * and `hidden` would only crop what a row deliberately renders OUTSIDE the
+     * container box — an overhanging corner control, a focus ring with a positive
+     * offset. Clipped, those are neither painted nor hit-testable.
+     *
+     * Row styling is untouched — every `--uxm-list-item-*` knob behaves
+     * identically in both.
+     */
+    variant?: ListVariant;
 }
-export declare function List({ children, className, ...rest }: ListProps): import("react").JSX.Element;
+export declare function List({ children, className, variant, ...rest }: ListProps): import("react").JSX.Element;
 /**
  * ListItem renders as one of three element types depending on `interactive`:
  *   - `<div>` (default) — display row, no state styling, not focusable

package/dist/ui/list/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/ui/list/list.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACpB,aAAa,EACb,cAAc,EACd,SAAS,EACV,MAAM,OAAO,CAAC;AAEf;;;;;;;GAOG;AACH,eAAO,MAAM,yBAAyB,EAMjC,aAAa,CAAC;AAEnB;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,qBAAqB,EAI7B,aAAa,CAAC;AAEnB,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC/D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,+BAM/D;AAED;;;;;;;;;GASG;AACH,MAAM,WAAW,aAAa;IAC5B,+DAA+D;IAC/D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;iDAc6C;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,qBAAqB;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB;;0DAEsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;sEACkE;IAClE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;yCAEqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,KAAK,UAAU,GAAG,IAAI,CACpB,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,MAAM,aAAa,CACpB,CAAC;AACF,KAAK,UAAU,GAAG,IAAI,CACpB,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,MAAM,aAAa,CACpB,CAAC;AACF,KAAK,OAAO,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,MAAM,aAAa,CAAC,CAAC;AAEzE,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,GAAG,IAAI,EACR,EAAE,aAAa,GAAG,CAAC,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,+BAoErD"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../src/ui/list/list.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACpB,aAAa,EACb,cAAc,EACd,SAAS,EACV,MAAM,OAAO,CAAC;AAEf;;;;;;;GAOG;AACH,eAAO,MAAM,yBAAyB,EAMjC,aAAa,CAAC;AAEnB;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,qBAAqB,EAI7B,aAAa,CAAC;AAEnB,uDAAuD;AACvD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;AAE3C,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC/D,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;;;;;;;;;;;OAeG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAgB,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,+BASjF;AAED;;;;;;;;;GASG;AACH,MAAM,WAAW,aAAa;IAC5B,+DAA+D;IAC/D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;iDAc6C;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,2DAA2D;IAC3D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,qBAAqB;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB;;0DAEsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;sEACkE;IAClE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;yCAEqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,KAAK,UAAU,GAAG,IAAI,CACpB,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,MAAM,aAAa,CACpB,CAAC;AACF,KAAK,UAAU,GAAG,IAAI,CACpB,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,MAAM,aAAa,CACpB,CAAC;AACF,KAAK,OAAO,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,MAAM,aAAa,CAAC,CAAC;AAEzE,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,GAAG,IAAI,EACR,EAAE,aAAa,GAAG,CAAC,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,+BAoErD"}

package/dist/ui/list/list.js

@@ -13,8 +13,15 @@ const LIST_ITEM_MEDIA_STYLE = {
   "--uxm-avatar-size": "var(--uxm-list-item-media-size, 36px)",
   "--uxm-avatar-small-size": "var(--uxm-list-item-media-size, 36px)"
 };
-function List({ children, className, ...rest }) {
-  return /* @__PURE__ */ jsx("div", { className: cn("uxm-list", className), ...rest, children });
+function List({ children, className, variant = "card", ...rest }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("uxm-list", variant === "plain" && "uxm-list--plain", className),
+      ...rest,
+      children
+    }
+  );
 }
 function ListItem({
   icon,

package/dist/ui/list/list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/ui/list/list.tsx"],"sourcesContent":["import { cn } from '@/helpers';\n\nimport { IconTile } from '../icon-tile';\n\nimport type {\n  AnchorHTMLAttributes,\n  ButtonHTMLAttributes,\n  CSSProperties,\n  HTMLAttributes,\n  ReactNode,\n} from 'react';\n\n/**\n * Forward the studio icon knobs (projected as `--uxm-list-item-icon-*` on the\n * row) into the `IconTile` atom's own var namespace, so the accent-tile\n * pattern lives in one place — the `IconTile` atom — instead of being\n * re-implemented in `list.scss`. The glyph tracks the tile at 0.6× (the\n * row-icon proportion used across the design system). Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_ICON_TILE_STYLE = {\n  '--uxm-icon-tile-bg': 'var(--uxm-list-item-icon-bg, var(--color-accent))',\n  '--uxm-icon-tile-color': 'var(--uxm-list-item-icon-color, var(--color-card))',\n  '--uxm-icon-tile-size': 'var(--uxm-list-item-icon-size, 24px)',\n  '--uxm-icon-tile-radius': 'var(--uxm-list-item-icon-radius, 6px)',\n  '--uxm-icon-tile-icon-size': 'calc(var(--uxm-list-item-icon-size, 24px) * 0.6)',\n} as CSSProperties;\n\n/**\n * Forward the row's media-size knob into the size vars of the atoms that\n * plausibly fill the `media` slot, so each one sizes itself through its OWN\n * machinery — frame, border, radius and inner glyph / initials all scale with\n * it — instead of being stretched from the outside. Mirrors\n * `LIST_ITEM_ICON_TILE_STYLE` above, and is the only order-independent fix:\n * both `Thumbnail` (`.uxm-thumbnail`, 0,1,0 but imported AFTER list in\n * `styles.css`) and `Avatar` (double-class size presets at 0,2,0, deliberately\n * so per its own note) would otherwise win or lose the cascade against a slot\n * rule purely on stylesheet order. The generic `> *` stretch in `list.scss`\n * stays as the fallback for a bare `<img>` / `<svg>` or any atom with no size\n * var of its own; both mechanisms resolve to the same number. Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_MEDIA_STYLE = {\n  '--uxm-thumbnail-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-small-size': 'var(--uxm-list-item-media-size, 36px)',\n} as CSSProperties;\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n}\n\nexport function List({ children, className, ...rest }: ListProps) {\n  return (\n    <div className={cn('uxm-list', className)} {...rest}>\n      {children}\n    </div>\n  );\n}\n\n/**\n * ListItem renders as one of three element types depending on `interactive`:\n *   - `<div>` (default) — display row, no state styling, not focusable\n *   - `<button>` — interactive without navigation; emits click events\n *   - `<a>` — interactive with navigation; pass `href`\n *\n * The state knobs (hover / focus / active / disabled) in the `list-item`\n * registry only paint when the row renders as button or anchor — the CSS\n * scopes them to element-type selectors so display-only divs stay inert.\n */\nexport interface ListItemProps {\n  /** Leading icon — typically <Icon ... /> from @modo/uxm/ui. */\n  icon?: ReactNode;\n  /** Leading media rendered as-is (a <Thumbnail>, <img>, avatar…) — NOT\n   *  wrapped in the accent `IconTile` the `icon` slot uses. Mutually\n   *  exclusive with `icon`: when both are passed, `media` wins. The slot\n   *  box is `--uxm-list-item-media-size` (36px) square; a `Thumbnail` or\n   *  `Avatar` gets that size forwarded into its own size var (see\n   *  `LIST_ITEM_MEDIA_STYLE`) and anything else is stretched to fill, so\n   *  rows stay on one leading grid either way.\n   *\n   *  Prefer decorative media in a row whose title already names the thing\n   *  (`alt=\"\"`): the slot sits INSIDE the row's `<button>`/`<a>`, so a\n   *  described image is concatenated into the row's accessible name.\n   *\n   *  Note: this shadows the native `media` attribute of `<a>` for the\n   *  anchor form of the row — pass it through `className`/a wrapper if\n   *  you genuinely need the HTML attribute. */\n  media?: ReactNode;\n  /** Secondary text shown under the title (e.g. a value). */\n  value?: ReactNode;\n  /** Trailing content — meta text, chevron icon, or a custom node. */\n  trailing?: ReactNode;\n  /** Primary label. */\n  children: ReactNode;\n  /** Render as a clickable element. When false (default), renders as a\n   *  static `<div>` with no state styling. When true, renders as\n   *  `<button>` (or `<a>` if `href` is also passed). */\n  interactive?: boolean;\n  /** Show the selected/active treatment (only meaningful when\n   *  `interactive` is true). Adds the `--active` modifier class. */\n  active?: boolean;\n  /** Disable interaction — only meaningful when `interactive`.\n   *  Forwards to the native `disabled` attribute on `<button>`, or\n   *  sets `aria-disabled` on `<a>`. */\n  disabled?: boolean;\n  /** Navigate to this URL on click. Implies `interactive`. */\n  href?: string;\n  className?: string;\n}\n\ntype AnchorRest = Omit<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof ListItemProps\n>;\ntype ButtonRest = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  keyof ListItemProps\n>;\ntype DivRest = Omit<HTMLAttributes<HTMLDivElement>, keyof ListItemProps>;\n\nexport function ListItem({\n  icon,\n  media,\n  value,\n  trailing,\n  children,\n  interactive,\n  active,\n  disabled,\n  href,\n  className,\n  ...rest\n}: ListItemProps & (AnchorRest | ButtonRest | DivRest)) {\n  const classes = cn(\n    'uxm-list-item',\n    active && 'uxm-list-item--active',\n    className,\n  );\n  const isInteractive = interactive || href !== undefined;\n  const inner = (\n    <>\n      {/* Leading slot. `media` renders as-is so a product photo / avatar\n          keeps its own frame; `icon` keeps the accent IconTile treatment.\n          `media` wins when both are passed — a row has one leading grid\n          position, and the as-is rendering is the more specific intent. */}\n      {media ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {media}\n        </span>\n      ) : (\n        icon && (\n          <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n            {icon}\n          </IconTile>\n        )\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">{children}</span>\n        {value !== undefined && value !== null && (\n          <span className=\"uxm-list-item__value\">{value}</span>\n        )}\n      </span>\n      {trailing && <span className=\"uxm-list-item__trailing\">{trailing}</span>}\n    </>\n  );\n\n  if (href !== undefined) {\n    return (\n      <a\n        href={href}\n        className={classes}\n        {...(disabled ? { 'aria-disabled': true as const, tabIndex: -1 } : {})}\n        {...(rest as AnchorRest)}\n      >\n        {inner}\n      </a>\n    );\n  }\n  if (isInteractive) {\n    return (\n      <button\n        type=\"button\"\n        className={classes}\n        disabled={disabled}\n        aria-pressed={active}\n        {...(rest as ButtonRest)}\n      >\n        {inner}\n      </button>\n    );\n  }\n  return (\n    <div\n      className={classes}\n      {...(disabled ? { 'aria-disabled': true as const } : {})}\n      {...(rest as DivRest)}\n    >\n      {inner}\n    </div>\n  );\n}\n"],"mappings":"AAsDI,SAuFA,UAvFA,KAuGE,YAvGF;AAtDJ,SAAS,UAAU;AAEnB,SAAS,gBAAgB;AAkBlB,MAAM,4BAA4B;AAAA,EACvC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,6BAA6B;AAC/B;AAgBO,MAAM,wBAAwB;AAAA,EACnC,wBAAwB;AAAA,EACxB,qBAAqB;AAAA,EACrB,2BAA2B;AAC7B;AAMO,SAAS,KAAK,EAAE,UAAU,WAAW,GAAG,KAAK,GAAc;AAChE,SACE,oBAAC,SAAI,WAAW,GAAG,YAAY,SAAS,GAAI,GAAG,MAC5C,UACH;AAEJ;AA+DO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAwD;AACtD,QAAM,UAAU;AAAA,IACd;AAAA,IACA,UAAU;AAAA,IACV;AAAA,EACF;AACA,QAAM,gBAAgB,eAAe,SAAS;AAC9C,QAAM,QACJ,iCAKG;AAAA,YACC,oBAAC,UAAK,WAAU,wBAAuB,OAAO,uBAC3C,iBACH,IAEA,QACE,oBAAC,YAAS,WAAU,uBAAsB,OAAO,2BAC9C,gBACH;AAAA,IAGJ,qBAAC,UAAK,WAAU,0BACd;AAAA,0BAAC,UAAK,WAAU,wBAAwB,UAAS;AAAA,MAChD,UAAU,UAAa,UAAU,QAChC,oBAAC,UAAK,WAAU,wBAAwB,iBAAM;AAAA,OAElD;AAAA,IACC,YAAY,oBAAC,UAAK,WAAU,2BAA2B,oBAAS;AAAA,KACnE;AAGF,MAAI,SAAS,QAAW;AACtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACV,GAAI,WAAW,EAAE,iBAAiB,MAAe,UAAU,GAAG,IAAI,CAAC;AAAA,QACnE,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,MAAI,eAAe;AACjB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW;AAAA,QACX;AAAA,QACA,gBAAc;AAAA,QACb,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACV,GAAI,WAAW,EAAE,iBAAiB,KAAc,IAAI,CAAC;AAAA,MACrD,GAAI;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/ui/list/list.tsx"],"sourcesContent":["import { cn } from '@/helpers';\n\nimport { IconTile } from '../icon-tile';\n\nimport type {\n  AnchorHTMLAttributes,\n  ButtonHTMLAttributes,\n  CSSProperties,\n  HTMLAttributes,\n  ReactNode,\n} from 'react';\n\n/**\n * Forward the studio icon knobs (projected as `--uxm-list-item-icon-*` on the\n * row) into the `IconTile` atom's own var namespace, so the accent-tile\n * pattern lives in one place — the `IconTile` atom — instead of being\n * re-implemented in `list.scss`. The glyph tracks the tile at 0.6× (the\n * row-icon proportion used across the design system). Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_ICON_TILE_STYLE = {\n  '--uxm-icon-tile-bg': 'var(--uxm-list-item-icon-bg, var(--color-accent))',\n  '--uxm-icon-tile-color': 'var(--uxm-list-item-icon-color, var(--color-card))',\n  '--uxm-icon-tile-size': 'var(--uxm-list-item-icon-size, 24px)',\n  '--uxm-icon-tile-radius': 'var(--uxm-list-item-icon-radius, 6px)',\n  '--uxm-icon-tile-icon-size': 'calc(var(--uxm-list-item-icon-size, 24px) * 0.6)',\n} as CSSProperties;\n\n/**\n * Forward the row's media-size knob into the size vars of the atoms that\n * plausibly fill the `media` slot, so each one sizes itself through its OWN\n * machinery — frame, border, radius and inner glyph / initials all scale with\n * it — instead of being stretched from the outside. Mirrors\n * `LIST_ITEM_ICON_TILE_STYLE` above, and is the only order-independent fix:\n * both `Thumbnail` (`.uxm-thumbnail`, 0,1,0 but imported AFTER list in\n * `styles.css`) and `Avatar` (double-class size presets at 0,2,0, deliberately\n * so per its own note) would otherwise win or lose the cascade against a slot\n * rule purely on stylesheet order. The generic `> *` stretch in `list.scss`\n * stays as the fallback for a bare `<img>` / `<svg>` or any atom with no size\n * var of its own; both mechanisms resolve to the same number. Kept as a module\n * constant so the studio preview can reuse the exact same forwarding.\n */\nexport const LIST_ITEM_MEDIA_STYLE = {\n  '--uxm-thumbnail-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-size': 'var(--uxm-list-item-media-size, 36px)',\n  '--uxm-avatar-small-size': 'var(--uxm-list-item-media-size, 36px)',\n} as CSSProperties;\n\n/** Container presentation. See `ListProps.variant`. */\nexport type ListVariant = 'card' | 'plain';\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n  /**\n   * Container presentation. `card` (default) keeps the bordered, rounded\n   * surface — right for a free-standing list on a page ground. `plain` drops\n   * the background, border and radius for a list that is ALREADY inside a\n   * surface (a flexpane body, a card body, a disclosure section), where a card\n   * container reads as a card inside a card.\n   *\n   * `plain` also releases `overflow` to `visible`. The card has to clip so rows\n   * cannot spill past its radius; with no radius there is nothing to clip to,\n   * and `hidden` would only crop what a row deliberately renders OUTSIDE the\n   * container box — an overhanging corner control, a focus ring with a positive\n   * offset. Clipped, those are neither painted nor hit-testable.\n   *\n   * Row styling is untouched — every `--uxm-list-item-*` knob behaves\n   * identically in both.\n   */\n  variant?: ListVariant;\n}\n\nexport function List({ children, className, variant = 'card', ...rest }: ListProps) {\n  return (\n    <div\n      className={cn('uxm-list', variant === 'plain' && 'uxm-list--plain', className)}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n}\n\n/**\n * ListItem renders as one of three element types depending on `interactive`:\n *   - `<div>` (default) — display row, no state styling, not focusable\n *   - `<button>` — interactive without navigation; emits click events\n *   - `<a>` — interactive with navigation; pass `href`\n *\n * The state knobs (hover / focus / active / disabled) in the `list-item`\n * registry only paint when the row renders as button or anchor — the CSS\n * scopes them to element-type selectors so display-only divs stay inert.\n */\nexport interface ListItemProps {\n  /** Leading icon — typically <Icon ... /> from @modo/uxm/ui. */\n  icon?: ReactNode;\n  /** Leading media rendered as-is (a <Thumbnail>, <img>, avatar…) — NOT\n   *  wrapped in the accent `IconTile` the `icon` slot uses. Mutually\n   *  exclusive with `icon`: when both are passed, `media` wins. The slot\n   *  box is `--uxm-list-item-media-size` (36px) square; a `Thumbnail` or\n   *  `Avatar` gets that size forwarded into its own size var (see\n   *  `LIST_ITEM_MEDIA_STYLE`) and anything else is stretched to fill, so\n   *  rows stay on one leading grid either way.\n   *\n   *  Prefer decorative media in a row whose title already names the thing\n   *  (`alt=\"\"`): the slot sits INSIDE the row's `<button>`/`<a>`, so a\n   *  described image is concatenated into the row's accessible name.\n   *\n   *  Note: this shadows the native `media` attribute of `<a>` for the\n   *  anchor form of the row — pass it through `className`/a wrapper if\n   *  you genuinely need the HTML attribute. */\n  media?: ReactNode;\n  /** Secondary text shown under the title (e.g. a value). */\n  value?: ReactNode;\n  /** Trailing content — meta text, chevron icon, or a custom node. */\n  trailing?: ReactNode;\n  /** Primary label. */\n  children: ReactNode;\n  /** Render as a clickable element. When false (default), renders as a\n   *  static `<div>` with no state styling. When true, renders as\n   *  `<button>` (or `<a>` if `href` is also passed). */\n  interactive?: boolean;\n  /** Show the selected/active treatment (only meaningful when\n   *  `interactive` is true). Adds the `--active` modifier class. */\n  active?: boolean;\n  /** Disable interaction — only meaningful when `interactive`.\n   *  Forwards to the native `disabled` attribute on `<button>`, or\n   *  sets `aria-disabled` on `<a>`. */\n  disabled?: boolean;\n  /** Navigate to this URL on click. Implies `interactive`. */\n  href?: string;\n  className?: string;\n}\n\ntype AnchorRest = Omit<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof ListItemProps\n>;\ntype ButtonRest = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  keyof ListItemProps\n>;\ntype DivRest = Omit<HTMLAttributes<HTMLDivElement>, keyof ListItemProps>;\n\nexport function ListItem({\n  icon,\n  media,\n  value,\n  trailing,\n  children,\n  interactive,\n  active,\n  disabled,\n  href,\n  className,\n  ...rest\n}: ListItemProps & (AnchorRest | ButtonRest | DivRest)) {\n  const classes = cn(\n    'uxm-list-item',\n    active && 'uxm-list-item--active',\n    className,\n  );\n  const isInteractive = interactive || href !== undefined;\n  const inner = (\n    <>\n      {/* Leading slot. `media` renders as-is so a product photo / avatar\n          keeps its own frame; `icon` keeps the accent IconTile treatment.\n          `media` wins when both are passed — a row has one leading grid\n          position, and the as-is rendering is the more specific intent. */}\n      {media ? (\n        <span className=\"uxm-list-item__media\" style={LIST_ITEM_MEDIA_STYLE}>\n          {media}\n        </span>\n      ) : (\n        icon && (\n          <IconTile className=\"uxm-list-item__icon\" style={LIST_ITEM_ICON_TILE_STYLE}>\n            {icon}\n          </IconTile>\n        )\n      )}\n      <span className=\"uxm-list-item__content\">\n        <span className=\"uxm-list-item__title\">{children}</span>\n        {value !== undefined && value !== null && (\n          <span className=\"uxm-list-item__value\">{value}</span>\n        )}\n      </span>\n      {trailing && <span className=\"uxm-list-item__trailing\">{trailing}</span>}\n    </>\n  );\n\n  if (href !== undefined) {\n    return (\n      <a\n        href={href}\n        className={classes}\n        {...(disabled ? { 'aria-disabled': true as const, tabIndex: -1 } : {})}\n        {...(rest as AnchorRest)}\n      >\n        {inner}\n      </a>\n    );\n  }\n  if (isInteractive) {\n    return (\n      <button\n        type=\"button\"\n        className={classes}\n        disabled={disabled}\n        aria-pressed={active}\n        {...(rest as ButtonRest)}\n      >\n        {inner}\n      </button>\n    );\n  }\n  return (\n    <div\n      className={classes}\n      {...(disabled ? { 'aria-disabled': true as const } : {})}\n      {...(rest as DivRest)}\n    >\n      {inner}\n    </div>\n  );\n}\n"],"mappings":"AA0EI,SA0FA,UA1FA,KA0GE,YA1GF;AA1EJ,SAAS,UAAU;AAEnB,SAAS,gBAAgB;AAkBlB,MAAM,4BAA4B;AAAA,EACvC,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,6BAA6B;AAC/B;AAgBO,MAAM,wBAAwB;AAAA,EACnC,wBAAwB;AAAA,EACxB,qBAAqB;AAAA,EACrB,2BAA2B;AAC7B;AA0BO,SAAS,KAAK,EAAE,UAAU,WAAW,UAAU,QAAQ,GAAG,KAAK,GAAc;AAClF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,YAAY,YAAY,WAAW,mBAAmB,SAAS;AAAA,MAC5E,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AA+DO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAwD;AACtD,QAAM,UAAU;AAAA,IACd;AAAA,IACA,UAAU;AAAA,IACV;AAAA,EACF;AACA,QAAM,gBAAgB,eAAe,SAAS;AAC9C,QAAM,QACJ,iCAKG;AAAA,YACC,oBAAC,UAAK,WAAU,wBAAuB,OAAO,uBAC3C,iBACH,IAEA,QACE,oBAAC,YAAS,WAAU,uBAAsB,OAAO,2BAC9C,gBACH;AAAA,IAGJ,qBAAC,UAAK,WAAU,0BACd;AAAA,0BAAC,UAAK,WAAU,wBAAwB,UAAS;AAAA,MAChD,UAAU,UAAa,UAAU,QAChC,oBAAC,UAAK,WAAU,wBAAwB,iBAAM;AAAA,OAElD;AAAA,IACC,YAAY,oBAAC,UAAK,WAAU,2BAA2B,oBAAS;AAAA,KACnE;AAGF,MAAI,SAAS,QAAW;AACtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACV,GAAI,WAAW,EAAE,iBAAiB,MAAe,UAAU,GAAG,IAAI,CAAC;AAAA,QACnE,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,MAAI,eAAe;AACjB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW;AAAA,QACX;AAAA,QACA,gBAAc;AAAA,QACb,GAAI;AAAA,QAEJ;AAAA;AAAA,IACH;AAAA,EAEJ;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACV,GAAI,WAAW,EAAE,iBAAiB,KAAc,IAAI,CAAC;AAAA,MACrD,GAAI;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viax.io/uxm",
-  "version": "4.43.2",
+  "version": "4.45.0",
   "description": "Viax UXM — React 19 UI primitives and design tokens.",
   "license": "MIT",
   "private": false,