neatkit 0.8.0 → 0.9.0
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/dist/Boundary.cjs +1 -1
- package/dist/Boundary.js +29 -29
- package/dist/Button-BV5OUXpc.js +101 -0
- package/dist/Button-DU4j_IED.cjs +1 -0
- package/dist/Button.cjs +1 -1
- package/dist/Button.js +1 -1
- package/dist/Checkbox.cjs +1 -1
- package/dist/Checkbox.js +1 -1
- package/dist/{Code-JDb4VFl7.cjs → Code-B7s_rN0G.cjs} +1 -1
- package/dist/{Code-ClkozPlv.js → Code-Bp2X1k-g.js} +1 -4
- package/dist/Code.cjs +1 -1
- package/dist/Code.js +1 -1
- package/dist/Divider-C7XGlr26.cjs +1 -0
- package/dist/{Divider-BE15WVDI.js → Divider-DZgpYpr-.js} +1 -1
- package/dist/Divider.cjs +1 -1
- package/dist/Divider.js +1 -1
- package/dist/Icon-BIBzgznI.cjs +1 -0
- package/dist/{Icon-BoEUoOk7.js → Icon-CxK1wlGk.js} +98 -52
- package/dist/Icon.cjs +1 -1
- package/dist/Icon.js +1 -1
- package/dist/Input.cjs +1 -1
- package/dist/Input.js +1 -1
- package/dist/Markdown.cjs +1 -1
- package/dist/Markdown.js +108 -104
- package/dist/Modal.cjs +1 -1
- package/dist/Modal.js +1 -1
- package/dist/Popover.cjs +1 -1
- package/dist/Popover.js +147 -141
- package/dist/Select.cjs +1 -1
- package/dist/Select.js +2 -2
- package/dist/Sidebar.cjs +1 -1
- package/dist/Sidebar.js +310 -295
- package/dist/Table-CADupJEU.js +423 -0
- package/dist/Table-qetwZpTC.cjs +1 -0
- package/dist/Table.cjs +1 -1
- package/dist/Table.js +1 -1
- package/dist/{Tooltip-B4bajPtk.cjs → Tooltip-B2d5ss7S.cjs} +1 -1
- package/dist/{Tooltip-BVqdnKK_.js → Tooltip-BK64rkxV.js} +1 -1
- package/dist/Tooltip.cjs +1 -1
- package/dist/Tooltip.js +1 -1
- package/dist/albert-sans-cb3e34c4.woff2 +0 -0
- package/dist/components/Icon/icons/GearIcon.d.ts +11 -0
- package/dist/components/Icon/icons/ImageIcon.d.ts +11 -0
- package/dist/components/Icon/utils/registry.d.ts +2 -0
- package/dist/components/Sidebar/Sidebar.d.ts +6 -1
- package/dist/components/Sidebar/components/SidebarFooter.d.ts +5 -0
- package/dist/components/Sidebar/components/SidebarGroup.d.ts +5 -16
- package/dist/components/Sidebar/components/SidebarHeader.d.ts +29 -0
- package/dist/components/Sidebar/components/SidebarItem.d.ts +3 -0
- package/dist/components/Sidebar/components/SidebarPanel.d.ts +2 -2
- package/dist/components/Sidebar/hooks/usePresentation.d.ts +2 -2
- package/dist/components/Sidebar/index.d.ts +1 -1
- package/dist/components/Sidebar/utils/presentation.d.ts +12 -0
- package/dist/components/Sidebar/utils/state.d.ts +2 -2
- package/dist/components/Table/Table.d.ts +21 -209
- package/dist/components/Table/components/TableAction.d.ts +18 -0
- package/dist/components/Table/components/TableActionCell.d.ts +15 -0
- package/dist/components/Table/components/TableActionHeaderCell.d.ts +13 -0
- package/dist/components/Table/components/TableBody.d.ts +27 -0
- package/dist/components/Table/components/TableCell.d.ts +42 -0
- package/dist/components/Table/components/TableFoot.d.ts +19 -0
- package/dist/components/Table/components/TableHead.d.ts +19 -0
- package/dist/components/Table/components/TableHeaderCell.d.ts +23 -0
- package/dist/components/Table/components/TableRow.d.ts +67 -0
- package/dist/components/Table/hooks/useHorizontalOverflow.d.ts +25 -0
- package/dist/components/Table/utils/cell.d.ts +25 -0
- package/dist/components/Table/utils/children.d.ts +18 -0
- package/dist/components/Table/utils/trigger.d.ts +54 -0
- package/dist/floating-position-DIjh2wnP.cjs +1 -0
- package/dist/floating-position-DvR6e334.js +50 -0
- package/dist/style.css +1 -1
- package/dist/{useFloatingPosition-CMirP2-2.js → useFloatingPosition-B3ZC-v3v.js} +1 -1
- package/dist/{useFloatingPosition-BBEUHPqy.cjs → useFloatingPosition-GzkP9dCc.cjs} +1 -1
- package/package.json +2 -1
- package/dist/Button-Chv4O66e.js +0 -99
- package/dist/Button-DCKtFvSo.cjs +0 -1
- package/dist/Divider-CJYbFcSX.cjs +0 -1
- package/dist/Icon-DJ4BigRz.cjs +0 -1
- package/dist/Table-B30TBckZ.js +0 -402
- package/dist/Table-DceR12X9.cjs +0 -1
- package/dist/floating-position-5wJ5G5IT.js +0 -48
- package/dist/floating-position-Cy9xxdH4.cjs +0 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { type ComponentPropsWithRef, type ComponentPropsWithoutRef, type ElementType, type ReactElement, type ReactNode } from "react";
|
|
2
2
|
import { type IconType } from "../../Icon";
|
|
3
|
+
import { type SidebarPresentation } from "../utils/presentation";
|
|
3
4
|
/** A type representing properties owned by the Sidebar.Item component. */
|
|
4
5
|
type SidebarItemOwnProps = {
|
|
5
6
|
/** Whether the item represents the current page or view. */
|
|
@@ -10,6 +11,8 @@ type SidebarItemOwnProps = {
|
|
|
10
11
|
disabled?: boolean;
|
|
11
12
|
/** The icon displayed before the item label. */
|
|
12
13
|
icon?: IconType;
|
|
14
|
+
/** The presentations the item is rendered in. */
|
|
15
|
+
presentation?: SidebarPresentation;
|
|
13
16
|
};
|
|
14
17
|
/** A type representing the reference accepted by a polymorphic element. */
|
|
15
18
|
type SidebarItemReference<Component extends ElementType> = ComponentPropsWithRef<Component>["ref"];
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { CSSProperties, HTMLAttributes, ReactNode, Ref } from "react";
|
|
2
|
-
import type {
|
|
2
|
+
import type { SidebarPresentationState } from "../utils/state";
|
|
3
3
|
/** A type representing the edge an overlay Sidebar occupies. */
|
|
4
4
|
export type SidebarSide = "end" | "start";
|
|
5
5
|
/** A type representing CSS custom properties accepted by Sidebar styles. */
|
|
@@ -19,7 +19,7 @@ export type SidebarPanelProps = Omit<HTMLAttributes<HTMLElement>, "children" | "
|
|
|
19
19
|
/** The reference assigned to the rendered panel element. */
|
|
20
20
|
panelReference: Ref<HTMLElement>;
|
|
21
21
|
/** The presentation currently rendered by the Sidebar. */
|
|
22
|
-
presentation:
|
|
22
|
+
presentation: SidebarPresentationState;
|
|
23
23
|
/** Whether the Sidebar is currently disclosed as an overlay. */
|
|
24
24
|
open: boolean;
|
|
25
25
|
/** The edge the overlay panel occupies. */
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { BoundaryWidthStore } from "../../Boundary/contexts/BoundaryContext";
|
|
2
|
-
import type {
|
|
2
|
+
import type { SidebarPresentationState, SidebarVariant } from "../utils/state";
|
|
3
3
|
/**
|
|
4
4
|
* Resolves the presentation a Sidebar renders inside its boundary.
|
|
5
5
|
*
|
|
@@ -11,4 +11,4 @@ import type { SidebarPresentation, SidebarVariant } from "../utils/state";
|
|
|
11
11
|
*
|
|
12
12
|
* @returns The explicit, measured, or pending Sidebar presentation.
|
|
13
13
|
*/
|
|
14
|
-
export declare function usePresentation(variant: SidebarVariant, width: BoundaryWidthStore | undefined):
|
|
14
|
+
export declare function usePresentation(variant: SidebarVariant, width: BoundaryWidthStore | undefined): SidebarPresentationState;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { default } from "./Sidebar";
|
|
2
|
-
export type { SidebarFooterProps,
|
|
2
|
+
export type { SidebarFooterProps, SidebarGroupProps, SidebarHeaderProps, SidebarItemProps, SidebarOpenChangeReason, SidebarPresentation, SidebarProps, SidebarSide, SidebarTriggerProps, SidebarUserAction, SidebarUserProps, SidebarVariant, } from "./Sidebar";
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { SidebarPresentationState } from "./state";
|
|
2
|
+
/** A type representing the presentations a Sidebar's content renders in. */
|
|
3
|
+
export type SidebarPresentation = "both" | "inline" | "overlay";
|
|
4
|
+
/**
|
|
5
|
+
* Determines whether content renders in the Sidebar's presentation.
|
|
6
|
+
*
|
|
7
|
+
* @param requested - The presentations the content is rendered in.
|
|
8
|
+
* @param current - The presentation the Sidebar currently renders.
|
|
9
|
+
*
|
|
10
|
+
* @returns Whether the content renders rather than being omitted.
|
|
11
|
+
*/
|
|
12
|
+
export declare function rendersInPresentation(requested: SidebarPresentation, current: SidebarPresentationState | undefined): boolean;
|
|
@@ -6,7 +6,7 @@ export type SidebarVariant = "inline" | "overlay" | "responsive";
|
|
|
6
6
|
* The pending presentation covers server rendering and hydration, where the
|
|
7
7
|
* boundary is not yet measured and stylesheets select the presentation.
|
|
8
8
|
*/
|
|
9
|
-
export type
|
|
9
|
+
export type SidebarPresentationState = "inline" | "overlay" | "pending";
|
|
10
10
|
/** A type representing an interaction requesting a Sidebar state change. */
|
|
11
11
|
export type SidebarOpenChangeReason = "escape" | "item" | "outside" | "trigger" | "variant";
|
|
12
12
|
/** A type representing the state one Sidebar publishes to its boundary. */
|
|
@@ -16,7 +16,7 @@ export type SidebarState = {
|
|
|
16
16
|
/** Whether the overlay Sidebar is currently open. */
|
|
17
17
|
open: boolean;
|
|
18
18
|
/** The presentation currently rendered by the Sidebar. */
|
|
19
|
-
presentation:
|
|
19
|
+
presentation: SidebarPresentationState;
|
|
20
20
|
/** The responsive behavior requested for the Sidebar. */
|
|
21
21
|
variant: SidebarVariant;
|
|
22
22
|
/** Adds a mounted Trigger to the overlay dismissal layer. */
|
|
@@ -1,136 +1,19 @@
|
|
|
1
|
-
import { type
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import { type ReactNode, type TableHTMLAttributes } from "react";
|
|
2
|
+
import TableBody from "./components/TableBody";
|
|
3
|
+
import TableCell from "./components/TableCell";
|
|
4
|
+
import TableFoot from "./components/TableFoot";
|
|
5
|
+
import TableHead from "./components/TableHead";
|
|
6
|
+
import TableHeaderCell from "./components/TableHeaderCell";
|
|
7
|
+
import TableRow from "./components/TableRow";
|
|
4
8
|
import "./styles/table.css";
|
|
5
|
-
|
|
6
|
-
export type
|
|
7
|
-
|
|
8
|
-
export type
|
|
9
|
-
|
|
10
|
-
export type
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
/** The additional class name applied to the horizontal scroll container. */
|
|
14
|
-
containerClassName?: string;
|
|
15
|
-
};
|
|
16
|
-
/** A type representing properties for the Table.Head component. */
|
|
17
|
-
export type TableHeadProps = HTMLAttributes<HTMLTableSectionElement> & {
|
|
18
|
-
/** The rows rendered inside the Table head. */
|
|
19
|
-
children: ReactNode;
|
|
20
|
-
};
|
|
21
|
-
/** A type representing properties for the Table.Body component. */
|
|
22
|
-
export type TableBodyProps = HTMLAttributes<HTMLTableSectionElement> & {
|
|
23
|
-
/** The rows rendered inside the Table body. */
|
|
24
|
-
children?: ReactNode;
|
|
25
|
-
/** The number of columns occupied by the generated empty-state cell. */
|
|
26
|
-
emptyColumnCount?: number;
|
|
27
|
-
/** The content displayed when children contain no explicit content. */
|
|
28
|
-
emptyMessage?: ReactNode;
|
|
29
|
-
};
|
|
30
|
-
/** A type representing properties for the Table.Foot component. */
|
|
31
|
-
export type TableFootProps = HTMLAttributes<HTMLTableSectionElement> & {
|
|
32
|
-
/** The rows rendered inside the Table foot. */
|
|
33
|
-
children: ReactNode;
|
|
34
|
-
};
|
|
35
|
-
/** Shared native properties for every Table.Row configuration. */
|
|
36
|
-
type TableRowBaseProps = Omit<HTMLAttributes<HTMLTableRowElement>, "aria-label" | "children" | "onClick"> & {
|
|
37
|
-
/**
|
|
38
|
-
* The controls operating on this row.
|
|
39
|
-
*
|
|
40
|
-
* Each action is keyed by its label, so labels must be unique per row.
|
|
41
|
-
*/
|
|
42
|
-
actions?: readonly TableRowAction[];
|
|
43
|
-
/** The cells rendered inside the Table row. */
|
|
44
|
-
children: ReactNode;
|
|
45
|
-
};
|
|
46
|
-
/** A type representing a static Table.Row configuration. */
|
|
47
|
-
type TableStaticRowProps = {
|
|
48
|
-
/** The optional accessible name applied to the static row. */
|
|
49
|
-
"aria-label"?: string;
|
|
50
|
-
/** Static rows do not expose download behavior. */
|
|
51
|
-
download?: never;
|
|
52
|
-
/** Static rows do not expose a navigation destination. */
|
|
53
|
-
href?: never;
|
|
54
|
-
/** Static rows do not describe a linked resource language. */
|
|
55
|
-
hrefLang?: never;
|
|
56
|
-
/** Static rows do not expose whole-row activation. */
|
|
57
|
-
onClick?: never;
|
|
58
|
-
/** Static rows do not expose navigation interception. */
|
|
59
|
-
onNavigate?: never;
|
|
60
|
-
/** Static rows do not target a browsing context. */
|
|
61
|
-
target?: never;
|
|
62
|
-
};
|
|
63
|
-
/** A type representing a button-backed Table.Row configuration. */
|
|
64
|
-
type TableButtonRowProps = {
|
|
65
|
-
/** The accessible name describing the whole-row action. */
|
|
66
|
-
"aria-label": string;
|
|
67
|
-
/** Button-backed rows do not expose download behavior. */
|
|
68
|
-
download?: never;
|
|
69
|
-
/** Button-backed rows do not expose a navigation destination. */
|
|
70
|
-
href?: never;
|
|
71
|
-
/** Button-backed rows do not describe a linked resource language. */
|
|
72
|
-
hrefLang?: never;
|
|
73
|
-
/** The callback invoked when the row's button is activated. */
|
|
74
|
-
onClick: MouseEventHandler<HTMLButtonElement>;
|
|
75
|
-
/** Button-backed rows do not expose navigation interception. */
|
|
76
|
-
onNavigate?: never;
|
|
77
|
-
/** Button-backed rows do not target a browsing context. */
|
|
78
|
-
target?: never;
|
|
79
|
-
};
|
|
80
|
-
/** A type representing a link-backed Table.Row configuration. */
|
|
81
|
-
type TableLinkRowProps = {
|
|
82
|
-
/** The accessible name describing the whole-row link. */
|
|
83
|
-
"aria-label": string;
|
|
84
|
-
/** Whether the linked resource should be downloaded. */
|
|
85
|
-
download?: boolean | string;
|
|
86
|
-
/** The destination opened by whole-row activation. */
|
|
87
|
-
href: string;
|
|
88
|
-
/** The language of the linked resource. */
|
|
89
|
-
hrefLang?: string;
|
|
90
|
-
/** Link-backed rows do not expose button activation. */
|
|
91
|
-
onClick?: never;
|
|
92
|
-
/** The callback invoked when the row's link is activated. */
|
|
93
|
-
onNavigate?: MouseEventHandler<HTMLAnchorElement>;
|
|
94
|
-
/** The relationship between the table and linked resource. */
|
|
95
|
-
rel?: string;
|
|
96
|
-
/** The browsing context used to open the linked resource. */
|
|
97
|
-
target?: HTMLAttributeAnchorTarget;
|
|
98
|
-
};
|
|
99
|
-
/** A type representing properties for the Table.Row component. */
|
|
100
|
-
export type TableRowProps = TableRowBaseProps & (TableButtonRowProps | TableLinkRowProps | TableStaticRowProps);
|
|
101
|
-
/** Shared properties configuring a Table header cell. */
|
|
102
|
-
type TableHeaderCellOwnProps = {
|
|
103
|
-
/** The horizontal alignment applied to the header content. */
|
|
104
|
-
align?: TableCellAlignment;
|
|
105
|
-
/** The content rendered inside the header cell. */
|
|
106
|
-
children?: ReactNode;
|
|
107
|
-
/** Whether the header pins its supported edge column during scrolling. */
|
|
108
|
-
sticky?: boolean;
|
|
109
|
-
};
|
|
110
|
-
/** A type representing properties for the Table.HeaderCell component. */
|
|
111
|
-
export type TableHeaderCellProps = Omit<ThHTMLAttributes<HTMLTableCellElement>, "align" | "children"> & TableHeaderCellOwnProps;
|
|
112
|
-
/** A type representing properties for the Table action header cell. */
|
|
113
|
-
export type TableActionHeaderCellProps = Omit<TableHeaderCellProps, "align">;
|
|
114
|
-
/** A type representing properties for the Table.Cell component. */
|
|
115
|
-
export type TableCellProps = Omit<TdHTMLAttributes<HTMLTableCellElement>, "align" | "children"> & {
|
|
116
|
-
/** The horizontal alignment applied to the cell content. */
|
|
117
|
-
align?: TableCellAlignment;
|
|
118
|
-
/** Content rendered when no value is supplied. */
|
|
119
|
-
children?: ReactNode;
|
|
120
|
-
/** A function transforming the supplied value into displayed content. */
|
|
121
|
-
format?: (value: TableCellValue) => ReactNode;
|
|
122
|
-
/** The maximum CSS width used to truncate overflowing content. */
|
|
123
|
-
truncate?: string;
|
|
124
|
-
/** The primitive value displayed or passed to the format function. */
|
|
125
|
-
value?: TableCellValue;
|
|
126
|
-
};
|
|
127
|
-
/** A type representing one consistently styled Table row action. */
|
|
128
|
-
export type TableRowAction = Omit<ButtonProps<"button">, "as" | "children" | "className" | "fullWidth" | "icon" | "iconAlignment" | "shape" | "style" | "textAlignment" | "type" | "variant"> & {
|
|
129
|
-
/** The icon identifying the row action. */
|
|
130
|
-
icon: IconType;
|
|
131
|
-
/** The short Tooltip label and base accessible name for the row action. */
|
|
132
|
-
label: string;
|
|
133
|
-
};
|
|
9
|
+
export type { TableRowAction } from "./components/TableAction";
|
|
10
|
+
export type { TableBodyProps } from "./components/TableBody";
|
|
11
|
+
export type { TableCellProps } from "./components/TableCell";
|
|
12
|
+
export type { TableFootProps } from "./components/TableFoot";
|
|
13
|
+
export type { TableHeadProps } from "./components/TableHead";
|
|
14
|
+
export type { TableHeaderCellProps } from "./components/TableHeaderCell";
|
|
15
|
+
export type { TableRowProps } from "./components/TableRow";
|
|
16
|
+
export type { TableCellAlignment, TableCellValue } from "./utils/cell";
|
|
134
17
|
/** A type representing the complete compound Table component. */
|
|
135
18
|
type TableComponent = typeof TableRoot & {
|
|
136
19
|
/** The body section containing Table data rows. */
|
|
@@ -146,84 +29,13 @@ type TableComponent = typeof TableRoot & {
|
|
|
146
29
|
/** A Table row. */
|
|
147
30
|
Row: typeof TableRow;
|
|
148
31
|
};
|
|
149
|
-
/**
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
* @param props - The native section properties and header rows.
|
|
153
|
-
* @param forwardedReference - The reference assigned to the head element.
|
|
154
|
-
*
|
|
155
|
-
* @returns The rendered Table head section.
|
|
156
|
-
*/
|
|
157
|
-
declare const TableHead: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
|
|
158
|
-
/** The rows rendered inside the Table head. */
|
|
159
|
-
children: ReactNode;
|
|
160
|
-
} & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
161
|
-
/**
|
|
162
|
-
* Renders the Table body and its optional empty state.
|
|
163
|
-
*
|
|
164
|
-
* @param props - The native section, row, and empty-state properties.
|
|
165
|
-
* @param forwardedReference - The reference assigned to the body element.
|
|
166
|
-
*
|
|
167
|
-
* @returns The rendered Table body section.
|
|
168
|
-
*/
|
|
169
|
-
declare const TableBody: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
|
|
170
|
-
/** The rows rendered inside the Table body. */
|
|
171
|
-
children?: ReactNode;
|
|
172
|
-
/** The number of columns occupied by the generated empty-state cell. */
|
|
173
|
-
emptyColumnCount?: number;
|
|
174
|
-
/** The content displayed when children contain no explicit content. */
|
|
175
|
-
emptyMessage?: ReactNode;
|
|
176
|
-
} & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
177
|
-
/**
|
|
178
|
-
* Renders the Table foot section.
|
|
179
|
-
*
|
|
180
|
-
* @param props - The native section properties and footer rows.
|
|
181
|
-
* @param forwardedReference - The reference assigned to the foot element.
|
|
182
|
-
*
|
|
183
|
-
* @returns The rendered Table foot section.
|
|
184
|
-
*/
|
|
185
|
-
declare const TableFoot: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
|
|
186
|
-
/** The rows rendered inside the Table foot. */
|
|
32
|
+
/** A type representing properties for the Table component. */
|
|
33
|
+
export type TableProps = TableHTMLAttributes<HTMLTableElement> & {
|
|
34
|
+
/** The table sections, rows, and cells rendered inside the Table. */
|
|
187
35
|
children: ReactNode;
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
*
|
|
192
|
-
* @param props - The native row properties and cells.
|
|
193
|
-
* @param forwardedReference - The reference assigned to the row element.
|
|
194
|
-
*
|
|
195
|
-
* @returns The rendered Table row.
|
|
196
|
-
*/
|
|
197
|
-
declare const TableRow: import("react").ForwardRefExoticComponent<TableRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
|
|
198
|
-
/**
|
|
199
|
-
* Renders a column header cell.
|
|
200
|
-
*
|
|
201
|
-
* @param props - The native header properties and displayed label.
|
|
202
|
-
* @param forwardedReference - The reference assigned to the header cell.
|
|
203
|
-
*
|
|
204
|
-
* @returns The rendered Table column header.
|
|
205
|
-
*/
|
|
206
|
-
declare const TableHeaderCell: import("react").ForwardRefExoticComponent<Omit<ThHTMLAttributes<HTMLTableCellElement>, "children" | "align"> & TableHeaderCellOwnProps & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
207
|
-
/**
|
|
208
|
-
* Renders a data cell with optional value formatting and truncation.
|
|
209
|
-
*
|
|
210
|
-
* @param props - The native cell, content, and display properties.
|
|
211
|
-
* @param forwardedReference - The reference assigned to the data cell.
|
|
212
|
-
*
|
|
213
|
-
* @returns The rendered Table data cell.
|
|
214
|
-
*/
|
|
215
|
-
declare const TableCell: import("react").ForwardRefExoticComponent<Omit<TdHTMLAttributes<HTMLTableCellElement>, "children" | "align"> & {
|
|
216
|
-
/** The horizontal alignment applied to the cell content. */
|
|
217
|
-
align?: TableCellAlignment;
|
|
218
|
-
/** Content rendered when no value is supplied. */
|
|
219
|
-
children?: ReactNode;
|
|
220
|
-
/** A function transforming the supplied value into displayed content. */
|
|
221
|
-
format?: (value: TableCellValue) => ReactNode;
|
|
222
|
-
/** The maximum CSS width used to truncate overflowing content. */
|
|
223
|
-
truncate?: string;
|
|
224
|
-
/** The primitive value displayed or passed to the format function. */
|
|
225
|
-
value?: TableCellValue;
|
|
226
|
-
} & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
36
|
+
/** The additional class name applied to the horizontal scroll container. */
|
|
37
|
+
containerClassName?: string;
|
|
38
|
+
};
|
|
227
39
|
/**
|
|
228
40
|
* Renders a semantic Table inside a keyboard-scrollable surface.
|
|
229
41
|
*
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { type ButtonProps } from "../../Button";
|
|
2
|
+
import type { IconType } from "../../Icon";
|
|
3
|
+
/** A type representing one consistently styled Table row action. */
|
|
4
|
+
export type TableRowAction = Omit<ButtonProps<"button">, "as" | "children" | "className" | "fullWidth" | "icon" | "iconAlignment" | "shape" | "style" | "textAlignment" | "type" | "variant"> & {
|
|
5
|
+
/** The icon identifying the row action. */
|
|
6
|
+
icon: IconType;
|
|
7
|
+
/** The short Tooltip label and base accessible name for the row action. */
|
|
8
|
+
label: string;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* Renders one consistently styled control operating on a Table row.
|
|
12
|
+
*
|
|
13
|
+
* @param props - The short label, icon, and native button properties.
|
|
14
|
+
*
|
|
15
|
+
* @returns The rendered Table row action.
|
|
16
|
+
*/
|
|
17
|
+
declare function TableAction(props: TableRowAction): import("react").JSX.Element;
|
|
18
|
+
export default TableAction;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type TableRowAction } from "./TableAction";
|
|
2
|
+
/** Internal action-cell properties supplied by a Table.Row. */
|
|
3
|
+
export type TableActionCellProps = {
|
|
4
|
+
/** The controls rendered inside the row's action cell. */
|
|
5
|
+
actions: readonly TableRowAction[];
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* Renders the cell containing controls for one Table row.
|
|
9
|
+
*
|
|
10
|
+
* @param props - The composed Table actions operating on the row.
|
|
11
|
+
*
|
|
12
|
+
* @returns The rendered Table action cell.
|
|
13
|
+
*/
|
|
14
|
+
declare function TableActionCell(props: TableActionCellProps): import("react").JSX.Element;
|
|
15
|
+
export default TableActionCell;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type TableHeaderCellProps } from "./TableHeaderCell";
|
|
2
|
+
/** A type representing properties for the Table action header cell. */
|
|
3
|
+
export type TableActionHeaderCellProps = Omit<TableHeaderCellProps, "align">;
|
|
4
|
+
/**
|
|
5
|
+
* Renders the header for a row-actions column.
|
|
6
|
+
*
|
|
7
|
+
* @param props - The native header properties and optional visible label.
|
|
8
|
+
* @param forwardedReference - The reference assigned to the header cell.
|
|
9
|
+
*
|
|
10
|
+
* @returns The rendered Table actions header.
|
|
11
|
+
*/
|
|
12
|
+
declare const TableActionHeaderCell: import("react").ForwardRefExoticComponent<TableActionHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
13
|
+
export default TableActionHeaderCell;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
/** A type representing properties for the Table.Body component. */
|
|
3
|
+
export type TableBodyProps = HTMLAttributes<HTMLTableSectionElement> & {
|
|
4
|
+
/** The rows rendered inside the Table body. */
|
|
5
|
+
children?: ReactNode;
|
|
6
|
+
/** The number of columns occupied by the generated empty-state cell. */
|
|
7
|
+
emptyColumnCount?: number;
|
|
8
|
+
/** The content displayed when children contain no explicit content. */
|
|
9
|
+
emptyMessage?: ReactNode;
|
|
10
|
+
};
|
|
11
|
+
/**
|
|
12
|
+
* Renders the Table body and its optional empty state.
|
|
13
|
+
*
|
|
14
|
+
* @param props - The native section, row, and empty-state properties.
|
|
15
|
+
* @param forwardedReference - The reference assigned to the body element.
|
|
16
|
+
*
|
|
17
|
+
* @returns The rendered Table body section.
|
|
18
|
+
*/
|
|
19
|
+
declare const TableBody: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
|
|
20
|
+
/** The rows rendered inside the Table body. */
|
|
21
|
+
children?: ReactNode;
|
|
22
|
+
/** The number of columns occupied by the generated empty-state cell. */
|
|
23
|
+
emptyColumnCount?: number;
|
|
24
|
+
/** The content displayed when children contain no explicit content. */
|
|
25
|
+
emptyMessage?: ReactNode;
|
|
26
|
+
} & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
27
|
+
export default TableBody;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { type ReactNode, type TdHTMLAttributes } from "react";
|
|
2
|
+
import { type TableCellAlignment, type TableCellFormatter, type TableCellValue } from "../utils/cell";
|
|
3
|
+
import type { TableRowTrigger } from "../utils/trigger";
|
|
4
|
+
/** A type representing properties for the Table.Cell component. */
|
|
5
|
+
export type TableCellProps = Omit<TdHTMLAttributes<HTMLTableCellElement>, "align" | "children"> & {
|
|
6
|
+
/** The horizontal alignment applied to the cell content. */
|
|
7
|
+
align?: TableCellAlignment;
|
|
8
|
+
/** Content rendered when no value is supplied. */
|
|
9
|
+
children?: ReactNode;
|
|
10
|
+
/** A function transforming the supplied value into displayed content. */
|
|
11
|
+
format?: TableCellFormatter;
|
|
12
|
+
/** The maximum CSS width used to truncate overflowing content. */
|
|
13
|
+
truncate?: string;
|
|
14
|
+
/** The primitive value displayed or passed to the format function. */
|
|
15
|
+
value?: TableCellValue;
|
|
16
|
+
};
|
|
17
|
+
/** Internal Table.Cell properties supplied by an interactive Table.Row. */
|
|
18
|
+
export type TableCellImplementationProps = TableCellProps & {
|
|
19
|
+
/** The primary row control rendered inside the first data cell. */
|
|
20
|
+
rowTrigger?: TableRowTrigger;
|
|
21
|
+
};
|
|
22
|
+
/**
|
|
23
|
+
* Renders a data cell with optional value formatting and truncation.
|
|
24
|
+
*
|
|
25
|
+
* @param props - The native cell, content, and display properties.
|
|
26
|
+
* @param forwardedReference - The reference assigned to the data cell.
|
|
27
|
+
*
|
|
28
|
+
* @returns The rendered Table data cell.
|
|
29
|
+
*/
|
|
30
|
+
declare const TableCell: import("react").ForwardRefExoticComponent<Omit<TdHTMLAttributes<HTMLTableCellElement>, "children" | "align"> & {
|
|
31
|
+
/** The horizontal alignment applied to the cell content. */
|
|
32
|
+
align?: TableCellAlignment;
|
|
33
|
+
/** Content rendered when no value is supplied. */
|
|
34
|
+
children?: ReactNode;
|
|
35
|
+
/** A function transforming the supplied value into displayed content. */
|
|
36
|
+
format?: TableCellFormatter;
|
|
37
|
+
/** The maximum CSS width used to truncate overflowing content. */
|
|
38
|
+
truncate?: string;
|
|
39
|
+
/** The primitive value displayed or passed to the format function. */
|
|
40
|
+
value?: TableCellValue;
|
|
41
|
+
} & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
42
|
+
export default TableCell;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
/** A type representing properties for the Table.Foot component. */
|
|
3
|
+
export type TableFootProps = HTMLAttributes<HTMLTableSectionElement> & {
|
|
4
|
+
/** The rows rendered inside the Table foot. */
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* Renders the Table foot section.
|
|
9
|
+
*
|
|
10
|
+
* @param props - The native section properties and footer rows.
|
|
11
|
+
* @param forwardedReference - The reference assigned to the foot element.
|
|
12
|
+
*
|
|
13
|
+
* @returns The rendered Table foot section.
|
|
14
|
+
*/
|
|
15
|
+
declare const TableFoot: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
|
|
16
|
+
/** The rows rendered inside the Table foot. */
|
|
17
|
+
children: ReactNode;
|
|
18
|
+
} & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
19
|
+
export default TableFoot;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type HTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
/** A type representing properties for the Table.Head component. */
|
|
3
|
+
export type TableHeadProps = HTMLAttributes<HTMLTableSectionElement> & {
|
|
4
|
+
/** The rows rendered inside the Table head. */
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* Renders the Table head section.
|
|
9
|
+
*
|
|
10
|
+
* @param props - The native section properties and header rows.
|
|
11
|
+
* @param forwardedReference - The reference assigned to the head element.
|
|
12
|
+
*
|
|
13
|
+
* @returns The rendered Table head section.
|
|
14
|
+
*/
|
|
15
|
+
declare const TableHead: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & {
|
|
16
|
+
/** The rows rendered inside the Table head. */
|
|
17
|
+
children: ReactNode;
|
|
18
|
+
} & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
19
|
+
export default TableHead;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { type ReactNode, type ThHTMLAttributes } from "react";
|
|
2
|
+
import type { TableCellAlignment } from "../utils/cell";
|
|
3
|
+
/** Shared properties configuring a Table header cell. */
|
|
4
|
+
type TableHeaderCellOwnProps = {
|
|
5
|
+
/** The horizontal alignment applied to the header content. */
|
|
6
|
+
align?: TableCellAlignment;
|
|
7
|
+
/** The content rendered inside the header cell. */
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
/** Whether the header pins its supported edge column during scrolling. */
|
|
10
|
+
sticky?: boolean;
|
|
11
|
+
};
|
|
12
|
+
/** A type representing properties for the Table.HeaderCell component. */
|
|
13
|
+
export type TableHeaderCellProps = Omit<ThHTMLAttributes<HTMLTableCellElement>, "align" | "children"> & TableHeaderCellOwnProps;
|
|
14
|
+
/**
|
|
15
|
+
* Renders a column header cell.
|
|
16
|
+
*
|
|
17
|
+
* @param props - The native header properties and displayed label.
|
|
18
|
+
* @param forwardedReference - The reference assigned to the header cell.
|
|
19
|
+
*
|
|
20
|
+
* @returns The rendered Table column header.
|
|
21
|
+
*/
|
|
22
|
+
declare const TableHeaderCell: import("react").ForwardRefExoticComponent<Omit<ThHTMLAttributes<HTMLTableCellElement>, "children" | "align"> & TableHeaderCellOwnProps & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
23
|
+
export default TableHeaderCell;
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import { type HTMLAttributes, type MouseEventHandler, type ReactNode } from "react";
|
|
2
|
+
import { type TableRowLinkProperties } from "../utils/trigger";
|
|
3
|
+
import type { TableRowAction } from "./TableAction";
|
|
4
|
+
/** Shared native properties for every Table.Row configuration. */
|
|
5
|
+
type TableRowBaseProps = Omit<HTMLAttributes<HTMLTableRowElement>, "aria-label" | "children" | "onClick"> & {
|
|
6
|
+
/**
|
|
7
|
+
* The controls operating on this row.
|
|
8
|
+
*
|
|
9
|
+
* Each action is keyed by its label, so labels must be unique per row.
|
|
10
|
+
*/
|
|
11
|
+
actions?: readonly TableRowAction[];
|
|
12
|
+
/** The cells rendered inside the Table row. */
|
|
13
|
+
children: ReactNode;
|
|
14
|
+
};
|
|
15
|
+
/** A type representing a static Table.Row configuration. */
|
|
16
|
+
type TableStaticRowProps = {
|
|
17
|
+
/** The optional accessible name applied to the static row. */
|
|
18
|
+
"aria-label"?: string;
|
|
19
|
+
/** Static rows do not expose download behavior. */
|
|
20
|
+
download?: never;
|
|
21
|
+
/** Static rows do not expose a navigation destination. */
|
|
22
|
+
href?: never;
|
|
23
|
+
/** Static rows do not describe a linked resource language. */
|
|
24
|
+
hrefLang?: never;
|
|
25
|
+
/** Static rows do not expose whole-row activation. */
|
|
26
|
+
onClick?: never;
|
|
27
|
+
/** Static rows do not expose navigation interception. */
|
|
28
|
+
onNavigate?: never;
|
|
29
|
+
/** Static rows do not target a browsing context. */
|
|
30
|
+
target?: never;
|
|
31
|
+
};
|
|
32
|
+
/** A type representing a button-backed Table.Row configuration. */
|
|
33
|
+
type TableButtonRowProps = {
|
|
34
|
+
/** The accessible name describing the whole-row action. */
|
|
35
|
+
"aria-label": string;
|
|
36
|
+
/** Button-backed rows do not expose download behavior. */
|
|
37
|
+
download?: never;
|
|
38
|
+
/** Button-backed rows do not expose a navigation destination. */
|
|
39
|
+
href?: never;
|
|
40
|
+
/** Button-backed rows do not describe a linked resource language. */
|
|
41
|
+
hrefLang?: never;
|
|
42
|
+
/** The callback invoked when the row's button is activated. */
|
|
43
|
+
onClick: MouseEventHandler<HTMLButtonElement>;
|
|
44
|
+
/** Button-backed rows do not expose navigation interception. */
|
|
45
|
+
onNavigate?: never;
|
|
46
|
+
/** Button-backed rows do not target a browsing context. */
|
|
47
|
+
target?: never;
|
|
48
|
+
};
|
|
49
|
+
/** A type representing a link-backed Table.Row configuration. */
|
|
50
|
+
type TableLinkRowProps = TableRowLinkProperties & {
|
|
51
|
+
/** The accessible name describing the whole-row link. */
|
|
52
|
+
"aria-label": string;
|
|
53
|
+
/** Link-backed rows do not expose button activation. */
|
|
54
|
+
onClick?: never;
|
|
55
|
+
};
|
|
56
|
+
/** A type representing properties for the Table.Row component. */
|
|
57
|
+
export type TableRowProps = TableRowBaseProps & (TableButtonRowProps | TableLinkRowProps | TableStaticRowProps);
|
|
58
|
+
/**
|
|
59
|
+
* Renders a native Table row without replacing its table semantics.
|
|
60
|
+
*
|
|
61
|
+
* @param props - The native row properties and cells.
|
|
62
|
+
* @param forwardedReference - The reference assigned to the row element.
|
|
63
|
+
*
|
|
64
|
+
* @returns The rendered Table row.
|
|
65
|
+
*/
|
|
66
|
+
declare const TableRow: import("react").ForwardRefExoticComponent<TableRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
|
|
67
|
+
export default TableRow;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { type MutableRefObject, type UIEvent } from "react";
|
|
2
|
+
/** A type representing the tracked horizontal overflow of a scroll region. */
|
|
3
|
+
export type HorizontalOverflow = {
|
|
4
|
+
/** The reference assigned to the scrolling container. */
|
|
5
|
+
containerReference: MutableRefObject<HTMLDivElement | null>;
|
|
6
|
+
/** The reference assigned to the content measured for overflow. */
|
|
7
|
+
contentReference: MutableRefObject<HTMLElement | null>;
|
|
8
|
+
/** Whether the content currently overflows its container horizontally. */
|
|
9
|
+
isScrollable: boolean;
|
|
10
|
+
/** Whether the container is scrolled away from its inline start. */
|
|
11
|
+
isScrolled: boolean;
|
|
12
|
+
/** Records the scroll position reached by the container. */
|
|
13
|
+
handleScroll: (event: UIEvent<HTMLDivElement>) => void;
|
|
14
|
+
};
|
|
15
|
+
/**
|
|
16
|
+
* Tracks whether a container's content overflows it horizontally.
|
|
17
|
+
*
|
|
18
|
+
* Overflow is measured rather than assumed, so a scroll region only becomes
|
|
19
|
+
* focusable while there is content a keyboard user cannot otherwise reach.
|
|
20
|
+
*
|
|
21
|
+
* @note Falls back to resize events when `ResizeObserver` is unavailable.
|
|
22
|
+
*
|
|
23
|
+
* @returns The element references, overflow state, and scroll handler.
|
|
24
|
+
*/
|
|
25
|
+
export declare function useHorizontalOverflow(): HorizontalOverflow;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
/** A value rendered directly or formatted by a Table cell. */
|
|
3
|
+
export type TableCellValue = boolean | Date | number | string;
|
|
4
|
+
/** The horizontal alignment applied to Table cell content. */
|
|
5
|
+
export type TableCellAlignment = "left" | "center" | "right";
|
|
6
|
+
/** A function transforming a supplied value into displayed cell content. */
|
|
7
|
+
export type TableCellFormatter = (value: TableCellValue) => ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Resolves the content displayed for a Table cell value.
|
|
10
|
+
*
|
|
11
|
+
* @param value - The supplied cell value.
|
|
12
|
+
* @param children - The fallback content used when no value is supplied.
|
|
13
|
+
* @param format - The optional consumer formatter applied to the value.
|
|
14
|
+
*
|
|
15
|
+
* @returns The content displayed inside the Table cell.
|
|
16
|
+
*/
|
|
17
|
+
export declare function resolveCellContent(value: TableCellValue | undefined, children: ReactNode, format: TableCellFormatter | undefined): ReactNode;
|
|
18
|
+
/**
|
|
19
|
+
* Resolves a native title for truncated primitive content.
|
|
20
|
+
*
|
|
21
|
+
* @param content - The rendered content considered for a title.
|
|
22
|
+
*
|
|
23
|
+
* @returns A readable title, when the content can be represented as text.
|
|
24
|
+
*/
|
|
25
|
+
export declare function resolveTruncateTitle(content: ReactNode): string | undefined;
|