@kerfjs/ui 5.0.0-beta.10 → 5.0.0-beta.101

package/dist/help-tags-register.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/integrations/webawesome/help-tags/help-tags-register.ts"],"names":[],"mappings":";;;AAIA,eAAA,EAAgB;AAYT,IAAM,kBAAA,GAAqB","file":"help-tags-register.js","sourcesContent":["import '@awesome.me/webawesome/dist/components/tooltip/tooltip.js';\n\nimport { installHelpTags } from './install-help-tag.js';\n\ninstallHelpTags();\n\n/**\n * Marker export for tests and tooling; importing this module registers the\n * Web Awesome tooltip and installs the document-level help tags that name\n * icon-only controls on hover and keyboard focus: an icon-only `<button>` or\n * link inside a `ToolbarControlGroup` (named by `aria-label`, without a\n * native `title`), plus the icon-only `Select` and `PopupMenu` triggers that\n * `select/register` and `popup-menu/register` already cover. Import it once\n * in an application whose toolbars have icon-only buttons but no registered\n * `Select` or `PopupMenu`; importing it alongside them is harmless.\n */\nexport const helpTagsRegistered = true;\n"]}

package/dist/icon-button.d.ts

@@ -0,0 +1,46 @@
+import * as kerfjs from 'kerfjs';
+import { LucideNode } from './lucide-icon.js';
+import 'lucide';
+import './css-values.js';
+
+type IconButtonAppearance = 'accent' | 'filled' | 'outlined' | 'filled-outlined' | 'plain';
+type IconButtonVariant = 'neutral' | 'brand' | 'success' | 'warning' | 'danger';
+type IconButtonSize = 'xs' | 's' | 'm' | 'l' | 'xl';
+type IconButtonRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
+    'data-component'?: never;
+    'data-action'?: never;
+}>;
+interface IconButtonProps {
+    /** The Lucide-compatible icon node shown alone in the button. */
+    icon: LucideNode;
+    /** The icon's stable name, as `LucideIcon` takes it. */
+    iconName: string;
+    /** Accessible name; the button has no visible text, so it is required. */
+    label: string;
+    /** Delegated `data-action` the application handles. */
+    action?: string;
+    /** Web Awesome appearance; defaults to Web Awesome's own. */
+    appearance?: IconButtonAppearance;
+    /** Web Awesome semantic variant; defaults to Web Awesome's own. */
+    variant?: IconButtonVariant;
+    /** Web Awesome control size; the square follows its control height. */
+    size?: IconButtonSize;
+    type?: 'button' | 'submit' | 'reset';
+    disabled?: boolean;
+    id?: string;
+    className?: string;
+    /** Safe `data-*` metadata; `data-component` and `data-action` stay owned. */
+    rootAttributes?: IconButtonRootAttributes;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
+}
+/**
+ * An icon-only Web Awesome button with a `LucideIcon`: square, one form
+ * control height on each side, so it matches an adjacent `wa-input` or
+ * `Select`. Web Awesome squares a button only for a lone `wa-icon`; this is
+ * the Kerf form for Lucide icons. Register `wa-button` once
+ * (`@awesome.me/webawesome/dist/components/button/button.js`).
+ */
+declare function IconButton({ icon, iconName, label, action, appearance, variant, size, type, disabled, id, className, rootAttributes, slot, }: IconButtonProps): kerfjs.SafeHtml;
+
+export { IconButton, type IconButtonAppearance, type IconButtonProps, type IconButtonSize, type IconButtonVariant };

package/dist/icon-button.js

@@ -0,0 +1,6 @@
+export { IconButton } from './chunk-VFYO3UGZ.js';
+
+
+
+
+//# sourceMappingURL=icon-button.js.map

package/dist/icon-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"icon-button.js"}

package/dist/icon-toggle-button.d.ts

@@ -0,0 +1,42 @@
+import * as kerfjs from 'kerfjs';
+import { LucideNode } from './lucide-icon.js';
+import 'lucide';
+import './css-values.js';
+
+/** Corner shape: fully round `pill` (default) or a softer `rounded` square. */
+type IconToggleButtonShape = 'pill' | 'rounded';
+type IconToggleButtonRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
+    'data-component'?: never;
+    'data-action'?: never;
+    'data-shape'?: never;
+}>;
+interface IconToggleButtonProps {
+    /** The Lucide-compatible icon node. */
+    icon: LucideNode;
+    /** The icon's stable name, as `LucideIcon` takes it. */
+    iconName: string;
+    /** Accessible name and hover help tag; required because no text is shown. */
+    label: string;
+    /** Pressed state, exposed as `aria-pressed`; the application owns it. */
+    pressed: boolean;
+    /** Delegated `data-action` the application handles to flip `pressed`. */
+    action?: string;
+    shape?: IconToggleButtonShape;
+    disabled?: boolean;
+    id?: string;
+    className?: string;
+    /** Safe `data-*` metadata; IconToggleButton-owned markers stay protected. */
+    rootAttributes?: IconToggleButtonRootAttributes;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
+}
+/**
+ * A standalone, icon-only toggle: a native `<button aria-pressed>` with the
+ * geometry and pressed chrome of a single contained `ToolbarControlGroup`
+ * (44px, a 2px-inset face that rises when pressed), for content and pane
+ * footers where no `Toolbar` belongs. Inside a toolbar, use a
+ * `ToolbarControlGroup` instead.
+ */
+declare function IconToggleButton({ icon, iconName, label, pressed, action, shape, disabled, id, className, rootAttributes, slot, }: IconToggleButtonProps): kerfjs.SafeHtml;
+
+export { IconToggleButton, type IconToggleButtonProps, type IconToggleButtonShape };

package/dist/icon-toggle-button.js

@@ -0,0 +1,6 @@
+export { IconToggleButton } from './chunk-CA7LNX3J.js';
+
+
+
+
+//# sourceMappingURL=icon-toggle-button.js.map

package/dist/icon-toggle-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"icon-toggle-button.js"}

package/dist/index.d.ts

@@ -1,25 +1,73 @@
-export { AppTab, AppTabProps } from './app-tab.js';
-export { DisclosureArrow, DisclosureArrowProps, DisclosureDirection } from './disclosure-arrow.js';
-export { EmptyState, EmptyStateProps } from './empty-state.js';
+export { FloatingToolbar, FloatingToolbarPosition, FloatingToolbarProps } from './floating-toolbar.js';
+export { IconButton, IconButtonAppearance, IconButtonProps, IconButtonSize, IconButtonVariant } from './icon-button.js';
+export { IconToggleButton, IconToggleButtonProps, IconToggleButtonShape } from './icon-toggle-button.js';
+export { PopupMenu, PopupMenuAnchor, PopupMenuDivider, PopupMenuElement, PopupMenuEntry, PopupMenuHeading, PopupMenuItem, PopupMenuPlacement, PopupMenuProps, closePopupMenu, openPopupMenu, openPopupMenuAt } from './popup-menu.js';
+export { SplitButton, SplitButtonProps, SplitButtonTone } from './split-button.js';
+export { Toolbar, ToolbarConfig, ToolbarPosition, ToolbarProps } from './toolbar.js';
+export { ToolbarActionLink, ToolbarActionLinkProps, ToolbarControlGroup, ToolbarControlGroupAppearance, ToolbarControlGroupButtonAppearance, ToolbarControlGroupContent, ToolbarControlGroupDensity, ToolbarControlGroupExpandedOverflow, ToolbarControlGroupMaterial, ToolbarControlGroupMenuInset, ToolbarControlGroupOverflow, ToolbarControlGroupProps, ToolbarControlGroupSelectedChrome, ToolbarControlGroupSelectedTone, ToolbarControlGroupShape, ToolbarControlGroupSize, ToolbarControlGroupTileTone, ToolbarControlGroupTone, ToolbarControlGroupVisibility } from './toolbar-control-group.js';
+export { HeadingLevel, ToolbarText, ToolbarTextProps, ToolbarTextSize, ToolbarTextTone } from './toolbar-text.js';
+export { FramedList, FramedListProps, FramedListRow, FramedListRowProps, FramedListSurface } from './framed-list.js';
+export { List, ListConfig, ListInset, ListProps, ListSurface } from './list.js';
+export { wireListFocusScroll } from './wire-list-focus-scroll.js';
 export { ListActionRow, ListActionRowProps } from './list-action-row.js';
 export { ListHeader, ListHeaderProps } from './list-header.js';
-export { ListItem, ListItemProps } from './list-item.js';
+export { ListInsetControl, ListInsetControlProps } from './list-inset-control.js';
+export { ListInsetText, ListInsetTextProps } from './list-inset-text.js';
+export { ListItem, ListItemLink, ListItemLinkProps, ListItemProps } from './list-item.js';
+export { SummaryRow, SummaryRowListEdge, SummaryRowPresentation, SummaryRowProps } from './summary-row.js';
+export { ValueTable, ValueTablePresentation, ValueTableProps, ValueTableRow, ValueTableRowProps, ValueTableStackBelow } from './value-table.js';
+export { AnchoredSurfaceOptions, AnchoredSurfacePoint, openAnchoredSurface, openAnchoredSurfaceAt } from './anchored-surface.js';
+export { Badge, BadgeAppearance, BadgeDotProps, BadgeProps, BadgeShape, BadgeSize, BadgeTextProps, BadgeTone } from './badge.js';
+export { Chip, ChipProps, ChipTone } from './chip.js';
+export { CornerStatus, CornerStatusPlacement, CornerStatusPresentation, CornerStatusProps } from './corner-status.js';
+export { wireCornerStatus } from './wire-corner-status.js';
+export { EdgeActivityIndicator, EdgeActivityIndicatorProps } from './edge-activity-indicator.js';
+export { EmptyState, EmptyStateProps } from './empty-state.js';
 export { LoadingSpinner, LoadingSpinnerProps } from './loading-spinner.js';
-export { LucideIcon, LucideIconProps, LucideNode } from './lucide-icon.js';
-export { PanelHeader, PanelHeaderProps } from './panel-header.js';
-export { ResizableRegion, ResizableRegionAxis, ResizableRegionEdge, ResizableRegionProps, clampRegionSize, resizeRegionFromPointer } from './resizable-region.js';
-export { SegmentedControl, SegmentedControlAppearance, SegmentedControlChoice, SegmentedControlLayout, SegmentedControlProps, SegmentedControlShape, SegmentedControlSize } from './segmented-control.js';
-export { Select, SelectChoice, SelectProps } from './select.js';
 export { Skeleton, SkeletonProps } from './skeleton.js';
-export { StateBanner, StateBannerProps, StateBannerTone } from './state-banner.js';
-export { TabBar, TabBarProps } from './tab-bar.js';
-export { TokenSearchField, TokenSearchFieldProps, TokenSearchFieldValue, TokenSearchToken, placeTokenSearchCaret, readTokenSearchField } from './token-search-field.js';
-export { Toolbar, ToolbarProps } from './toolbar.js';
-export { ToolbarControlGroup, ToolbarControlGroupProps } from './toolbar-control-group.js';
-export { HeadingLevel, ToolbarText, ToolbarTextProps, ToolbarTextSize } from './toolbar-text.js';
-export { ValueTable, ValueTableProps, ValueTableRow, ValueTableRowProps } from './value-table.js';
+export { StateBanner, StateBannerProps, StateBannerTone, StateBannerUrgency } from './state-banner.js';
+export { ChoiceChips, ChoiceChipsChoice, ChoiceChipsProps, ChoiceChipsSize, ChoiceChipsSwatch } from './choice-chips.js';
+export { Combobox, ComboboxProps, ComboboxSuggestion } from './combobox.js';
+export { ComboboxCommit, WireComboboxesOptions, wireComboboxes } from './wire-comboboxes.js';
+export { Composer, ComposerProps, ComposerRootAttributes } from './composer.js';
+export { wireComposers } from './wire-composers.js';
+export { FieldLabel, FieldLabelProps, Text, TextContent, TextFont, TextProps, TextSize, TextTone, TextVariant } from './text.js';
+export { FileDropZone, FileDropZoneProps, FilePickerTrigger, FilePickerTriggerProps } from './file-picker.js';
+export { FilePickerSelection, WireFilePickersOptions, fileMatchesAccept, wireFilePickers } from './wire-file-pickers.js';
+export { SegmentedControl, SegmentedControlAppearance, SegmentedControlChoice, SegmentedControlLayout, SegmentedControlProps, SegmentedControlShape, SegmentedControlSize } from './segmented-control.js';
+export { Select, SelectChoice, SelectFocusRingOwner, SelectPresentation, SelectProps, SelectSelectedPresentation, SelectSize } from './select.js';
+export { T as TokenSearchEditorAttributes, a as TokenSearchField, b as TokenSearchFieldProps, c as TokenSearchFieldValue, d as TokenSearchModel, e as TokenSearchModelOptions, f as TokenSearchResolvedToken, g as TokenSearchRule, h as TokenSearchState, i as TokenSearchSuggestion, j as TokenSearchToken, k as TokenSearchTrailingAction, l as TokenSearchTrailingActionAttributes, m as createTokenSearchModel, p as placeTokenSearchCaret, r as readTokenSearchField } from './token-search-model-aYR0YAei.js';
+export { TokenSearchCollapsibleOptions, TokenSearchEdit, TokenSearchFieldsHandle, TokenSearchSubmit, WireTokenSearchFieldsOptions, wireTokenSearchFields } from './wire-token-search-fields.js';
+export { ColumnTrack, ColumnTrackLayout, ColumnTrackProps } from './column-track.js';
+export { ContentSwap, ContentSwapDirection, ContentSwapProps, ContentSwapSide, ContentSwapTransition } from './content-swap.js';
+export { Grid, GridProps } from './grid.js';
+export { Pane, PaneAppearance, PaneChromeDividers, PaneChromePlacement, PaneConfig, PaneContentElement, PaneElement, PaneHeaderPresentation, PaneProps, PaneSeparatorSide, ScrollEdge, SurfaceTint, SurfaceTintScheme } from './pane.js';
+export { ResizableRegion, ResizableRegionAxis, ResizableRegionCollapseMotion, ResizableRegionContentOverflow, ResizableRegionEdge, ResizableRegionPresentation, ResizableRegionProps, ResizableRegionResponsiveFillAt, ResizableRegionRestorePosition, ResizableRegionSeparator, clampRegionSize, resizeRegionFromPointer } from './resizable-region.js';
 export { ResizeCommit, WireResizableRegionsOptions, wireResizableRegions } from './wire-resizable-regions.js';
+export { Row, RowProps } from './row.js';
+export { Spacer, SpacerProps } from './spacer.js';
+export { LucideIcon, LucideIconProps, LucideNode } from './lucide-icon.js';
+export { AppTab, AppTabNameOverflow, AppTabPresentation, AppTabProps, AppTabSize } from './app-tab.js';
+export { DisclosureArrow, DisclosureArrowProps, DisclosureDirection } from './disclosure-arrow.js';
+export { TabActivation, TabBar, TabBarAllocation, TabBarPresentation, TabBarProps, TabBarTrailingPlacement } from './tab-bar.js';
 export { TabDropPosition, TabReorder, TabReorderSource, WireTabBarsOptions, reorderTabs, wireTabBars } from './wire-tab-bars.js';
-export { TokenSearchCollapsibleOptions, TokenSearchFieldsHandle, TokenSearchSubmit, WireTokenSearchFieldsOptions, wireTokenSearchFields } from './wire-token-search-fields.js';
+export { BackdropImage, BackdropImageFit, BackdropImageParallax, BackdropImagePosition, BackdropImageProps, BackdropImageRepeat, BackdropImageScrim, BackdropImageSingleProps, BackdropImageTiledProps } from './backdrop-image.js';
+export { ContentItem, ContentItemAppearance, ContentItemBubble, ContentItemFrame, ContentItemProps, ContentItemSelectionMode, ContentItemShape } from './content-item.js';
+export { SunkenPanel, SunkenPanelProps, SunkenPanelShape, ensureSunkenTexture } from './sunken-panel.js';
+export { DialogSurface, DialogSurfaceBodyLayout, DialogSurfaceFooterPresentation, DialogSurfaceHeaderPresentation, DialogSurfaceHeight, DialogSurfaceMaxHeight, DialogSurfacePresentation, DialogSurfaceProps, DialogSurfaceRootAttributes, DialogSurfaceSheetMotion, DialogSurfaceSize, PopoverDialogSurface, PopoverDialogSurfaceDataAttributes, PopoverDialogSurfacePresentation, PopoverDialogSurfaceProps, PopupSurface, PopupSurfaceInset, PopupSurfaceProps, SurfaceInset } from './surface-scaffold.js';
+export { wireOverlaySheets } from './wire-overlay-sheets.js';
+export { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+export { CssColor, CssFlex, CssFlexBasis, CssFlexKeyword, CssForegroundColor, CssLength, CssLengthExpression, CssSize, CssSizeKeyword, CssValue, UiColor, UiColorName, UiForegroundColorName, UiSpaceName, calc, colorVar, em, fillColor, flex, foregroundColor, foregroundColorVar, lengthVar, pct, plus, px, rem, space, uiColor } from './css-values.js';
+export { ListDropPosition, ListReorder, ListReorderSource, ListReorderTarget, WireListReorderOptions, reorderListItems, wireListReorder } from './wire-list-reorder.js';
+export { ScrollDividerTarget, WireScrollDividersOptions, wireScrollDividers } from './wire-scroll-dividers.js';
+export { wireToolbarVisibility } from './wire-toolbar-visibility.js';
+export { H as HorizontalAlignment, L as ListVerticalAlignment, V as VerticalAlignment } from './flex-alignment-4ms8ZbV8.js';
+export { L as ListIconTile, a as ListIconTileColor, b as ListIconTileTone } from './list-icon-tile-B8dr97OW.js';
+export { S as ScrollClearance } from './scroll-clearance-BikHljTc.js';
+export { S as SemanticTone } from './semantic-tone-CdW013KF.js';
+export { S as Sides } from './sides-BPSWde0A.js';
 import 'kerfjs';
+import './extension-attributes-mu8MFUl0.js';
+import 'kerfjs/overlay';
+import 'kerfjs/jsx-runtime';
 import 'lucide';

package/dist/index.js

@@ -1,26 +1,73 @@
-export { reorderTabs, wireTabBars } from './chunk-XXMOARTH.js';
-export { wireTokenSearchFields } from './chunk-CVZYNJJ5.js';
-export { ValueTable, ValueTableRow } from './chunk-37T3VNIZ.js';
-export { wireResizableRegions } from './chunk-AQNKJRFH.js';
-export { Select } from './chunk-LC3YSAZC.js';
-export { StateBanner } from './chunk-I7INRJO4.js';
-export { TabBar } from './chunk-AVZHJN6C.js';
-export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField } from './chunk-7LDCTU7D.js';
-export { PanelHeader } from './chunk-Y5MRDTLC.js';
-export { ToolbarText } from './chunk-RUNWEPR4.js';
-export { ResizableRegion, clampRegionSize, resizeRegionFromPointer } from './chunk-M5JRI6MN.js';
-export { SegmentedControl } from './chunk-YGN7OMLT.js';
-export { AppTab } from './chunk-2Z5TWHKQ.js';
-export { ListHeader } from './chunk-W5EQ3HYQ.js';
-export { ListItem } from './chunk-L4OKFDJY.js';
-export { ToolbarControlGroup } from './chunk-MFKMHK5W.js';
-export { Toolbar } from './chunk-DAFFDO33.js';
-export { DisclosureArrow } from './chunk-56RJXPHG.js';
-export { LucideIcon } from './chunk-W2FK7ZNY.js';
-export { EmptyState } from './chunk-WVPYVDXY.js';
-export { LoadingSpinner } from './chunk-55DATV3A.js';
-export { ListActionRow } from './chunk-7JB7VPRI.js';
-
-export { Skeleton } from './chunk-B24C4A6T.js';
+export { wireToolbarVisibility } from './chunk-2GOCOLQL.js';
+export { wireOverlaySheets } from './chunk-5NQF35VO.js';
+export { wireResizableRegions } from './chunk-GS2QD3N7.js';
+export { reorderTabs, wireTabBars } from './chunk-K4AT3V3J.js';
+export { wireTokenSearchFields } from './chunk-PKL6QJKK.js';
+
+export { wireScrollDividers } from './chunk-OZ6X76G5.js';
+export { wireComboboxes } from './chunk-FDZNYD4C.js';
+export { wireComposers } from './chunk-ELCMSQNJ.js';
+export { wireCornerStatus } from './chunk-ZKKO4MHC.js';
+export { fileMatchesAccept, wireFilePickers } from './chunk-2MSPNRWJ.js';
+export { wireListFocusScroll } from './chunk-QDSZTQXL.js';
+export { reorderListItems, wireListReorder } from './chunk-MJ5RU6XT.js';
+export { createTokenSearchModel } from './chunk-IM3GKYOG.js';
+export { ValueTable, ValueTableRow } from './chunk-DZJ4GBSP.js';
+export { StateBanner } from './chunk-FNZQOUZ5.js';
+export { SummaryRow } from './chunk-4UB5Z3ZZ.js';
+export { SunkenPanel } from './chunk-D5RGM3XA.js';
+
+export { DialogSurface, PopoverDialogSurface, PopupSurface } from './chunk-BYFTHA4I.js';
+export { TabBar } from './chunk-JOR5LGYE.js';
+export { SegmentedControl } from './chunk-NS2TBYM4.js';
+export { Select } from './chunk-NS762OVM.js';
+export { Spacer } from './chunk-YMUIQRWK.js';
+export { SplitButton } from './chunk-HLDRH23D.js';
+export { IconButton } from './chunk-VFYO3UGZ.js';
+export { IconToggleButton } from './chunk-CA7LNX3J.js';
+export { ListActionRow } from './chunk-SIW64V65.js';
+export { EdgeActivityIndicator } from './chunk-QH5KOFNS.js';
+export { EmptyState } from './chunk-B53PS2LE.js';
+export { FileDropZone, FilePickerTrigger } from './chunk-W4IK7AWD.js';
+export { FramedList, FramedListRow } from './chunk-S2XULQEK.js';
+export { Grid } from './chunk-KCS6NJ3O.js';
+export { ColumnTrack } from './chunk-QYMJHS4K.js';
+export { Combobox } from './chunk-ETCWQLJV.js';
+export { Composer } from './chunk-AV7CPAPT.js';
+export { ContentItem } from './chunk-7IUEBNCO.js';
+export { ContentSwap } from './chunk-EIET4QLK.js';
+export { CornerStatus } from './chunk-G3J7JDP6.js';
+export { openAnchoredSurface, openAnchoredSurfaceAt } from './chunk-3WYREXW4.js';
+export { AppTab } from './chunk-TGLUDQP2.js';
+export { BackdropImage } from './chunk-SCDWURBO.js';
+export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField } from './chunk-MF6ZUUJZ.js';
+export { ResizableRegion, clampRegionSize, resizeRegionFromPointer } from './chunk-Y6KT7ZTR.js';
+export { Row } from './chunk-YQ2AC4E2.js';
+export { ListItem, ListItemLink } from './chunk-ZYU5WRC3.js';
+export { ToolbarText } from './chunk-EKHDLBRP.js';
+
+export { PopupMenu, closePopupMenu, openPopupMenu, openPopupMenuAt } from './chunk-HQZYKJ56.js';
+export { ListHeader } from './chunk-3SKAEPPZ.js';
+export { ListInsetControl } from './chunk-AN5IWMTM.js';
+export { ListInsetText } from './chunk-S4Y3YTAI.js';
+export { DisclosureArrow } from './chunk-3VXDSIBJ.js';
+export { FloatingToolbar } from './chunk-S3ECMF23.js';
+export { ToolbarActionLink, ToolbarControlGroup } from './chunk-2PXZBFEC.js';
+export { Toolbar } from './chunk-CMLPFIC5.js';
+export { List } from './chunk-HZPHCSCS.js';
+
+export { Pane } from './chunk-M5KZ26VV.js';
+
+export { ensureSunkenTexture } from './chunk-IKS72C6P.js';
+export { LucideIcon } from './chunk-LOSRXZAH.js';
+export { LoadingSpinner } from './chunk-WVS6CUCT.js';
+
+export { FieldLabel, Text } from './chunk-LL45C7BB.js';
+export { Skeleton } from './chunk-CVD5IZGB.js';
+export { calc, colorVar, em, fillColor, flex, foregroundColor, foregroundColorVar, lengthVar, pct, plus, px, rem, space, uiColor } from './chunk-IQSRHXZR.js';
+export { Badge } from './chunk-U6QYTMDB.js';
+
+export { Chip } from './chunk-34U4ANDJ.js';
+export { ChoiceChips } from './chunk-FR76ZJQC.js';
 
 //# sourceMappingURL=index.js.map

package/dist/list-action-row.d.ts

@@ -1,29 +1,83 @@
 import { SafeHtml } from 'kerfjs';
+import { L as ListIconTile } from './list-icon-tile-B8dr97OW.js';
+export { a as ListIconTileColor, b as ListIconTileTone } from './list-icon-tile-B8dr97OW.js';
+import { PopupMenuEntry, PopupMenuPlacement } from './popup-menu.js';
+import './css-values.js';
+import './semantic-content-BbzjvSu9.js';
 
 type ListActionRowRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
     'data-component'?: never;
     'data-action'?: never;
     'data-item-id'?: never;
     'data-has-icon'?: never;
+    'data-icon-tile'?: never;
+    'data-icon-tile-tone'?: never;
     'data-multiline'?: never;
+    'data-density'?: never;
+    'data-divider'?: never;
+    'data-busy'?: never;
+    'data-trailing-visibility'?: never;
     'data-state'?: never;
     'data-selected'?: never;
     'data-pressed'?: never;
+    'data-dragging'?: never;
+    'data-drop-position'?: never;
 }>;
 type ListActionRowTrailingAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
     'data-component'?: never;
     'data-action'?: never;
     'data-item-id'?: never;
+    'data-kui-disabled'?: never;
     popoverTarget?: string;
     popoverTargetAction?: 'toggle' | 'show' | 'hide';
     'aria-controls'?: string;
     'aria-haspopup'?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | 'true';
 }>;
-interface ListActionRowProps {
+/** A trailing overflow `PopupMenu` rendered as the row's sibling trailing control. */
+interface ListActionRowTrailingMenu {
+    /** Accessible name of the icon-only menu trigger, such as `Actions for report.json`. */
+    label: string;
+    /** Decorative trigger icon, typically a `MoreHorizontal` `LucideIcon`. */
+    icon: SafeHtml;
+    /** The menu's commands, headings, and dividers; items dispatch their own `data-action`s. */
+    items: readonly PopupMenuEntry[];
+    /** Where the menu opens relative to its trigger. Defaults to `bottom-end`. */
+    placement?: PopupMenuPlacement;
+    disabled?: boolean;
+}
+interface ListActionRowTrailingButtonProps {
+    trailingAction: string;
+    trailingActionLabel: string;
+    /** Decorative dormant content for the trailing button. Must not contain interactive descendants. */
+    trailingActionIcon: SafeHtml;
+    trailingActionDisabled?: boolean;
+    trailingActionTitle?: string;
+    trailingActionAttributes?: ListActionRowTrailingAttributes;
+    trailingMenu?: never;
+}
+interface ListActionRowTrailingMenuProps {
+    /** A trailing overflow menu in place of the trailing button. Import `@kerfjs/ui/popup-menu/register` once. */
+    trailingMenu: ListActionRowTrailingMenu;
+    trailingAction?: never;
+    trailingActionLabel?: never;
+    trailingActionIcon?: never;
+    trailingActionDisabled?: never;
+    trailingActionTitle?: never;
+    trailingActionAttributes?: never;
+}
+interface ListActionRowCommonProps {
     /** Visible dormant content for the primary button. Must not contain interactive descendants. */
     label: string | SafeHtml;
+    description?: string | SafeHtml;
+    status?: string | SafeHtml;
+    busy?: boolean;
+    /** Row height: `standard` is 44px; `compact` is 36px (42px with `iconTile`), the height of a compact `ListItem`. */
+    density?: 'standard' | 'compact';
+    divider?: 'none' | 'before' | 'after' | 'both';
     /** Decorative dormant content for the primary button. Must not contain interactive descendants. */
     icon?: SafeHtml;
+    /** Present `icon` in a filled 32px rounded tile with an 18px glyph: a quiet tone preset, or `{ color, foreground? }` for an application color. */
+    iconTile?: ListIconTile;
     action: string;
     itemId?: string;
     selected?: boolean;
@@ -34,19 +88,22 @@ interface ListActionRowProps {
     state?: string;
     disabled?: boolean;
     tabIndex?: number;
-    /** Render as an unanimated loading skeleton, disabling both actions. */
+    /** Render as an unanimated loading skeleton, disabling both actions: label, description, icon, and status text become skeletons; the `busy` indicator stays live. */
     placeholder?: boolean;
-    trailingAction: string;
-    trailingActionLabel: string;
-    /** Decorative dormant content for the trailing button. Must not contain interactive descendants. */
-    trailingActionIcon: SafeHtml;
-    trailingActionDisabled?: boolean;
-    trailingActionTitle?: string;
+    /** Native HTML drag source (`draggable="true"` on the row root); a placeholder is never draggable. Pair with `wireListReorder` for pointer and keyboard reordering. */
+    draggable?: boolean;
+    /** Dim this row as one of the rows being dragged. */
+    dragging?: boolean;
+    /** Draw the insertion line at this row's leading (`before`) or trailing (`after`) block edge. */
+    dropPosition?: 'before' | 'after';
+    trailingActionVisibility?: 'always' | 'interaction';
     className?: string;
-    style?: string;
     rootAttributes?: ListActionRowRootAttributes;
-    trailingActionAttributes?: ListActionRowTrailingAttributes;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
 }
-declare function ListActionRow({ label, icon, action, itemId, selected, pressed, accessibleLabel, title, multiline, state, disabled, tabIndex, placeholder, trailingAction, trailingActionLabel, trailingActionIcon, trailingActionDisabled, trailingActionTitle, className, style, rootAttributes, trailingActionAttributes }: ListActionRowProps): SafeHtml;
+/** Exactly one trailing control: a native button (`trailingAction*`) or an overflow menu (`trailingMenu`). */
+type ListActionRowProps = ListActionRowCommonProps & (ListActionRowTrailingButtonProps | ListActionRowTrailingMenuProps);
+declare function ListActionRow({ label, description, status, busy, density, divider, icon, iconTile, action, itemId, selected, pressed, accessibleLabel, title, multiline, state, disabled, tabIndex, placeholder, draggable, dragging, dropPosition, trailingAction, trailingActionLabel, trailingActionIcon, trailingActionDisabled, trailingActionTitle, trailingActionVisibility, trailingMenu, className, rootAttributes, trailingActionAttributes, slot, }: ListActionRowProps): SafeHtml;
 
-export { ListActionRow, type ListActionRowProps };
+export { ListActionRow, type ListActionRowProps, type ListActionRowTrailingMenu, ListIconTile };

package/dist/list-action-row.js

@@ -1,4 +1,8 @@
-export { ListActionRow } from './chunk-7JB7VPRI.js';
+export { ListActionRow } from './chunk-SIW64V65.js';
+
+
+
+
 
 
 

package/dist/list-header.d.ts

@@ -1,14 +1,23 @@
 import { SafeHtml } from 'kerfjs';
+import { HeadingLevel } from './toolbar-text.js';
+import './css-values.js';
 
 type ListHeaderRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
     'data-component'?: never;
     'data-action'?: never;
     'data-has-badge'?: never;
     'data-has-count'?: never;
+    'data-density'?: never;
+    'data-size'?: never;
+    'data-divider'?: never;
+    'data-inline'?: never;
+    'data-width'?: never;
+    'data-indicator-tone'?: never;
     'data-toggle'?: never;
 }>;
 type ListHeaderTriggerAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
     'data-action'?: never;
+    'data-kui-disabled'?: never;
     popoverTarget?: string;
     popoverTargetAction?: 'toggle' | 'show' | 'hide';
     'aria-controls'?: string;
@@ -16,28 +25,74 @@ type ListHeaderTriggerAttributes = Readonly<Record<`data-${string}`, string | un
 }>;
 interface ListHeaderBaseProps {
     label: string;
-    action?: string;
-    actionLabel?: string;
-    actionIcon?: SafeHtml;
-    actionDisabled?: boolean;
-    disabledReason?: string;
-    expanded?: boolean;
-    toggle?: boolean;
+    /** Visual label size, independent of the native heading level. Default `sm`. */
+    size?: 'xs' | 'sm' | 'm' | 'l' | 'xl';
+    density?: 'standard' | 'compact';
+    divider?: 'none' | 'before' | 'after' | 'both';
+    /** Shrink-wrap the header without its default outer margin, border, or padding. */
+    inline?: boolean;
+    /** Fill the available row or shrink-wrap while retaining normal header geometry. */
+    width?: 'fill' | 'content';
+    indicatorTone?: 'neutral' | 'accent' | 'pop' | 'danger';
     /** Render as an unanimated loading skeleton: keep the label and action affordance, disable interaction. */
     placeholder?: boolean;
     rootAttributes?: ListHeaderRootAttributes;
     triggerAttributes?: ListHeaderTriggerAttributes;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
 }
+type ListHeaderModeProps = {
+    /** Render the title as a controlled disclosure trigger. */
+    toggle: true;
+    /** A toggle's label is its button text, not a heading. */
+    headingLevel?: never;
+    action: string;
+    expanded: boolean;
+    actionIcon?: SafeHtml;
+    actionLabel?: never;
+    actionDisabled?: boolean;
+    disabledReason?: string;
+} | {
+    /** Render a separately named trailing action. */
+    toggle?: false;
+    /**
+     * Native heading level (`h1`–`h6`) of the label. Default `2`. Match the
+     * document outline; the visual treatment does not change.
+     */
+    headingLevel?: HeadingLevel;
+    action: string;
+    actionLabel: string;
+    actionIcon: SafeHtml;
+    expanded?: never;
+    actionDisabled?: boolean;
+    disabledReason?: string;
+} | {
+    /** Render a passive section heading. */
+    toggle?: false;
+    /**
+     * Native heading level (`h1`–`h6`) of the label. Default `2`. Match the
+     * document outline; the visual treatment does not change.
+     */
+    headingLevel?: HeadingLevel;
+    action?: never;
+    actionLabel?: never;
+    actionIcon?: never;
+    expanded?: never;
+    actionDisabled?: never;
+    disabledReason?: never;
+};
 type ListHeaderIndicatorProps = {
     count: number;
     countLabel: string;
     badge?: never;
+    status?: never;
 } | {
     count?: never;
     countLabel?: never;
-    badge?: SafeHtml;
+    badge?: SafeHtml | undefined;
+    status?: SafeHtml | undefined;
 };
-type ListHeaderProps = ListHeaderBaseProps & ListHeaderIndicatorProps;
-declare function ListHeader({ label, count, countLabel, badge, action, actionLabel, actionIcon, actionDisabled, disabledReason, expanded, toggle, placeholder, rootAttributes, triggerAttributes }: ListHeaderProps): SafeHtml;
+type ListHeaderProps = ListHeaderBaseProps & ListHeaderIndicatorProps & ListHeaderModeProps;
+declare function ListHeader({ label, size, headingLevel, count, countLabel, badge, status, density, divider, inline, width, indicatorTone, action, actionLabel, actionIcon, actionDisabled, disabledReason, expanded, toggle, placeholder, rootAttributes, triggerAttributes, slot, }: ListHeaderProps): SafeHtml;
 
 export { ListHeader, type ListHeaderProps };

package/dist/list-header.js

@@ -1,4 +1,7 @@
-export { ListHeader } from './chunk-W5EQ3HYQ.js';
+export { ListHeader } from './chunk-3SKAEPPZ.js';
+
+
+
 
 
 

package/dist/list-icon-tile-B8dr97OW.d.ts

@@ -0,0 +1,18 @@
+import { CssColor, CssForegroundColor } from './css-values.js';
+
+/**
+ * Quiet tile palette for a list row's leading icon: the same fill, border, and
+ * foreground roles as `ToolbarControlGroup`'s `tileTone`.
+ */
+type ListIconTileTone = 'neutral' | 'brand' | 'success' | 'warning' | 'danger';
+/** A list row's leading icon tile filled with an application-chosen color. */
+interface ListIconTileColor {
+    /** The tile fill: `uiColor()`, `colorVar()`, or `fillColor()` for an app color such as `#e5484d`. */
+    color: CssColor;
+    /** The glyph color over the fill. Defaults to black or white, whichever contrasts with `color`. */
+    foreground?: CssForegroundColor;
+}
+/** A filled leading icon tile: a quiet tone preset or an application color. */
+type ListIconTile = ListIconTileTone | ListIconTileColor;
+
+export type { ListIconTile as L, ListIconTileColor as a, ListIconTileTone as b };

package/dist/list-inset-control.d.ts

@@ -0,0 +1,22 @@
+import * as kerfjs from 'kerfjs';
+import { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+import { S as Sides } from './sides-BPSWde0A.js';
+
+interface ListInsetControlProps {
+    /** Control(s) that own their own border and padding (e.g. an input, a `wa-*`). */
+    children: KerfUiContent;
+    /** Physical inset sides in canonical top/right/bottom/left order. Defaults to all sides. */
+    sides?: Sides;
+    className?: string;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
+}
+/**
+ * Insets a control into a pane/list content region: an 8px inline margin (so its
+ * edges line up with `.kui-content` items) and a stretch flex row with an 8px gap.
+ * Use it for controls that carry their own border and padding but no outer margin
+ * — the wrapper adds only the alignment margin and layout, not a second inset.
+ */
+declare function ListInsetControl({ children, sides, className, slot, }: ListInsetControlProps): kerfjs.SafeHtml;
+
+export { ListInsetControl, type ListInsetControlProps, Sides };

package/dist/list-inset-control.js

@@ -0,0 +1,3 @@
+export { ListInsetControl } from './chunk-AN5IWMTM.js';
+
+//# sourceMappingURL=list-inset-control.js.map

package/dist/list-inset-control.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"list-inset-control.js"}