@flood-md/react 0.2.9 → 0.2.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +256 -2
- package/dist/app-shell.d.ts +3 -0
- package/dist/app-shell.js +66 -0
- package/dist/bulk-action-bar.d.ts +3 -0
- package/dist/bulk-action-bar.js +17 -0
- package/dist/collection-toolbar.d.ts +3 -0
- package/dist/collection-toolbar.js +26 -0
- package/dist/collection-view-switcher.d.ts +3 -0
- package/dist/collection-view-switcher.js +19 -0
- package/dist/combobox.d.ts +6 -1
- package/dist/combobox.js +77 -29
- package/dist/command-list.d.ts +5 -1
- package/dist/command-list.js +2 -2
- package/dist/data-display.js +3 -3
- package/dist/data-table.js +44 -9
- package/dist/date-picker.js +2 -2
- package/dist/date-range-picker.js +2 -2
- package/dist/date-time-picker.js +2 -2
- package/dist/date-time-range-picker.js +2 -2
- package/dist/disclosure.d.ts +2 -1
- package/dist/disclosure.js +4 -4
- package/dist/filter-condition.d.ts +3 -0
- package/dist/filter-condition.js +21 -0
- package/dist/filter-group.d.ts +2 -0
- package/dist/filter-group.js +62 -0
- package/dist/foundations.css +805 -120
- package/dist/index.d.ts +403 -3
- package/dist/index.js +65 -11
- package/dist/menu.js +5 -4
- package/dist/menubar.d.ts +2 -0
- package/dist/menubar.js +85 -0
- package/dist/navigation-group.d.ts +3 -0
- package/dist/navigation-group.js +13 -0
- package/dist/navigation-item.d.ts +3 -0
- package/dist/navigation-item.js +68 -0
- package/dist/navigation-layout.d.ts +2 -1
- package/dist/navigation-layout.js +12 -4
- package/dist/navigation-tree.js +51 -7
- package/dist/navigation.js +2 -2
- package/dist/overflow-actions.d.ts +2 -0
- package/dist/overflow-actions.js +75 -0
- package/dist/overlay-runtime.d.ts +3 -0
- package/dist/overlay-runtime.js +35 -1
- package/dist/overlays.js +32 -16
- package/dist/select.js +4 -1
- package/dist/sidebar.d.ts +2 -0
- package/dist/sidebar.js +58 -0
- package/dist/toolbar.js +2 -2
- package/package.json +2 -2
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,162 @@
|
|
|
1
1
|
import { type ButtonHTMLAttributes, type InputHTMLAttributes, type TextareaHTMLAttributes, type SelectHTMLAttributes, type AnchorHTMLAttributes, type ReactNode, type HTMLAttributes, type CSSProperties, type LabelHTMLAttributes, type FieldsetHTMLAttributes, type RefCallback, type RefObject, type Ref, type MouseEvent as ReactMouseEvent, type TableHTMLAttributes, type ImgHTMLAttributes, type BlockquoteHTMLAttributes } from "react";
|
|
2
|
+
export interface OverflowAction extends MenuActionItem {
|
|
3
|
+
/** Higher priority actions remain visible longer; source order stays unchanged. */
|
|
4
|
+
priority?: number;
|
|
5
|
+
}
|
|
6
|
+
export interface OverflowActionsProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onAction"> {
|
|
7
|
+
label: string;
|
|
8
|
+
items: readonly OverflowAction[];
|
|
9
|
+
onAction?: (id: string) => void;
|
|
10
|
+
moreLabel?: string;
|
|
11
|
+
size?: "sm" | "md" | "lg" | "xl";
|
|
12
|
+
variant?: ButtonProps["variant"];
|
|
13
|
+
shape?: ToolbarProps["shape"];
|
|
14
|
+
containerVariant?: ToolbarProps["variant"];
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
/** Optional fixed content measured before command space is allocated. */
|
|
17
|
+
leading?: ReactNode;
|
|
18
|
+
trailing?: ReactNode;
|
|
19
|
+
/** Upper bound for visible commands; additional commands remain in More. */
|
|
20
|
+
maxVisibleActions?: number;
|
|
21
|
+
}
|
|
22
|
+
/** Priority-based overflow composed from Toolbar, Button and Menu. @since 0.2.11 */
|
|
23
|
+
export declare const OverflowActions: import("react").ForwardRefExoticComponent<OverflowActionsProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
24
|
+
export interface FilterConditionValue {
|
|
25
|
+
property: string;
|
|
26
|
+
operator: "is" | "is-not";
|
|
27
|
+
values: string[];
|
|
28
|
+
}
|
|
29
|
+
export interface FilterConditionProperty {
|
|
30
|
+
id: string;
|
|
31
|
+
label: string;
|
|
32
|
+
options: readonly ComboboxOption[];
|
|
33
|
+
disabled?: boolean;
|
|
34
|
+
}
|
|
35
|
+
export interface FilterConditionProps extends Omit<FieldsetProps, "children" | "legend" | "onChange"> {
|
|
36
|
+
label: string;
|
|
37
|
+
properties: readonly FilterConditionProperty[];
|
|
38
|
+
value: FilterConditionValue;
|
|
39
|
+
onValueChange: (value: FilterConditionValue) => void;
|
|
40
|
+
onRemove?: () => void;
|
|
41
|
+
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
42
|
+
labels?: Partial<Record<"property" | "operator" | "values" | "include" | "exclude" | "placeholder" | "remove", string>>;
|
|
43
|
+
}
|
|
44
|
+
/** One finite-choice filter predicate; the host owns application and query semantics. @since 0.2.11 */
|
|
45
|
+
export declare const FilterCondition: import("react").ForwardRefExoticComponent<FilterConditionProps & import("react").RefAttributes<HTMLFieldSetElement>>;
|
|
46
|
+
export interface FilterGroupCondition extends FilterConditionValue {
|
|
47
|
+
id: string;
|
|
48
|
+
}
|
|
49
|
+
export interface FilterGroupValue {
|
|
50
|
+
match: "all" | "any";
|
|
51
|
+
conditions: FilterGroupCondition[];
|
|
52
|
+
}
|
|
53
|
+
export interface FilterGroupProps extends Omit<FieldsetProps, "children" | "legend" | "onChange"> {
|
|
54
|
+
label: string;
|
|
55
|
+
properties: readonly FilterConditionProperty[];
|
|
56
|
+
value: FilterGroupValue;
|
|
57
|
+
onValueChange: (value: FilterGroupValue) => void;
|
|
58
|
+
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
59
|
+
allowDuplicateProperties?: boolean;
|
|
60
|
+
maxConditions?: number;
|
|
61
|
+
labels?: Partial<Record<"match" | "all" | "any" | "add" | "condition", string>>;
|
|
62
|
+
conditionLabels?: FilterConditionProps["labels"];
|
|
63
|
+
}
|
|
64
|
+
/** A flat controlled group of finite-choice predicates, without query execution or Apply/Cancel ownership. @since 0.2.11 */
|
|
65
|
+
export declare const FilterGroup: import("react").ForwardRefExoticComponent<FilterGroupProps & import("react").RefAttributes<HTMLFieldSetElement>>;
|
|
66
|
+
export interface CollectionFilterSummary {
|
|
67
|
+
id: string;
|
|
68
|
+
label: string;
|
|
69
|
+
removeLabel?: string;
|
|
70
|
+
disabled?: boolean;
|
|
71
|
+
}
|
|
72
|
+
export interface CollectionToolbarProps extends Omit<FieldsetProps, "children" | "legend" | "onChange"> {
|
|
73
|
+
label: string;
|
|
74
|
+
searchValue: string;
|
|
75
|
+
onSearchValueChange: (value: string) => void;
|
|
76
|
+
searchLabel?: string;
|
|
77
|
+
searchPlaceholder?: string;
|
|
78
|
+
clearSearchLabel?: string;
|
|
79
|
+
appliedFilters?: readonly CollectionFilterSummary[];
|
|
80
|
+
onRemoveFilter?: (id: string) => void;
|
|
81
|
+
appliedFiltersLabel?: string;
|
|
82
|
+
summaryPrefix?: ReactNode;
|
|
83
|
+
/** At most two task-important quick filters; move additional properties into filterContent. */
|
|
84
|
+
quickFilters?: ReactNode;
|
|
85
|
+
filterContent?: ReactNode;
|
|
86
|
+
filtersLabel?: string;
|
|
87
|
+
filterTitle?: string;
|
|
88
|
+
filtersOpen?: boolean;
|
|
89
|
+
onFiltersOpenChange?: (open: boolean) => void;
|
|
90
|
+
filterPanelRef?: Ref<HTMLDivElement>;
|
|
91
|
+
filterPanelClassName?: string;
|
|
92
|
+
onClear?: () => void;
|
|
93
|
+
canClear?: boolean;
|
|
94
|
+
clearLabel?: string;
|
|
95
|
+
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
96
|
+
}
|
|
97
|
+
/** Search, accepted summaries and staged filter disclosure; saved views and query semantics stay host-owned. @since 0.2.11 */
|
|
98
|
+
export declare const CollectionToolbar: import("react").ForwardRefExoticComponent<CollectionToolbarProps & import("react").RefAttributes<HTMLFieldSetElement>>;
|
|
99
|
+
export interface CollectionViewOption {
|
|
100
|
+
id: string;
|
|
101
|
+
name: string;
|
|
102
|
+
disabled?: boolean;
|
|
103
|
+
}
|
|
104
|
+
export interface CollectionViewSwitcherProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onChange"> {
|
|
105
|
+
label: string;
|
|
106
|
+
views: readonly CollectionViewOption[];
|
|
107
|
+
value: string;
|
|
108
|
+
onValueChange: (id: string) => void;
|
|
109
|
+
actions?: readonly OverflowAction[];
|
|
110
|
+
onAction?: (id: string) => void;
|
|
111
|
+
actionsLabel?: string;
|
|
112
|
+
moreLabel?: string;
|
|
113
|
+
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
114
|
+
disabled?: boolean;
|
|
115
|
+
/** Focus target for host-owned naming/deletion dialogs. */
|
|
116
|
+
selectRef?: Ref<HTMLSelectElement>;
|
|
117
|
+
}
|
|
118
|
+
/** Controlled saved/preset view choice with optional adaptive commands. @since 0.2.11 */
|
|
119
|
+
export declare const CollectionViewSwitcher: import("react").ForwardRefExoticComponent<CollectionViewSwitcherProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
120
|
+
export interface BulkActionBarProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onAction"> {
|
|
121
|
+
label: string;
|
|
122
|
+
selectionCount: number;
|
|
123
|
+
/** Complete localized count, for example "2 selected". */
|
|
124
|
+
selectionLabel?: string;
|
|
125
|
+
/** Visible selection summary. Hidden counters do not reserve a slot. */
|
|
126
|
+
counter?: "label" | "number" | "none";
|
|
127
|
+
/** Reserved counter width; stable while selectionCount changes. */
|
|
128
|
+
counterWidth?: CSSProperties["inlineSize"];
|
|
129
|
+
items: readonly OverflowAction[];
|
|
130
|
+
onAction?: (id: string) => void;
|
|
131
|
+
onClear: () => void;
|
|
132
|
+
clearLabel?: string;
|
|
133
|
+
moreLabel?: string;
|
|
134
|
+
size?: "sm" | "md" | "lg" | "xl";
|
|
135
|
+
/** One to three visible commands; the default is two. */
|
|
136
|
+
maxVisibleActions?: 1 | 2 | 3;
|
|
137
|
+
disabled?: boolean;
|
|
138
|
+
pending?: boolean;
|
|
139
|
+
}
|
|
140
|
+
/** A bounded single-row selection command capsule. The host owns positioning and updates. @since 0.2.11 */
|
|
141
|
+
export declare const BulkActionBar: import("react").ForwardRefExoticComponent<BulkActionBarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
142
|
+
export interface MenubarMenu {
|
|
143
|
+
id: string;
|
|
144
|
+
label: string;
|
|
145
|
+
disabled?: boolean;
|
|
146
|
+
items: readonly MenuItem[];
|
|
147
|
+
}
|
|
148
|
+
export interface MenubarProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onAction"> {
|
|
149
|
+
label: string;
|
|
150
|
+
menus: readonly MenubarMenu[];
|
|
151
|
+
openValue?: string | null;
|
|
152
|
+
defaultOpenValue?: string | null;
|
|
153
|
+
onOpenValueChange?: (id: string | null) => void;
|
|
154
|
+
onAction?: (menuId: string, actionId: string) => void;
|
|
155
|
+
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
156
|
+
disabled?: boolean;
|
|
157
|
+
}
|
|
158
|
+
/** Desktop application commands; destinations use native links instead. @since 0.2.11 */
|
|
159
|
+
export declare const Menubar: import("react").ForwardRefExoticComponent<MenubarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2
160
|
export interface TimePickerProps extends Omit<TimeFieldProps, "end"> {
|
|
3
161
|
interval?: number;
|
|
4
162
|
open?: boolean;
|
|
@@ -29,6 +187,10 @@ export interface DateTimeRangePickerProps extends Omit<HTMLAttributes<HTMLDivEle
|
|
|
29
187
|
startTimeLabel?: string;
|
|
30
188
|
endDateLabel?: string;
|
|
31
189
|
endTimeLabel?: string;
|
|
190
|
+
startDatePickerLabels?: DateTimePickerProps["datePickerLabels"];
|
|
191
|
+
endDatePickerLabels?: DateTimePickerProps["datePickerLabels"];
|
|
192
|
+
startTimePickerLabels?: DateTimePickerProps["timePickerLabels"];
|
|
193
|
+
endTimePickerLabels?: DateTimePickerProps["timePickerLabels"];
|
|
32
194
|
form?: string;
|
|
33
195
|
required?: boolean;
|
|
34
196
|
disabled?: boolean;
|
|
@@ -116,6 +278,7 @@ export interface DataTableColumn {
|
|
|
116
278
|
id: string;
|
|
117
279
|
label: string;
|
|
118
280
|
sortable?: boolean;
|
|
281
|
+
numeric?: boolean;
|
|
119
282
|
align?: "start" | "end";
|
|
120
283
|
width?: CSSProperties["width"];
|
|
121
284
|
}
|
|
@@ -125,6 +288,15 @@ export interface DataTableRow {
|
|
|
125
288
|
cells: Readonly<Record<string, ReactNode>>;
|
|
126
289
|
sortValues?: Readonly<Record<string, string | number | null>>;
|
|
127
290
|
selectionDisabled?: boolean;
|
|
291
|
+
/** One named record-opening action. Other controls in the row remain independent. */
|
|
292
|
+
primaryAction?: {
|
|
293
|
+
column: string;
|
|
294
|
+
title: string;
|
|
295
|
+
description?: ReactNode;
|
|
296
|
+
buttonProps: Omit<ButtonProps, "children" | "type" | "variant" | "size"> & {
|
|
297
|
+
ref?: Ref<HTMLButtonElement>;
|
|
298
|
+
};
|
|
299
|
+
};
|
|
128
300
|
}
|
|
129
301
|
export interface DataTableSort {
|
|
130
302
|
column: string;
|
|
@@ -146,6 +318,11 @@ export interface DataTableLabels {
|
|
|
146
318
|
page?: (page: number) => string;
|
|
147
319
|
}
|
|
148
320
|
export interface DataTableProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
|
|
321
|
+
/** Host-owned heading, search and filters aligned with the outer table cells. */
|
|
322
|
+
toolbar?: ReactNode;
|
|
323
|
+
inset?: "standard" | "roomy";
|
|
324
|
+
/** Ready with no rows only. Compose EmptyState/actions here; loading and error keep their owners. */
|
|
325
|
+
emptyContent?: ReactNode;
|
|
149
326
|
caption: string;
|
|
150
327
|
hideCaption?: boolean;
|
|
151
328
|
columns: readonly DataTableColumn[];
|
|
@@ -165,6 +342,13 @@ export interface DataTableProps extends Omit<HTMLAttributes<HTMLDivElement>, "ch
|
|
|
165
342
|
defaultPage?: number;
|
|
166
343
|
pageSize?: number;
|
|
167
344
|
onPageChange?: (page: number) => void;
|
|
345
|
+
/** Hide the result range while preserving selection and pagination controls. */
|
|
346
|
+
showResults?: boolean;
|
|
347
|
+
/** Server mode renders rows as the supplied page, without local sorting/slicing. */
|
|
348
|
+
paginationMode?: "client" | "server";
|
|
349
|
+
totalRows?: number;
|
|
350
|
+
/** Server dataset selection is controlled; the host validates IDs outside this page. */
|
|
351
|
+
selectionScope?: "page" | "dataset";
|
|
168
352
|
state?: "ready" | "loading" | "error";
|
|
169
353
|
onRetry?: () => void;
|
|
170
354
|
labels?: DataTableLabels;
|
|
@@ -289,6 +473,8 @@ export interface DateTimePickerProps extends Omit<HTMLAttributes<HTMLDivElement>
|
|
|
289
473
|
onValueChange?: (value: DateTimeValue) => void;
|
|
290
474
|
dateLabel?: string;
|
|
291
475
|
timeLabel?: string;
|
|
476
|
+
datePickerLabels?: Pick<DatePickerProps, "calendarLabel" | "openCalendarLabel" | "previousMonthLabel" | "nextMonthLabel" | "viewLabels" | "segmentLabels" | "messages">;
|
|
477
|
+
timePickerLabels?: Pick<TimePickerProps, "panelLabel" | "openTimeLabel" | "segmentLabels" | "messages">;
|
|
292
478
|
dateName?: string;
|
|
293
479
|
timeName?: string;
|
|
294
480
|
form?: string;
|
|
@@ -342,28 +528,136 @@ export interface TreeProps extends Omit<HTMLAttributes<HTMLDivElement>, "childre
|
|
|
342
528
|
}
|
|
343
529
|
/** @since 0.2.7 */
|
|
344
530
|
export declare const Tree: import("react").ForwardRefExoticComponent<TreeProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
531
|
+
export interface NavigationItemDisclosure {
|
|
532
|
+
expanded: boolean;
|
|
533
|
+
onExpandedChange: (expanded: boolean) => void;
|
|
534
|
+
label: string;
|
|
535
|
+
controls?: string;
|
|
536
|
+
disabled?: boolean;
|
|
537
|
+
}
|
|
538
|
+
export interface NavigationItemProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'onChange'> {
|
|
539
|
+
label: string;
|
|
540
|
+
description?: string;
|
|
541
|
+
icon?: ReactNode;
|
|
542
|
+
reserveIcon?: boolean;
|
|
543
|
+
trailing?: ReactNode;
|
|
544
|
+
/** Independent action rendered beside the primary control in expanded rows. */
|
|
545
|
+
trailingAction?: ReactNode;
|
|
546
|
+
href?: string;
|
|
547
|
+
linkProps?: Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'children' | 'aria-current'>;
|
|
548
|
+
onAction?: () => void;
|
|
549
|
+
actionProps?: Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;
|
|
550
|
+
disclosure?: NavigationItemDisclosure;
|
|
551
|
+
current?: boolean;
|
|
552
|
+
currentKind?: 'page' | 'location';
|
|
553
|
+
ancestorCurrent?: boolean;
|
|
554
|
+
disabled?: boolean;
|
|
555
|
+
size?: 'sm' | 'md' | 'lg';
|
|
556
|
+
compact?: boolean;
|
|
557
|
+
variant?: 'quiet' | 'standard';
|
|
558
|
+
tooltip?: boolean;
|
|
559
|
+
tooltipSide?: 'left' | 'right';
|
|
560
|
+
controlRef?: Ref<HTMLElement>;
|
|
561
|
+
disclosureRef?: Ref<HTMLButtonElement>;
|
|
562
|
+
}
|
|
563
|
+
/** Shared navigation row geometry and native destination/action behavior. @since 0.2.11 */
|
|
564
|
+
export declare const NavigationItem: import("react").ForwardRefExoticComponent<NavigationItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
565
|
+
export interface NavigationGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "title" | "onChange"> {
|
|
566
|
+
label?: string;
|
|
567
|
+
hideLabel?: boolean;
|
|
568
|
+
headingAction?: ReactNode;
|
|
569
|
+
separator?: boolean;
|
|
570
|
+
collapsible?: boolean;
|
|
571
|
+
expanded?: boolean;
|
|
572
|
+
defaultExpanded?: boolean;
|
|
573
|
+
onExpandedChange?: (expanded: boolean) => void;
|
|
574
|
+
compact?: boolean;
|
|
575
|
+
size?: "sm" | "md" | "lg";
|
|
576
|
+
collapseDisabled?: boolean;
|
|
577
|
+
children?: ReactNode;
|
|
578
|
+
}
|
|
579
|
+
/** Related navigation with independently configurable presentation. @since 0.2.11 */
|
|
580
|
+
export declare const NavigationGroup: import("react").ForwardRefExoticComponent<NavigationGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
345
581
|
export interface NavigationTreeItem {
|
|
346
582
|
value: string;
|
|
347
583
|
label: string;
|
|
348
584
|
href?: string;
|
|
349
585
|
icon?: ReactNode;
|
|
586
|
+
trailing?: ReactNode;
|
|
587
|
+
trailingAction?: ReactNode;
|
|
350
588
|
disabled?: boolean;
|
|
351
589
|
children?: readonly NavigationTreeItem[];
|
|
352
590
|
content?: ReactNode;
|
|
591
|
+
flyout?: {
|
|
592
|
+
openOnHover?: boolean;
|
|
593
|
+
positionReference?: RefObject<HTMLElement | null>;
|
|
594
|
+
};
|
|
353
595
|
linkProps?: Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "href" | "children" | "aria-current">;
|
|
354
596
|
}
|
|
355
597
|
export interface NavigationTreeProps extends Omit<HTMLAttributes<HTMLElement>, "children" | "onChange"> {
|
|
356
598
|
label: string;
|
|
357
599
|
items: readonly NavigationTreeItem[];
|
|
358
600
|
currentValue?: string;
|
|
601
|
+
/** Page destination versus the current global module/location. */
|
|
602
|
+
currentKind?: "page" | "location";
|
|
359
603
|
expandedValues?: readonly string[];
|
|
360
604
|
defaultExpandedValues?: readonly string[];
|
|
361
605
|
onExpandedValuesChange?: (values: string[]) => void;
|
|
362
606
|
expandLabel?: (item: NavigationTreeItem, expanded: boolean) => string;
|
|
363
607
|
size?: ContentSize;
|
|
608
|
+
variant?: "quiet" | "standard";
|
|
609
|
+
/** Icon rail; branches open a Popover without changing the accepted expansion set. */
|
|
610
|
+
compact?: boolean;
|
|
611
|
+
flyoutSide?: "left" | "right";
|
|
612
|
+
branchGuides?: boolean;
|
|
364
613
|
}
|
|
365
614
|
/** @since 0.2.7 */
|
|
366
615
|
export declare const NavigationTree: import("react").ForwardRefExoticComponent<NavigationTreeProps & import("react").RefAttributes<HTMLElement>>;
|
|
616
|
+
export interface SidebarGroup {
|
|
617
|
+
id: string;
|
|
618
|
+
label: string;
|
|
619
|
+
/** Keep the navigation name while omitting a redundant visible section title. */
|
|
620
|
+
hideLabel?: boolean;
|
|
621
|
+
separator?: boolean;
|
|
622
|
+
branchGuides?: boolean;
|
|
623
|
+
headingAction?: ReactNode;
|
|
624
|
+
collapsible?: boolean;
|
|
625
|
+
expanded?: boolean;
|
|
626
|
+
defaultExpanded?: boolean;
|
|
627
|
+
onExpandedChange?: (expanded: boolean) => void;
|
|
628
|
+
items: readonly NavigationTreeItem[];
|
|
629
|
+
}
|
|
630
|
+
export interface SidebarSlotState {
|
|
631
|
+
collapsed: boolean;
|
|
632
|
+
}
|
|
633
|
+
export interface SidebarProps extends Omit<HTMLAttributes<HTMLElement>, "children" | "onChange"> {
|
|
634
|
+
label: string;
|
|
635
|
+
groups: readonly SidebarGroup[];
|
|
636
|
+
currentValue?: string;
|
|
637
|
+
currentKind?: NavigationTreeProps["currentKind"];
|
|
638
|
+
collapsed?: boolean;
|
|
639
|
+
defaultCollapsed?: boolean;
|
|
640
|
+
onCollapsedChange?: (collapsed: boolean) => void;
|
|
641
|
+
collapsible?: boolean;
|
|
642
|
+
collapseLabel?: string;
|
|
643
|
+
expandLabel?: string;
|
|
644
|
+
expandedValues?: readonly string[];
|
|
645
|
+
defaultExpandedValues?: readonly string[];
|
|
646
|
+
onExpandedValuesChange?: (values: string[]) => void;
|
|
647
|
+
expandItemLabel?: NavigationTreeProps["expandLabel"];
|
|
648
|
+
size?: ContentSize;
|
|
649
|
+
/** Quiet recedes behind work content; standard preserves the stronger pill recipe. */
|
|
650
|
+
variant?: "quiet" | "standard";
|
|
651
|
+
side?: "start" | "end";
|
|
652
|
+
width?: CSSProperties["width"];
|
|
653
|
+
header?: ReactNode | ((state: SidebarSlotState) => ReactNode);
|
|
654
|
+
headerLayout?: "stacked" | "inline";
|
|
655
|
+
footer?: ReactNode | ((state: SidebarSlotState) => ReactNode);
|
|
656
|
+
footerSeparator?: boolean;
|
|
657
|
+
headerSeparator?: boolean;
|
|
658
|
+
}
|
|
659
|
+
/** Bounded desktop navigation composed from NavigationTree and ScrollArea. @since 0.2.11 */
|
|
660
|
+
export declare const Sidebar: import("react").ForwardRefExoticComponent<SidebarProps & import("react").RefAttributes<HTMLElement>>;
|
|
367
661
|
export interface ErrorSummaryItem {
|
|
368
662
|
id: string;
|
|
369
663
|
fieldId: string;
|
|
@@ -440,6 +734,7 @@ export interface DateRangePickerProps extends Omit<DateRangeFieldProps, "end"> {
|
|
|
440
734
|
onOpenChange?: (open: boolean) => void;
|
|
441
735
|
calendarLabel?: string;
|
|
442
736
|
openCalendarLabel?: string;
|
|
737
|
+
viewLabels?: CalendarProps["viewLabels"];
|
|
443
738
|
locale?: string;
|
|
444
739
|
weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
445
740
|
today?: string;
|
|
@@ -455,6 +750,7 @@ export interface DatePickerProps extends Omit<DateFieldProps, "end"> {
|
|
|
455
750
|
onOpenChange?: (open: boolean) => void;
|
|
456
751
|
calendarLabel?: string;
|
|
457
752
|
openCalendarLabel?: string;
|
|
753
|
+
viewLabels?: CalendarProps["viewLabels"];
|
|
458
754
|
locale?: string;
|
|
459
755
|
weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
460
756
|
today?: string;
|
|
@@ -620,6 +916,7 @@ export declare const Editable: import("react").ForwardRefExoticComponent<Editabl
|
|
|
620
916
|
export type ControlSize = "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
|
|
621
917
|
export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
622
918
|
variant?: "solid" | "subtle" | "outline" | "ghost";
|
|
919
|
+
tone?: "default" | "danger";
|
|
623
920
|
size?: ControlSize;
|
|
624
921
|
loading?: boolean;
|
|
625
922
|
}
|
|
@@ -645,6 +942,10 @@ export interface ToolbarProps extends Omit<HTMLAttributes<HTMLDivElement>, "role
|
|
|
645
942
|
label: string;
|
|
646
943
|
orientation?: "horizontal" | "vertical";
|
|
647
944
|
loop?: boolean;
|
|
945
|
+
/** Pill keeps a single horizontal rail; rounded permits wrapped tool groups. */
|
|
946
|
+
shape?: "rounded" | "pill";
|
|
947
|
+
/** Plain groups keep control height without another surface or outer inset. */
|
|
948
|
+
variant?: "contained" | "plain";
|
|
648
949
|
}
|
|
649
950
|
/** @since 0.2.4 */
|
|
650
951
|
export declare const Toolbar: import("react").ForwardRefExoticComponent<ToolbarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -669,6 +970,8 @@ export interface TableProps extends Omit<TableHTMLAttributes<HTMLTableElement>,
|
|
|
669
970
|
density?: DataDensity;
|
|
670
971
|
striped?: boolean;
|
|
671
972
|
scrollLabel?: string;
|
|
973
|
+
/** Shared cell alignment. Middle keeps mixed record/action rows coherent; top is an explicit prose-table choice. */
|
|
974
|
+
cellVerticalAlign?: "top" | "middle" | "bottom";
|
|
672
975
|
}
|
|
673
976
|
/** @since 0.2.4 */
|
|
674
977
|
export declare const Table: import("react").ForwardRefExoticComponent<TableProps & import("react").RefAttributes<HTMLTableElement>>;
|
|
@@ -746,6 +1049,7 @@ export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, "childre
|
|
|
746
1049
|
onValueChange?: (value: string) => void;
|
|
747
1050
|
activationMode?: "automatic" | "manual";
|
|
748
1051
|
orientation?: "horizontal" | "vertical";
|
|
1052
|
+
variant?: "contained" | "line";
|
|
749
1053
|
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
750
1054
|
disabled?: boolean;
|
|
751
1055
|
iconOnly?: boolean;
|
|
@@ -837,9 +1141,13 @@ export interface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, "childre
|
|
|
837
1141
|
}
|
|
838
1142
|
/** @since 0.2.4 */
|
|
839
1143
|
export declare const Menu: import("react").ForwardRefExoticComponent<MenuProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1144
|
+
export interface TooltipTriggerProps extends HTMLAttributes<HTMLElement> {
|
|
1145
|
+
ref: RefCallback<HTMLElement>;
|
|
1146
|
+
}
|
|
840
1147
|
export interface TooltipProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "content" | "title" | "role"> {
|
|
841
1148
|
content: string;
|
|
842
|
-
|
|
1149
|
+
/** Native link/button-safe hover/focus props; the trigger keeps its own semantics. */
|
|
1150
|
+
trigger: (props: TooltipTriggerProps) => ReactNode;
|
|
843
1151
|
side?: "top" | "bottom" | "left" | "right";
|
|
844
1152
|
align?: "start" | "center" | "end";
|
|
845
1153
|
delay?: number;
|
|
@@ -848,7 +1156,7 @@ export interface TooltipProps extends Omit<HTMLAttributes<HTMLDivElement>, "chil
|
|
|
848
1156
|
export declare const Tooltip: import("react").ForwardRefExoticComponent<TooltipProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
849
1157
|
export interface PopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "title" | "role"> {
|
|
850
1158
|
title: string;
|
|
851
|
-
chrome?: "default" | "minimal";
|
|
1159
|
+
chrome?: "default" | "minimal" | "title-only";
|
|
852
1160
|
trigger: (props: OverlayTriggerProps) => ReactNode;
|
|
853
1161
|
children?: ReactNode;
|
|
854
1162
|
open?: boolean;
|
|
@@ -860,6 +1168,7 @@ export interface PopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, "chil
|
|
|
860
1168
|
closeLabel?: string;
|
|
861
1169
|
initialFocusRef?: RefObject<HTMLElement | null>;
|
|
862
1170
|
positionReference?: RefObject<HTMLElement | null>;
|
|
1171
|
+
focusOnOpen?: boolean;
|
|
863
1172
|
}
|
|
864
1173
|
export declare const Popover: import("react").ForwardRefExoticComponent<PopoverProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
865
1174
|
export interface DialogProps extends Omit<HTMLAttributes<HTMLDialogElement>, "children" | "title" | "role"> {
|
|
@@ -876,6 +1185,21 @@ export interface DialogProps extends Omit<HTMLAttributes<HTMLDialogElement>, "ch
|
|
|
876
1185
|
initialFocusRef?: RefObject<HTMLElement | null>;
|
|
877
1186
|
}
|
|
878
1187
|
export declare const Dialog: import("react").ForwardRefExoticComponent<DialogProps & import("react").RefAttributes<HTMLDialogElement>>;
|
|
1188
|
+
export interface CommandPaletteProps extends Omit<DialogProps, "children" | "description" | "initialFocusRef"> {
|
|
1189
|
+
searchLabel: string;
|
|
1190
|
+
items: readonly CommandListItem[];
|
|
1191
|
+
density?: "comfortable" | "compact";
|
|
1192
|
+
query?: string;
|
|
1193
|
+
defaultQuery?: string;
|
|
1194
|
+
onQueryChange?: (query: string) => void;
|
|
1195
|
+
onAction: (id: string) => void;
|
|
1196
|
+
loading?: boolean;
|
|
1197
|
+
placeholder?: string;
|
|
1198
|
+
emptyMessage?: string;
|
|
1199
|
+
loadingMessage?: string;
|
|
1200
|
+
}
|
|
1201
|
+
/** @since 0.2.11 */
|
|
1202
|
+
export declare const CommandPalette: import("react").ForwardRefExoticComponent<CommandPaletteProps & import("react").RefAttributes<HTMLDialogElement>>;
|
|
879
1203
|
export interface DrawerProps extends DialogProps {
|
|
880
1204
|
side?: "start" | "end" | "top" | "bottom";
|
|
881
1205
|
size?: "sm" | "md" | "lg";
|
|
@@ -893,6 +1217,8 @@ export interface AlertDialogProps extends Omit<DialogProps, "children" | "role"
|
|
|
893
1217
|
export declare const AlertDialog: import("react").ForwardRefExoticComponent<AlertDialogProps & import("react").RefAttributes<HTMLDialogElement>>;
|
|
894
1218
|
export interface CollapsibleProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "onChange"> {
|
|
895
1219
|
title: string;
|
|
1220
|
+
/** Independent action beside the disclosure trigger, never nested inside it. */
|
|
1221
|
+
headerAction?: ReactNode;
|
|
896
1222
|
open?: boolean;
|
|
897
1223
|
defaultOpen?: boolean;
|
|
898
1224
|
onOpenChange?: (open: boolean) => void;
|
|
@@ -994,6 +1320,7 @@ export interface ComboboxOption {
|
|
|
994
1320
|
description?: string;
|
|
995
1321
|
keywords?: readonly string[];
|
|
996
1322
|
disabled?: boolean;
|
|
1323
|
+
group?: string;
|
|
997
1324
|
}
|
|
998
1325
|
export interface ComboboxProps extends Omit<InputProps, "type" | "value" | "defaultValue" | "onChange" | "children"> {
|
|
999
1326
|
options: readonly ComboboxOption[];
|
|
@@ -1006,7 +1333,27 @@ export interface ComboboxProps extends Omit<InputProps, "type" | "value" | "defa
|
|
|
1006
1333
|
toggleLabel?: string;
|
|
1007
1334
|
clearLabel?: string;
|
|
1008
1335
|
invalidSelectionMessage?: string;
|
|
1336
|
+
query?: string;
|
|
1337
|
+
onQueryChange?: (query: string) => void;
|
|
1338
|
+
/** Manual results require a controlled query and a matching optionsQuery. */
|
|
1339
|
+
filtering?: "local" | "manual";
|
|
1340
|
+
optionsQuery?: string;
|
|
1341
|
+
/** Retain the selected record's presentation while remote results change. */
|
|
1342
|
+
selectedOptions?: readonly ComboboxOption[];
|
|
1343
|
+
loadState?: "ready" | "loading" | "error";
|
|
1344
|
+
loadingMessage?: string;
|
|
1345
|
+
errorMessage?: string;
|
|
1346
|
+
onRetry?: () => void;
|
|
1347
|
+
retryLabel?: string;
|
|
1348
|
+
}
|
|
1349
|
+
export interface AutocompleteProps extends Omit<ComboboxProps, "query" | "onQueryChange" | "selectedOptions" | "value" | "defaultValue" | "onValueChange"> {
|
|
1350
|
+
value?: string;
|
|
1351
|
+
defaultValue?: string;
|
|
1352
|
+
onValueChange?: (value: string) => void;
|
|
1353
|
+
onOptionSelect?: (option: ComboboxOption) => void;
|
|
1009
1354
|
}
|
|
1355
|
+
/** A free text field with suggestions; FormData contains text rather than an option ID. @since 0.2.11 */
|
|
1356
|
+
export declare const Autocomplete: import("react").ForwardRefExoticComponent<AutocompleteProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
1010
1357
|
/** @since 0.2.5 */
|
|
1011
1358
|
export declare const Combobox: import("react").ForwardRefExoticComponent<ComboboxProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
1012
1359
|
export interface MultiSelectProps extends Omit<ComboboxProps, "value" | "defaultValue" | "onValueChange"> {
|
|
@@ -1073,6 +1420,8 @@ export interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
|
|
|
1073
1420
|
export declare const Label: import("react").ForwardRefExoticComponent<LabelProps & import("react").RefAttributes<HTMLLabelElement>>;
|
|
1074
1421
|
export interface FieldsetProps extends FieldsetHTMLAttributes<HTMLFieldSetElement> {
|
|
1075
1422
|
legend: ReactNode;
|
|
1423
|
+
/** Visual role only; compact choice captions remain the default. @since 0.2.10 */
|
|
1424
|
+
legendSize?: "label" | "section";
|
|
1076
1425
|
/** @since 0.2.3 */
|
|
1077
1426
|
hideLabel?: boolean;
|
|
1078
1427
|
hint?: ReactNode;
|
|
@@ -1097,9 +1446,13 @@ export interface RadioGroupProps extends Omit<FieldsetProps, "children" | "defau
|
|
|
1097
1446
|
required?: boolean;
|
|
1098
1447
|
}
|
|
1099
1448
|
export declare const RadioGroup: import("react").ForwardRefExoticComponent<RadioGroupProps & import("react").RefAttributes<HTMLFieldSetElement>>;
|
|
1449
|
+
export interface SegmentedControlOption extends ToggleOption {
|
|
1450
|
+
/** Optional visible count read with the label. Format localized counts before passing them. @since 0.2.11 */
|
|
1451
|
+
count?: number | string;
|
|
1452
|
+
}
|
|
1100
1453
|
export interface SegmentedControlProps extends Omit<RadioGroupProps, "legend" | "options"> {
|
|
1101
1454
|
label: string;
|
|
1102
|
-
options: readonly
|
|
1455
|
+
options: readonly SegmentedControlOption[];
|
|
1103
1456
|
controlSize?: "sm" | "md" | "lg" | "xl";
|
|
1104
1457
|
iconOnly?: boolean;
|
|
1105
1458
|
fullWidth?: boolean;
|
|
@@ -1236,6 +1589,8 @@ export interface IconSlotProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
1236
1589
|
export declare const IconSlot: import("react").ForwardRefExoticComponent<IconSlotProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
1237
1590
|
export interface IconButtonProps extends Omit<ButtonProps, "aria-label"> {
|
|
1238
1591
|
label: string;
|
|
1592
|
+
/** Glyph size only; size continues to own the interactive target and insets. */
|
|
1593
|
+
iconSize?: ControlSize;
|
|
1239
1594
|
}
|
|
1240
1595
|
export declare const IconButton: import("react").ForwardRefExoticComponent<IconButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1241
1596
|
export declare const Divider: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLHRElement> & import("react").RefAttributes<HTMLHRElement>>;
|
|
@@ -1396,6 +1751,51 @@ export interface SectionProps extends Omit<HTMLAttributes<HTMLElement>, "title">
|
|
|
1396
1751
|
headingSize?: "display" | "large" | "page" | "section";
|
|
1397
1752
|
}
|
|
1398
1753
|
export declare const Section: import("react").ForwardRefExoticComponent<SectionProps & import("react").RefAttributes<HTMLElement>>;
|
|
1754
|
+
export interface PageHeaderProps extends Omit<HTMLAttributes<HTMLElement>, "title" | "children"> {
|
|
1755
|
+
title: string;
|
|
1756
|
+
description?: ReactNode;
|
|
1757
|
+
actions?: ReactNode;
|
|
1758
|
+
headingId?: string;
|
|
1759
|
+
/** Use level 2 when showing a page header inside an existing document outline. */
|
|
1760
|
+
headingLevel?: 1 | 2;
|
|
1761
|
+
headingSize?: "page" | "large" | "display";
|
|
1762
|
+
}
|
|
1763
|
+
/** The primary heading and associated actions inside a page's main region. @since 0.2.11 */
|
|
1764
|
+
export declare const PageHeader: import("react").ForwardRefExoticComponent<PageHeaderProps & import("react").RefAttributes<HTMLElement>>;
|
|
1765
|
+
export interface AppTopBarProps extends Omit<HTMLAttributes<HTMLElement>, "children"> {
|
|
1766
|
+
start?: ReactNode;
|
|
1767
|
+
end?: ReactNode;
|
|
1768
|
+
bordered?: boolean;
|
|
1769
|
+
}
|
|
1770
|
+
/** Persistent application chrome with independent context and action slots. @since 0.2.11 */
|
|
1771
|
+
export declare const AppTopBar: import("react").ForwardRefExoticComponent<AppTopBarProps & import("react").RefAttributes<HTMLElement>>;
|
|
1772
|
+
export interface AppShellNavigationDrawer {
|
|
1773
|
+
/** Switch below this shell width in CSS pixels. */
|
|
1774
|
+
below: number;
|
|
1775
|
+
title: string;
|
|
1776
|
+
triggerLabel?: string;
|
|
1777
|
+
size?: DrawerProps["size"];
|
|
1778
|
+
renderContent: (close: () => void) => ReactNode;
|
|
1779
|
+
}
|
|
1780
|
+
export interface AppShellProps extends HTMLAttributes<HTMLDivElement> {
|
|
1781
|
+
navigation?: ReactNode;
|
|
1782
|
+
navigationSide?: "start" | "end";
|
|
1783
|
+
navigationDrawer?: AppShellNavigationDrawer;
|
|
1784
|
+
/** Render function places the shell's responsive trigger in a custom top bar. */
|
|
1785
|
+
topBar?: ReactNode | ((navigationTrigger: ReactNode) => ReactNode);
|
|
1786
|
+
footer?: ReactNode;
|
|
1787
|
+
scroll?: "content" | "page";
|
|
1788
|
+
mainId?: string;
|
|
1789
|
+
/** Use section when embedding a shell inside an existing main landmark. */
|
|
1790
|
+
mainAs?: "main" | "section";
|
|
1791
|
+
mainLabel?: string;
|
|
1792
|
+
mainRef?: Ref<HTMLElement>;
|
|
1793
|
+
scrollLabel?: string;
|
|
1794
|
+
scrollOrientation?: ScrollAreaProps["orientation"];
|
|
1795
|
+
skipLabel?: string;
|
|
1796
|
+
}
|
|
1797
|
+
/** Composes application navigation and a main landmark with optional bounded scrolling. @since 0.2.11 */
|
|
1798
|
+
export declare const AppShell: import("react").ForwardRefExoticComponent<AppShellProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1399
1799
|
export interface SplitProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
|
|
1400
1800
|
main: ReactNode;
|
|
1401
1801
|
aside: ReactNode;
|