@kerfjs/ui 5.0.0-beta.11 → 5.0.0-beta.110

package/dist/file-picker.js.map

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

package/dist/flex-alignment-4ms8ZbV8.d.ts

@@ -0,0 +1,5 @@
+type HorizontalAlignment = 'left' | 'l' | 'flex-start' | 'center' | 'c' | 'space-around' | 'right' | 'r' | 'flex-end' | 'full' | 'f' | 'space-between';
+type VerticalAlignment = 'top' | 't' | 'flex-start' | 'middle' | 'm' | 'c' | 'space-around' | 'bottom' | 'b' | 'flex-end' | 'full' | 'f' | 'space-between' | 'baseline';
+type ListVerticalAlignment = Exclude<VerticalAlignment, 'baseline'>;
+
+export type { HorizontalAlignment as H, ListVerticalAlignment as L, VerticalAlignment as V };

package/dist/floating-toolbar.d.ts

@@ -1,10 +1,12 @@
-import { SafeHtml } from 'kerfjs';
+import * as kerfjs from 'kerfjs';
+import { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+import { CssLength } from './css-values.js';
 
 /** Where a {@link FloatingToolbar} floats within its positioned container. */
 type FloatingToolbarPosition = 'bottom' | 'bottom-start' | 'bottom-end' | 'top' | 'top-start' | 'top-end';
 interface FloatingToolbarProps {
     /** Toolbar contents — normally one or more `ToolbarControlGroup`s. */
-    children: SafeHtml | SafeHtml[];
+    children: KerfUiContent;
     /** Accessible name for the toolbar (required — it exposes `role="toolbar"`). */
     label: string;
     /**
@@ -12,17 +14,38 @@ interface FloatingToolbarProps {
      * Default: `'bottom-end'`.
      */
     position?: FloatingToolbarPosition;
+    /** Keep the toolbar in normal document flow instead of floating over content. */
+    placement?: 'floating' | 'inline';
+    /**
+     * Distance from the container edges named by `position`. Default:
+     * `space('m')` (16px, 8px past a top toolbar's own inset). Omit it inside a
+     * `Workbench`, `CollapsiblePanel`, or `ResizableRegion` restore corner: the
+     * corner owns the inset there and sets it to zero.
+     */
+    inset?: CssLength;
+    /** Add device or layout-routed safe-area insets to the positioned edges. */
+    safeAreaInsets?: boolean;
     className?: string;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
 }
 /**
  * A toolbar that floats above the main content of its nearest positioned
  * ancestor — a transparent, forced-dark cluster of controls (e.g. a drawer
  * restore button) that sits over the content but NOT over dialogs or overlays
  * (it is not in the top layer). It is inset from the container edges by
- * `--kui-floating-toolbar-inset` (default `--kui-space-m`, i.e. 8px more than a
- * top toolbar's own inset); override that token to move it. The app owns the
- * controls and their behavior — wire them with `delegate()` as usual.
+ * `inset` (default `--kui-space-m`, i.e. 8px more than a top toolbar's own
+ * inset); pass a typed length to move it. Inside a `Workbench`, `CollapsiblePanel`, or
+ * `ResizableRegion` restore corner the corner owns the inset, so the toolbar
+ * floats from the corner's own position. While one of those layouts has a
+ * side overlay open over the toolbar's region (a Workbench rail overlay, a
+ * `wireSidebar` compact overlay, an overlay `CollapsiblePanel` or horizontal
+ * `ResizableRegion`), the toolbar is hidden — unfocusable and out of the
+ * accessibility tree — until the overlay closes. The app owns the controls
+ * and their behavior — wire them with `delegate()` as usual. Set
+ * `placement="inline"` for normal flow when an owner already positions the
+ * control; floating placement can add safe-area insets to its per-edge tokens.
  */
-declare function FloatingToolbar({ children, label, position, className }: FloatingToolbarProps): SafeHtml;
+declare function FloatingToolbar({ children, label, position, placement, inset, safeAreaInsets, className, slot, }: FloatingToolbarProps): kerfjs.SafeHtml;
 
 export { FloatingToolbar, type FloatingToolbarPosition, type FloatingToolbarProps };

package/dist/floating-toolbar.js

@@ -1,3 +1,3 @@
-export { FloatingToolbar } from './chunk-5E2HVJ33.js';
+export { FloatingToolbar } from './chunk-S3ECMF23.js';
 
 //# sourceMappingURL=floating-toolbar.js.map

package/dist/framed-list.d.ts

@@ -0,0 +1,47 @@
+import * as kerfjs from 'kerfjs';
+import { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+
+/** The frame's fill: the lowered surface (as `ValueTable`), or the page surface. */
+type FramedListSurface = 'lowered' | 'base';
+type FramedListRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
+    'data-component'?: never;
+    'data-surface'?: never;
+}>;
+type FramedListRowRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
+    'data-component'?: never;
+    'data-highlighted'?: never;
+}>;
+interface FramedListProps {
+    /** `FramedListRow` children. */
+    children: KerfUiContent;
+    /** Accessible name for the list, when no heading names it. */
+    label?: string;
+    /** Frame fill; defaults to `lowered`, matching `ValueTable`. */
+    surface?: FramedListSurface;
+    id?: string;
+    className?: string;
+    /** Safe `data-*` metadata; FramedList-owned markers stay protected. */
+    rootAttributes?: FramedListRootAttributes;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
+}
+interface FramedListRowProps {
+    /** Arbitrary row content: a `Row` of copy and controls, a keycap, … */
+    children: KerfUiContent;
+    /** Tint the row (the row being edited or the current item). */
+    highlighted?: boolean;
+    id?: string;
+    className?: string;
+    /** Safe `data-*` metadata; FramedListRow-owned markers stay protected. */
+    rootAttributes?: FramedListRowRootAttributes;
+}
+/**
+ * An inset-grouped list (the settings-list pattern): one rounded, bordered
+ * frame with 1px dividers between rows of arbitrary content. `ValueTable` is
+ * the same frame for label/value facts; this one takes any row content.
+ */
+declare function FramedList({ children, label, surface, id, className, rootAttributes, slot, }: FramedListProps): kerfjs.SafeHtml;
+/** One row of a `FramedList`; it owns the row inset and the divider above it. */
+declare function FramedListRow({ children, highlighted, id, className, rootAttributes, }: FramedListRowProps): kerfjs.SafeHtml;
+
+export { FramedList, type FramedListProps, FramedListRow, type FramedListRowProps, type FramedListSurface };

package/dist/framed-list.js

@@ -0,0 +1,4 @@
+export { FramedList, FramedListRow } from './chunk-S2XULQEK.js';
+
+
+//# sourceMappingURL=framed-list.js.map

package/dist/framed-list.js.map

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

package/dist/grid.d.ts

@@ -0,0 +1,58 @@
+import * as kerfjs from 'kerfjs';
+import { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+import { S as Sides } from './sides-BPSWde0A.js';
+import { UiGap, CssFlexKeyword, CssFlex, CssLength } from './css-values.js';
+export { UiGapValue, UiSpaceName } from './css-values.js';
+
+type GridRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
+    'data-component'?: never;
+    'data-columns'?: never;
+    'data-min-column-width'?: never;
+    'data-auto-fill'?: never;
+    'data-flex'?: never;
+    'data-fill'?: never;
+    'data-text-insets'?: never;
+    'data-control-insets'?: never;
+}>;
+interface GridCommonProps {
+    children?: KerfUiContent;
+    /** Make this a labeled multi-select grid for `ContentItem selectionMode="multiple"` tiles. */
+    selectionMode?: 'multiple';
+    /** Accessible name for the multi-select grid. */
+    ariaLabel?: string;
+    /** One spacing value or separate column and row values. Defaults to xs. */
+    gap?: UiGap;
+    /** Allow this grid to grow/shrink, use a keyword, or supply a typed CSS flex shorthand. */
+    flex?: boolean | CssFlexKeyword | CssFlex;
+    /**
+     * Fill the height of a parent with a definite height, such as an app root or
+     * a fixed-height frame, when this grid is that parent's layout root. Inside a
+     * flex layout use `flex` instead. Defaults to false.
+     */
+    fill?: boolean;
+    /** Physical sides that receive the standard 17px text inset. */
+    textInsets?: Sides;
+    /** Physical sides that receive the standard 8px control inset. Text insets win on overlap. */
+    controlInsets?: Sides;
+    className?: string;
+    /** Safe `data-*` metadata; Grid-owned structural attributes remain protected. */
+    rootAttributes?: GridRootAttributes;
+    /** Native named-slot assignment when composed inside a web component. */
+    slot?: string;
+}
+type GridProps = GridCommonProps & ({
+    /** Number of equal-width columns. Must be a positive safe integer. */
+    columns: number;
+    minColumnWidth?: never;
+    autoFill?: never;
+} | {
+    columns?: never;
+    /** Fit equal columns of at least this width; collapse as the container narrows. */
+    minColumnWidth: CssLength;
+    /** Keep empty tracks instead of stretching a sparse row. Defaults to false. */
+    autoFill?: boolean;
+});
+/** Render equal tracks with a fixed count or a responsive minimum width. */
+declare function Grid({ children, selectionMode, ariaLabel, columns, minColumnWidth, autoFill, gap, flex, fill, textInsets, controlInsets, className, rootAttributes, slot, }: GridProps): kerfjs.SafeHtml;
+
+export { CssFlex, CssFlexKeyword, CssLength, Grid, type GridProps, Sides, UiGap };

package/dist/grid.js

@@ -0,0 +1,6 @@
+export { Grid } from './chunk-KCS6NJ3O.js';
+
+
+
+
+//# sourceMappingURL=grid.js.map

package/dist/grid.js.map

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

package/dist/help-tags-register.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Marker export for tests and tooling; importing this module installs the
+ * document-level help tags that name icon-only controls on hover and
+ * keyboard focus: an icon-only `<button>` or link inside a
+ * `ToolbarControlGroup` (named by `aria-label`, without a native `title`),
+ * plus the icon-only `Select` and `PopupMenu` triggers that `select/register`
+ * and `popup-menu/register` already cover. Import it once in an application
+ * whose toolbars have icon-only buttons but no registered `Select` or
+ * `PopupMenu`; importing it alongside them is harmless.
+ */
+declare const helpTagsRegistered = true;
+
+export { helpTagsRegistered };

package/dist/help-tags-register.js

@@ -0,0 +1,10 @@
+import { installHelpTags } from './chunk-2LM3PYHA.js';
+
+
+// src/wiring/help-tags-register.ts
+installHelpTags();
+var helpTagsRegistered = true;
+
+export { helpTagsRegistered };
+
+//# sourceMappingURL=help-tags-register.js.map

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

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

package/dist/index.d.ts

@@ -1,26 +1,81 @@
-export { AppTab, AppTabProps } from './app-tab.js';
-export { DisclosureArrow, DisclosureArrowProps, DisclosureDirection } from './disclosure-arrow.js';
-export { EmptyState, EmptyStateProps } from './empty-state.js';
+export { Button, ButtonContent, ButtonEmphasis, ButtonLabel, ButtonOptions, ButtonProps, ButtonRootAttributes, ButtonShape, ButtonSize, ButtonTone, ButtonType } from './button.js';
 export { FloatingToolbar, FloatingToolbarPosition, FloatingToolbarProps } from './floating-toolbar.js';
+export { PopupMenu, PopupMenuAnchor, PopupMenuDivider, PopupMenuElement, PopupMenuEntry, PopupMenuHeading, PopupMenuItem, PopupMenuPlacement, PopupMenuProps, closePopupMenu, openPopupMenu, openPopupMenuAt } from './popup-menu.js';
+export { SplitButton, SplitButtonProps, SplitButtonShape, 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 { Checkbox, CheckboxProps, CheckboxRootAttributes, CheckboxSize } from './checkbox.js';
+export { wireCheckboxes } from './wire-checkboxes.js';
+export { CheckboxGroup, CheckboxGroupChoice, CheckboxGroupName, CheckboxGroupOptions, CheckboxGroupOrientation, CheckboxGroupProps, CheckboxGroupRootAttributes, CheckboxGroupSize } from './checkbox-group.js';
+export { ChoiceChips, ChoiceChipsChoice, ChoiceChipsProps, ChoiceChipsSelectionMode, ChoiceChipsSize, ChoiceChipsSwatch } from './choice-chips.js';
+export { readChoiceChips, wireChoiceChips } from './wire-choice-chips.js';
+export { Combobox, ComboboxProps, ComboboxSuggestion } from './combobox.js';
+export { ComboboxCommit, WireComboboxesOptions, wireComboboxes } from './wire-comboboxes.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 { MessageComposer, MessageComposerProps, MessageComposerRootAttributes } from './message-composer.js';
+export { wireMessageComposers } from './wire-message-composers.js';
+export { RadioGroup, RadioGroupChoice, RadioGroupName, RadioGroupOptions, RadioGroupOrientation, RadioGroupProps, RadioGroupRootAttributes, RadioGroupSize } from './radio-group.js';
+export { S as SearchField, a as SearchFieldEditorAttributes, b as SearchFieldModel, c as SearchFieldModelOptions, d as SearchFieldProps, e as SearchFieldResolvedToken, f as SearchFieldRule, g as SearchFieldState, h as SearchFieldStructure, i as SearchFieldSuggestion, j as SearchFieldToken, k as SearchFieldTrailingAction, l as SearchFieldTrailingActionAttributes, m as SearchFieldValue, n as createSearchFieldModel, p as placeSearchFieldCaret, r as readSearchField } from './search-field-CrGTN5sa.js';
+export { SearchFieldCollapsibleOptions, SearchFieldEdit, SearchFieldSubmit, SearchFieldsHandle, WireSearchFieldsOptions, wireSearchFields } from './wire-search-fields.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 { Switch, SwitchProps, SwitchRootAttributes, SwitchSize } from './switch.js';
+export { TextField, TextFieldName, TextFieldOptions, TextFieldProps, TextFieldRootAttributes, TextFieldSize, TextFieldType } from './text-field.js';
+export { wireTextFields } from './wire-text-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 { 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, TokenSearchEdit, TokenSearchFieldsHandle, TokenSearchSubmit, WireTokenSearchFieldsOptions, wireTokenSearchFields } from './wire-token-search-fields.js';
+export { TabBarItem, TabBarItemNameOverflow, TabBarItemPresentation, TabBarItemProps, TabBarItemSize } from './tab-bar-item.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 { DialogCloseSource, DialogRequestCloseDetail, DialogSurface, DialogSurfaceBodyLayout, DialogSurfaceFooterPresentation, DialogSurfaceHeaderPresentation, DialogSurfaceHeight, DialogSurfaceMaxHeight, DialogSurfaceName, DialogSurfaceOptions, DialogSurfacePresentation, DialogSurfaceProps, DialogSurfaceRootAttributes, DialogSurfaceSheetMotion, DialogSurfaceSize, PopoverDialogSurface, PopoverDialogSurfaceDataAttributes, PopoverDialogSurfacePresentation, PopoverDialogSurfaceProps, PopupSurface, PopupSurfaceInset, PopupSurfaceProps, SurfaceInset, closeDialog, openDialog } from './surface-scaffold.js';
+export { wireOverlaySheets } from './wire-overlay-sheets.js';
+export { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+export { ApplySelectionOptions, SelectionGesture, SelectionModifiers, SelectionResult, applySelection, isApplePlatform, selectionGesture } from './selection.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,27 +1,86 @@
-export { wireResizableRegions } from './chunk-AQNKJRFH.js';
-export { reorderTabs, wireTabBars } from './chunk-XXMOARTH.js';
-export { wireTokenSearchFields } from './chunk-LCOBDOCC.js';
-export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField } from './chunk-7LDCTU7D.js';
-export { ValueTable, ValueTableRow } from './chunk-37T3VNIZ.js';
-export { SegmentedControl } from './chunk-YGN7OMLT.js';
-export { Select } from './chunk-CH4SQ6H5.js';
-export { StateBanner } from './chunk-I7INRJO4.js';
-export { TabBar } from './chunk-AVZHJN6C.js';
-export { ListActionRow } from './chunk-7JB7VPRI.js';
-export { PanelHeader } from './chunk-XE5ZLPCC.js';
-export { ToolbarText } from './chunk-RUNWEPR4.js';
-export { ResizableRegion, clampRegionSize, resizeRegionFromPointer } from './chunk-M5JRI6MN.js';
-export { AppTab } from './chunk-2Z5TWHKQ.js';
-export { ListHeader } from './chunk-5ATCDSQS.js';
-export { ListItem } from './chunk-L4OKFDJY.js';
-export { ToolbarControlGroup } from './chunk-RNPGFQ33.js';
-export { Toolbar } from './chunk-DAFFDO33.js';
-
-export { Skeleton } from './chunk-B24C4A6T.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 { FloatingToolbar } from './chunk-5E2HVJ33.js';
+export { reorderTabs, wireTabBars } from './chunk-T74YB76U.js';
+export { wireTextFields } from './chunk-KC6WUSNS.js';
+export { wireToolbarVisibility } from './chunk-2GOCOLQL.js';
+export { reorderListItems, wireListReorder } from './chunk-MJ5RU6XT.js';
+export { wireMessageComposers } from './chunk-HTERKONR.js';
+export { wireOverlaySheets } from './chunk-4RECPEHI.js';
+export { wireResizableRegions } from './chunk-GS2QD3N7.js';
+export { wireSearchFields } from './chunk-UMNHJSIO.js';
+export { readChoiceChips, wireChoiceChips } from './chunk-K57NINLH.js';
+export { wireComboboxes } from './chunk-MVKHSAKE.js';
+export { wireCornerStatus } from './chunk-ZKKO4MHC.js';
+export { fileMatchesAccept, wireFilePickers } from './chunk-KK3S5OTW.js';
+export { wireListFocusScroll } from './chunk-QDSZTQXL.js';
+export { ValueTable, ValueTableRow } from './chunk-DZJ4GBSP.js';
+
+export { wireScrollDividers } from './chunk-OZ6X76G5.js';
+export { wireCheckboxes } from './chunk-CNM6ZWP2.js';
+export { TabBarItem } from './chunk-ZCDRLN3B.js';
+export { TabBar } from './chunk-7AK5I7U7.js';
+export { TextField } from './chunk-36HVQ72F.js';
+export { Spacer } from './chunk-YMUIQRWK.js';
+export { SplitButton } from './chunk-TI2GV36S.js';
+export { StateBanner } from './chunk-2FW7D4IG.js';
+export { SummaryRow } from './chunk-4UB5Z3ZZ.js';
+export { SunkenPanel } from './chunk-D5RGM3XA.js';
+export { createSearchFieldModel } from './chunk-CIAUILRR.js';
+export { SegmentedControl } from './chunk-LZUUUHNH.js';
+export { Select } from './chunk-ZX2QQJXD.js';
+
+export { applySelection, isApplePlatform, selectionGesture } from './chunk-GXSX6Q6O.js';
+export { MessageComposer } from './chunk-4OV272LF.js';
+export { RadioGroup } from './chunk-OHPYT2BH.js';
+export { DialogSurface, PopoverDialogSurface, PopupSurface } from './chunk-6CDILXF4.js';
+export { closeDialog, openDialog } from './chunk-ATGAJVZ6.js';
+
+export { EmptyState } from './chunk-B53PS2LE.js';
+export { FileDropZone, FilePickerTrigger } from './chunk-KDQZ3E5C.js';
+export { FramedList, FramedListRow } from './chunk-S2XULQEK.js';
+export { Grid } from './chunk-KCS6NJ3O.js';
+
+export { ListActionRow } from './chunk-JCCN3U6X.js';
+export { ContentItem } from './chunk-5USKCWGL.js';
+export { ContentSwap } from './chunk-EIET4QLK.js';
+export { CornerStatus } from './chunk-G3J7JDP6.js';
+export { EdgeActivityIndicator } from './chunk-QH5KOFNS.js';
+export { Chip } from './chunk-LMHN2TJL.js';
+export { ChoiceChips } from './chunk-ITUQC4FW.js';
+export { ColumnTrack } from './chunk-QYMJHS4K.js';
+export { Combobox } from './chunk-BKUMG2KB.js';
+export { openAnchoredSurface, openAnchoredSurfaceAt } from './chunk-3WYREXW4.js';
+export { BackdropImage } from './chunk-SCDWURBO.js';
+export { Button } from './chunk-KPINJHIC.js';
+export { Switch } from './chunk-LTBVP6VN.js';
+export { Row } from './chunk-AMIHGFLP.js';
+export { SearchField, placeSearchFieldCaret, readSearchField } from './chunk-VEME3D7K.js';
+export { ResizableRegion, clampRegionSize, resizeRegionFromPointer } from './chunk-Y6KT7ZTR.js';
+export { ToolbarText } from './chunk-EKHDLBRP.js';
+export { ListHeader } from './chunk-NR6O74ST.js';
+export { FieldLabel, Text } from './chunk-7K6U6FCN.js';
+export { ListInsetControl } from './chunk-AN5IWMTM.js';
+export { ListInsetText } from './chunk-S4Y3YTAI.js';
+export { ListItem, ListItemLink } from './chunk-3GLYIIFR.js';
+export { FloatingToolbar } from './chunk-S3ECMF23.js';
+export { PopupMenu, closePopupMenu, openPopupMenu, openPopupMenuAt } from './chunk-OQP3PFKQ.js';
+
+
+
+export { Skeleton } from './chunk-CVD5IZGB.js';
+export { DisclosureArrow } from './chunk-TKNVL53O.js';
+export { ToolbarActionLink, ToolbarControlGroup } from './chunk-5J6Z4BWY.js';
+export { Toolbar } from './chunk-ZN7KUMPY.js';
+export { Pane } from './chunk-HQZG3OFL.js';
+
+export { ensureSunkenTexture } from './chunk-IKS72C6P.js';
+export { List } from './chunk-NB6POCFH.js';
+
+
+export { LoadingSpinner } from './chunk-WVS6CUCT.js';
+export { Badge } from './chunk-RMWNO6BA.js';
+export { CheckboxGroup } from './chunk-HU5IHXCI.js';
+export { Checkbox } from './chunk-C26Q6P4Q.js';
+export { LucideIcon } from './chunk-HJXVVFBT.js';
+export { calc, colorVar, em, fillColor, flex, foregroundColor, foregroundColorVar, lengthVar, pct, plus, px, rem, space, uiColor } from './chunk-IQSRHXZR.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,11 @@
-export { ListActionRow } from './chunk-7JB7VPRI.js';
+export { ListActionRow } from './chunk-JCCN3U6X.js';
+
+
+
+
+
+
+