@botiverse/raft-ui 0.58.1 → 0.59.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/CHANGELOG.md +17 -0
- package/dist/components/table/index.d.mts +2 -2
- package/dist/components/table/table.d.mts +48 -5
- package/dist/components/table/table.mjs +56 -5
- package/dist/components/table/table.recipe.mjs +47 -20
- package/dist/wip.d.mts +3 -1
- package/dist/wip.mjs +2 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,20 @@
|
|
|
1
|
+
## [0.59.0](https://github.com/botiverse/raft-design/compare/v0.58.1...v0.59.0) (2026-11-03)
|
|
2
|
+
|
|
3
|
+
### Breaking Changes
|
|
4
|
+
|
|
5
|
+
- **TableHead / TableCell**: `align` is now a variant, `"left"` (the default) or `"right"`, instead of the native HTML `align` attribute. Pass the same value to a column's heading and its cells. ([#959](https://github.com/botiverse/raft-design/pull/959))
|
|
6
|
+
- Why: a right-aligned column was set with a class on each cell, which can't move a sortable heading's label (a button filling the cell); one `align` value now aligns a heading, its cells and a sortable heading's label alike.
|
|
7
|
+
- Affects: `align="right"` sets `text-right` instead of rendering the `align` attribute; `align` no longer takes `"center"`, `"justify"` or `"char"`, and is no longer passed to the `th` or `td`.
|
|
8
|
+
- Migrate: replace `align="center"` / `"justify"` / `"char"` with a class such as `text-center`; a column aligned with a `text-right` class can pass `align="right"` to its heading and cells instead.
|
|
9
|
+
- Docs: https://raft-design.botiverse.build/components/table/#content
|
|
10
|
+
|
|
11
|
+
### Added
|
|
12
|
+
|
|
13
|
+
- **TableSortableHead** (`@botiverse/raft-ui/wip`, experimental, + types `TableSort`, `TableSortableHeadProps`): a column heading that sorts the rows. Its label is a button filling the cell; it sets `aria-sort` on the heading cell and draws a 12px arrow on the sorted column only, after the label or before it with `align="right"`. The sort stays in your state: pass `sort` and set it from `onSortChange`; `firstSort` (default `"ascending"`) is the direction of a first click. ([#959](https://github.com/botiverse/raft-design/pull/959))
|
|
14
|
+
- Why: the Sorting rule had no part, so each list had to build its heading's button, `aria-sort`, arrow and touch hit area itself.
|
|
15
|
+
- Affects: every sortable heading keeps the 12px arrow's room, empty when unsorted, so columns don't move when the sort changes; on a touch screen the button's hit area is 44px high.
|
|
16
|
+
- Docs: https://raft-design.botiverse.build/components/table/#sorting
|
|
17
|
+
|
|
1
18
|
## [0.58.1](https://github.com/botiverse/raft-design/compare/v0.58.0...v0.58.1) (2026-11-03)
|
|
2
19
|
|
|
3
20
|
### Fixed
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Table, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColgroup, TableColgroupProps, TableColumn, TableColumnProps, TableHead, TableHeadProps, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps } from "./table.mjs";
|
|
2
|
-
export { Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableColgroup, type TableColgroupProps, TableColumn, type TableColumnProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableProps, TableRow, type TableRowProps };
|
|
1
|
+
import { Table, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColgroup, TableColgroupProps, TableColumn, TableColumnProps, TableHead, TableHeadProps, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, TableSort, TableSortableHead, TableSortableHeadProps } from "./table.mjs";
|
|
2
|
+
export { Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableColgroup, type TableColgroupProps, TableColumn, type TableColumnProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, type TableSort, TableSortableHead, type TableSortableHeadProps };
|
|
@@ -5,8 +5,41 @@ type TableProps = StyledProps<useRender.ComponentProps<"table">>;
|
|
|
5
5
|
type TableHeaderProps = StyledProps<useRender.ComponentProps<"thead">>;
|
|
6
6
|
type TableBodyProps = StyledProps<useRender.ComponentProps<"tbody">>;
|
|
7
7
|
type TableRowProps = StyledProps<useRender.ComponentProps<"tr">>;
|
|
8
|
-
type TableHeadProps = StyledProps<useRender.ComponentProps<"th"
|
|
9
|
-
|
|
8
|
+
type TableHeadProps = Omit<StyledProps<useRender.ComponentProps<"th">>, "align"> & {
|
|
9
|
+
/**
|
|
10
|
+
* `"right"` for a right-aligned column, such as numbers. Pass the same
|
|
11
|
+
* value to the column's cells, so the heading sits over its values.
|
|
12
|
+
*/
|
|
13
|
+
align?: "left" | "right";
|
|
14
|
+
};
|
|
15
|
+
type TableCellProps = Omit<StyledProps<useRender.ComponentProps<"td">>, "align"> & {
|
|
16
|
+
/**
|
|
17
|
+
* `"right"` for a right-aligned column, such as numbers. Pass the same
|
|
18
|
+
* value to the column's heading, so the heading sits over its values.
|
|
19
|
+
*/
|
|
20
|
+
align?: "left" | "right";
|
|
21
|
+
};
|
|
22
|
+
type TableSort = "ascending" | "descending";
|
|
23
|
+
type TableSortableHeadProps = Omit<StyledProps<useRender.ComponentProps<"th">>, "align" | "aria-sort"> & {
|
|
24
|
+
/**
|
|
25
|
+
* The column's current sort, or undefined when the rows aren't sorted by
|
|
26
|
+
* it. Sets `aria-sort` on the heading cell and draws the arrow.
|
|
27
|
+
*/
|
|
28
|
+
sort?: TableSort;
|
|
29
|
+
/**
|
|
30
|
+
* The direction of a first click, when the rows aren't sorted by this
|
|
31
|
+
* column: `"descending"` for numbers and dates, `"ascending"` for text.
|
|
32
|
+
*/
|
|
33
|
+
firstSort?: TableSort;
|
|
34
|
+
/** Called with the next direction: the reverse of `sort`, or `firstSort`. */
|
|
35
|
+
onSortChange?: (sort: TableSort) => void;
|
|
36
|
+
/**
|
|
37
|
+
* `"right"` for a right-aligned column, such as numbers: the label ends on
|
|
38
|
+
* the column's right edge and the arrow goes before it. Pass the same value
|
|
39
|
+
* to the column's cells.
|
|
40
|
+
*/
|
|
41
|
+
align?: "left" | "right";
|
|
42
|
+
};
|
|
10
43
|
type TableColgroupProps = StyledProps<useRender.ComponentProps<"colgroup">>;
|
|
11
44
|
type TableColumnProps = StyledProps<useRender.ComponentProps<"col">>;
|
|
12
45
|
type TableCaptionProps = StyledProps<useRender.ComponentProps<"caption">>;
|
|
@@ -21,8 +54,18 @@ export declare function Table({ className, render, ...props }: TableProps): impo
|
|
|
21
54
|
export declare function TableHeader({ className, render, ...props }: TableHeaderProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
22
55
|
export declare function TableBody({ className, render, ...props }: TableBodyProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
23
56
|
export declare function TableRow({ className, render, ...props }: TableRowProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
24
|
-
export declare function TableHead({ className, render, scope, ...props }: TableHeadProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
25
|
-
|
|
57
|
+
export declare function TableHead({ className, render, scope, align, ...props }: TableHeadProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
58
|
+
/**
|
|
59
|
+
* A column heading that sorts the rows (table.md, "Sorting"): a `TableHead`
|
|
60
|
+
* whose label is a button filling the cell, with `aria-sort` on the cell and
|
|
61
|
+
* a 12px arrow on the sorted column only. Which column is sorted is the
|
|
62
|
+
* caller's: pass `sort` and update it from `onSortChange`. In a header row
|
|
63
|
+
* drawn without `Table`, pass `render={<div role="columnheader" />}`; with
|
|
64
|
+
* `render` it sets no `scope`, which only a `th` takes. Native props,
|
|
65
|
+
* `className` and the ref go to the heading cell, not the button.
|
|
66
|
+
*/
|
|
67
|
+
export declare function TableSortableHead({ className, render, scope, sort, firstSort, onSortChange, align, children, ...props }: TableSortableHeadProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
68
|
+
export declare function TableCell({ className, render, align, ...props }: TableCellProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
26
69
|
/**
|
|
27
70
|
* The table's accessible name. Render it visually or hide it with `sr-only`;
|
|
28
71
|
* a table without a caption should carry `aria-label` instead.
|
|
@@ -32,4 +75,4 @@ export declare function TableCaption({ className, render, ...props }: TableCapti
|
|
|
32
75
|
export declare function TableColgroup({ className, render, ...props }: TableColgroupProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
33
76
|
export declare function TableColumn({ className, render, ...props }: TableColumnProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
|
|
34
77
|
//#endregion
|
|
35
|
-
export type { TableBodyProps, TableCaptionProps, TableCellProps, TableColgroupProps, TableColumnProps, TableHeadProps, TableHeaderProps, TableProps, TableRowProps };
|
|
78
|
+
export type { TableBodyProps, TableCaptionProps, TableCellProps, TableColgroupProps, TableColumnProps, TableHeadProps, TableHeaderProps, TableProps, TableRowProps, TableSort, TableSortableHeadProps };
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { table } from "./table.recipe.mjs";
|
|
2
|
+
import { ArrowDown, ArrowUp } from "lucide-react";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
4
|
import { mergeProps } from "@base-ui/react/merge-props";
|
|
3
5
|
import { useRender } from "@base-ui/react/use-render";
|
|
4
6
|
//#region src/components/table/table.tsx
|
|
@@ -45,8 +47,8 @@ function TableRow({ className, render, ...props }) {
|
|
|
45
47
|
state: { slot: "table-row" }
|
|
46
48
|
});
|
|
47
49
|
}
|
|
48
|
-
function TableHead({ className, render, scope = "col", ...props }) {
|
|
49
|
-
const { head } = table();
|
|
50
|
+
function TableHead({ className, render, scope = "col", align = "left", ...props }) {
|
|
51
|
+
const { head } = table({ align });
|
|
50
52
|
return useRender({
|
|
51
53
|
defaultTagName: "th",
|
|
52
54
|
render,
|
|
@@ -57,8 +59,57 @@ function TableHead({ className, render, scope = "col", ...props }) {
|
|
|
57
59
|
state: { slot: "table-head" }
|
|
58
60
|
});
|
|
59
61
|
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
+
/**
|
|
63
|
+
* A column heading that sorts the rows (table.md, "Sorting"): a `TableHead`
|
|
64
|
+
* whose label is a button filling the cell, with `aria-sort` on the cell and
|
|
65
|
+
* a 12px arrow on the sorted column only. Which column is sorted is the
|
|
66
|
+
* caller's: pass `sort` and update it from `onSortChange`. In a header row
|
|
67
|
+
* drawn without `Table`, pass `render={<div role="columnheader" />}`; with
|
|
68
|
+
* `render` it sets no `scope`, which only a `th` takes. Native props,
|
|
69
|
+
* `className` and the ref go to the heading cell, not the button.
|
|
70
|
+
*/
|
|
71
|
+
function TableSortableHead({ className, render, scope, sort, firstSort = "ascending", onSortChange, align = "left", children, ...props }) {
|
|
72
|
+
const { head, sortableHead, sortButton, sortArrow } = table({
|
|
73
|
+
align,
|
|
74
|
+
sorted: sort !== void 0
|
|
75
|
+
});
|
|
76
|
+
const arrow = sort ? /* @__PURE__ */ jsx(sort === "descending" ? ArrowDown : ArrowUp, {
|
|
77
|
+
"aria-hidden": true,
|
|
78
|
+
"data-slot": "table-sort-arrow",
|
|
79
|
+
className: sortArrow()
|
|
80
|
+
}) : /* @__PURE__ */ jsx("span", {
|
|
81
|
+
"aria-hidden": true,
|
|
82
|
+
"data-slot": "table-sort-arrow-space",
|
|
83
|
+
className: sortArrow()
|
|
84
|
+
});
|
|
85
|
+
const button = /* @__PURE__ */ jsxs("button", {
|
|
86
|
+
type: "button",
|
|
87
|
+
"data-slot": "table-sort-button",
|
|
88
|
+
className: sortButton(),
|
|
89
|
+
onClick: () => onSortChange?.(sort ? reverseSort(sort) : firstSort),
|
|
90
|
+
children: [
|
|
91
|
+
align === "right" ? arrow : null,
|
|
92
|
+
children,
|
|
93
|
+
align === "right" ? null : arrow
|
|
94
|
+
]
|
|
95
|
+
});
|
|
96
|
+
return useRender({
|
|
97
|
+
defaultTagName: "th",
|
|
98
|
+
render,
|
|
99
|
+
props: mergeProps({
|
|
100
|
+
scope: scope ?? (render === void 0 ? "col" : void 0),
|
|
101
|
+
"aria-sort": sort,
|
|
102
|
+
className: head({ className: sortableHead({ className }) }),
|
|
103
|
+
children: button
|
|
104
|
+
}, props),
|
|
105
|
+
state: { slot: "table-sortable-head" }
|
|
106
|
+
});
|
|
107
|
+
}
|
|
108
|
+
function reverseSort(sort) {
|
|
109
|
+
return sort === "ascending" ? "descending" : "ascending";
|
|
110
|
+
}
|
|
111
|
+
function TableCell({ className, render, align = "left", ...props }) {
|
|
112
|
+
const { cell } = table({ align });
|
|
62
113
|
return useRender({
|
|
63
114
|
defaultTagName: "td",
|
|
64
115
|
render,
|
|
@@ -99,4 +150,4 @@ function TableColumn({ className, render, ...props }) {
|
|
|
99
150
|
});
|
|
100
151
|
}
|
|
101
152
|
//#endregion
|
|
102
|
-
export { Table, TableBody, TableCaption, TableCell, TableColgroup, TableColumn, TableHead, TableHeader, TableRow };
|
|
153
|
+
export { Table, TableBody, TableCaption, TableCell, TableColgroup, TableColumn, TableHead, TableHeader, TableRow, TableSortableHead };
|
|
@@ -7,25 +7,52 @@ import { tv } from "../../lib/tv.mjs";
|
|
|
7
7
|
* `table-fixed` class when stable widths matter; the base writes no
|
|
8
8
|
* `table-layout` so that override is always available.
|
|
9
9
|
*/
|
|
10
|
-
const table = tv({
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
10
|
+
const table = tv({
|
|
11
|
+
slots: {
|
|
12
|
+
root: ["w-full border-collapse caption-bottom", "font-sans text-callout text-foreground"],
|
|
13
|
+
header: [],
|
|
14
|
+
body: ["[&>tr:last-child>td]:border-b-0 [&>tr:last-child>th]:border-b-0", "[&>tr]:hover:bg-fill-subtle [&>tr]:active:bg-fill-medium"],
|
|
15
|
+
row: [
|
|
16
|
+
"not-aria-selected:not-data-[selected=true]:data-popup-open:bg-fill-subtle",
|
|
17
|
+
"not-aria-selected:not-data-[selected=true]:has-data-popup-open:bg-fill-subtle",
|
|
18
|
+
"aria-selected:bg-info-soft aria-selected:hover:bg-info-soft aria-selected:active:bg-info-soft",
|
|
19
|
+
"data-[selected=true]:bg-info-soft data-[selected=true]:hover:bg-info-soft data-[selected=true]:active:bg-info-soft"
|
|
20
|
+
],
|
|
21
|
+
head: [
|
|
22
|
+
"text-left whitespace-nowrap",
|
|
23
|
+
"border-b border-line-hairline px-3 py-2",
|
|
24
|
+
"text-footnote font-bold normal-case tracking-normal text-foreground-hint"
|
|
25
|
+
],
|
|
26
|
+
cell: ["align-top wrap-anywhere", "border-b border-line-hairline px-3 py-2"],
|
|
27
|
+
colgroup: [],
|
|
28
|
+
column: [],
|
|
29
|
+
caption: ["pt-2 text-caption text-foreground-hint"],
|
|
30
|
+
sortableHead: ["p-0"],
|
|
31
|
+
sortButton: [
|
|
32
|
+
"relative flex w-full items-center gap-1",
|
|
33
|
+
"border-0 bg-transparent px-3 py-2 [font:inherit]",
|
|
34
|
+
"cursor-pointer rounded-sticker",
|
|
35
|
+
"hover:text-foreground",
|
|
36
|
+
"outline-none focus-visible:shadow-focus",
|
|
37
|
+
"pointer-coarse:after:absolute pointer-coarse:after:inset-x-0 pointer-coarse:after:bottom-0 pointer-coarse:after:content-['']",
|
|
38
|
+
"pointer-coarse:after:-top-[calc(--spacing(11)-100%)]"
|
|
39
|
+
],
|
|
40
|
+
sortArrow: ["size-3 shrink-0"]
|
|
41
|
+
},
|
|
42
|
+
variants: {
|
|
43
|
+
align: {
|
|
44
|
+
left: {},
|
|
45
|
+
right: {
|
|
46
|
+
head: "text-right",
|
|
47
|
+
cell: "text-right",
|
|
48
|
+
sortButton: "justify-end"
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
sorted: {
|
|
52
|
+
true: { sortButton: "text-foreground" },
|
|
53
|
+
false: { sortButton: "text-foreground-hint" }
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
});
|
|
30
57
|
//#endregion
|
|
31
58
|
export { table };
|
package/dist/wip.d.mts
CHANGED
|
@@ -16,6 +16,8 @@ import { MessageQuotedPreviewAuthorDelegatedBy, MessageQuotedPreviewAuthorDelega
|
|
|
16
16
|
import "./components/message-quoted-preview/index.mjs";
|
|
17
17
|
import { MessageListJumpControls, MessageListJumpControlsProps, MessageListJumpPill, MessageListJumpPillDismiss, MessageListJumpPillDismissProps, MessageListJumpPillGroup, MessageListJumpPillGroupProps, MessageListJumpPillProps } from "./components/message-list/message-list-jump.mjs";
|
|
18
18
|
import "./components/message-list/index.mjs";
|
|
19
|
+
import { TableSort, TableSortableHead, TableSortableHeadProps } from "./components/table/table.mjs";
|
|
20
|
+
import "./components/table/index.mjs";
|
|
19
21
|
import { DEFAULT_DRAG_MESSAGES, DragAnnouncementSource, DragMessages, DragNamed, DragPlace, createDragAnnouncements, dragInstructions, dragMessages } from "./components/drag/drag-announcements.mjs";
|
|
20
22
|
import { PanelSplitAction, PanelSplitActionMain, PanelSplitActionMainProps, PanelSplitActionMenu, PanelSplitActionMenuProps, PanelSplitActionProps, PanelSplitActionToggle, PanelSplitActionToggleProps } from "./components/panel/panel-split-action.mjs";
|
|
21
23
|
import "./components/panel/index.mjs";
|
|
@@ -62,4 +64,4 @@ import { SaveStatus, SaveStatusError, SaveStatusErrorProps, SaveStatusProps, Sav
|
|
|
62
64
|
import "./components/save-status/index.mjs";
|
|
63
65
|
import { TaskCompletionControl, TaskCompletionControlProps } from "./components/task-completion-control/task-completion-control.mjs";
|
|
64
66
|
import "./components/task-completion-control/index.mjs";
|
|
65
|
-
export { Dialog as AnnouncementDialog, AnnouncementDialogAction, AnnouncementDialogBody, DialogClose as AnnouncementDialogClose, AnnouncementDialogContent, AnnouncementDialogFooter, AnnouncementDialogHeader, AnnouncementDialogLabel, AnnouncementDialogPicture, AnnouncementDialogSecondaryAction, AnnouncementDialogText, AnnouncementDialogTitle, DialogTrigger as AnnouncementDialogTrigger, AvatarGroupButton, type AvatarGroupButtonProps, COMMENT_HIGHLIGHT, COMMENT_HIGHLIGHT_ACTIVE, ChoiceList, type ChoiceListGroup, type ChoiceListItem, type ChoiceListMultipleProps, type ChoiceListProps, type ChoiceListSingleProps, ComboboxSelect, type ComboboxSelectGroup, type ComboboxSelectMessages, type ComboboxSelectOption, type ComboboxSelectProps, type ComboboxSelectSelection, type ComboboxSelectValue, CommentCard, CommentCardMeta, type CommentCardMetaProps, type CommentCardProps, CommentCardQuote, type CommentCardQuoteProps, CommentCardTrigger, type CommentCardTriggerProps, CommentEntry, CommentEntryAuthor, type CommentEntryAuthorProps, CommentEntryBody, type CommentEntryBodyProps, CommentEntryHeader, type CommentEntryHeaderProps, type CommentEntryProps, CommentEntryTime, type CommentEntryTimeProps, CommentMargin, CommentMarginItem, type CommentMarginItemProps, type CommentMarginLayout, type CommentMarginLayoutItem, type CommentMarginLayoutOptions, type CommentMarginProps, CommentMarker, type CommentMarkerProps, DEFAULT_DRAG_MESSAGES, DRAG_AUTO_SCROLL_ZONE_PX, DRAG_KEYBOARD_CODES, DRAG_KEYBOARD_OFFSET_PX, DRAG_LIFT_Z_INDEX, DRAG_SETTLE, DRAG_SIBLING_TRANSITION, DROP_GLIDE, DialogCommit, type DialogCommitProps, DialogFooterNote, type DialogFooterNoteProps, DialogSheetBack, type DialogSheetBackProps, DialogSheetContent, type DialogSheetContentProps, type DragAcrossLists, type DragAnnouncementSource, DragLift, type DragLiftProps, type DragListsItems, DragLiveRegion, type DragMessages, type DragNamed, type DragPlace, DragRefusalHint, type DragRefusalHintProps, DragRemeasure, type DragRemeasureProps, type DragSensorsOptions, DraggedSlot, type DraggedSlotProps, DropPlaceholder, type DropPlaceholderProps, DropdownMenuLinkItem, type DropdownMenuLinkItemProps, Ellipsis, type EllipsisProps, type EllipsisState, EllipsisToggle, type EllipsisToggleProps, FilterChip, FilterChipLabel, type FilterChipLabelProps, type FilterChipProps, FilterChipRemove, type FilterChipRemoveProps, type HoldThenMoveOptions, HoldThenMoveTouchSensor, InboxItemLeadingBadge, type InboxItemLeadingBadgeProps, InboxItemSkeleton, InboxItemSkeletonList, type InboxItemSkeletonListProps, type InboxItemSkeletonProps, LIFT_CLASS, ListRowSkeleton, type ListRowSkeletonProps, MOUSE_DRAG_DISTANCE_PX, MessageItemDelegatedAvatar, type MessageItemDelegatedAvatarProps, MessageItemDelegatedBy, MessageItemDelegatedByButton, type MessageItemDelegatedByButtonProps, MessageItemDelegatedByName, type MessageItemDelegatedByNameProps, type MessageItemDelegatedByProps, MessageListJumpControls, type MessageListJumpControlsProps, MessageListJumpPill, MessageListJumpPillDismiss, type MessageListJumpPillDismissProps, MessageListJumpPillGroup, type MessageListJumpPillGroupProps, type MessageListJumpPillProps, MessageQuotedPreviewAuthorDelegatedBy, type MessageQuotedPreviewAuthorDelegatedByProps, MessageReferenceIcon, type MessageReferenceIconProps, MessageReferenceReadMark, type MessageReferenceReadMarkProps, Meter, MeterHeader, type MeterHeaderProps, MeterIndicator, type MeterIndicatorProps, MeterLabel, type MeterLabelProps, type MeterProps, MeterTrack, type MeterTrackProps, MeterValue, type MeterValueProps, MobileNavServerItem, type MobileNavServerItemProps, MobileNavServerPopover, MobileNavServerPopoverContent, type MobileNavServerPopoverContentProps, MobileNavServerPopoverDestination, type MobileNavServerPopoverDestinationProps, MobileNavServerPopoverDestinations, type MobileNavServerPopoverDestinationsProps, MobileNavServerPopoverGroup, type MobileNavServerPopoverGroupProps, MobileNavServerPopoverList, type MobileNavServerPopoverListProps, type MobileNavServerPopoverProps, MobileNavServerPopoverRow, MobileNavServerPopoverRowBody, type MobileNavServerPopoverRowBodyProps, MobileNavServerPopoverRowDescription, type MobileNavServerPopoverRowDescriptionProps, MobileNavServerPopoverRowLabel, type MobileNavServerPopoverRowLabelProps, type MobileNavServerPopoverRowProps, ModeBar, ModeBarAction, type ModeBarActionProps, ModeBarContent, type ModeBarContentProps, ModeBarDescription, type ModeBarDescriptionProps, type ModeBarProps, ModeBarTitle, type ModeBarTitleProps, MouseOnlyPointerSensor, ORIGIN_OPACITY, type OverlayLayerKind, OverlayLayerProvider, type OverlayLayerProviderProps, PULL_TO_REFRESH_DAMPING, PULL_TO_REFRESH_HOLD_DISTANCE, PULL_TO_REFRESH_MAX_DISTANCE, PULL_TO_REFRESH_POINTER_QUERY, PULL_TO_REFRESH_SNAP_BACK_MS, PULL_TO_REFRESH_THRESHOLD, PanelSplitAction, PanelSplitActionMain, type PanelSplitActionMainProps, PanelSplitActionMenu, type PanelSplitActionMenuProps, type PanelSplitActionProps, PanelSplitActionToggle, type PanelSplitActionToggleProps, PopoverActions, type PopoverActionsProps, PopoverBody, type PopoverBodyProps, PreviewCardActions, type PreviewCardActionsProps, PreviewCardBody, type PreviewCardBodyProps, PreviewCardEyebrow, type PreviewCardEyebrowProps, PreviewCardFooter, type PreviewCardFooterProps, PreviewCardMeta, type PreviewCardMetaProps, type PullToRefresh, PullToRefreshIndicator, type PullToRefreshIndicatorProps, type PullToRefreshPlatform, type PullToRefreshState, SaveStatus, SaveStatusError, type SaveStatusErrorProps, type SaveStatusProps, SaveStatusSaved, type SaveStatusSavedProps, TOUCH_DRAG_DISTANCE_PX, TOUCH_DRAG_HOLD_MS, TOUCH_DRAG_TOLERANCE_PX, TaskCompletionControl, type TaskCompletionControlProps, type UseCommentMarginFitsOptions, type UseDragListsOptions, type UsePullToRefreshOptions, cancelDrag, createDragAnnouncements, dragInstructions, dragListStrategy, dragMessages, keepGrabInside, listKeyboardCoordinates, resolveCommentMarginLayout, setCommentHighlights, useCommentMarginFits, useDragAcrossLists, useDragAnnouncer, useDragLists, useDragSensors, useDragSiblingTransition, useHoldThenMoveTouchSensor, useMouseOnlyPointerSensor, useParentOverlayKind, usePullToRefresh, useTruncated };
|
|
67
|
+
export { Dialog as AnnouncementDialog, AnnouncementDialogAction, AnnouncementDialogBody, DialogClose as AnnouncementDialogClose, AnnouncementDialogContent, AnnouncementDialogFooter, AnnouncementDialogHeader, AnnouncementDialogLabel, AnnouncementDialogPicture, AnnouncementDialogSecondaryAction, AnnouncementDialogText, AnnouncementDialogTitle, DialogTrigger as AnnouncementDialogTrigger, AvatarGroupButton, type AvatarGroupButtonProps, COMMENT_HIGHLIGHT, COMMENT_HIGHLIGHT_ACTIVE, ChoiceList, type ChoiceListGroup, type ChoiceListItem, type ChoiceListMultipleProps, type ChoiceListProps, type ChoiceListSingleProps, ComboboxSelect, type ComboboxSelectGroup, type ComboboxSelectMessages, type ComboboxSelectOption, type ComboboxSelectProps, type ComboboxSelectSelection, type ComboboxSelectValue, CommentCard, CommentCardMeta, type CommentCardMetaProps, type CommentCardProps, CommentCardQuote, type CommentCardQuoteProps, CommentCardTrigger, type CommentCardTriggerProps, CommentEntry, CommentEntryAuthor, type CommentEntryAuthorProps, CommentEntryBody, type CommentEntryBodyProps, CommentEntryHeader, type CommentEntryHeaderProps, type CommentEntryProps, CommentEntryTime, type CommentEntryTimeProps, CommentMargin, CommentMarginItem, type CommentMarginItemProps, type CommentMarginLayout, type CommentMarginLayoutItem, type CommentMarginLayoutOptions, type CommentMarginProps, CommentMarker, type CommentMarkerProps, DEFAULT_DRAG_MESSAGES, DRAG_AUTO_SCROLL_ZONE_PX, DRAG_KEYBOARD_CODES, DRAG_KEYBOARD_OFFSET_PX, DRAG_LIFT_Z_INDEX, DRAG_SETTLE, DRAG_SIBLING_TRANSITION, DROP_GLIDE, DialogCommit, type DialogCommitProps, DialogFooterNote, type DialogFooterNoteProps, DialogSheetBack, type DialogSheetBackProps, DialogSheetContent, type DialogSheetContentProps, type DragAcrossLists, type DragAnnouncementSource, DragLift, type DragLiftProps, type DragListsItems, DragLiveRegion, type DragMessages, type DragNamed, type DragPlace, DragRefusalHint, type DragRefusalHintProps, DragRemeasure, type DragRemeasureProps, type DragSensorsOptions, DraggedSlot, type DraggedSlotProps, DropPlaceholder, type DropPlaceholderProps, DropdownMenuLinkItem, type DropdownMenuLinkItemProps, Ellipsis, type EllipsisProps, type EllipsisState, EllipsisToggle, type EllipsisToggleProps, FilterChip, FilterChipLabel, type FilterChipLabelProps, type FilterChipProps, FilterChipRemove, type FilterChipRemoveProps, type HoldThenMoveOptions, HoldThenMoveTouchSensor, InboxItemLeadingBadge, type InboxItemLeadingBadgeProps, InboxItemSkeleton, InboxItemSkeletonList, type InboxItemSkeletonListProps, type InboxItemSkeletonProps, LIFT_CLASS, ListRowSkeleton, type ListRowSkeletonProps, MOUSE_DRAG_DISTANCE_PX, MessageItemDelegatedAvatar, type MessageItemDelegatedAvatarProps, MessageItemDelegatedBy, MessageItemDelegatedByButton, type MessageItemDelegatedByButtonProps, MessageItemDelegatedByName, type MessageItemDelegatedByNameProps, type MessageItemDelegatedByProps, MessageListJumpControls, type MessageListJumpControlsProps, MessageListJumpPill, MessageListJumpPillDismiss, type MessageListJumpPillDismissProps, MessageListJumpPillGroup, type MessageListJumpPillGroupProps, type MessageListJumpPillProps, MessageQuotedPreviewAuthorDelegatedBy, type MessageQuotedPreviewAuthorDelegatedByProps, MessageReferenceIcon, type MessageReferenceIconProps, MessageReferenceReadMark, type MessageReferenceReadMarkProps, Meter, MeterHeader, type MeterHeaderProps, MeterIndicator, type MeterIndicatorProps, MeterLabel, type MeterLabelProps, type MeterProps, MeterTrack, type MeterTrackProps, MeterValue, type MeterValueProps, MobileNavServerItem, type MobileNavServerItemProps, MobileNavServerPopover, MobileNavServerPopoverContent, type MobileNavServerPopoverContentProps, MobileNavServerPopoverDestination, type MobileNavServerPopoverDestinationProps, MobileNavServerPopoverDestinations, type MobileNavServerPopoverDestinationsProps, MobileNavServerPopoverGroup, type MobileNavServerPopoverGroupProps, MobileNavServerPopoverList, type MobileNavServerPopoverListProps, type MobileNavServerPopoverProps, MobileNavServerPopoverRow, MobileNavServerPopoverRowBody, type MobileNavServerPopoverRowBodyProps, MobileNavServerPopoverRowDescription, type MobileNavServerPopoverRowDescriptionProps, MobileNavServerPopoverRowLabel, type MobileNavServerPopoverRowLabelProps, type MobileNavServerPopoverRowProps, ModeBar, ModeBarAction, type ModeBarActionProps, ModeBarContent, type ModeBarContentProps, ModeBarDescription, type ModeBarDescriptionProps, type ModeBarProps, ModeBarTitle, type ModeBarTitleProps, MouseOnlyPointerSensor, ORIGIN_OPACITY, type OverlayLayerKind, OverlayLayerProvider, type OverlayLayerProviderProps, PULL_TO_REFRESH_DAMPING, PULL_TO_REFRESH_HOLD_DISTANCE, PULL_TO_REFRESH_MAX_DISTANCE, PULL_TO_REFRESH_POINTER_QUERY, PULL_TO_REFRESH_SNAP_BACK_MS, PULL_TO_REFRESH_THRESHOLD, PanelSplitAction, PanelSplitActionMain, type PanelSplitActionMainProps, PanelSplitActionMenu, type PanelSplitActionMenuProps, type PanelSplitActionProps, PanelSplitActionToggle, type PanelSplitActionToggleProps, PopoverActions, type PopoverActionsProps, PopoverBody, type PopoverBodyProps, PreviewCardActions, type PreviewCardActionsProps, PreviewCardBody, type PreviewCardBodyProps, PreviewCardEyebrow, type PreviewCardEyebrowProps, PreviewCardFooter, type PreviewCardFooterProps, PreviewCardMeta, type PreviewCardMetaProps, type PullToRefresh, PullToRefreshIndicator, type PullToRefreshIndicatorProps, type PullToRefreshPlatform, type PullToRefreshState, SaveStatus, SaveStatusError, type SaveStatusErrorProps, type SaveStatusProps, SaveStatusSaved, type SaveStatusSavedProps, TOUCH_DRAG_DISTANCE_PX, TOUCH_DRAG_HOLD_MS, TOUCH_DRAG_TOLERANCE_PX, type TableSort, TableSortableHead, type TableSortableHeadProps, TaskCompletionControl, type TaskCompletionControlProps, type UseCommentMarginFitsOptions, type UseDragListsOptions, type UsePullToRefreshOptions, cancelDrag, createDragAnnouncements, dragInstructions, dragListStrategy, dragMessages, keepGrabInside, listKeyboardCoordinates, resolveCommentMarginLayout, setCommentHighlights, useCommentMarginFits, useDragAcrossLists, useDragAnnouncer, useDragLists, useDragSensors, useDragSiblingTransition, useHoldThenMoveTouchSensor, useMouseOnlyPointerSensor, useParentOverlayKind, usePullToRefresh, useTruncated };
|
package/dist/wip.mjs
CHANGED
|
@@ -12,6 +12,7 @@ import { MessageItemDelegatedAvatar, MessageItemDelegatedBy, MessageItemDelegate
|
|
|
12
12
|
import { MessageReferenceIcon, MessageReferenceReadMark } from "./components/message-item/message-reference.mjs";
|
|
13
13
|
import { MessageQuotedPreviewAuthorDelegatedBy } from "./components/message-quoted-preview/message-quoted-preview.mjs";
|
|
14
14
|
import { MessageListJumpControls, MessageListJumpPill, MessageListJumpPillDismiss, MessageListJumpPillGroup } from "./components/message-list/message-list-jump.mjs";
|
|
15
|
+
import { TableSortableHead } from "./components/table/table.mjs";
|
|
15
16
|
import { DEFAULT_DRAG_MESSAGES, createDragAnnouncements, dragInstructions, dragMessages } from "./components/drag/drag-announcements.mjs";
|
|
16
17
|
import { LIFT_CLASS } from "./components/drag/drag.recipe.mjs";
|
|
17
18
|
import { DRAG_AUTO_SCROLL_ZONE_PX, DRAG_KEYBOARD_OFFSET_PX, DRAG_LIFT_Z_INDEX, DRAG_SETTLE, DRAG_SIBLING_TRANSITION, DROP_GLIDE, DragLift, ORIGIN_OPACITY, cancelDrag, keepGrabInside, useDragSiblingTransition } from "./components/drag/drag-lift.mjs";
|
|
@@ -42,4 +43,4 @@ import { PullToRefreshIndicator } from "./components/pull-to-refresh/pull-to-ref
|
|
|
42
43
|
import { ChoiceList } from "./components/choice-list/choice-list.mjs";
|
|
43
44
|
import { SaveStatus, SaveStatusError, SaveStatusSaved } from "./components/save-status/save-status.mjs";
|
|
44
45
|
import { TaskCompletionControl } from "./components/task-completion-control/task-completion-control.mjs";
|
|
45
|
-
export { Dialog as AnnouncementDialog, AnnouncementDialogAction, AnnouncementDialogBody, DialogClose as AnnouncementDialogClose, AnnouncementDialogContent, AnnouncementDialogFooter, AnnouncementDialogHeader, AnnouncementDialogLabel, AnnouncementDialogPicture, AnnouncementDialogSecondaryAction, AnnouncementDialogText, AnnouncementDialogTitle, DialogTrigger as AnnouncementDialogTrigger, AvatarGroupButton, COMMENT_HIGHLIGHT, COMMENT_HIGHLIGHT_ACTIVE, ChoiceList, ComboboxSelect, CommentCard, CommentCardMeta, CommentCardQuote, CommentCardTrigger, CommentEntry, CommentEntryAuthor, CommentEntryBody, CommentEntryHeader, CommentEntryTime, CommentMargin, CommentMarginItem, CommentMarker, DEFAULT_DRAG_MESSAGES, DRAG_AUTO_SCROLL_ZONE_PX, DRAG_KEYBOARD_CODES, DRAG_KEYBOARD_OFFSET_PX, DRAG_LIFT_Z_INDEX, DRAG_SETTLE, DRAG_SIBLING_TRANSITION, DROP_GLIDE, DialogCommit, DialogFooterNote, DialogSheetBack, DialogSheetContent, DragLift, DragLiveRegion, DragRefusalHint, DragRemeasure, DraggedSlot, DropPlaceholder, DropdownMenuLinkItem, Ellipsis, EllipsisToggle, FilterChip, FilterChipLabel, FilterChipRemove, HoldThenMoveTouchSensor, InboxItemLeadingBadge, InboxItemSkeleton, InboxItemSkeletonList, LIFT_CLASS, ListRowSkeleton, MOUSE_DRAG_DISTANCE_PX, MessageItemDelegatedAvatar, MessageItemDelegatedBy, MessageItemDelegatedByButton, MessageItemDelegatedByName, MessageListJumpControls, MessageListJumpPill, MessageListJumpPillDismiss, MessageListJumpPillGroup, MessageQuotedPreviewAuthorDelegatedBy, MessageReferenceIcon, MessageReferenceReadMark, Meter, MeterHeader, MeterIndicator, MeterLabel, MeterTrack, MeterValue, MobileNavServerItem, MobileNavServerPopover, MobileNavServerPopoverContent, MobileNavServerPopoverDestination, MobileNavServerPopoverDestinations, MobileNavServerPopoverGroup, MobileNavServerPopoverList, MobileNavServerPopoverRow, MobileNavServerPopoverRowBody, MobileNavServerPopoverRowDescription, MobileNavServerPopoverRowLabel, ModeBar, ModeBarAction, ModeBarContent, ModeBarDescription, ModeBarTitle, MouseOnlyPointerSensor, ORIGIN_OPACITY, OverlayLayerProvider, PULL_TO_REFRESH_DAMPING, PULL_TO_REFRESH_HOLD_DISTANCE, PULL_TO_REFRESH_MAX_DISTANCE, PULL_TO_REFRESH_POINTER_QUERY, PULL_TO_REFRESH_SNAP_BACK_MS, PULL_TO_REFRESH_THRESHOLD, PanelSplitAction, PanelSplitActionMain, PanelSplitActionMenu, PanelSplitActionToggle, PopoverActions, PopoverBody, PreviewCardActions, PreviewCardBody, PreviewCardEyebrow, PreviewCardFooter, PreviewCardMeta, PullToRefreshIndicator, SaveStatus, SaveStatusError, SaveStatusSaved, TOUCH_DRAG_DISTANCE_PX, TOUCH_DRAG_HOLD_MS, TOUCH_DRAG_TOLERANCE_PX, TaskCompletionControl, cancelDrag, createDragAnnouncements, dragInstructions, dragListStrategy, dragMessages, keepGrabInside, listKeyboardCoordinates, resolveCommentMarginLayout, setCommentHighlights, useCommentMarginFits, useDragAcrossLists, useDragAnnouncer, useDragLists, useDragSensors, useDragSiblingTransition, useHoldThenMoveTouchSensor, useMouseOnlyPointerSensor, useParentOverlayKind, usePullToRefresh, useTruncated };
|
|
46
|
+
export { Dialog as AnnouncementDialog, AnnouncementDialogAction, AnnouncementDialogBody, DialogClose as AnnouncementDialogClose, AnnouncementDialogContent, AnnouncementDialogFooter, AnnouncementDialogHeader, AnnouncementDialogLabel, AnnouncementDialogPicture, AnnouncementDialogSecondaryAction, AnnouncementDialogText, AnnouncementDialogTitle, DialogTrigger as AnnouncementDialogTrigger, AvatarGroupButton, COMMENT_HIGHLIGHT, COMMENT_HIGHLIGHT_ACTIVE, ChoiceList, ComboboxSelect, CommentCard, CommentCardMeta, CommentCardQuote, CommentCardTrigger, CommentEntry, CommentEntryAuthor, CommentEntryBody, CommentEntryHeader, CommentEntryTime, CommentMargin, CommentMarginItem, CommentMarker, DEFAULT_DRAG_MESSAGES, DRAG_AUTO_SCROLL_ZONE_PX, DRAG_KEYBOARD_CODES, DRAG_KEYBOARD_OFFSET_PX, DRAG_LIFT_Z_INDEX, DRAG_SETTLE, DRAG_SIBLING_TRANSITION, DROP_GLIDE, DialogCommit, DialogFooterNote, DialogSheetBack, DialogSheetContent, DragLift, DragLiveRegion, DragRefusalHint, DragRemeasure, DraggedSlot, DropPlaceholder, DropdownMenuLinkItem, Ellipsis, EllipsisToggle, FilterChip, FilterChipLabel, FilterChipRemove, HoldThenMoveTouchSensor, InboxItemLeadingBadge, InboxItemSkeleton, InboxItemSkeletonList, LIFT_CLASS, ListRowSkeleton, MOUSE_DRAG_DISTANCE_PX, MessageItemDelegatedAvatar, MessageItemDelegatedBy, MessageItemDelegatedByButton, MessageItemDelegatedByName, MessageListJumpControls, MessageListJumpPill, MessageListJumpPillDismiss, MessageListJumpPillGroup, MessageQuotedPreviewAuthorDelegatedBy, MessageReferenceIcon, MessageReferenceReadMark, Meter, MeterHeader, MeterIndicator, MeterLabel, MeterTrack, MeterValue, MobileNavServerItem, MobileNavServerPopover, MobileNavServerPopoverContent, MobileNavServerPopoverDestination, MobileNavServerPopoverDestinations, MobileNavServerPopoverGroup, MobileNavServerPopoverList, MobileNavServerPopoverRow, MobileNavServerPopoverRowBody, MobileNavServerPopoverRowDescription, MobileNavServerPopoverRowLabel, ModeBar, ModeBarAction, ModeBarContent, ModeBarDescription, ModeBarTitle, MouseOnlyPointerSensor, ORIGIN_OPACITY, OverlayLayerProvider, PULL_TO_REFRESH_DAMPING, PULL_TO_REFRESH_HOLD_DISTANCE, PULL_TO_REFRESH_MAX_DISTANCE, PULL_TO_REFRESH_POINTER_QUERY, PULL_TO_REFRESH_SNAP_BACK_MS, PULL_TO_REFRESH_THRESHOLD, PanelSplitAction, PanelSplitActionMain, PanelSplitActionMenu, PanelSplitActionToggle, PopoverActions, PopoverBody, PreviewCardActions, PreviewCardBody, PreviewCardEyebrow, PreviewCardFooter, PreviewCardMeta, PullToRefreshIndicator, SaveStatus, SaveStatusError, SaveStatusSaved, TOUCH_DRAG_DISTANCE_PX, TOUCH_DRAG_HOLD_MS, TOUCH_DRAG_TOLERANCE_PX, TableSortableHead, TaskCompletionControl, cancelDrag, createDragAnnouncements, dragInstructions, dragListStrategy, dragMessages, keepGrabInside, listKeyboardCoordinates, resolveCommentMarginLayout, setCommentHighlights, useCommentMarginFits, useDragAcrossLists, useDragAnnouncer, useDragLists, useDragSensors, useDragSiblingTransition, useHoldThenMoveTouchSensor, useMouseOnlyPointerSensor, useParentOverlayKind, usePullToRefresh, useTruncated };
|