@tensor_1/react 2.16.0 → 2.17.0

package/dist/index.d.cts

@@ -1,9 +1,9 @@
 import * as react from 'react';
-import { RefObject, ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, HTMLAttributes, TextareaHTMLAttributes, SelectHTMLAttributes, CSSProperties, AnchorHTMLAttributes, DetailsHTMLAttributes, TdHTMLAttributes, TableHTMLAttributes, ThHTMLAttributes } from 'react';
+import { RefObject, ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, AriaAttributes, HTMLAttributes, TextareaHTMLAttributes, SelectHTMLAttributes, AnchorHTMLAttributes, DetailsHTMLAttributes, TdHTMLAttributes, TableHTMLAttributes, ThHTMLAttributes } from 'react';
 
 declare function cx(...args: (string | false | null | undefined | 0)[]): string;
 
-declare function useDialog(open: boolean): React.RefObject<HTMLDialogElement>;
+declare function useDialog(open: boolean, onClose?: () => void): React.RefObject<HTMLDialogElement>;
 
 /**
  * uix table engine — framework-agnostic, dependency-free logic for data grids.
@@ -114,6 +114,11 @@ interface UseTableResult<T> {
     pinned: ReadonlySet<string>;
     /** header select-all tri-state over the current derived rows. */
     selectAll: SelectAllState;
+    /**
+     * Screen-reader status text reflecting the latest change — "Sorted by {field}, {dir}",
+     * "{n} results" (filter/search), "{n} selected". Pass to `<TableWrap announcement>` (UIX-A11Y-2).
+     */
+    announcement: string;
     /** cycle a column's sort; pass additive (⇧-click) to keep it as a secondary key. */
     toggleSort: (field: string, additive?: boolean) => void;
     setSort: (keys: SortKey[]) => void;
@@ -265,8 +270,19 @@ interface InputGroupProps {
     leadingIcon?: ReactNode;
     trailingIcon?: ReactNode;
     className?: string;
+    /** Injected by `<Field>` when it wraps the group; forwarded onto the child control. */
+    id?: string;
+    'aria-describedby'?: string;
+    'aria-invalid'?: AriaAttributes['aria-invalid'];
+    'aria-required'?: AriaAttributes['aria-required'];
 }
-declare function InputGroup({ children, leadingIcon, trailingIcon, className }: InputGroupProps): react.JSX.Element;
+/**
+ * Icon-adorned wrapper for a child `<Input>`. The control is passed as `children`, so
+ * `<Field>`'s injected `id`/`aria-*` land on this wrapper — they're forwarded onto the
+ * single child element (the child's own props win) so label/message association survives
+ * the extra div (UIX-A11Y-3).
+ */
+declare function InputGroup({ children, leadingIcon, trailingIcon, className, id, 'aria-describedby': describedBy, 'aria-invalid': invalid, 'aria-required': required, }: InputGroupProps): react.JSX.Element;
 
 interface ComboboxOption {
     value: string;
@@ -313,8 +329,10 @@ declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttri
 interface RadioGroupProps {
     children: ReactNode;
     className?: string;
+    /** Group name; when set the group renders as fieldset/legend so it's announced with each radio. */
+    label?: ReactNode;
 }
-declare function RadioGroup({ children, className }: RadioGroupProps): react.JSX.Element;
+declare function RadioGroup({ children, className, label }: RadioGroupProps): react.JSX.Element;
 
 interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
     label?: ReactNode;
@@ -333,18 +351,17 @@ interface FieldProps {
 }
 declare function Field({ label, hint, error, success, required, children, className, htmlFor }: FieldProps): react.JSX.Element;
 
-interface ModalProps {
+interface ModalProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
     open: boolean;
     onClose?: () => void;
     title?: ReactNode;
     children?: ReactNode;
     footer?: ReactNode;
-    className?: string;
-    style?: CSSProperties;
+    /** Accessible name for the close button (default "Close dialog"). */
     closeLabel?: string;
     role?: 'dialog' | 'alertdialog';
 }
-declare function Modal({ open, onClose, title, children, footer, className, style, closeLabel, role }: ModalProps): react.JSX.Element;
+declare function Modal({ open, onClose, title, children, footer, className, closeLabel, role, ...rest }: ModalProps): react.JSX.Element;
 
 interface ConfirmDialogProps {
     open: boolean;
@@ -377,17 +394,16 @@ interface PromptDialogProps {
 }
 declare function PromptDialog({ open, title, description, inputLabel, defaultValue, placeholder, submitLabel, cancelLabel, closeLabel, onSubmit, onCancel, validate, pending }: PromptDialogProps): react.JSX.Element;
 
-interface DrawerProps {
+interface DrawerProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
     open: boolean;
     onClose?: () => void;
     title?: ReactNode;
     children?: ReactNode;
     footer?: ReactNode;
-    className?: string;
 }
-declare function Drawer({ open, onClose, title, children, footer, className }: DrawerProps): react.JSX.Element;
+declare function Drawer({ open, onClose, title, children, footer, className, ...rest }: DrawerProps): react.JSX.Element;
 
-interface PeekProps {
+interface PeekProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
     open: boolean;
     onClose?: () => void;
     title?: ReactNode;
@@ -396,18 +412,19 @@ interface PeekProps {
     onNavPrev?: () => void;
     onNavNext?: () => void;
     hint?: string;
-    className?: string;
 }
-declare function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, className }: PeekProps): react.JSX.Element;
+declare function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, className, onClick, ...rest }: PeekProps): react.JSX.Element;
 
 interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     title?: ReactNode;
+    /** Element for the title — pick a real heading to slot the card into the page outline (UIX-A11Y-4). Default `div` keeps legacy rendering. */
+    titleAs?: 'h2' | 'h3' | 'h4' | 'div';
     subtitle?: ReactNode;
     headerAction?: ReactNode;
     footer?: ReactNode;
     children?: ReactNode;
 }
-declare function Card({ title, subtitle, headerAction, footer, children, className, ...props }: CardProps): react.JSX.Element;
+declare function Card({ title, titleAs: TitleTag, subtitle, headerAction, footer, children, className, ...props }: CardProps): react.JSX.Element;
 interface CardLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'title'> {
     title?: ReactNode;
     subtitle?: ReactNode;
@@ -435,6 +452,8 @@ declare function Breadcrumbs({ items, label, separator, className, ...props }: B
 interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
     eyebrow?: ReactNode;
     title: ReactNode;
+    /** Heading level for the title — drop to `h2` when the page already owns an `h1` (UIX-A11Y-4). */
+    as?: 'h1' | 'h2';
     /** Supporting copy under the title. */
     subtitle?: ReactNode;
     /** Right-aligned action area (buttons, menus). */
@@ -444,7 +463,7 @@ interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
  * Page header — eyebrow / title / subtitle + actions row, over `.uix-page-header`.
  * The hairline + breathing room below come from the component CSS.
  */
-declare function PageHeader({ eyebrow, title, subtitle, actions, className, ...props }: PageHeaderProps): react.JSX.Element;
+declare function PageHeader({ eyebrow, title, subtitle, actions, as: TitleTag, className, ...props }: PageHeaderProps): react.JSX.Element;
 
 interface DetailLayoutProps extends HTMLAttributes<HTMLDivElement> {
     /** The narrow trailing column (record meta, side panels). */
@@ -589,6 +608,18 @@ interface TabProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange'> {
     disabled?: boolean;
 }
 declare function Tab({ value, children, disabled, className, onClick, ...props }: TabProps): react.JSX.Element;
+interface TabPanelProps extends HTMLAttributes<HTMLDivElement> {
+    /** The owning `<Tab>`'s value — the panel renders only while that tab is selected. */
+    value: string;
+    children?: ReactNode;
+}
+/**
+ * The tabpanel paired with a `<Tab>` by `value` (UIX-A11Y-2): labelled by its tab,
+ * `tabIndex 0` so Tab from the tablist lands in the content, rendered only while
+ * selected. Place it as a direct child of `<Tabs>` — it is hoisted out of the tablist —
+ * or anywhere the Tabs context reaches.
+ */
+declare function TabPanel({ value, children, ...props }: TabPanelProps): react.JSX.Element | null;
 
 type ShellNav = 'full' | 'rail' | 'hidden';
 interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
@@ -606,11 +637,13 @@ interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
     onExitFocus?: () => void;
     /** Drop the content gutter so a genuinely wide table runs edge-to-edge. */
     mainBleed?: boolean;
+    /** id given to `<main>` and targeted by the skip link. Override on collision (UIX-A11Y-2). */
+    mainId?: string;
     sidebar?: ReactNode;
     topbar?: ReactNode;
     children?: ReactNode;
 }
-declare function AppShell({ nav, collapsed, focus, onExitFocus, mainBleed, sidebar, topbar, children, className, ...props }: AppShellProps): react.JSX.Element;
+declare function AppShell({ nav, collapsed, focus, onExitFocus, mainBleed, mainId, sidebar, topbar, children, className, ...props }: AppShellProps): react.JSX.Element;
 
 interface SidebarProps extends HTMLAttributes<HTMLElement> {
     collapsed?: boolean;
@@ -749,8 +782,10 @@ declare function Alert({ tone, title, icon, children, className, ...props }: Ale
 interface SpinnerProps extends HTMLAttributes<HTMLSpanElement> {
     size?: 'md' | 'lg';
     accent?: boolean;
+    /** Announced loading text (default "Loading…"). */
+    label?: string;
 }
-declare function Spinner({ size, accent, className, ...props }: SpinnerProps): react.JSX.Element;
+declare function Spinner({ size, accent, label, className, ...props }: SpinnerProps): react.JSX.Element;
 
 type ToastTone = 'success' | 'danger' | 'info';
 interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
@@ -768,6 +803,11 @@ interface ToasterProps extends HTMLAttributes<HTMLDivElement> {
 declare function Toaster({ children, className, ...props }: ToasterProps): react.JSX.Element;
 
 interface TableWrapProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Polite live-region text for table state changes — "Sorted by …", "N results",
+     * "N selected". Pass `useTable().announcement` straight through (UIX-A11Y-2).
+     */
+    announcement?: string;
     children?: ReactNode;
 }
 declare const TableWrap: react.ForwardRefExoticComponent<TableWrapProps & react.RefAttributes<HTMLDivElement>>;
@@ -819,9 +859,11 @@ interface RowActionProps extends ButtonHTMLAttributes<HTMLButtonElement> {
 declare function RowAction({ children, className, type, ...props }: RowActionProps): react.JSX.Element;
 interface ExpandToggleProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     expanded?: boolean;
+    /** id of the detail row this toggle controls → `aria-controls` (UIX-A11Y-2). */
+    controls?: string;
 }
 /** Chevron button that expands/collapses an inline detail row. */
-declare function ExpandToggle({ expanded, className, type, ...props }: ExpandToggleProps): react.JSX.Element;
+declare function ExpandToggle({ expanded, controls, className, type, ...props }: ExpandToggleProps): react.JSX.Element;
 /** Emphasised primary cell text. */
 declare function CellStrong({ children, className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
 /** Secondary line under a primary cell value (muted, meta size). */
@@ -863,8 +905,10 @@ interface ProgressProps extends HTMLAttributes<HTMLDivElement> {
     max?: number;
     /** Continuous slide animation when the amount of work is unknown. */
     indeterminate?: boolean;
+    /** Accessible name — rendered as `aria-label` (an explicit `aria-label` prop wins). */
+    label?: string;
 }
-declare function Progress({ value, max, indeterminate, className, ...props }: ProgressProps): react.JSX.Element;
+declare function Progress({ value, max, indeterminate, label, className, ...props }: ProgressProps): react.JSX.Element;
 
 /** Fill color tone for the meter bar. Defaults to `success` (green). */
 type MeterTone = 'success' | 'warning' | 'danger' | 'attention' | 'overdue';
@@ -873,9 +917,11 @@ interface MeterProps extends HTMLAttributes<HTMLDivElement> {
     value?: number;
     /** Threshold tone applied via `data-tone` on the fill element. `success` is the implicit default (no attribute). */
     tone?: MeterTone;
+    /** Accessible name — rendered as `aria-label` (an explicit `aria-label` prop wins). */
+    label?: string;
 }
 /** Horizontal utilization / threshold bar backed by `.uix-meter`. */
-declare function Meter({ value, tone, className, ...props }: MeterProps): react.JSX.Element;
+declare function Meter({ value, tone, label, className, ...props }: MeterProps): react.JSX.Element;
 
 interface StatTrend {
     direction: 'up' | 'down';
@@ -905,7 +951,9 @@ interface TooltipProps extends HTMLAttributes<HTMLSpanElement> {
  * Tooltip whose bubble renders in the top layer via the native Popover API, so it
  * escapes any `overflow: hidden/scroll` ancestor that would clip the old CSS-only
  * `[data-uix-tip]` tooltip (UIX-FIX-02). Positioned by the shared overlay engine
- * (flip/shift), shown on hover and keyboard focus, dismissed on blur or Escape.
+ * (flip/shift), shown on hover and keyboard focus, dismissed on blur or Escape
+ * (document-level, per WCAG 1.4.13), and hoverable: the bubble stays open while
+ * the pointer is over it (UIX-A11Y-1).
  */
 declare function Tooltip({ label, placement, className, children, ...props }: TooltipProps): react.JSX.Element;
 
@@ -957,6 +1005,7 @@ interface LoadingStateProps extends HTMLAttributes<HTMLDivElement> {
     /** Number of skeleton rows to render. */
     rows?: number;
     density?: 'compact' | 'comfortable';
+    /** Announced loading text (default "Loading"). */
     label?: string;
 }
 /** A stack of skeleton rows for list/section loading. `role="status"`. */
@@ -1039,7 +1088,11 @@ declare function UserChip({ avatar, name, sub, className, children, ...props }:
 interface CommentsProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
 }
-/** Comment thread container over `.uix-comments`. */
+/**
+ * Comment thread container over `.uix-comments`. role="log" is an implicit polite
+ * live region: comments appended after initial render are announced, the initial
+ * list is not (UIX-A11Y-3). Pass `role` to override.
+ */
 declare function Comments({ children, className, ...props }: CommentsProps): react.JSX.Element;
 interface CommentProps extends HTMLAttributes<HTMLDivElement> {
     /** Usually an `<Avatar />` (the grid reserves the leading column). */
@@ -1053,6 +1106,8 @@ declare function Comment({ avatar, author, meta, children, className, ...props }
 
 interface ComposerProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
+    /** Accessible name for the child `<textarea>`; applied as its `aria-label`. */
+    label?: string;
 }
 /**
  * Composer surface over `.uix-composer` — a single box that owns the
@@ -1060,8 +1115,13 @@ interface ComposerProps extends HTMLAttributes<HTMLDivElement> {
  * `<ComposerBar>` inside; the descendant `textarea` picks up the composer's
  * padding/typography automatically, so the input never reads as a second
  * nested box.
+ *
+ * A placeholder is not an accessible name, so the composer labels a bare child
+ * `<textarea>` with `label` (default "Add a comment"); a textarea that brings its
+ * own `aria-label`/`aria-labelledby` — or an `id` (likely tied to an external
+ * `<label htmlFor>`) — is left untouched (UIX-A11Y-3).
  */
-declare function Composer({ children, className, ...props }: ComposerProps): react.JSX.Element;
+declare function Composer({ children, className, label, ...props }: ComposerProps): react.JSX.Element;
 interface ComposerBarProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
 }
@@ -1166,12 +1226,12 @@ type SavedViewMenuProps = SavedViewMenuBaseProps & ({
 /** Generic saved-view selector. Persistence, ownership and authorization remain application concerns. */
 declare function SavedViewMenu({ items, onSelect, onPinChange, pinLabel, unpinLabel, emptyLabel, actions, footer }: SavedViewMenuProps): react.JSX.Element;
 
-interface TimelineProps extends HTMLAttributes<HTMLDivElement> {
+interface TimelineProps extends HTMLAttributes<HTMLOListElement> {
     children?: ReactNode;
 }
-/** Activity timeline container over `.uix-timeline`. */
+/** Activity timeline container over `.uix-timeline`. Ordered list so AT reads entry count + sequence (UIX-A11Y-4). */
 declare function Timeline({ children, className, ...props }: TimelineProps): react.JSX.Element;
-interface TimelineItemProps extends HTMLAttributes<HTMLDivElement> {
+interface TimelineItemProps extends HTMLAttributes<HTMLLIElement> {
     /**
      * Custom rail node — an icon puck, an avatar, a tinted dot. Defaults to the
      * accent `.uix-timeline__node` dot. Supply this to make a heterogeneous feed
@@ -1278,7 +1338,9 @@ interface CommandPaletteProps extends HTMLAttributes<HTMLDivElement> {
 }
 /**
  * ⌘K command palette surface over `.uix-cmdk`. Presentational: mount it inside a
- * Modal/Popover and wire search + keyboard selection in the consumer.
+ * Modal/Popover and wire search + keyboard selection in the consumer. The input is
+ * a combobox over the listbox of `CommandItem`s; spreads override every default, so
+ * consumers already passing their own roles/labels keep working.
  */
 declare function CommandPalette({ inputProps, children, className, ...props }: CommandPaletteProps): react.JSX.Element;
 interface CommandGroupProps {
@@ -1295,17 +1357,27 @@ interface CommandItemProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
 }
 /** A single command row over `.uix-cmdk__item`. */
-declare function CommandItem({ icon, shortcut, active, children, className, ...props }: CommandItemProps): react.JSX.Element;
+declare function CommandItem({ icon, shortcut, active, children, className, id, ...props }: CommandItemProps): react.JSX.Element;
 
 interface InboxProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Which pane a narrow viewport (<700px) shows: 'list' (default, matches the old
+     * behaviour) or 'detail'. Consumers should render a Back control in the detail pane
+     * on narrow viewports to return to the list (UIX-A11Y-2).
+     */
+    view?: 'list' | 'detail';
     children?: ReactNode;
 }
 /** Two-pane inbox master-detail container backed by `.uix-inbox`. Place `<InboxList>` and `<InboxDetail>` as children. */
-declare function Inbox({ children, className, ...props }: InboxProps): react.JSX.Element;
+declare function Inbox({ view, children, className, ...props }: InboxProps): react.JSX.Element;
 interface InboxListProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
 }
-/** Left-pane item list. Place `<InboxItem>` children here. */
+/**
+ * Left-pane item list. Place `<InboxItem>` children here. A keyboard listbox
+ * (UIX-A11Y-2): the list is the single tab stop; ArrowUp/ArrowDown/Home/End move the
+ * active option via `aria-activedescendant`, Enter/Space click it.
+ */
 declare function InboxList({ children, className, ...props }: InboxListProps): react.JSX.Element;
 interface InboxItemProps extends HTMLAttributes<HTMLDivElement> {
     /** Primary subject / title line. */
@@ -1321,7 +1393,7 @@ interface InboxItemProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
 }
 /** A single inbox row with subject, preview excerpt, optional leading slot, and unread/selected states. */
-declare function InboxItem({ subject, preview, leading, unread, selected, children, className, ...props }: InboxItemProps): react.JSX.Element;
+declare function InboxItem({ subject, preview, leading, unread, selected, children, className, id, ...props }: InboxItemProps): react.JSX.Element;
 interface InboxDetailProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
 }
@@ -1329,25 +1401,39 @@ interface InboxDetailProps extends HTMLAttributes<HTMLDivElement> {
 declare function InboxDetail({ children, className, ...props }: InboxDetailProps): react.JSX.Element;
 
 interface KanbanProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Polite live-region text for keyboard moves (UIX-A11Y-2). `onMove` implementations
+     * should set it, e.g. "Card X moved to Doing, position 2 of 4".
+     */
+    announcement?: string;
     children?: ReactNode;
 }
-declare function Kanban({ children, className, ...props }: KanbanProps): react.JSX.Element;
+declare function Kanban({ announcement, children, className, ...props }: KanbanProps): react.JSX.Element;
 interface KanbanColumnProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     title?: ReactNode;
     count?: number;
     children?: ReactNode;
 }
 declare function KanbanColumn({ title, count, children, className, ...props }: KanbanColumnProps): react.JSX.Element;
+type KanbanMoveDirection = 'up' | 'down' | 'left' | 'right';
 interface KanbanCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     title?: ReactNode;
     meta?: ReactNode;
+    /**
+     * Keyboard move contract (UIX-A11Y-2): when provided, Alt+Arrow on the focused card
+     * calls it — the same accelerator convention as NavFavourites row moves. Pair with
+     * the board-level `announcement` so SR users hear the result.
+     */
+    onMove?: (dir: KanbanMoveDirection) => void;
     children?: ReactNode;
 }
-declare function KanbanCard({ title, meta, children, className, ...props }: KanbanCardProps): react.JSX.Element;
+declare function KanbanCard({ title, meta, children, className, onMove, onKeyDown, ...props }: KanbanCardProps): react.JSX.Element;
 
 interface TreeNodeData {
     id: string;
     label: ReactNode;
+    /** Plain-text label for keyboard typeahead when `label` is not a string (UIX-A11Y-2). */
+    typeaheadLabel?: string;
     icon?: ReactNode;
     children?: TreeNodeData[];
 }
@@ -1396,6 +1482,10 @@ declare function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, se
 interface TreeLike<T> {
     id: string;
     children?: T[];
+    /** The display label — typeahead matches it only when it is a plain string (UIX-A11Y-2). */
+    label?: unknown;
+    /** Explicit typeahead text for nodes whose `label` is not a string (rich ReactNode labels). */
+    typeaheadLabel?: string;
 }
 interface FlatNode<T> {
     node: T;
@@ -2047,4 +2137,4 @@ declare function hsvToHex(value: HsvColor): string;
 declare function contrastRatio(background: string, foreground: string): number | undefined;
 declare function meetsContrast(background: string, foreground: string, minimum?: number): boolean;
 
-export { type AccessStateProps, Alert, type AlertProps, type AlertTone, type Align, AppShell, type AppShellProps, type AppliedBrandProfileSnapshot, type AsyncOperationState, AsyncOperationStatus, type AsyncOperationStatusProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type BoundedRelationshipGraph, type BrandProfile, BrandProfileEditor, type BrandProfileEditorProps, type BrandProfileLogo, type BrandProfileTypography, BrandProfiles, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, BuilderCanvas, type BuilderCanvasItem, type BuilderCanvasProps, type BuilderPaletteItem, BulkBar, type BulkBarProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, type CalendarDay, Card, CardLink, type CardLinkProps, type CardProps, CellStrong, CellSub, Checkbox, type CheckboxProps, CollapsibleSection, type CollapsibleSectionProps, ColorPicker, type ColorPickerProps, type ColumnFilter, Combobox, type ComboboxOption, type ComboboxProps, CommandGroup, type CommandGroupProps, CommandItem, type CommandItemProps, CommandPalette, type CommandPaletteProps, Comment, type CommentProps, Comments, type CommentsProps, Composer, ComposerBar, type ComposerBarProps, type ComposerProps, ConfirmDialog, type ConfirmDialogProps, ContentList, ContentListItem, type ContentListItemProps, type ContentListProps, DateRangePicker, type DateRangePickerProps, type DateRangeValue, DescriptionItem, type DescriptionItemProps, DescriptionList, type DescriptionListItem, type DescriptionListProps, DetailLayout, type DetailLayoutProps, DetailPage, type DetailPageMetric, type DetailPageProps, type DetailPageTab, type DiffEntry, type DiffKind, type DiffResolution, type DiffSummary, DiffViewer, type DiffViewerProps, Drawer, type DrawerProps, EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, EventRow, type EventRowProps, ExpandToggle, type ExpandToggleProps, FeaturedRundown, FeaturedRundownItem, type FeaturedRundownItemProps, type FeaturedRundownProps, FeaturedStage, type FeaturedStageProps, Field, type FieldProps, type FilterKind, type FilterOp, type FilterOption, FilterPopover, type FilterPopoverProps, FilteredEmptyState, type FlatNode, Flow, FlowNode, type FlowNodeProps, type FlowNodeState, type FlowProps, type FlowVariant, ForbiddenState, Highlighted, type HighlightedProps, type HsvColor, Inbox, InboxDetail, type InboxDetailProps, InboxItem, type InboxItemProps, InboxList, type InboxListProps, type InboxProps, Input, InputGroup, type InputGroupProps, type InputProps, type JsonPrimitive, type JsonValue, Kanban, KanbanCard, type KanbanCardProps, KanbanColumn, type KanbanColumnProps, type KanbanProps, Label, type LabelProps, LicensePositionBar, type LicensePositionBarProps, List, ListItem, type ListItemProps, type ListProps, LoadingState, type LoadingStateProps, Mark, type MarkProps, type MatchBulkResult, MatchReview, type MatchReviewAction, type MatchReviewCandidate, type MatchReviewField, type MatchReviewProps, Meter, type MeterProps, type MeterTone, MetricInput, type MetricInputProps, Modal, type ModalProps, type NavFavouriteItem, NavFavourites, type NavFavouritesLabels, type NavFavouritesProps, NavGroup, type NavGroupProps, NavItem, type NavItemProps, NewsLead, type NewsLeadProps, NotFoundState, Note, type NoteProps, type NoteTone, NoticeQueue, type NoticeQueueProps, PageHeader, type PageHeaderProps, PageIntro, type PageIntroProps, Pagination, type PaginationProps, Peek, type PeekProps, type PillTone, type PillTreatment, Pipeline, type PipelineProps, PipelineStage, type PipelineStageProps, type PipelineStageState, type Placement, Popover, type PopoverProps, type PositionOptions, type PositionResult, type PositionedRelationshipNode, type Primitive, Progress, type ProgressProps, PromptDialog, type PromptDialogProps, Prose, type ProseProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type Rect, type RelatedLinkItem, RelatedLinks, type RelatedLinksProps, RelationshipGraph, type RelationshipGraphEdge, type RelationshipGraphLegendItem, type RelationshipGraphNode, type RelationshipGraphProps, RelativeTime, type RelativeTimeFormatContext, type RelativeTimeProps, type RelativeTimeUnit, type RelativeTimeValue, ResourceGrid, type ResourceGridProps, type RgbColor, type Row, RowAction, type RowActionProps, RowActions, type RowActionsProps, type RuleAction, type RuleActionDefinition, RuleBuilder, type RuleBuilderProps, type RuleCondition, type RuleDefinition, type RuleFieldDefinition, type RuleGroup, type RuleOperatorDefinition, type RuleValidationIssue, type RuleValueEditorProps, type SavedViewItem, SavedViewMenu, type SavedViewMenuProps, SchedulingCalendar, type SchedulingCalendarEntry, type SchedulingCalendarOverlay, type SchedulingCalendarProps, type SchedulingCalendarView, type SchedulingEntryState, type SchedulingOverlayKind, SectionHead, type SectionHeadProps, type Segment, Segmented, SegmentedOption, type SegmentedOptionProps, type SegmentedProps, Select, type SelectAllState, type SelectProps, type ShellNav, type Side, Sidebar, type SidebarProps, SidebarSection, type SidebarSectionProps, type Size, Skeleton, type SkeletonProps, type SortDir, type SortDirection, type SortKey, Spinner, type SpinnerProps, StarButton, type StarButtonProps, Stat, StatLine, type StatLineItem, type StatLineProps, type StatProps, type StatTrend, type StateVariant, StatusPill, type StatusPillProps, StatusRow, type StatusRowProps, SubNavItem, type SubNavItemProps, Switch, type SwitchProps, Tab, type TabProps, Table, type TableDensity, type TableProps, TableWrap, type TableWrapProps, Tabs, type TabsProps, Td, type TdProps, Textarea, type TextareaProps, Th, type ThProps, Timeline, TimelineItem, type TimelineItemProps, type TimelineProps, Toast, type ToastProps, type ToastTone, Toaster, type ToasterProps, ToggleRow, type ToggleRowProps, Tooltip, type TooltipProps, Tr, type TrProps, Tree, type TreeLike, type TreeNavAction, type TreeNodeData, type TreeNodeProps, type TreeProps, type UseAnchoredPositionOptions, type UseTableOptions, type UseTableResult, type UseVirtualRowsOptions, type UseVirtualRowsResult, UserChip, type UserChipProps, ViewMenu, type ViewMenuColumn, type ViewMenuProps, type ViewState, type VirtualWindow, type ZonedDateSpan, addCalendarDays, addCalendarMonths, appendRuleNode, applyBrandProfile, applyFilters, boundRelationshipGraph, buildMonthGrid, buildThreeWayDiff, clampMetricValue, clampWidth, computePosition, contrastRatio, cx, enumerateDateSpan, filterComboboxOptions, findRuleNodeDepth, flattenTree, hexToRgb, highlightSegments, hsvToHex, hsvToRgb, isDateInRange, isDateUnavailable, isRuleGroup, layoutRelationshipGraph, mapRuleGroup, matchFilter, meetsContrast, mergePinned, moveRuleNode, multiSort, nextSortDir, normalizeHex, parseDateValue, parseMetricValue, parseView, relationshipNeighbors, relativeTimeValue, removeRuleNode, reorder, restoreBrandProfile, rgbToHex, rgbToHsv, ruleDepth, searchRows, selectAllState, selectRangeDate, serializeView, shouldVirtualize, startOfMonth, stepMetricValue, summarizeDiff, summarizeRule, toDateKey, toggleId, togglePage, toggleSort, traverseRelationshipNode, treeNav, useAnchoredPosition, useDialog, useTable, useVirtualRows, validateRuleDefinition, virtualWindow, zonedDateKey, zonedDateSpan };
+export { type AccessStateProps, Alert, type AlertProps, type AlertTone, type Align, AppShell, type AppShellProps, type AppliedBrandProfileSnapshot, type AsyncOperationState, AsyncOperationStatus, type AsyncOperationStatusProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type BoundedRelationshipGraph, type BrandProfile, BrandProfileEditor, type BrandProfileEditorProps, type BrandProfileLogo, type BrandProfileTypography, BrandProfiles, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, BuilderCanvas, type BuilderCanvasItem, type BuilderCanvasProps, type BuilderPaletteItem, BulkBar, type BulkBarProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, type CalendarDay, Card, CardLink, type CardLinkProps, type CardProps, CellStrong, CellSub, Checkbox, type CheckboxProps, CollapsibleSection, type CollapsibleSectionProps, ColorPicker, type ColorPickerProps, type ColumnFilter, Combobox, type ComboboxOption, type ComboboxProps, CommandGroup, type CommandGroupProps, CommandItem, type CommandItemProps, CommandPalette, type CommandPaletteProps, Comment, type CommentProps, Comments, type CommentsProps, Composer, ComposerBar, type ComposerBarProps, type ComposerProps, ConfirmDialog, type ConfirmDialogProps, ContentList, ContentListItem, type ContentListItemProps, type ContentListProps, DateRangePicker, type DateRangePickerProps, type DateRangeValue, DescriptionItem, type DescriptionItemProps, DescriptionList, type DescriptionListItem, type DescriptionListProps, DetailLayout, type DetailLayoutProps, DetailPage, type DetailPageMetric, type DetailPageProps, type DetailPageTab, type DiffEntry, type DiffKind, type DiffResolution, type DiffSummary, DiffViewer, type DiffViewerProps, Drawer, type DrawerProps, EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, EventRow, type EventRowProps, ExpandToggle, type ExpandToggleProps, FeaturedRundown, FeaturedRundownItem, type FeaturedRundownItemProps, type FeaturedRundownProps, FeaturedStage, type FeaturedStageProps, Field, type FieldProps, type FilterKind, type FilterOp, type FilterOption, FilterPopover, type FilterPopoverProps, FilteredEmptyState, type FlatNode, Flow, FlowNode, type FlowNodeProps, type FlowNodeState, type FlowProps, type FlowVariant, ForbiddenState, Highlighted, type HighlightedProps, type HsvColor, Inbox, InboxDetail, type InboxDetailProps, InboxItem, type InboxItemProps, InboxList, type InboxListProps, type InboxProps, Input, InputGroup, type InputGroupProps, type InputProps, type JsonPrimitive, type JsonValue, Kanban, KanbanCard, type KanbanCardProps, KanbanColumn, type KanbanColumnProps, type KanbanMoveDirection, type KanbanProps, Label, type LabelProps, LicensePositionBar, type LicensePositionBarProps, List, ListItem, type ListItemProps, type ListProps, LoadingState, type LoadingStateProps, Mark, type MarkProps, type MatchBulkResult, MatchReview, type MatchReviewAction, type MatchReviewCandidate, type MatchReviewField, type MatchReviewProps, Meter, type MeterProps, type MeterTone, MetricInput, type MetricInputProps, Modal, type ModalProps, type NavFavouriteItem, NavFavourites, type NavFavouritesLabels, type NavFavouritesProps, NavGroup, type NavGroupProps, NavItem, type NavItemProps, NewsLead, type NewsLeadProps, NotFoundState, Note, type NoteProps, type NoteTone, NoticeQueue, type NoticeQueueProps, PageHeader, type PageHeaderProps, PageIntro, type PageIntroProps, Pagination, type PaginationProps, Peek, type PeekProps, type PillTone, type PillTreatment, Pipeline, type PipelineProps, PipelineStage, type PipelineStageProps, type PipelineStageState, type Placement, Popover, type PopoverProps, type PositionOptions, type PositionResult, type PositionedRelationshipNode, type Primitive, Progress, type ProgressProps, PromptDialog, type PromptDialogProps, Prose, type ProseProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type Rect, type RelatedLinkItem, RelatedLinks, type RelatedLinksProps, RelationshipGraph, type RelationshipGraphEdge, type RelationshipGraphLegendItem, type RelationshipGraphNode, type RelationshipGraphProps, RelativeTime, type RelativeTimeFormatContext, type RelativeTimeProps, type RelativeTimeUnit, type RelativeTimeValue, ResourceGrid, type ResourceGridProps, type RgbColor, type Row, RowAction, type RowActionProps, RowActions, type RowActionsProps, type RuleAction, type RuleActionDefinition, RuleBuilder, type RuleBuilderProps, type RuleCondition, type RuleDefinition, type RuleFieldDefinition, type RuleGroup, type RuleOperatorDefinition, type RuleValidationIssue, type RuleValueEditorProps, type SavedViewItem, SavedViewMenu, type SavedViewMenuProps, SchedulingCalendar, type SchedulingCalendarEntry, type SchedulingCalendarOverlay, type SchedulingCalendarProps, type SchedulingCalendarView, type SchedulingEntryState, type SchedulingOverlayKind, SectionHead, type SectionHeadProps, type Segment, Segmented, SegmentedOption, type SegmentedOptionProps, type SegmentedProps, Select, type SelectAllState, type SelectProps, type ShellNav, type Side, Sidebar, type SidebarProps, SidebarSection, type SidebarSectionProps, type Size, Skeleton, type SkeletonProps, type SortDir, type SortDirection, type SortKey, Spinner, type SpinnerProps, StarButton, type StarButtonProps, Stat, StatLine, type StatLineItem, type StatLineProps, type StatProps, type StatTrend, type StateVariant, StatusPill, type StatusPillProps, StatusRow, type StatusRowProps, SubNavItem, type SubNavItemProps, Switch, type SwitchProps, Tab, TabPanel, type TabPanelProps, type TabProps, Table, type TableDensity, type TableProps, TableWrap, type TableWrapProps, Tabs, type TabsProps, Td, type TdProps, Textarea, type TextareaProps, Th, type ThProps, Timeline, TimelineItem, type TimelineItemProps, type TimelineProps, Toast, type ToastProps, type ToastTone, Toaster, type ToasterProps, ToggleRow, type ToggleRowProps, Tooltip, type TooltipProps, Tr, type TrProps, Tree, type TreeLike, type TreeNavAction, type TreeNodeData, type TreeNodeProps, type TreeProps, type UseAnchoredPositionOptions, type UseTableOptions, type UseTableResult, type UseVirtualRowsOptions, type UseVirtualRowsResult, UserChip, type UserChipProps, ViewMenu, type ViewMenuColumn, type ViewMenuProps, type ViewState, type VirtualWindow, type ZonedDateSpan, addCalendarDays, addCalendarMonths, appendRuleNode, applyBrandProfile, applyFilters, boundRelationshipGraph, buildMonthGrid, buildThreeWayDiff, clampMetricValue, clampWidth, computePosition, contrastRatio, cx, enumerateDateSpan, filterComboboxOptions, findRuleNodeDepth, flattenTree, hexToRgb, highlightSegments, hsvToHex, hsvToRgb, isDateInRange, isDateUnavailable, isRuleGroup, layoutRelationshipGraph, mapRuleGroup, matchFilter, meetsContrast, mergePinned, moveRuleNode, multiSort, nextSortDir, normalizeHex, parseDateValue, parseMetricValue, parseView, relationshipNeighbors, relativeTimeValue, removeRuleNode, reorder, restoreBrandProfile, rgbToHex, rgbToHsv, ruleDepth, searchRows, selectAllState, selectRangeDate, serializeView, shouldVirtualize, startOfMonth, stepMetricValue, summarizeDiff, summarizeRule, toDateKey, toggleId, togglePage, toggleSort, traverseRelationshipNode, treeNav, useAnchoredPosition, useDialog, useTable, useVirtualRows, validateRuleDefinition, virtualWindow, zonedDateKey, zonedDateSpan };

package/dist/index.d.ts

@@ -28,7 +28,7 @@ export { ToggleRow, ToggleRowProps } from './components/ToggleRow.js';
 export { CollapsibleSection, CollapsibleSectionProps } from './components/CollapsibleSection.js';
 export { List, ListItem, ListItemProps, ListProps } from './components/List.js';
 export { DescriptionItem, DescriptionItemProps, DescriptionList, DescriptionListItem, DescriptionListProps } from './components/DescriptionList.js';
-export { Tab, TabProps, Tabs, TabsProps } from './components/Tabs.js';
+export { Tab, TabPanel, TabPanelProps, TabProps, Tabs, TabsProps } from './components/Tabs.js';
 export { AppShell, AppShellProps, ShellNav } from './components/AppShell.js';
 export { NavGroup, NavGroupProps, NavItem, NavItemProps, Sidebar, SidebarProps, SidebarSection, SidebarSectionProps, SubNavItem, SubNavItemProps } from './components/Sidebar.js';
 export { StarButton, StarButtonProps } from './components/StarButton.js';
@@ -61,7 +61,7 @@ export { Note, NoteProps, NoteTone, Prose, ProseProps } from './components/Prose
 export { Popover, PopoverProps } from './components/Popover.js';
 export { CommandGroup, CommandGroupProps, CommandItem, CommandItemProps, CommandPalette, CommandPaletteProps } from './components/CommandPalette.js';
 export { Inbox, InboxDetail, InboxDetailProps, InboxItem, InboxItemProps, InboxList, InboxListProps, InboxProps } from './components/Inbox.js';
-export { Kanban, KanbanCard, KanbanCardProps, KanbanColumn, KanbanColumnProps, KanbanProps } from './components/Kanban.js';
+export { Kanban, KanbanCard, KanbanCardProps, KanbanColumn, KanbanColumnProps, KanbanMoveDirection, KanbanProps } from './components/Kanban.js';
 export { Tree, TreeNodeData, TreeNodeProps, TreeProps } from './components/Tree.js';
 export { FlatNode, TreeLike, TreeNavAction, flattenTree, treeNav } from './tree-model.js';
 export { ContentList, ContentListItem, ContentListItemProps, ContentListProps, EventRow, EventRowProps, FeaturedRundown, FeaturedRundownItem, FeaturedRundownItemProps, FeaturedRundownProps, FeaturedStage, FeaturedStageProps, NewsLead, NewsLeadProps, NoticeQueue, NoticeQueueProps, PageIntro, PageIntroProps, ResourceGrid, ResourceGridProps, SectionHead, SectionHeadProps, StatLine, StatLineItem, StatLineProps, StatusRow, StatusRowProps } from './components/EditorialHome.js';

package/dist/index.js

@@ -28,7 +28,7 @@ import { ToggleRow } from "./components/ToggleRow.js";
 import { CollapsibleSection } from "./components/CollapsibleSection.js";
 import { List, ListItem } from "./components/List.js";
 import { DescriptionList, DescriptionItem } from "./components/DescriptionList.js";
-import { Tabs, Tab } from "./components/Tabs.js";
+import { Tabs, Tab, TabPanel } from "./components/Tabs.js";
 import { AppShell } from "./components/AppShell.js";
 import { Sidebar, SidebarSection, NavItem, NavGroup, SubNavItem } from "./components/Sidebar.js";
 import { StarButton } from "./components/StarButton.js";
@@ -247,6 +247,7 @@ export {
   SubNavItem,
   Switch,
   Tab,
+  TabPanel,
   Table,
   TableWrap,
   Tabs,

package/dist/tree-model.d.ts

@@ -11,6 +11,10 @@
 interface TreeLike<T> {
     id: string;
     children?: T[];
+    /** The display label — typeahead matches it only when it is a plain string (UIX-A11Y-2). */
+    label?: unknown;
+    /** Explicit typeahead text for nodes whose `label` is not a string (rich ReactNode labels). */
+    typeaheadLabel?: string;
 }
 interface FlatNode<T> {
     node: T;

package/dist/tree-model.js

@@ -40,6 +40,14 @@ function treeNav(flat, currentId, key) {
     case " ":
       return cur.hasChildren ? { toggleId: cur.node.id, selectId: cur.node.id } : { selectId: cur.node.id };
     default:
+      if (key.length === 1) {
+        const q = key.toLowerCase();
+        for (let step = 1; step <= flat.length; step++) {
+          const f = flat[(idx + step) % flat.length];
+          const label = f.node.typeaheadLabel ?? (typeof f.node.label === "string" ? f.node.label : void 0);
+          if (label != null && label.toLowerCase().startsWith(q)) return { focusId: f.node.id };
+        }
+      }
       return {};
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tensor_1/react",
-  "version": "2.16.0",
+  "version": "2.17.0",
   "description": "Thin React wrappers over the UIx v2 CSS component library.",
   "license": "UNLICENSED",
   "type": "module",