@fusion.dev/helix-headless 0.145.0 → 0.146.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/custom-elements.json +7373 -3849
- package/dist/accordion/item/accordion-item.d.ts +14 -0
- package/dist/accordion/item/accordion-item.js +16 -6
- package/dist/accordion/root/accordion-root.d.ts +8 -5
- package/dist/announcement/root/announcement-root.d.ts +3 -2
- package/dist/announcement/root/announcement-root.js +3 -1
- package/dist/app-header/root/app-header-root.d.ts +7 -2
- package/dist/app-header/root/app-header-root.js +9 -1
- package/dist/app-header/sectioning.d.ts +3 -1
- package/dist/app-header/sectioning.js +3 -2
- package/dist/avatar/group/avatar-group.d.ts +20 -14
- package/dist/avatar/group/avatar-group.js +17 -19
- package/dist/badge/root/badge-root.d.ts +3 -1
- package/dist/badge/root/badge-root.js +2 -2
- package/dist/bar-chart/root/bar-chart-root.d.ts +18 -1
- package/dist/bar-chart/root/bar-chart-root.js +52 -15
- package/dist/bar-chart/stack.d.ts +15 -0
- package/dist/bar-chart/stack.js +19 -0
- package/dist/breadcrumbs/root/breadcrumbs-root.d.ts +25 -0
- package/dist/breadcrumbs/root/breadcrumbs-root.js +50 -3
- package/dist/button/root/button-root.d.ts +26 -0
- package/dist/button/root/button-root.js +38 -18
- package/dist/button-group/root/button-group-root.d.ts +2 -1
- package/dist/button-group/root/button-group-root.js +5 -1
- package/dist/canvas/node/canvas-node.d.ts +4 -3
- package/dist/canvas/node/canvas-node.js +3 -2
- package/dist/canvas/root/canvas-root.js +2 -2
- package/dist/card/root/card-root.d.ts +24 -3
- package/dist/card/root/card-root.js +20 -8
- package/dist/carousel/root/carousel-root.d.ts +43 -4
- package/dist/carousel/root/carousel-root.js +40 -12
- package/dist/carousel/stops.d.ts +20 -0
- package/dist/carousel/stops.js +30 -0
- package/dist/chat/message/chat-message.js +5 -4
- package/dist/chat/naming.d.ts +5 -1
- package/dist/chat/naming.js +4 -2
- package/dist/chat/root/chat-root.d.ts +25 -3
- package/dist/chat/root/chat-root.js +22 -5
- package/dist/checkbox/root/checkbox-root.d.ts +20 -0
- package/dist/checkbox/root/checkbox-root.js +14 -1
- package/dist/checkbox-group/root/checkbox-group-root.d.ts +8 -2
- package/dist/checkbox-group/root/checkbox-group-root.js +12 -10
- package/dist/checkbox-group/select-all.d.ts +27 -0
- package/dist/checkbox-group/select-all.js +12 -0
- package/dist/code-block/highlight.d.ts +15 -0
- package/dist/code-block/highlight.js +4 -0
- package/dist/code-block/root/code-block-root.d.ts +49 -1
- package/dist/code-block/root/code-block-root.js +58 -3
- package/dist/color-input/root/color-input-root.d.ts +3 -0
- package/dist/color-input/root/color-input-root.js +6 -3
- package/dist/color-picker/root/color-picker-root.d.ts +33 -4
- package/dist/color-picker/root/color-picker-root.js +80 -21
- package/dist/color-picker/swatches.d.ts +12 -0
- package/dist/color-picker/swatches.js +26 -0
- package/dist/combobox/root/combobox-root.d.ts +43 -0
- package/dist/combobox/root/combobox-root.js +79 -15
- package/dist/command/root/command-root.d.ts +16 -1
- package/dist/command/root/command-root.js +22 -4
- package/dist/copy-button/root/copy-button-root.d.ts +5 -0
- package/dist/copy-button/root/copy-button-root.js +10 -3
- package/dist/data-table/index.d.ts +1 -1
- package/dist/data-table/index.js +1 -1
- package/dist/data-table/keys.d.ts +24 -0
- package/dist/data-table/keys.js +24 -0
- package/dist/data-table/root/data-table-root.d.ts +27 -18
- package/dist/data-table/root/data-table-root.js +20 -52
- package/dist/data-table/tree.d.ts +16 -1
- package/dist/data-table/tree.js +2 -3
- package/dist/date-input/root/date-input-root.d.ts +3 -1
- package/dist/date-input/root/date-input-root.js +18 -7
- package/dist/date-picker/root/date-picker-root.js +12 -6
- package/dist/dialog/description.js +15 -1
- package/dist/dialog/root/dialog-root.d.ts +8 -2
- package/dist/dialog/root/dialog-root.js +16 -1
- package/dist/divider/root/divider-root.d.ts +3 -0
- package/dist/divider/root/divider-root.js +2 -1
- package/dist/donut-chart/root/donut-chart-root.d.ts +31 -0
- package/dist/donut-chart/root/donut-chart-root.js +48 -1
- package/dist/drawer/reveal.d.ts +8 -0
- package/dist/drawer/reveal.js +1 -0
- package/dist/drawer/root/drawer-root.d.ts +59 -0
- package/dist/drawer/root/drawer-root.js +63 -4
- package/dist/drilldown/item/drilldown-item.js +1 -1
- package/dist/drilldown/root/drilldown-root.d.ts +21 -3
- package/dist/drilldown/root/drilldown-root.js +21 -3
- package/dist/element-events.generated.js +31 -5
- package/dist/empty/root/empty-root.d.ts +3 -1
- package/dist/empty/root/empty-root.js +3 -2
- package/dist/file-input/root/file-input-root.d.ts +69 -6
- package/dist/file-input/root/file-input-root.js +82 -19
- package/dist/file-input/screen.d.ts +2 -1
- package/dist/filter-input/menu/filter-menu.d.ts +2 -0
- package/dist/filter-input/menu/filter-menu.js +12 -4
- package/dist/filter-input/root/filter-input-root.d.ts +30 -6
- package/dist/filter-input/root/filter-input-root.js +1 -1
- package/dist/filter-input/suggest.d.ts +28 -3
- package/dist/filter-input/suggest.js +18 -8
- package/dist/format-date/root/format-date-root.d.ts +9 -16
- package/dist/format-date/root/format-date-root.js +10 -27
- package/dist/heatmap/root/heatmap-root.d.ts +24 -13
- package/dist/heatmap/root/heatmap-root.js +34 -12
- package/dist/icon/root/icon-root.d.ts +12 -1
- package/dist/icon/root/icon-root.js +21 -10
- package/dist/icon/settle.d.ts +7 -0
- package/dist/icon/settle.js +10 -0
- package/dist/icon-button/root/icon-button-root.d.ts +2 -0
- package/dist/image/root/image-root.d.ts +5 -1
- package/dist/image/root/image-root.js +1 -1
- package/dist/input/root/input-root.d.ts +12 -2
- package/dist/input/root/input-root.js +11 -2
- package/dist/kbd/root/kbd-root.d.ts +35 -1
- package/dist/kbd/root/kbd-root.js +23 -4
- package/dist/legend/root/legend-root.d.ts +55 -8
- package/dist/legend/root/legend-root.js +55 -13
- package/dist/lightbox/root/lightbox-root.d.ts +49 -6
- package/dist/lightbox/root/lightbox-root.js +86 -19
- package/dist/lightbox/zoom-controller.d.ts +59 -0
- package/dist/lightbox/zoom-controller.js +128 -0
- package/dist/lightbox/zoom.d.ts +22 -0
- package/dist/lightbox/zoom.js +16 -0
- package/dist/line-chart/root/line-chart-root.d.ts +22 -1
- package/dist/line-chart/root/line-chart-root.js +21 -1
- package/dist/list/item/list-item.d.ts +2 -0
- package/dist/list/item/list-item.js +11 -2
- package/dist/list/root/list-root.d.ts +62 -13
- package/dist/list/root/list-root.js +70 -13
- package/dist/list/selection.d.ts +37 -7
- package/dist/list/selection.js +16 -7
- package/dist/listbox/root/listbox-root.d.ts +37 -1
- package/dist/listbox/root/listbox-root.js +49 -3
- package/dist/loader/busy.d.ts +10 -0
- package/dist/loader/busy.js +11 -0
- package/dist/loader/root/loader-root.d.ts +9 -2
- package/dist/loader/root/loader-root.js +23 -3
- package/dist/megamenu/root/megamenu-root.d.ts +51 -10
- package/dist/megamenu/root/megamenu-root.js +76 -5
- package/dist/menu/item/menu-item.d.ts +51 -2
- package/dist/menu/item/menu-item.js +47 -23
- package/dist/menu/root/menu-root.d.ts +14 -0
- package/dist/menu/root/menu-root.js +2 -2
- package/dist/meter/root/meter-root.d.ts +20 -1
- package/dist/meter/root/meter-root.js +11 -15
- package/dist/navigation/root/navigation-root.d.ts +2 -1
- package/dist/navigation/root/navigation-root.js +2 -2
- package/dist/notifications/root/notifications-root.d.ts +10 -3
- package/dist/notifications/root/notifications-root.js +19 -7
- package/dist/number-input/root/number-input-root.d.ts +17 -8
- package/dist/number-input/root/number-input-root.js +2 -7
- package/dist/object-inspector/root/object-inspector-root.d.ts +75 -27
- package/dist/object-inspector/root/object-inspector-root.js +117 -76
- package/dist/object-inspector/rows.d.ts +18 -0
- package/dist/object-inspector/rows.js +33 -0
- package/dist/option/root/option-root.d.ts +5 -3
- package/dist/outline/root/outline-root.d.ts +18 -0
- package/dist/outline/root/outline-root.js +23 -5
- package/dist/pagination/size/pagination-size.d.ts +1 -0
- package/dist/pagination/size/pagination-size.js +1 -1
- package/dist/pin-input/code.d.ts +10 -0
- package/dist/pin-input/code.js +13 -0
- package/dist/pin-input/root/pin-input-root.d.ts +25 -1
- package/dist/pin-input/root/pin-input-root.js +10 -11
- package/dist/popover/hide-outside.d.ts +14 -0
- package/dist/popover/hide-outside.js +41 -0
- package/dist/popover/root/popover-root.d.ts +57 -7
- package/dist/popover/root/popover-root.js +58 -3
- package/dist/progress/root/progress-root.d.ts +20 -0
- package/dist/progress/root/progress-root.js +15 -15
- package/dist/qr-code/export.d.ts +26 -1
- package/dist/qr-code/export.js +14 -0
- package/dist/qr-code/root/qr-code-root.d.ts +19 -5
- package/dist/qr-code/root/qr-code-root.js +58 -9
- package/dist/quote/marks.d.ts +8 -0
- package/dist/quote/marks.js +5 -0
- package/dist/quote/root/quote-root.d.ts +14 -2
- package/dist/quote/root/quote-root.js +23 -1
- package/dist/radio/root/radio-root.d.ts +6 -2
- package/dist/radio/root/radio-root.js +6 -1
- package/dist/rating/root/rating-root.d.ts +9 -4
- package/dist/rating/root/rating-root.js +31 -7
- package/dist/rating/steps.d.ts +7 -0
- package/dist/rating/steps.js +9 -0
- package/dist/scatter-chart/fit.d.ts +15 -0
- package/dist/scatter-chart/fit.js +35 -0
- package/dist/scatter-chart/root/scatter-chart-root.d.ts +21 -1
- package/dist/scatter-chart/root/scatter-chart-root.js +30 -17
- package/dist/scroll-area/root/scroll-area-root.d.ts +22 -51
- package/dist/scroll-area/root/scroll-area-root.js +57 -173
- package/dist/scroll-area/scrollbar-controller.d.ts +111 -0
- package/dist/scroll-area/scrollbar-controller.js +172 -0
- package/dist/scroll-area/scrollbar.d.ts +27 -0
- package/dist/scroll-area/scrollbar.js +9 -0
- package/dist/select/root/select-root.d.ts +15 -0
- package/dist/select/root/select-root.js +18 -6
- package/dist/skeleton/root/skeleton-root.d.ts +3 -0
- package/dist/skeleton/root/skeleton-root.js +4 -2
- package/dist/skip-link/root/skip-link-root.js +2 -2
- package/dist/slider/root/slider-root.d.ts +41 -4
- package/dist/slider/root/slider-root.js +23 -3
- package/dist/sparkline/readings.d.ts +18 -0
- package/dist/sparkline/readings.js +19 -0
- package/dist/sparkline/root/sparkline-root.d.ts +78 -7
- package/dist/sparkline/root/sparkline-root.js +118 -23
- package/dist/speed-dial/root/speed-dial-root.js +2 -2
- package/dist/splitter/root/splitter-root.d.ts +7 -12
- package/dist/splitter/root/splitter-root.js +209 -204
- package/dist/stat/root/stat-root.d.ts +14 -5
- package/dist/stat/root/stat-root.js +21 -5
- package/dist/steps/reach.d.ts +5 -0
- package/dist/steps/reach.js +3 -0
- package/dist/steps/root/steps-root.d.ts +49 -3
- package/dist/steps/root/steps-root.js +44 -5
- package/dist/steps/step/step.d.ts +7 -0
- package/dist/steps/step/step.js +7 -2
- package/dist/switch/root/switch-root.d.ts +10 -0
- package/dist/table/column/table-column.d.ts +0 -10
- package/dist/table/column/table-column.js +3 -19
- package/dist/table/root/table-root.d.ts +31 -10
- package/dist/table/root/table-root.js +2 -13
- package/dist/tabs/panel/tab-panel.d.ts +16 -3
- package/dist/tabs/panel/tab-panel.js +34 -5
- package/dist/tabs/root/tabs-root.d.ts +12 -0
- package/dist/tabs/root/tabs-root.js +1 -1
- package/dist/tabs/tab/tab.d.ts +5 -0
- package/dist/tabs/tab/tab.js +5 -2
- package/dist/tag/group/tag-group.d.ts +31 -4
- package/dist/tag/group/tag-group.js +46 -7
- package/dist/tag/root/tag-root.js +9 -2
- package/dist/textarea/root/textarea-root.d.ts +28 -1
- package/dist/textarea/root/textarea-root.js +40 -1
- package/dist/time-input/root/time-input-root.d.ts +5 -1
- package/dist/time-input/root/time-input-root.js +16 -8
- package/dist/time-picker/root/time-picker-root.d.ts +18 -4
- package/dist/time-picker/root/time-picker-root.js +7 -10
- package/dist/time-picker/wheel-name.d.ts +9 -0
- package/dist/time-picker/wheel-name.js +15 -0
- package/dist/timeline/group/timeline-group.js +2 -2
- package/dist/toast/item/toast-item.d.ts +14 -1
- package/dist/toast/item/toast-item.js +22 -5
- package/dist/toast/root/toast-root.d.ts +6 -0
- package/dist/toast/root/toast-root.js +16 -1
- package/dist/toggle/group/toggle-group.d.ts +24 -3
- package/dist/toggle/group/toggle-group.js +34 -5
- package/dist/tooltip/root/tooltip-root.d.ts +13 -2
- package/dist/tooltip/root/tooltip-root.js +9 -1
- package/dist/tour/back.d.ts +10 -0
- package/dist/tour/back.js +8 -0
- package/dist/tour/root/tour-root.d.ts +30 -2
- package/dist/tour/root/tour-root.js +34 -8
- package/dist/tree/item/tree-item.d.ts +7 -3
- package/dist/tree/item/tree-item.js +3 -0
- package/dist/tree/root/tree-root.d.ts +24 -3
- package/dist/tree/root/tree-root.js +32 -13
- package/dist/tree/selection.js +2 -15
- package/dist/trend/root/trend-root.d.ts +43 -18
- package/dist/trend/root/trend-root.js +31 -6
- package/dist/video/media-events.d.ts +13 -18
- package/dist/video/media-events.js +1 -5
- package/dist/video/root/video-root.d.ts +18 -5
- package/dist/video/root/video-root.js +19 -10
- package/dist/video-playlist/menu/video-playlist-menu.d.ts +2 -0
- package/dist/video-playlist/menu/video-playlist-menu.js +2 -1
- package/dist/video-playlist/root/video-playlist-root.d.ts +7 -1
- package/dist/virtual-list/fill.d.ts +0 -8
- package/dist/virtual-list/fill.js +1 -17
- package/dist/virtual-list/plan.d.ts +49 -0
- package/dist/virtual-list/plan.js +16 -0
- package/dist/virtual-list/root/virtual-list-root.d.ts +114 -13
- package/dist/virtual-list/root/virtual-list-root.js +183 -40
- package/lint.json +1 -1
- package/package.json +8 -8
- package/types/jsx.d.ts +4577 -835
- package/types/vue.d.ts +926 -168
- package/dist/chat/relative-clock.d.ts +0 -39
- package/dist/chat/relative-clock.js +0 -31
- package/dist/data-table/root/order.d.ts +0 -141
- package/dist/data-table/root/order.js +0 -76
- package/dist/tag/selection.d.ts +0 -10
- package/dist/tag/selection.js +0 -12
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import type { ReactiveController, ReactiveControllerHost } from 'lit';
|
|
2
|
-
/** What the clock reads from its host. */
|
|
3
|
-
export interface RelativeClockOptions {
|
|
4
|
-
/** The locale the reading is written in. Empty is the runtime's own. */
|
|
5
|
-
locale: () => string;
|
|
6
|
-
/** The instant being read, or nothing where there is none. */
|
|
7
|
-
moment: () => Date | undefined;
|
|
8
|
-
}
|
|
9
|
-
/**
|
|
10
|
-
* The time a relative reading is drawn against, moved on when the reading
|
|
11
|
-
* would change.
|
|
12
|
-
*
|
|
13
|
-
* **One wakeup when the words go stale, and none in between.** `relativeTime`
|
|
14
|
-
* says how long its answer holds, so the clock asks core's shared ticker for
|
|
15
|
-
* exactly that moment: a turn a minute old wakes once a minute, an hour old
|
|
16
|
-
* once an hour. Every turn on the page shares the ticker's one timer.
|
|
17
|
-
*
|
|
18
|
-
* `Format Date` keeps the same arrangement inline, and the two belong in one
|
|
19
|
-
* core controller.
|
|
20
|
-
*/
|
|
21
|
-
export declare class RelativeClockController implements ReactiveController {
|
|
22
|
-
private readonly host;
|
|
23
|
-
private readonly options;
|
|
24
|
-
/** The time the host last drew against, in milliseconds. */
|
|
25
|
-
now: number;
|
|
26
|
-
private stop;
|
|
27
|
-
constructor(host: ReactiveControllerHost & HTMLElement, options: RelativeClockOptions);
|
|
28
|
-
hostConnected(): void;
|
|
29
|
-
hostDisconnected(): void;
|
|
30
|
-
/**
|
|
31
|
-
* Reads the clock again and schedules the next reading.
|
|
32
|
-
*
|
|
33
|
-
* The host calls it when the instant or the locale changes, and the ticker
|
|
34
|
-
* calls it when the words go stale. **Only on a page**: a server has nobody
|
|
35
|
-
* to update a reading for, and a subscription there holds the element after
|
|
36
|
-
* its markup is sent.
|
|
37
|
-
*/
|
|
38
|
-
tick(): void;
|
|
39
|
-
}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { relativeTime, subscribe } from '@fusion.dev/helix-core';
|
|
2
|
-
export class RelativeClockController {
|
|
3
|
-
constructor(host, options) {
|
|
4
|
-
this.host = host;
|
|
5
|
-
this.options = options;
|
|
6
|
-
this.now = Date.now();
|
|
7
|
-
this.stop = undefined;
|
|
8
|
-
host.addController(this);
|
|
9
|
-
}
|
|
10
|
-
hostConnected() {
|
|
11
|
-
this.tick();
|
|
12
|
-
}
|
|
13
|
-
hostDisconnected() {
|
|
14
|
-
this.stop?.();
|
|
15
|
-
this.stop = undefined;
|
|
16
|
-
}
|
|
17
|
-
tick() {
|
|
18
|
-
this.stop?.();
|
|
19
|
-
this.stop = undefined;
|
|
20
|
-
this.now = Date.now();
|
|
21
|
-
this.host.requestUpdate();
|
|
22
|
-
const moment = this.options.moment();
|
|
23
|
-
if (!moment || !this.host.isConnected) {
|
|
24
|
-
return;
|
|
25
|
-
}
|
|
26
|
-
const { next } = relativeTime(this.options.locale())(moment, new Date(this.now));
|
|
27
|
-
if (Number.isFinite(next)) {
|
|
28
|
-
this.stop = subscribe(next, () => this.tick());
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
}
|
|
@@ -1,141 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Filter, sort, then window. In that order, over the whole set, every time.
|
|
3
|
-
*
|
|
4
|
-
* **This is the file that stops the classic virtualization bug.** Sorting the
|
|
5
|
-
* rendered window looks completely correct on the first screen and is wrong
|
|
6
|
-
* everywhere else, and it is the natural thing to write once rows are data and
|
|
7
|
-
* only some of them are drawn. Keeping the three operations here, as functions
|
|
8
|
-
* over an array with no knowledge of what is on screen, is what makes that
|
|
9
|
-
* mistake hard to make: nothing in this module can see a window, and `window()`
|
|
10
|
-
* is the last thing applied rather than the first.
|
|
11
|
-
*
|
|
12
|
-
* The order is not a preference. Filtering after sorting sorts rows that are
|
|
13
|
-
* about to be thrown away, which is only slower; paging before either is the bug.
|
|
14
|
-
* Filter narrows, sort arranges what is left, the page is a slice of that, and
|
|
15
|
-
* the count a reader is shown is the length after filtering rather than the
|
|
16
|
-
* length of the data, or the pagination promises pages that are empty.
|
|
17
|
-
*/
|
|
18
|
-
/**
|
|
19
|
-
* A row, which is whatever the consumer's data is.
|
|
20
|
-
*
|
|
21
|
-
* Not `DataRow`: `@fusion.dev/helix-core` already exports one, for a cell read out of a
|
|
22
|
-
* chart series, and the headless barrel re-exports both. Two different `DataRow`s
|
|
23
|
-
* reaching a consumer through one package is an ambiguity TypeScript refuses
|
|
24
|
-
* outright.
|
|
25
|
-
*/
|
|
26
|
-
export type DataRow = Readonly<Record<string, unknown>>;
|
|
27
|
-
/** One column's contribution, reduced to the two functions this module needs. */
|
|
28
|
-
export interface Axis {
|
|
29
|
-
/** The field this axis is named by, matched against a sort spec. */
|
|
30
|
-
field: string;
|
|
31
|
-
/** The value to compare and match on, which is not always what the cell shows. */
|
|
32
|
-
order: (row: DataRow) => unknown;
|
|
33
|
-
}
|
|
34
|
-
/** A parsed `field:direction`. */
|
|
35
|
-
export interface Sort {
|
|
36
|
-
direction: 'asc' | 'desc';
|
|
37
|
-
field: string;
|
|
38
|
-
}
|
|
39
|
-
/**
|
|
40
|
-
* `field:asc` and `field:desc`, and nothing else.
|
|
41
|
-
*
|
|
42
|
-
* A bare `field` parses as ascending, because that is what a URL query usually
|
|
43
|
-
* carries and refusing it would make the common case the verbose one. Anything
|
|
44
|
-
* unparseable is no sort rather than an error: this value arrives from a query
|
|
45
|
-
* string as often as from code, and a bad one should leave the table in the
|
|
46
|
-
* order the data came in rather than break the page.
|
|
47
|
-
*/
|
|
48
|
-
export declare const parse: (spec: string) => Sort | undefined;
|
|
49
|
-
/** A `Sort` written back out, so the property and the attribute agree. */
|
|
50
|
-
export declare const format: (sort: Sort | undefined) => string;
|
|
51
|
-
/**
|
|
52
|
-
* What a reader gets on the next click of a sortable heading.
|
|
53
|
-
*
|
|
54
|
-
* Ascending, descending, then none. **The third state is not an omission to be
|
|
55
|
-
* tidied away**: the order rows arrived in is information the data came with,
|
|
56
|
-
* often the server's own relevance ranking, and a two-state cycle makes it
|
|
57
|
-
* unreachable once a reader has sorted once.
|
|
58
|
-
*/
|
|
59
|
-
export declare const cycle: (current: Sort | undefined, field: string) => Sort | undefined;
|
|
60
|
-
/**
|
|
61
|
-
* Rows matching a query, across every axis.
|
|
62
|
-
*
|
|
63
|
-
* One query over all columns rather than a predicate per column, which is what a
|
|
64
|
-
* reader means by a search box above a table. Per-column predicates are a
|
|
65
|
-
* different feature and compose with this rather than replacing it.
|
|
66
|
-
*
|
|
67
|
-
* Case-insensitive and substring, on the ordering value rather than the rendered
|
|
68
|
-
* one: a cell showing a formatted date should be findable by the text a reader
|
|
69
|
-
* sees, and a cell showing an icon should be findable by the value behind it.
|
|
70
|
-
* Where those differ, `compare` on the column is what decides, which is the same
|
|
71
|
-
* function sorting uses, so search and sort cannot disagree about what a column
|
|
72
|
-
* holds.
|
|
73
|
-
*/
|
|
74
|
-
export declare const filter: (rows: readonly DataRow[], query: string, axes: readonly Axis[]) => DataRow[];
|
|
75
|
-
/**
|
|
76
|
-
* Rows in the asked-for order, stably.
|
|
77
|
-
*
|
|
78
|
-
* **Stable, and that is load-bearing rather than tidy.** `Array.prototype.sort`
|
|
79
|
-
* is required to be stable since ES2019, so equal rows keep the order they
|
|
80
|
-
* arrived in, which means sorting by one column and then another leaves the
|
|
81
|
-
* first as the tiebreak. A reader who sorts by status and then by name expects
|
|
82
|
-
* exactly that, and an unstable sort would shuffle equal rows on every
|
|
83
|
-
* re-render, which reads as the table twitching.
|
|
84
|
-
*/
|
|
85
|
-
export declare const sort: (rows: readonly DataRow[], spec: Sort | undefined, axes: readonly Axis[]) => DataRow[];
|
|
86
|
-
/**
|
|
87
|
-
* One page of rows, clamped.
|
|
88
|
-
*
|
|
89
|
-
* A page past the end returns the last page rather than nothing, because the
|
|
90
|
-
* usual way to be past the end is a bookmarked link after the result shrank,
|
|
91
|
-
* and an empty table is a worse answer than the last page of a smaller one. The
|
|
92
|
-
* same clamp `Pagination` already applies to what it reports.
|
|
93
|
-
*/
|
|
94
|
-
export declare const window_: (rows: readonly DataRow[], page: number, size: number) => DataRow[];
|
|
95
|
-
/** What arranging produces: the rows in order, with no page or window taken. */
|
|
96
|
-
export interface Arranged {
|
|
97
|
-
/** Rows after filtering and sorting, in the order they are to be drawn. */
|
|
98
|
-
rows: DataRow[];
|
|
99
|
-
/** Rows before filtering, which is what tells a reader a filter is on. */
|
|
100
|
-
total: number;
|
|
101
|
-
}
|
|
102
|
-
/**
|
|
103
|
-
* Filtering and sorting, with nothing taken off the end.
|
|
104
|
-
*
|
|
105
|
-
* **Split out of `ordered` because a window moves and this does not.** A table
|
|
106
|
-
* drawing a window on a result re-renders every time a scroll reveals a row,
|
|
107
|
-
* and deriving that render from the whole result means filtering and sorting it
|
|
108
|
-
* again each time: 23.7ms at five thousand rows, a frame budget spent three
|
|
109
|
-
* times over before a cell is drawn. A caller that keeps this between renders
|
|
110
|
-
* pays it once per change to the data rather than once per frame.
|
|
111
|
-
*
|
|
112
|
-
* The two steps stay together for the reason `ordered` gives below: sorting a
|
|
113
|
-
* page is the classic bug, and one function doing both is what makes calling
|
|
114
|
-
* them in the wrong order impossible.
|
|
115
|
-
*/
|
|
116
|
-
export declare const arranged: (rows: readonly DataRow[], axes: readonly Axis[], { query, spec }: {
|
|
117
|
-
query: string;
|
|
118
|
-
spec: string;
|
|
119
|
-
}) => Arranged;
|
|
120
|
-
/** What one pass over the data produces: the window, and the counts around it. */
|
|
121
|
-
export interface Ordered {
|
|
122
|
-
/** Rows after filtering, before paging. The number a pagination must page. */
|
|
123
|
-
matched: number;
|
|
124
|
-
/** The rows to draw. */
|
|
125
|
-
rows: DataRow[];
|
|
126
|
-
/** Rows before filtering, which is what tells a reader a filter is on. */
|
|
127
|
-
total: number;
|
|
128
|
-
}
|
|
129
|
-
/**
|
|
130
|
-
* The whole pass, in the one order that is correct.
|
|
131
|
-
*
|
|
132
|
-
* Exported as a single function so a caller cannot get the order wrong by
|
|
133
|
-
* calling the three in the sequence that reads naturally, which is the sequence
|
|
134
|
-
* that pages before it sorts.
|
|
135
|
-
*/
|
|
136
|
-
export declare const ordered: (rows: readonly DataRow[], axes: readonly Axis[], { page, query, size, spec }: {
|
|
137
|
-
page: number;
|
|
138
|
-
query: string;
|
|
139
|
-
size: number;
|
|
140
|
-
spec: string;
|
|
141
|
-
}) => Ordered;
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
export const parse = (spec) => {
|
|
2
|
-
const trimmed = spec.trim();
|
|
3
|
-
if (trimmed === '') {
|
|
4
|
-
return undefined;
|
|
5
|
-
}
|
|
6
|
-
const [field = '', direction = 'asc'] = trimmed.split(':');
|
|
7
|
-
if (field === '' || (direction !== 'asc' && direction !== 'desc')) {
|
|
8
|
-
return undefined;
|
|
9
|
-
}
|
|
10
|
-
return { direction, field };
|
|
11
|
-
};
|
|
12
|
-
export const format = (sort) => sort ? `${sort.field}:${sort.direction}` : '';
|
|
13
|
-
export const cycle = (current, field) => {
|
|
14
|
-
if (current?.field !== field) {
|
|
15
|
-
return { direction: 'asc', field };
|
|
16
|
-
}
|
|
17
|
-
return current.direction === 'asc' ? { direction: 'desc', field } : undefined;
|
|
18
|
-
};
|
|
19
|
-
export const filter = (rows, query, axes) => {
|
|
20
|
-
const needle = query.trim().toLocaleLowerCase();
|
|
21
|
-
if (needle === '') {
|
|
22
|
-
return [...rows];
|
|
23
|
-
}
|
|
24
|
-
return rows.filter((row) => axes.some((axis) => text(axis.order(row)).toLocaleLowerCase().includes(needle)));
|
|
25
|
-
};
|
|
26
|
-
export const sort = (rows, spec, axes) => {
|
|
27
|
-
const axis = spec ? axes.find((one) => one.field === spec.field) : undefined;
|
|
28
|
-
if (!spec || !axis) {
|
|
29
|
-
return [...rows];
|
|
30
|
-
}
|
|
31
|
-
const sign = spec.direction === 'asc' ? 1 : -1;
|
|
32
|
-
return [...rows].sort((left, right) => compare(axis.order(left), axis.order(right), sign));
|
|
33
|
-
};
|
|
34
|
-
export const window_ = (rows, page, size) => {
|
|
35
|
-
if (size <= 0) {
|
|
36
|
-
return [...rows];
|
|
37
|
-
}
|
|
38
|
-
const pages = Math.max(1, Math.ceil(rows.length / size));
|
|
39
|
-
const wanted = Math.min(pages, Math.max(1, Math.floor(page) || 1));
|
|
40
|
-
const from = (wanted - 1) * size;
|
|
41
|
-
return rows.slice(from, from + size);
|
|
42
|
-
};
|
|
43
|
-
const text = (value) => {
|
|
44
|
-
if (value === null || value === undefined) {
|
|
45
|
-
return '';
|
|
46
|
-
}
|
|
47
|
-
if (value instanceof Date) {
|
|
48
|
-
return value.toISOString();
|
|
49
|
-
}
|
|
50
|
-
return String(value);
|
|
51
|
-
};
|
|
52
|
-
const compare = (left, right, sign) => {
|
|
53
|
-
const leftMissing = left === null || left === undefined || left === '';
|
|
54
|
-
const rightMissing = right === null || right === undefined || right === '';
|
|
55
|
-
if (leftMissing || rightMissing) {
|
|
56
|
-
return leftMissing && rightMissing ? 0 : leftMissing ? 1 : -1;
|
|
57
|
-
}
|
|
58
|
-
if (typeof left === 'number' && typeof right === 'number') {
|
|
59
|
-
return sign * (left - right);
|
|
60
|
-
}
|
|
61
|
-
if (typeof left === 'boolean' && typeof right === 'boolean') {
|
|
62
|
-
return sign * (Number(left) - Number(right));
|
|
63
|
-
}
|
|
64
|
-
if (left instanceof Date && right instanceof Date) {
|
|
65
|
-
return sign * (left.getTime() - right.getTime());
|
|
66
|
-
}
|
|
67
|
-
return (sign * text(left).localeCompare(text(right), undefined, { numeric: true, sensitivity: 'base' }));
|
|
68
|
-
};
|
|
69
|
-
export const arranged = (rows, axes, { query, spec }) => ({
|
|
70
|
-
rows: sort(filter(rows, query, axes), parse(spec), axes),
|
|
71
|
-
total: rows.length,
|
|
72
|
-
});
|
|
73
|
-
export const ordered = (rows, axes, { page, query, size, spec }) => {
|
|
74
|
-
const { rows: inOrder, total } = arranged(rows, axes, { query, spec });
|
|
75
|
-
return { matched: inOrder.length, rows: window_(inOrder, page, size), total };
|
|
76
|
-
};
|
package/dist/tag/selection.d.ts
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
/** How many tags a group lets a reader select. */
|
|
2
|
-
export type TagSelectionMode = 'multiple' | 'none' | 'single';
|
|
3
|
-
/**
|
|
4
|
-
* The `value` a press on the tag carrying `pressed` leaves.
|
|
5
|
-
*
|
|
6
|
-
* `single` selects that tag alone, or none where it was the one selected.
|
|
7
|
-
* `multiple` adds it, or takes it out. `none` selects nothing and leaves the
|
|
8
|
-
* value as it was.
|
|
9
|
-
*/
|
|
10
|
-
export declare const pressedValue: (mode: TagSelectionMode, value: string, pressed: string) => string;
|
package/dist/tag/selection.js
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { commaList, toggleValue } from '@fusion.dev/helix-core';
|
|
2
|
-
export const pressedValue = (mode, value, pressed) => {
|
|
3
|
-
const now = commaList(value);
|
|
4
|
-
const held = now.includes(pressed);
|
|
5
|
-
if (mode === 'single') {
|
|
6
|
-
return held ? '' : pressed;
|
|
7
|
-
}
|
|
8
|
-
if (mode === 'multiple') {
|
|
9
|
-
return toggleValue(now, pressed).join(', ');
|
|
10
|
-
}
|
|
11
|
-
return value;
|
|
12
|
-
};
|