@vizejs/ui 0.347.7 → 0.351.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/{button-BMIqJ_M5.d.mts → button-CVX8UBXj.d.mts} +6 -7
- package/dist/{button-CaLxP2l2.mjs → button-DT8AKlds.mjs} +2 -2
- package/dist/button.d.mts +1 -1
- package/dist/button.mjs +1 -1
- package/dist/catalog.d.mts +541 -0
- package/dist/catalog.mjs +784 -0
- package/dist/{checkbox-B4y9GUen.mjs → checkbox-BgIvwjyC.mjs} +2 -2
- package/dist/{checkbox-sbhaWekB.d.mts → checkbox-DP3_ko7D.d.mts} +7 -8
- package/dist/checkbox.d.mts +1 -1
- package/dist/checkbox.mjs +1 -1
- package/dist/collection.d.mts +2 -2
- package/dist/collection.mjs +1 -1
- package/dist/composite-navigation-QINW9GLy.d.mts +115 -0
- package/dist/composite-navigation-Skx3LZsv.mjs +354 -0
- package/dist/composite-navigation.d.mts +2 -0
- package/dist/composite-navigation.mjs +2 -0
- package/dist/controllable-state.d.mts +1 -1
- package/dist/dismissable-layer-4icKahVs.d.mts +119 -0
- package/dist/dismissable-layer-CwG1gtdz.mjs +488 -0
- package/dist/dismissable-layer.d.mts +2 -0
- package/dist/dismissable-layer.mjs +2 -0
- package/dist/focus-CAWi_I-0.mjs +318 -0
- package/dist/focus-K6dOifoZ.d.mts +112 -0
- package/dist/focus-guards-Bt0C-0qS.d.mts +81 -0
- package/dist/focus-guards-DhMPQAT8.mjs +299 -0
- package/dist/focus-guards.d.mts +2 -0
- package/dist/focus-guards.mjs +2 -0
- package/dist/focus-scope-CavhKWx0.d.mts +100 -0
- package/dist/focus-scope-D9U1aj67.mjs +340 -0
- package/dist/focus-scope-dom-DBwNEWxG.mjs +264 -0
- package/dist/focus-scope.d.mts +2 -0
- package/dist/focus-scope.mjs +2 -0
- package/dist/focus.d.mts +2 -0
- package/dist/focus.mjs +2 -0
- package/dist/hover-BXwwbSaO.d.mts +80 -0
- package/dist/hover.d.mts +2 -0
- package/dist/hover.mjs +197 -0
- package/dist/{id-BSgJwErt.d.mts → id-5OAUyVPd.d.mts} +2 -3
- package/dist/{id-CPBdeoL3.mjs → id-mziSyAse.mjs} +2 -2
- package/dist/id.d.mts +2 -2
- package/dist/id.mjs +1 -1
- package/dist/index.d.mts +22 -11
- package/dist/index.mjs +21 -10
- package/dist/inert-outside-CyqtoKQ4.mjs +346 -0
- package/dist/inert-outside-tuHRmaqJ.d.mts +43 -0
- package/dist/inert-outside.d.mts +2 -0
- package/dist/inert-outside.mjs +2 -0
- package/dist/interaction-modality.d.mts +2 -2
- package/dist/interaction-modality.mjs +1 -1
- package/dist/long-press-Dsul69gk.mjs +340 -0
- package/dist/{long-press-CRjjjJK2.d.mts → long-press-cll6z2K9.d.mts} +8 -18
- package/dist/long-press.d.mts +2 -2
- package/dist/long-press.mjs +1 -245
- package/dist/media-pdf.d.mts +1 -1
- package/dist/media-pdf.mjs +1 -1
- package/dist/media.d.mts +1 -1
- package/dist/media.mjs +1 -1
- package/dist/move-BOmXDYbh.d.mts +103 -0
- package/dist/move-BVvMHzxr.mjs +386 -0
- package/dist/move.d.mts +2 -0
- package/dist/move.mjs +2 -0
- package/dist/{press-Bp57IOe2.mjs → press-N_mE3Mgx.mjs} +3 -149
- package/dist/press-event-Cd2OPpmw.mjs +149 -0
- package/dist/press.d.mts +1 -1
- package/dist/press.mjs +1 -1
- package/dist/{primitive-BE28SwD7.mjs → primitive-BX31dogp.mjs} +2 -2
- package/dist/{primitive-Bog8qvd8.d.mts → primitive-C8jW7DLd.d.mts} +3 -4
- package/dist/primitive.d.mts +1 -1
- package/dist/primitive.mjs +1 -1
- package/dist/scroll-lock-BgVtX4wT.d.mts +49 -0
- package/dist/scroll-lock-Ckbmm0-J.mjs +313 -0
- package/dist/scroll-lock.d.mts +2 -0
- package/dist/scroll-lock.mjs +2 -0
- package/dist/spatial-navigation-CHj9mDZH.d.mts +106 -0
- package/dist/spatial-navigation-D6-UDavU.mjs +301 -0
- package/dist/spatial-navigation.d.mts +2 -0
- package/dist/spatial-navigation.mjs +2 -0
- package/dist/typeahead-B7KDxE_u.mjs +175 -0
- package/dist/typeahead-BbgUB2Bj.d.mts +71 -0
- package/dist/typeahead.d.mts +2 -0
- package/dist/typeahead.mjs +2 -0
- package/dist/visually-hidden-BOqfqBFt.d.mts +17 -0
- package/dist/{visually-hidden-CTSV3ctZ.mjs → visually-hidden-BwDOx5yf.mjs} +2 -2
- package/dist/visually-hidden.d.mts +1 -1
- package/dist/visually-hidden.mjs +1 -1
- package/package.json +67 -6
- package/dist/visually-hidden-CekDwEwR.d.mts +0 -19
- /package/dist/{_plugin-vue_export-helper-BVN2DL-U.mjs → _plugin-vue_export-helper-BOaGB7Aw.mjs} +0 -0
- /package/dist/{collection-aHZ6Pf0e.d.mts → collection-B_dFZOHO.d.mts} +0 -0
- /package/dist/{collection-CoOROaho.mjs → collection-eHN150dT.mjs} +0 -0
- /package/dist/{controllable-state-B9v6FClp.d.mts → controllable-state-BtoxKahh.d.mts} +0 -0
- /package/dist/{interaction-modality-CO-eQzNy.mjs → interaction-modality-DOZK0BpZ.mjs} +0 -0
- /package/dist/{interaction-modality-tee79ZBZ.d.mts → interaction-modality-jgHKjPFB.d.mts} +0 -0
- /package/dist/{pdf-source-BbZKF_dS.d.mts → pdf-source-BYFK2Pks.d.mts} +0 -0
- /package/dist/{pdf-source-C9zNQd9l.mjs → pdf-source-zu1LkCeE.mjs} +0 -0
- /package/dist/{press-types-B8Ssxqg4.d.mts → press-types-CNqStzJf.d.mts} +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useControllableState } from "./controllable-state.mjs";
|
|
2
|
-
import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-
|
|
2
|
+
import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
|
|
3
3
|
import { computed, createElementBlock, defineComponent, nextTick, openBlock, unref, useTemplateRef, watch, watchEffect } from "vue";
|
|
4
4
|
//#region src/checkbox-state.ts
|
|
5
5
|
/** Resolve the visual state while giving the mixed state precedence. */
|
|
@@ -18,7 +18,7 @@ const _hoisted_1 = [
|
|
|
18
18
|
];
|
|
19
19
|
//#endregion
|
|
20
20
|
//#region src/CheckboxControl.vue
|
|
21
|
-
var CheckboxControl_default =
|
|
21
|
+
var CheckboxControl_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
|
|
22
22
|
__name: "CheckboxControl",
|
|
23
23
|
props: {
|
|
24
24
|
modelValue: {
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { r as StateUpdate } from "./controllable-state-
|
|
2
|
-
import * as _$vue from "vue";
|
|
1
|
+
import { r as StateUpdate } from "./controllable-state-BtoxKahh.mjs";
|
|
3
2
|
|
|
4
3
|
//#region src/checkbox-state.d.ts
|
|
5
4
|
/** Visual state exposed by the Checkbox Native CSS contract. */
|
|
@@ -42,21 +41,21 @@ type __VLS_Props = {
|
|
|
42
41
|
};
|
|
43
42
|
/** Move focus to the native checkbox. */
|
|
44
43
|
declare function focus(options?: FocusOptions): void;
|
|
45
|
-
declare const __VLS_export:
|
|
46
|
-
element: Readonly<
|
|
47
|
-
checked:
|
|
44
|
+
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
|
|
45
|
+
element: Readonly<import("vue").ShallowRef<HTMLInputElement | null>>;
|
|
46
|
+
checked: import("vue").ComputedRef<boolean>;
|
|
48
47
|
focus: typeof focus;
|
|
49
48
|
reset: () => boolean;
|
|
50
49
|
setChecked: (update: StateUpdate<boolean>) => boolean;
|
|
51
|
-
}, {}, {}, {},
|
|
50
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
52
51
|
"update:modelValue": (value: boolean) => any;
|
|
53
52
|
"update:indeterminate": (value: boolean) => any;
|
|
54
53
|
change: (value: boolean, nativeEvent: Event) => any;
|
|
55
|
-
}, string,
|
|
54
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
56
55
|
"onUpdate:modelValue"?: (value: boolean) => any;
|
|
57
56
|
"onUpdate:indeterminate"?: (value: boolean) => any;
|
|
58
57
|
onChange?: (value: boolean, nativeEvent: Event) => any;
|
|
59
|
-
}>, {}, {}, {}, {}, string,
|
|
58
|
+
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
60
59
|
declare const _default: typeof __VLS_export;
|
|
61
60
|
//#endregion
|
|
62
61
|
export { CheckboxState as n, getCheckboxState as r, _default as t };
|
package/dist/checkbox.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as CheckboxState, r as getCheckboxState, t as _default } from "./checkbox-
|
|
1
|
+
import { n as CheckboxState, r as getCheckboxState, t as _default } from "./checkbox-DP3_ko7D.mjs";
|
|
2
2
|
export { _default as Checkbox, CheckboxState, getCheckboxState };
|
package/dist/checkbox.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as getCheckboxState, t as CheckboxControl_default } from "./checkbox-
|
|
1
|
+
import { n as getCheckboxState, t as CheckboxControl_default } from "./checkbox-BgIvwjyC.mjs";
|
|
2
2
|
export { CheckboxControl_default as Checkbox, getCheckboxState };
|
package/dist/collection.d.mts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as CollectionActiveChangeReason, c as CollectionItemInput, d as CollectionNavigationOptions, f as CollectionRegistration, h as CollectionTextSearchOptions, i as CollectionActiveChange, l as CollectionKey, m as CollectionRegistryOptions, n as normalizeCollectionTextValue, o as CollectionDisabledBehavior, p as CollectionRegistry, r as createCollectionRegistry, s as CollectionItem, t as extractCollectionTextValue, u as CollectionNavigationDirection } from "./collection-
|
|
2
|
-
export { CollectionActiveChange, CollectionActiveChangeReason, CollectionDisabledBehavior, CollectionItem, CollectionItemInput, CollectionKey, CollectionNavigationDirection, CollectionNavigationOptions, CollectionRegistration, CollectionRegistry, CollectionRegistryOptions, CollectionTextSearchOptions, createCollectionRegistry, extractCollectionTextValue, normalizeCollectionTextValue };
|
|
1
|
+
import { a as CollectionActiveChangeReason, c as CollectionItemInput, d as CollectionNavigationOptions, f as CollectionRegistration, h as CollectionTextSearchOptions, i as CollectionActiveChange, l as CollectionKey, m as CollectionRegistryOptions, n as normalizeCollectionTextValue, o as CollectionDisabledBehavior, p as CollectionRegistry, r as createCollectionRegistry, s as CollectionItem, t as extractCollectionTextValue, u as CollectionNavigationDirection } from "./collection-B_dFZOHO.mjs";
|
|
2
|
+
export { type CollectionActiveChange, type CollectionActiveChangeReason, type CollectionDisabledBehavior, type CollectionItem, type CollectionItemInput, type CollectionKey, type CollectionNavigationDirection, type CollectionNavigationOptions, type CollectionRegistration, type CollectionRegistry, type CollectionRegistryOptions, type CollectionTextSearchOptions, createCollectionRegistry, extractCollectionTextValue, normalizeCollectionTextValue };
|
package/dist/collection.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as extractCollectionTextValue, r as normalizeCollectionTextValue, t as createCollectionRegistry } from "./collection-
|
|
1
|
+
import { n as extractCollectionTextValue, r as normalizeCollectionTextValue, t as createCollectionRegistry } from "./collection-eHN150dT.mjs";
|
|
2
2
|
export { createCollectionRegistry, extractCollectionTextValue, normalizeCollectionTextValue };
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
import { l as CollectionKey, p as CollectionRegistry, s as CollectionItem } from "./collection-B_dFZOHO.mjs";
|
|
2
|
+
import { a as TypeaheadOptions, r as TypeaheadController } from "./typeahead-BbgUB2Bj.mjs";
|
|
3
|
+
import { ComputedRef, MaybeRefOrGetter } from "vue";
|
|
4
|
+
|
|
5
|
+
//#region src/composite-navigation-types.d.ts
|
|
6
|
+
/** Physical axes recognized by composite arrow-key navigation. */
|
|
7
|
+
type CompositeOrientation = "both" | "horizontal" | "vertical";
|
|
8
|
+
/** Reading direction used to map horizontal arrows. */
|
|
9
|
+
type CompositeDirection = "ltr" | "rtl";
|
|
10
|
+
/** DOM focus-management strategy described by the WAI-ARIA APG. */
|
|
11
|
+
type CompositeFocusStrategy = "active-descendant" | "roving";
|
|
12
|
+
/** Logical movement requested from a composite controller. */
|
|
13
|
+
type CompositeNavigationIntent = "first" | "focus" | "last" | "next" | "page-next" | "page-previous" | "pointer" | "previous" | "typeahead";
|
|
14
|
+
/** Imperative and keyboard movement commands accepted by `navigate`. */
|
|
15
|
+
type CompositeNavigationCommand = Exclude<CompositeNavigationIntent, "focus" | "pointer" | "typeahead">;
|
|
16
|
+
/** Immutable snapshot published after logical active state changes. */
|
|
17
|
+
interface CompositeNavigationChange<Key extends CollectionKey> {
|
|
18
|
+
/** Newly active item. */
|
|
19
|
+
readonly key: Key;
|
|
20
|
+
/** Active item before navigation. */
|
|
21
|
+
readonly previousKey: Key | null;
|
|
22
|
+
/** Navigation operation that selected this item. */
|
|
23
|
+
readonly intent: CompositeNavigationIntent;
|
|
24
|
+
/** Native event responsible for navigation, or `null` for imperative calls. */
|
|
25
|
+
readonly originalEvent: Event | null;
|
|
26
|
+
/** Focus-management strategy used while synchronizing the DOM. */
|
|
27
|
+
readonly focusStrategy: CompositeFocusStrategy;
|
|
28
|
+
}
|
|
29
|
+
/** Shared options for both composite focus-management strategies. */
|
|
30
|
+
interface CompositeNavigationBaseOptions<Key extends CollectionKey, Value> {
|
|
31
|
+
/** Ordered, mutation-aware logical item registry. */
|
|
32
|
+
readonly registry: CollectionRegistry<Key, Value>;
|
|
33
|
+
/**
|
|
34
|
+
* Arrow-key axes recognized by this composite.
|
|
35
|
+
*
|
|
36
|
+
* @default "vertical"
|
|
37
|
+
*/
|
|
38
|
+
readonly orientation?: MaybeRefOrGetter<CompositeOrientation | undefined>;
|
|
39
|
+
/**
|
|
40
|
+
* Reading direction used by horizontal arrows.
|
|
41
|
+
*
|
|
42
|
+
* @default "ltr"
|
|
43
|
+
*/
|
|
44
|
+
readonly direction?: MaybeRefOrGetter<CompositeDirection | undefined>;
|
|
45
|
+
/** Wrap arrow navigation at collection boundaries. */
|
|
46
|
+
readonly loop?: MaybeRefOrGetter<boolean | undefined>;
|
|
47
|
+
/** Suppress keyboard and pointer navigation while retaining active state. */
|
|
48
|
+
readonly isDisabled?: MaybeRefOrGetter<boolean | undefined>;
|
|
49
|
+
/** Number of logical items traversed by PageUp and PageDown. */
|
|
50
|
+
readonly pageSize?: MaybeRefOrGetter<number | undefined>;
|
|
51
|
+
/** Optional buffered typeahead integrated into the same active state. */
|
|
52
|
+
readonly typeahead?: false | Omit<TypeaheadOptions<Key, Value>, "registry">;
|
|
53
|
+
/** Called after the active item and DOM focus representation are synchronized. */
|
|
54
|
+
readonly onNavigate?: (change: CompositeNavigationChange<Key>) => void;
|
|
55
|
+
/**
|
|
56
|
+
* Custom visibility policy for virtualized or scroll-managed collections.
|
|
57
|
+
* The default calls `scrollIntoView({block: "nearest", inline: "nearest"})`
|
|
58
|
+
* when the method exists and DOM focus did not already scroll the item.
|
|
59
|
+
*/
|
|
60
|
+
readonly scrollIntoView?: (item: CollectionItem<Key, Value>, originalEvent: Event | null) => void;
|
|
61
|
+
}
|
|
62
|
+
/** Roving-tabindex options. */
|
|
63
|
+
interface RovingNavigationOptions<Key extends CollectionKey, Value> extends CompositeNavigationBaseOptions<Key, Value> {
|
|
64
|
+
/** @default "roving" */
|
|
65
|
+
readonly focusStrategy?: "roving";
|
|
66
|
+
/** Avoid browser scrolling when DOM focus moves; custom scrolling still runs. */
|
|
67
|
+
readonly preventScroll?: MaybeRefOrGetter<boolean | undefined>;
|
|
68
|
+
/** Optional stable ID projection for item props. */
|
|
69
|
+
readonly getItemId?: (item: CollectionItem<Key, Value>) => string | undefined;
|
|
70
|
+
}
|
|
71
|
+
/** `aria-activedescendant` options with a required SSR-stable ID projection. */
|
|
72
|
+
interface ActiveDescendantNavigationOptions<Key extends CollectionKey, Value> extends CompositeNavigationBaseOptions<Key, Value> {
|
|
73
|
+
readonly focusStrategy: "active-descendant";
|
|
74
|
+
/** Resolve the stable DOM ID referenced by `aria-activedescendant`. */
|
|
75
|
+
readonly getItemId: (item: CollectionItem<Key, Value>) => string;
|
|
76
|
+
}
|
|
77
|
+
/** Closed, strategy-discriminated composite configuration. */
|
|
78
|
+
type CompositeNavigationOptions<Key extends CollectionKey, Value> = ActiveDescendantNavigationOptions<Key, Value> | RovingNavigationOptions<Key, Value>;
|
|
79
|
+
/** Dynamic props for the composite container. */
|
|
80
|
+
interface CompositeContainerProps {
|
|
81
|
+
readonly "aria-activedescendant"?: string;
|
|
82
|
+
readonly tabindex?: 0;
|
|
83
|
+
readonly onFocus: (event: FocusEvent) => void;
|
|
84
|
+
readonly onKeydown: (event: KeyboardEvent) => void;
|
|
85
|
+
}
|
|
86
|
+
/** Dynamic props for one registered composite item. */
|
|
87
|
+
interface CompositeItemProps {
|
|
88
|
+
readonly id?: string;
|
|
89
|
+
readonly tabindex?: -1 | 0;
|
|
90
|
+
readonly onFocus: (event: FocusEvent) => void;
|
|
91
|
+
readonly onPointerdown: (event: PointerEvent) => void;
|
|
92
|
+
}
|
|
93
|
+
/** Focus and keyboard adapter layered over a collection registry. */
|
|
94
|
+
interface CompositeNavigationController<Key extends CollectionKey> {
|
|
95
|
+
/** Registry-owned logical active key. */
|
|
96
|
+
readonly activeKey: ComputedRef<Key | null>;
|
|
97
|
+
/** Integrated typeahead controller, or `null` when typeahead is disabled. */
|
|
98
|
+
readonly typeahead: TypeaheadController<Key> | null;
|
|
99
|
+
/** Resolve current dynamic container attributes and stable handlers. */
|
|
100
|
+
readonly getContainerProps: () => Readonly<CompositeContainerProps>;
|
|
101
|
+
/** Resolve current dynamic item attributes and stable key-owned handlers. */
|
|
102
|
+
readonly getItemProps: (key: Key) => Readonly<CompositeItemProps>;
|
|
103
|
+
/** Move logical focus and synchronize the configured DOM representation. */
|
|
104
|
+
readonly navigate: (intent: CompositeNavigationCommand, originalEvent?: Event | null) => Key | null;
|
|
105
|
+
/** Release typeahead timers and cached handlers without disposing the registry. */
|
|
106
|
+
readonly dispose: () => void;
|
|
107
|
+
}
|
|
108
|
+
//#endregion
|
|
109
|
+
//#region src/composite-navigation.d.ts
|
|
110
|
+
/** Create an SSR-safe roving-tabindex or active-descendant collection adapter. */
|
|
111
|
+
declare function createCompositeNavigation<Key extends CollectionKey, Value>(options: CompositeNavigationOptions<Key, Value>): CompositeNavigationController<Key>;
|
|
112
|
+
/** Create a composite adapter disposed with the current Vue effect scope. */
|
|
113
|
+
declare function useCompositeNavigation<Key extends CollectionKey, Value>(options: CompositeNavigationOptions<Key, Value>): CompositeNavigationController<Key>;
|
|
114
|
+
//#endregion
|
|
115
|
+
export { CompositeDirection as a, CompositeNavigationBaseOptions as c, CompositeNavigationController as d, CompositeNavigationIntent as f, RovingNavigationOptions as h, CompositeContainerProps as i, CompositeNavigationChange as l, CompositeOrientation as m, useCompositeNavigation as n, CompositeFocusStrategy as o, CompositeNavigationOptions as p, ActiveDescendantNavigationOptions as r, CompositeItemProps as s, createCompositeNavigation as t, CompositeNavigationCommand as u };
|
|
@@ -0,0 +1,354 @@
|
|
|
1
|
+
import { t as createTypeahead } from "./typeahead-B7KDxE_u.mjs";
|
|
2
|
+
import { getCurrentScope, onScopeDispose, toValue } from "vue";
|
|
3
|
+
//#region src/composite-navigation-internal.ts
|
|
4
|
+
const optionDiagnostic = "VIZE_UI_COMPOSITE_NAVIGATION_OPTION";
|
|
5
|
+
function capture(errors, callback) {
|
|
6
|
+
try {
|
|
7
|
+
callback();
|
|
8
|
+
} catch (error) {
|
|
9
|
+
errors.push(error);
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
function surfaceErrors(errors, message) {
|
|
13
|
+
if (errors.length === 1) throw errors[0];
|
|
14
|
+
if (errors.length < 2) return;
|
|
15
|
+
const Aggregate = globalThis.AggregateError;
|
|
16
|
+
if (typeof Aggregate === "function") throw new Aggregate(errors, message);
|
|
17
|
+
const fallback = Object.assign(new Error(message), { errors: [...errors] });
|
|
18
|
+
fallback.name = "AggregateError";
|
|
19
|
+
throw fallback;
|
|
20
|
+
}
|
|
21
|
+
function readBoolean(source, name) {
|
|
22
|
+
const value = toValue(source);
|
|
23
|
+
if (value === void 0) return false;
|
|
24
|
+
if (typeof value !== "boolean") throw new TypeError(`${optionDiagnostic}: ${name} must resolve to a boolean`);
|
|
25
|
+
return value;
|
|
26
|
+
}
|
|
27
|
+
function readOrientation(source) {
|
|
28
|
+
const value = toValue(source) ?? "vertical";
|
|
29
|
+
if (value !== "both" && value !== "horizontal" && value !== "vertical") throw new TypeError(`${optionDiagnostic}: orientation must resolve to both, horizontal, or vertical`);
|
|
30
|
+
return value;
|
|
31
|
+
}
|
|
32
|
+
function readDirection(source) {
|
|
33
|
+
const value = toValue(source) ?? "ltr";
|
|
34
|
+
if (value !== "ltr" && value !== "rtl") throw new TypeError(`${optionDiagnostic}: direction must resolve to ltr or rtl`);
|
|
35
|
+
return value;
|
|
36
|
+
}
|
|
37
|
+
function readPageSize(source) {
|
|
38
|
+
const value = toValue(source) ?? 10;
|
|
39
|
+
if (typeof value !== "number" || !Number.isSafeInteger(value) || value < 1) throw new TypeError(`${optionDiagnostic}: pageSize must resolve to a positive safe integer`);
|
|
40
|
+
return value;
|
|
41
|
+
}
|
|
42
|
+
function readStrategy(value) {
|
|
43
|
+
const strategy = value ?? "roving";
|
|
44
|
+
if (strategy !== "roving" && strategy !== "active-descendant") throw new TypeError(`${optionDiagnostic}: focusStrategy must be roving or active-descendant`);
|
|
45
|
+
return strategy;
|
|
46
|
+
}
|
|
47
|
+
function keyIntent(event, orientation, direction) {
|
|
48
|
+
if (event.isComposing || event.altKey || event.ctrlKey || event.metaKey) return null;
|
|
49
|
+
if (event.key === "Home") return "first";
|
|
50
|
+
if (event.key === "End") return "last";
|
|
51
|
+
if (event.key === "PageDown") return "page-next";
|
|
52
|
+
if (event.key === "PageUp") return "page-previous";
|
|
53
|
+
if ((orientation === "vertical" || orientation === "both") && event.key === "ArrowDown") return "next";
|
|
54
|
+
if ((orientation === "vertical" || orientation === "both") && event.key === "ArrowUp") return "previous";
|
|
55
|
+
if (orientation === "horizontal" || orientation === "both") {
|
|
56
|
+
if (event.key === "ArrowRight") return direction === "rtl" ? "previous" : "next";
|
|
57
|
+
if (event.key === "ArrowLeft") return direction === "rtl" ? "next" : "previous";
|
|
58
|
+
}
|
|
59
|
+
return null;
|
|
60
|
+
}
|
|
61
|
+
function validateId(value) {
|
|
62
|
+
if (typeof value !== "string" || value.length === 0) throw new TypeError("VIZE_UI_COMPOSITE_NAVIGATION_ID: an item ID must be non-empty and contain no ASCII whitespace or controls");
|
|
63
|
+
for (let index = 0; index < value.length; index++) {
|
|
64
|
+
const code = value.charCodeAt(index);
|
|
65
|
+
if (code <= 32 || code === 127) throw new TypeError("VIZE_UI_COMPOSITE_NAVIGATION_ID: an item ID must be non-empty and contain no ASCII whitespace or controls");
|
|
66
|
+
}
|
|
67
|
+
return value;
|
|
68
|
+
}
|
|
69
|
+
function validateOptions(options) {
|
|
70
|
+
if (!options || typeof options !== "object" || Array.isArray(options)) throw new TypeError(`${optionDiagnostic}: options must be an object`);
|
|
71
|
+
const registry = options.registry;
|
|
72
|
+
if (!registry || typeof registry.getNavigationKey !== "function" || !registry.activeKey) throw new TypeError(`${optionDiagnostic}: registry must be a CollectionRegistry`);
|
|
73
|
+
const strategy = readStrategy(options.focusStrategy);
|
|
74
|
+
if (strategy === "active-descendant" && typeof options.getItemId !== "function") throw new TypeError(`${optionDiagnostic}: active-descendant requires a getItemId function`);
|
|
75
|
+
for (const name of [
|
|
76
|
+
"getItemId",
|
|
77
|
+
"onNavigate",
|
|
78
|
+
"scrollIntoView"
|
|
79
|
+
]) {
|
|
80
|
+
const callback = options[name];
|
|
81
|
+
if (callback !== void 0 && typeof callback !== "function") throw new TypeError(`${optionDiagnostic}: ${name} must be a function`);
|
|
82
|
+
}
|
|
83
|
+
readOrientation(options.orientation);
|
|
84
|
+
readDirection(options.direction);
|
|
85
|
+
readBoolean(options.loop, "loop");
|
|
86
|
+
readBoolean(options.isDisabled, "isDisabled");
|
|
87
|
+
readPageSize(options.pageSize);
|
|
88
|
+
if (strategy === "roving") readBoolean(options.preventScroll, "preventScroll");
|
|
89
|
+
if (options.typeahead !== void 0 && options.typeahead !== false && (!options.typeahead || typeof options.typeahead !== "object" || Array.isArray(options.typeahead))) throw new TypeError(`${optionDiagnostic}: typeahead must be false or an options object`);
|
|
90
|
+
return strategy;
|
|
91
|
+
}
|
|
92
|
+
const nonTextInputType = /^(?:button|checkbox|color|file|image|radio|range|reset|submit)$/iu;
|
|
93
|
+
function isEditableDescendant(event) {
|
|
94
|
+
const path = typeof event.composedPath === "function" ? event.composedPath() : [event.target];
|
|
95
|
+
for (const candidate of path) {
|
|
96
|
+
if (candidate === event.currentTarget) break;
|
|
97
|
+
const target = candidate;
|
|
98
|
+
const name = target?.localName;
|
|
99
|
+
if (name === "input") {
|
|
100
|
+
if (!nonTextInputType.test(target?.type ?? "text")) return true;
|
|
101
|
+
continue;
|
|
102
|
+
}
|
|
103
|
+
if (name === "select" || name === "textarea" || target?.isContentEditable === true) return true;
|
|
104
|
+
}
|
|
105
|
+
return false;
|
|
106
|
+
}
|
|
107
|
+
function validateCommand(value) {
|
|
108
|
+
if (value !== "first" && value !== "last" && value !== "next" && value !== "page-next" && value !== "page-previous" && value !== "previous") throw new TypeError(`${optionDiagnostic}: navigation intent is invalid`);
|
|
109
|
+
return value;
|
|
110
|
+
}
|
|
111
|
+
//#endregion
|
|
112
|
+
//#region src/composite-navigation-dom.ts
|
|
113
|
+
function eventElement(value) {
|
|
114
|
+
const candidate = value;
|
|
115
|
+
return candidate?.nodeType === 1 && typeof candidate.getRootNode === "function" ? candidate : null;
|
|
116
|
+
}
|
|
117
|
+
function focusItem(element, preventScroll, errors) {
|
|
118
|
+
const focusable = element;
|
|
119
|
+
if (typeof focusable?.focus !== "function") {
|
|
120
|
+
errors.push(/* @__PURE__ */ new Error("VIZE_UI_COMPOSITE_NAVIGATION_FOCUS: active roving item is not focusable"));
|
|
121
|
+
return;
|
|
122
|
+
}
|
|
123
|
+
capture(errors, () => {
|
|
124
|
+
try {
|
|
125
|
+
focusable.focus?.({ preventScroll });
|
|
126
|
+
} catch {
|
|
127
|
+
focusable.focus?.();
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
function revealItem(item, custom, event, errors) {
|
|
132
|
+
if (custom) {
|
|
133
|
+
capture(errors, () => custom(item, event));
|
|
134
|
+
return;
|
|
135
|
+
}
|
|
136
|
+
const reveal = item.element?.scrollIntoView;
|
|
137
|
+
if (typeof reveal === "function") capture(errors, () => reveal.call(item.element, {
|
|
138
|
+
block: "nearest",
|
|
139
|
+
inline: "nearest"
|
|
140
|
+
}));
|
|
141
|
+
}
|
|
142
|
+
function tokenIncludes(value, token) {
|
|
143
|
+
return value?.split(/\s+/u).includes(token) === true;
|
|
144
|
+
}
|
|
145
|
+
function relatedElement(host, id) {
|
|
146
|
+
const root = host.getRootNode();
|
|
147
|
+
if (typeof root.getElementById === "function") return root.getElementById(id);
|
|
148
|
+
return host.ownerDocument.getElementById(id);
|
|
149
|
+
}
|
|
150
|
+
function validateActiveDescendant(host, item, id, errors) {
|
|
151
|
+
const element = item.element;
|
|
152
|
+
if (!host || !element) return;
|
|
153
|
+
if (element.id !== id || relatedElement(element, id) !== element) {
|
|
154
|
+
errors.push(/* @__PURE__ */ new Error("VIZE_UI_COMPOSITE_NAVIGATION_ID_RELATIONSHIP: active descendant ID must uniquely resolve to its registered element"));
|
|
155
|
+
return;
|
|
156
|
+
}
|
|
157
|
+
if (host.contains(element) || tokenIncludes(host.getAttribute("aria-owns"), id)) return;
|
|
158
|
+
const role = host.getAttribute("role");
|
|
159
|
+
if (role === "combobox" || role === "searchbox" || role === "textbox") {
|
|
160
|
+
const controlledIds = host.getAttribute("aria-controls")?.split(/\s+/u) ?? [];
|
|
161
|
+
for (const controlledId of controlledIds) {
|
|
162
|
+
const controlled = relatedElement(host, controlledId);
|
|
163
|
+
if (controlled?.contains(element) || tokenIncludes(controlled?.getAttribute("aria-owns") ?? null, id)) return;
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
errors.push(/* @__PURE__ */ new Error("VIZE_UI_COMPOSITE_NAVIGATION_RELATIONSHIP: active descendant must be contained, aria-owned, or controlled by a supported input role"));
|
|
167
|
+
}
|
|
168
|
+
//#endregion
|
|
169
|
+
//#region src/composite-navigation.ts
|
|
170
|
+
const disposedDiagnostic = "VIZE_UI_COMPOSITE_NAVIGATION_DISPOSED";
|
|
171
|
+
const itemDiagnostic = "VIZE_UI_COMPOSITE_NAVIGATION_ITEM";
|
|
172
|
+
const setupDiagnostic = "VIZE_UI_COMPOSITE_NAVIGATION_SETUP";
|
|
173
|
+
/** Create an SSR-safe roving-tabindex or active-descendant collection adapter. */
|
|
174
|
+
function createCompositeNavigation(options) {
|
|
175
|
+
const strategy = validateOptions(options);
|
|
176
|
+
const registry = options.registry;
|
|
177
|
+
const itemHandlers = /* @__PURE__ */ new Map();
|
|
178
|
+
let container = null;
|
|
179
|
+
let disposed = false;
|
|
180
|
+
const assertActive = () => {
|
|
181
|
+
if (disposed) throw new Error(`${disposedDiagnostic}: the controller has been disposed`);
|
|
182
|
+
};
|
|
183
|
+
const getItem = (key) => {
|
|
184
|
+
const item = registry.getItem(key);
|
|
185
|
+
if (!item) throw new Error(`${itemDiagnostic}: no item is registered for ${String(key)}`);
|
|
186
|
+
return item;
|
|
187
|
+
};
|
|
188
|
+
const effectiveKey = () => registry.activeKey.value ?? registry.navigableItems.value[0]?.key ?? null;
|
|
189
|
+
const itemId = (item) => {
|
|
190
|
+
const getId = options.getItemId;
|
|
191
|
+
const value = getId?.(item) ?? (item.element?.id || void 0);
|
|
192
|
+
if (value === void 0) {
|
|
193
|
+
if (strategy === "active-descendant") throw new Error("VIZE_UI_COMPOSITE_NAVIGATION_ID: active-descendant items require a stable ID");
|
|
194
|
+
return;
|
|
195
|
+
}
|
|
196
|
+
return validateId(value);
|
|
197
|
+
};
|
|
198
|
+
const synchronizeDom = (key, originalEvent, moveDomFocus, errors) => {
|
|
199
|
+
const item = getItem(key);
|
|
200
|
+
if (strategy === "active-descendant") validateActiveDescendant(container, item, itemId(item), errors);
|
|
201
|
+
const preventScroll = strategy === "roving" && readBoolean(options.preventScroll, "preventScroll");
|
|
202
|
+
if (strategy === "roving" && moveDomFocus) focusItem(item.element, preventScroll, errors);
|
|
203
|
+
if (options.scrollIntoView || strategy === "active-descendant" || moveDomFocus && preventScroll) revealItem(item, options.scrollIntoView, originalEvent, errors);
|
|
204
|
+
};
|
|
205
|
+
const notify = (key, previousKey, intent, originalEvent, errors) => {
|
|
206
|
+
const change = Object.freeze({
|
|
207
|
+
key,
|
|
208
|
+
previousKey,
|
|
209
|
+
intent,
|
|
210
|
+
originalEvent,
|
|
211
|
+
focusStrategy: strategy
|
|
212
|
+
});
|
|
213
|
+
capture(errors, () => options.onNavigate?.(change));
|
|
214
|
+
};
|
|
215
|
+
const commit = (mutate, intent, originalEvent, moveDomFocus) => {
|
|
216
|
+
const previousKey = registry.activeKey.value;
|
|
217
|
+
const errors = [];
|
|
218
|
+
capture(errors, mutate);
|
|
219
|
+
const key = registry.activeKey.value;
|
|
220
|
+
if (key !== null && key !== previousKey) {
|
|
221
|
+
capture(errors, () => synchronizeDom(key, originalEvent, moveDomFocus, errors));
|
|
222
|
+
notify(key, previousKey, intent, originalEvent, errors);
|
|
223
|
+
}
|
|
224
|
+
surfaceErrors(errors, "Composite navigation transition failed");
|
|
225
|
+
return key;
|
|
226
|
+
};
|
|
227
|
+
const pageTarget = (intent) => {
|
|
228
|
+
const direction = intent === "page-next" ? "next" : "previous";
|
|
229
|
+
let key = effectiveKey();
|
|
230
|
+
for (let index = 0; index < readPageSize(options.pageSize); index++) {
|
|
231
|
+
const next = registry.getNavigationKey(direction, {
|
|
232
|
+
fromKey: key,
|
|
233
|
+
loop: false
|
|
234
|
+
});
|
|
235
|
+
if (next === null || next === key) break;
|
|
236
|
+
key = next;
|
|
237
|
+
}
|
|
238
|
+
return key;
|
|
239
|
+
};
|
|
240
|
+
const navigate = (intent, originalEvent = null) => {
|
|
241
|
+
assertActive();
|
|
242
|
+
intent = validateCommand(intent);
|
|
243
|
+
if (readBoolean(options.isDisabled, "isDisabled")) return null;
|
|
244
|
+
if (intent === "page-next" || intent === "page-previous") {
|
|
245
|
+
const target = pageTarget(intent);
|
|
246
|
+
if (target === null) return null;
|
|
247
|
+
return commit(() => {
|
|
248
|
+
registry.setActiveKey(target);
|
|
249
|
+
}, intent, originalEvent, strategy === "roving");
|
|
250
|
+
}
|
|
251
|
+
return commit(() => {
|
|
252
|
+
registry.moveActive(intent, { loop: readBoolean(options.loop, "loop") });
|
|
253
|
+
}, intent, originalEvent, strategy === "roving");
|
|
254
|
+
};
|
|
255
|
+
const configuredTypeahead = options.typeahead;
|
|
256
|
+
const typeahead = configuredTypeahead && typeof configuredTypeahead === "object" ? createTypeahead({
|
|
257
|
+
...configuredTypeahead,
|
|
258
|
+
registry,
|
|
259
|
+
isDisabled: () => readBoolean(options.isDisabled, "isDisabled") || readBoolean(configuredTypeahead.isDisabled, "typeahead.isDisabled"),
|
|
260
|
+
onMatch(match) {
|
|
261
|
+
const errors = [];
|
|
262
|
+
if (match.key !== match.previousKey) {
|
|
263
|
+
capture(errors, () => synchronizeDom(match.key, match.originalEvent, strategy === "roving", errors));
|
|
264
|
+
notify(match.key, match.previousKey, "typeahead", match.originalEvent, errors);
|
|
265
|
+
}
|
|
266
|
+
capture(errors, () => configuredTypeahead.onMatch?.(match));
|
|
267
|
+
surfaceErrors(errors, "Composite typeahead transition failed");
|
|
268
|
+
}
|
|
269
|
+
}) : null;
|
|
270
|
+
const activateItem = (key, event) => {
|
|
271
|
+
if (disposed || readBoolean(options.isDisabled, "isDisabled")) return;
|
|
272
|
+
if (!registry.navigableItems.value.some((item) => item.key === key)) return;
|
|
273
|
+
commit(() => {
|
|
274
|
+
registry.setActiveKey(key);
|
|
275
|
+
}, event.type === "pointerdown" ? "pointer" : "focus", event, false);
|
|
276
|
+
};
|
|
277
|
+
const handlersFor = (key) => {
|
|
278
|
+
const cached = itemHandlers.get(key);
|
|
279
|
+
if (cached) return cached;
|
|
280
|
+
for (const cachedKey of itemHandlers.keys()) if (!registry.getItem(cachedKey)) itemHandlers.delete(cachedKey);
|
|
281
|
+
const handlers = Object.freeze({
|
|
282
|
+
onFocus: (event) => activateItem(key, event),
|
|
283
|
+
onPointerdown: (event) => activateItem(key, event)
|
|
284
|
+
});
|
|
285
|
+
itemHandlers.set(key, handlers);
|
|
286
|
+
return handlers;
|
|
287
|
+
};
|
|
288
|
+
const onFocus = (event) => {
|
|
289
|
+
if (disposed) return;
|
|
290
|
+
container = eventElement(event.currentTarget);
|
|
291
|
+
if (strategy !== "active-descendant" || event.target !== event.currentTarget || readBoolean(options.isDisabled, "isDisabled")) return;
|
|
292
|
+
const key = effectiveKey();
|
|
293
|
+
if (key !== null && registry.activeKey.value === null) commit(() => {
|
|
294
|
+
registry.setActiveKey(key);
|
|
295
|
+
}, "focus", event, false);
|
|
296
|
+
};
|
|
297
|
+
const onKeydown = (event) => {
|
|
298
|
+
if (disposed) return;
|
|
299
|
+
container = eventElement(event.currentTarget);
|
|
300
|
+
if (event.defaultPrevented || isEditableDescendant(event) || readBoolean(options.isDisabled, "isDisabled")) return;
|
|
301
|
+
const intent = keyIntent(event, readOrientation(options.orientation), readDirection(options.direction));
|
|
302
|
+
if (intent && registry.navigableItems.value.length > 0) {
|
|
303
|
+
event.preventDefault();
|
|
304
|
+
navigate(intent, event);
|
|
305
|
+
return;
|
|
306
|
+
}
|
|
307
|
+
typeahead?.typeaheadProps.onKeydown(event);
|
|
308
|
+
};
|
|
309
|
+
return Object.freeze({
|
|
310
|
+
activeKey: registry.activeKey,
|
|
311
|
+
typeahead,
|
|
312
|
+
getContainerProps: () => {
|
|
313
|
+
assertActive();
|
|
314
|
+
const key = effectiveKey();
|
|
315
|
+
const activeDescendant = strategy === "active-descendant" && key !== null ? itemId(getItem(key)) : void 0;
|
|
316
|
+
const props = {
|
|
317
|
+
onFocus,
|
|
318
|
+
onKeydown,
|
|
319
|
+
...strategy === "active-descendant" ? { tabindex: 0 } : {},
|
|
320
|
+
...activeDescendant !== void 0 ? { "aria-activedescendant": activeDescendant } : {}
|
|
321
|
+
};
|
|
322
|
+
return Object.freeze(props);
|
|
323
|
+
},
|
|
324
|
+
getItemProps: (key) => {
|
|
325
|
+
assertActive();
|
|
326
|
+
const item = getItem(key);
|
|
327
|
+
const handlers = handlersFor(key);
|
|
328
|
+
const id = itemId(item);
|
|
329
|
+
const props = {
|
|
330
|
+
...handlers,
|
|
331
|
+
...id ? { id } : {},
|
|
332
|
+
...strategy === "roving" ? { tabindex: effectiveKey() === key ? 0 : -1 } : {}
|
|
333
|
+
};
|
|
334
|
+
return Object.freeze(props);
|
|
335
|
+
},
|
|
336
|
+
navigate,
|
|
337
|
+
dispose: () => {
|
|
338
|
+
if (disposed) return;
|
|
339
|
+
disposed = true;
|
|
340
|
+
typeahead?.dispose();
|
|
341
|
+
itemHandlers.clear();
|
|
342
|
+
container = null;
|
|
343
|
+
}
|
|
344
|
+
});
|
|
345
|
+
}
|
|
346
|
+
/** Create a composite adapter disposed with the current Vue effect scope. */
|
|
347
|
+
function useCompositeNavigation(options) {
|
|
348
|
+
if (!getCurrentScope()) throw new Error(`${setupDiagnostic}: use inside component setup or an active effect scope`);
|
|
349
|
+
const controller = createCompositeNavigation(options);
|
|
350
|
+
onScopeDispose(controller.dispose);
|
|
351
|
+
return controller;
|
|
352
|
+
}
|
|
353
|
+
//#endregion
|
|
354
|
+
export { useCompositeNavigation as n, createCompositeNavigation as t };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as CompositeDirection, c as CompositeNavigationBaseOptions, d as CompositeNavigationController, f as CompositeNavigationIntent, h as RovingNavigationOptions, i as CompositeContainerProps, l as CompositeNavigationChange, m as CompositeOrientation, n as useCompositeNavigation, o as CompositeFocusStrategy, p as CompositeNavigationOptions, r as ActiveDescendantNavigationOptions, s as CompositeItemProps, t as createCompositeNavigation, u as CompositeNavigationCommand } from "./composite-navigation-QINW9GLy.mjs";
|
|
2
|
+
export { type ActiveDescendantNavigationOptions, type CompositeContainerProps, type CompositeDirection, type CompositeFocusStrategy, type CompositeItemProps, type CompositeNavigationBaseOptions, type CompositeNavigationChange, type CompositeNavigationCommand, type CompositeNavigationController, type CompositeNavigationIntent, type CompositeNavigationOptions, type CompositeOrientation, type RovingNavigationOptions, createCompositeNavigation, useCompositeNavigation };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { i as useControllableState, n as ControllableStateOptions, r as StateUpdate, t as ControllableState } from "./controllable-state-
|
|
1
|
+
import { i as useControllableState, n as ControllableStateOptions, r as StateUpdate, t as ControllableState } from "./controllable-state-BtoxKahh.mjs";
|
|
2
2
|
export { ControllableState, ControllableStateOptions, StateUpdate, useControllableState };
|