v-float 0.9.1 → 0.11.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/README.md +44 -175
- package/dist/index.d.mts +688 -0
- package/dist/index.d.mts.map +1 -0
- package/dist/index.mjs +2038 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +74 -74
- package/dist/composables/index.d.ts +0 -4
- package/dist/composables/index.d.ts.map +0 -1
- package/dist/composables/interactions/index.d.ts +0 -7
- package/dist/composables/interactions/index.d.ts.map +0 -1
- package/dist/composables/interactions/navigation-strategies.d.ts +0 -36
- package/dist/composables/interactions/navigation-strategies.d.ts.map +0 -1
- package/dist/composables/interactions/polygon.d.ts +0 -38
- package/dist/composables/interactions/polygon.d.ts.map +0 -1
- package/dist/composables/interactions/use-click.d.ts +0 -120
- package/dist/composables/interactions/use-click.d.ts.map +0 -1
- package/dist/composables/interactions/use-escape-key.d.ts +0 -57
- package/dist/composables/interactions/use-escape-key.d.ts.map +0 -1
- package/dist/composables/interactions/use-focus-trap.d.ts +0 -41
- package/dist/composables/interactions/use-focus-trap.d.ts.map +0 -1
- package/dist/composables/interactions/use-focus.d.ts +0 -60
- package/dist/composables/interactions/use-focus.d.ts.map +0 -1
- package/dist/composables/interactions/use-hover.d.ts +0 -78
- package/dist/composables/interactions/use-hover.d.ts.map +0 -1
- package/dist/composables/interactions/use-list-navigation.d.ts +0 -109
- package/dist/composables/interactions/use-list-navigation.d.ts.map +0 -1
- package/dist/composables/middlewares/arrow.d.ts +0 -25
- package/dist/composables/middlewares/arrow.d.ts.map +0 -1
- package/dist/composables/middlewares/index.d.ts +0 -4
- package/dist/composables/middlewares/index.d.ts.map +0 -1
- package/dist/composables/positioning/index.d.ts +0 -5
- package/dist/composables/positioning/index.d.ts.map +0 -1
- package/dist/composables/positioning/use-arrow.d.ts +0 -55
- package/dist/composables/positioning/use-arrow.d.ts.map +0 -1
- package/dist/composables/positioning/use-client-point.d.ts +0 -218
- package/dist/composables/positioning/use-client-point.d.ts.map +0 -1
- package/dist/composables/positioning/use-floating-tree.d.ts +0 -240
- package/dist/composables/positioning/use-floating-tree.d.ts.map +0 -1
- package/dist/composables/positioning/use-floating.d.ts +0 -162
- package/dist/composables/positioning/use-floating.d.ts.map +0 -1
- package/dist/composables/utils/is-using-keyboard.d.ts +0 -2
- package/dist/composables/utils/is-using-keyboard.d.ts.map +0 -1
- package/dist/composables/utils/use-active-descendant.d.ts +0 -8
- package/dist/composables/utils/use-active-descendant.d.ts.map +0 -1
- package/dist/index.d.ts +0 -2
- package/dist/index.d.ts.map +0 -1
- package/dist/types.d.ts +0 -18
- package/dist/types.d.ts.map +0 -1
- package/dist/utils.d.ts +0 -92
- package/dist/utils.d.ts.map +0 -1
- package/dist/v-float.es.js +0 -3520
- package/dist/v-float.umd.js +0 -4
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,uBAAuB,CAAA;AACrC,cAAc,kBAAkB,CAAA"}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
export type NavigationAction = {
|
|
2
|
-
type: "navigate";
|
|
3
|
-
index: number | null;
|
|
4
|
-
} | {
|
|
5
|
-
type: "close";
|
|
6
|
-
};
|
|
7
|
-
export interface StrategyContext {
|
|
8
|
-
current: number | null;
|
|
9
|
-
items: Array<HTMLElement | null>;
|
|
10
|
-
isRtl: boolean;
|
|
11
|
-
loop: boolean;
|
|
12
|
-
allowEscape: boolean;
|
|
13
|
-
isVirtual: boolean;
|
|
14
|
-
cols: number;
|
|
15
|
-
nested: boolean;
|
|
16
|
-
isDisabled: (index: number) => boolean;
|
|
17
|
-
findNextEnabled: (start: number, dir: 1 | -1, wrap: boolean) => number | null;
|
|
18
|
-
getFirstEnabledIndex: () => number | null;
|
|
19
|
-
getLastEnabledIndex: () => number | null;
|
|
20
|
-
}
|
|
21
|
-
export interface NavigationStrategy {
|
|
22
|
-
handleKey(key: string, context: StrategyContext): NavigationAction | null;
|
|
23
|
-
}
|
|
24
|
-
export declare class VerticalNavigationStrategy implements NavigationStrategy {
|
|
25
|
-
handleKey(key: string, context: StrategyContext): NavigationAction | null;
|
|
26
|
-
}
|
|
27
|
-
export declare class HorizontalNavigationStrategy implements NavigationStrategy {
|
|
28
|
-
handleKey(key: string, context: StrategyContext): NavigationAction | null;
|
|
29
|
-
}
|
|
30
|
-
export declare class GridNavigationStrategy implements NavigationStrategy {
|
|
31
|
-
private fallbackToLinear;
|
|
32
|
-
private loopDirection;
|
|
33
|
-
constructor(fallbackToLinear?: boolean, loopDirection?: "row" | "next");
|
|
34
|
-
handleKey(key: string, context: StrategyContext): NavigationAction | null;
|
|
35
|
-
}
|
|
36
|
-
//# sourceMappingURL=navigation-strategies.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"navigation-strategies.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/navigation-strategies.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAA;AAE7F,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,KAAK,EAAE,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAChC,KAAK,EAAE,OAAO,CAAA;IACd,IAAI,EAAE,OAAO,CAAA;IACb,WAAW,EAAE,OAAO,CAAA;IACpB,SAAS,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,OAAO,CAAA;IACf,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAA;IACtC,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,IAAI,CAAA;IAC7E,oBAAoB,EAAE,MAAM,MAAM,GAAG,IAAI,CAAA;IACzC,mBAAmB,EAAE,MAAM,MAAM,GAAG,IAAI,CAAA;CACzC;AAED,MAAM,WAAW,kBAAkB;IACjC,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,GAAG,gBAAgB,GAAG,IAAI,CAAA;CAC1E;AAkCD,qBAAa,0BAA2B,YAAW,kBAAkB;IACnE,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,GAAG,gBAAgB,GAAG,IAAI;CAa1E;AAED,qBAAa,4BAA6B,YAAW,kBAAkB;IACrE,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,GAAG,gBAAgB,GAAG,IAAI;CAY1E;AAED,qBAAa,sBAAuB,YAAW,kBAAkB;IAE7D,OAAO,CAAC,gBAAgB;IACxB,OAAO,CAAC,aAAa;gBADb,gBAAgB,GAAE,OAAe,EACjC,aAAa,GAAE,KAAK,GAAG,MAAc;IAG/C,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,GAAG,gBAAgB,GAAG,IAAI;CA8K1E"}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { TreeNode } from '../positioning/use-floating-tree';
|
|
2
|
-
import { AnchorElement, FloatingContext, FloatingElement } from '../positioning/use-floating';
|
|
3
|
-
type Point = [number, number];
|
|
4
|
-
type Polygon = Point[];
|
|
5
|
-
export interface SafePolygonOptions {
|
|
6
|
-
buffer?: number;
|
|
7
|
-
blockPointerEvents?: boolean;
|
|
8
|
-
requireIntent?: boolean;
|
|
9
|
-
onPolygonChange?: (polygon: Polygon) => void;
|
|
10
|
-
}
|
|
11
|
-
export interface CreateSafePolygonHandlerContext {
|
|
12
|
-
x: number;
|
|
13
|
-
y: number;
|
|
14
|
-
placement: FloatingContext["placement"]["value"];
|
|
15
|
-
elements: {
|
|
16
|
-
domReference: AnchorElement | null;
|
|
17
|
-
floating: FloatingElement | null;
|
|
18
|
-
};
|
|
19
|
-
buffer: number;
|
|
20
|
-
onClose: () => void;
|
|
21
|
-
nodeId?: string;
|
|
22
|
-
tree?: {
|
|
23
|
-
nodes: Map<string, TreeNode<FloatingContext>>;
|
|
24
|
-
};
|
|
25
|
-
}
|
|
26
|
-
/**
|
|
27
|
-
* Generates a safe polygon area that the user can traverse without closing the
|
|
28
|
-
* floating element once leaving the reference element.
|
|
29
|
-
* @see https://floating-ui.com/docs/useHover#safepolygon
|
|
30
|
-
*/
|
|
31
|
-
export declare function safePolygon(options?: SafePolygonOptions): {
|
|
32
|
-
(context: CreateSafePolygonHandlerContext): (event: MouseEvent) => void;
|
|
33
|
-
__options: {
|
|
34
|
-
blockPointerEvents: boolean;
|
|
35
|
-
};
|
|
36
|
-
};
|
|
37
|
-
export {};
|
|
38
|
-
//# sourceMappingURL=polygon.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"polygon.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/polygon.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAA;AAE3E,OAAO,KAAK,EAAE,aAAa,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAGlG,KAAK,KAAK,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAC7B,KAAK,OAAO,GAAG,KAAK,EAAE,CAAA;AAoDtB,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;CAC7C;AAED,MAAM,WAAW,+BAA+B;IAC9C,CAAC,EAAE,MAAM,CAAA;IACT,CAAC,EAAE,MAAM,CAAA;IACT,SAAS,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,CAAA;IAChD,QAAQ,EAAE;QACR,YAAY,EAAE,aAAa,GAAG,IAAI,CAAA;QAClC,QAAQ,EAAE,eAAe,GAAG,IAAI,CAAA;KACjC,CAAA;IACD,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAA;KAAE,CAAA;CACzD;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,OAAO,GAAE,kBAAuB;cAsCJ,+BAA+B,WAehD,UAAU;;;;EAiVhD"}
|
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
import { MaybeRefOrGetter } from 'vue';
|
|
2
|
-
import { FloatingContext } from '../positioning/use-floating';
|
|
3
|
-
import { TreeNode } from '../positioning/use-floating-tree';
|
|
4
|
-
/**
|
|
5
|
-
* Enables showing/hiding the floating element when clicking the reference element
|
|
6
|
-
* and optionally when clicking outside both the reference and floating elements.
|
|
7
|
-
*
|
|
8
|
-
* This composable provides unified event handlers for both inside click interactions
|
|
9
|
-
* (to open/toggle floating elements) and outside click interactions (to close them).
|
|
10
|
-
*
|
|
11
|
-
* The composable supports both standalone usage with FloatingContext and tree-aware
|
|
12
|
-
* usage with TreeNode<FloatingContext> for complex nested floating UI structures.
|
|
13
|
-
*
|
|
14
|
-
* @param context - The floating context or tree node with open state and change handler.
|
|
15
|
-
* @param options - Configuration options for click behavior.
|
|
16
|
-
*
|
|
17
|
-
* @example Basic standalone usage with outside click enabled
|
|
18
|
-
* ```ts
|
|
19
|
-
* const context = useFloating(...)
|
|
20
|
-
* useClick(context, {
|
|
21
|
-
* toggle: true,
|
|
22
|
-
* outsideClick: true,
|
|
23
|
-
* outsideEvent: 'pointerdown'
|
|
24
|
-
* })
|
|
25
|
-
* ```
|
|
26
|
-
*
|
|
27
|
-
* @example Tree-aware usage for nested floating elements
|
|
28
|
-
* ```ts
|
|
29
|
-
* const tree = useFloatingTree(rootContext)
|
|
30
|
-
* const parentNode = tree.root
|
|
31
|
-
* const childNode = tree.addNode(childContext, parentNode.id)
|
|
32
|
-
*
|
|
33
|
-
* // Tree-aware behavior: child won't close when clicked,
|
|
34
|
-
* // but will close when parent or outside is clicked
|
|
35
|
-
* useClick(childNode, { outsideClick: true })
|
|
36
|
-
* ```
|
|
37
|
-
*
|
|
38
|
-
* @example Custom outside click handler
|
|
39
|
-
* ```ts
|
|
40
|
-
* useClick(context, {
|
|
41
|
-
* outsideClick: true,
|
|
42
|
-
* onOutsideClick: (event, context) => {
|
|
43
|
-
* if (confirm('Close dialog?')) {
|
|
44
|
-
* context.setOpen(false)
|
|
45
|
-
* }
|
|
46
|
-
* }
|
|
47
|
-
* })
|
|
48
|
-
* ```
|
|
49
|
-
*/
|
|
50
|
-
export declare function useClick(context: FloatingContext | TreeNode<FloatingContext>, options?: UseClickOptions): void;
|
|
51
|
-
/**
|
|
52
|
-
* Options for configuring the useClick behavior.
|
|
53
|
-
*/
|
|
54
|
-
export interface UseClickOptions {
|
|
55
|
-
/**
|
|
56
|
-
* Whether the Hook is enabled.
|
|
57
|
-
* @default true
|
|
58
|
-
*/
|
|
59
|
-
enabled?: MaybeRefOrGetter<boolean>;
|
|
60
|
-
/**
|
|
61
|
-
* The type of event to use to determine a "click" with mouse input.
|
|
62
|
-
* Keyboard clicks work as normal.
|
|
63
|
-
* @default 'click'
|
|
64
|
-
*/
|
|
65
|
-
event?: MaybeRefOrGetter<"click" | "mousedown">;
|
|
66
|
-
/**
|
|
67
|
-
* Whether to toggle the open state with repeated clicks.
|
|
68
|
-
* @default true
|
|
69
|
-
*/
|
|
70
|
-
toggle?: MaybeRefOrGetter<boolean>;
|
|
71
|
-
/**
|
|
72
|
-
* Whether to ignore the logic for mouse input.
|
|
73
|
-
* @default false
|
|
74
|
-
*/
|
|
75
|
-
ignoreMouse?: MaybeRefOrGetter<boolean>;
|
|
76
|
-
/**
|
|
77
|
-
* Whether to ignore keyboard handlers (Enter and Space key functionality).
|
|
78
|
-
* @default false
|
|
79
|
-
*/
|
|
80
|
-
ignoreKeyboard?: MaybeRefOrGetter<boolean>;
|
|
81
|
-
/**
|
|
82
|
-
* Whether to ignore touch events.
|
|
83
|
-
* @default false
|
|
84
|
-
*/
|
|
85
|
-
ignoreTouch?: MaybeRefOrGetter<boolean>;
|
|
86
|
-
/**
|
|
87
|
-
* Whether to enable outside click detection to close the floating element.
|
|
88
|
-
* @default false
|
|
89
|
-
*/
|
|
90
|
-
outsideClick?: MaybeRefOrGetter<boolean>;
|
|
91
|
-
/**
|
|
92
|
-
* The event to use for outside click detection.
|
|
93
|
-
* @default 'pointerdown'
|
|
94
|
-
*/
|
|
95
|
-
outsideEvent?: MaybeRefOrGetter<"pointerdown" | "mousedown" | "click">;
|
|
96
|
-
/**
|
|
97
|
-
* Whether to use capture phase for document outside click listener.
|
|
98
|
-
* @default true
|
|
99
|
-
*/
|
|
100
|
-
outsideCapture?: MaybeRefOrGetter<boolean>;
|
|
101
|
-
/**
|
|
102
|
-
* Custom function to handle outside clicks.
|
|
103
|
-
* If provided, this function will be called instead of the default behavior.
|
|
104
|
-
* The function receives the event and context as parameters.
|
|
105
|
-
* @param event - The mouse event that triggered the outside click
|
|
106
|
-
* @param context - The floating context containing refs and state
|
|
107
|
-
*/
|
|
108
|
-
onOutsideClick?: (event: MouseEvent, context: FloatingContext) => void;
|
|
109
|
-
/**
|
|
110
|
-
* Whether to prevent clicks on scrollbars from triggering outside click.
|
|
111
|
-
* @default true
|
|
112
|
-
*/
|
|
113
|
-
preventScrollbarClick?: MaybeRefOrGetter<boolean>;
|
|
114
|
-
/**
|
|
115
|
-
* Whether to handle drag events that start inside and end outside.
|
|
116
|
-
* @default true
|
|
117
|
-
*/
|
|
118
|
-
handleDragEvents?: MaybeRefOrGetter<boolean>;
|
|
119
|
-
}
|
|
120
|
-
//# sourceMappingURL=use-click.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-click.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/use-click.ts"],"names":[],"mappings":"AAEE,OAAO,EAAY,KAAK,gBAAgB,EAA8C,MAAM,KAAK,CAAA;AACjG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAA;AAkB7E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,wBAAgB,QAAQ,CACtB,OAAO,EAAE,eAAe,GAAG,QAAQ,CAAC,eAAe,CAAC,EACpD,OAAO,GAAE,eAAoB,GAC5B,IAAI,CAoQN;AA0CD;;GAEG;AACH,MAAM,WAAW,eAAe;IAG9B;;;OAGG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEnC;;;;OAIG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,WAAW,CAAC,CAAA;IAE/C;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAElC;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEvC;;;OAGG;IACH,cAAc,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAE1C;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAIvC;;;OAGG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAExC;;;OAGG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC,aAAa,GAAG,WAAW,GAAG,OAAO,CAAC,CAAA;IAEtE;;;OAGG;IACH,cAAc,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAE1C;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,eAAe,KAAK,IAAI,CAAA;IAEtE;;;OAGG;IACH,qBAAqB,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEjD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;CAC7C"}
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
import { MaybeRefOrGetter } from 'vue';
|
|
2
|
-
import { FloatingContext } from '../positioning/use-floating';
|
|
3
|
-
import { TreeNode } from '../positioning/use-floating-tree';
|
|
4
|
-
export interface UseEscapeKeyOptions {
|
|
5
|
-
/**
|
|
6
|
-
* Condition to enable the escape key listener.
|
|
7
|
-
* @default true
|
|
8
|
-
*/
|
|
9
|
-
enabled?: MaybeRefOrGetter<boolean>;
|
|
10
|
-
/**
|
|
11
|
-
* Whether to use capture phase for document event listeners.
|
|
12
|
-
* @default false
|
|
13
|
-
*/
|
|
14
|
-
capture?: boolean;
|
|
15
|
-
/**
|
|
16
|
-
* Custom callback function to be executed when the escape key is pressed.
|
|
17
|
-
* When provided, overrides default behavior.
|
|
18
|
-
*/
|
|
19
|
-
onEscape?: (event: KeyboardEvent) => void;
|
|
20
|
-
}
|
|
21
|
-
/**
|
|
22
|
-
* A composable to handle the escape key press with tree-aware behavior and composition event handling.
|
|
23
|
-
*
|
|
24
|
-
* When passed a FloatingContext, it will close that floating element by setting open to false.
|
|
25
|
-
* When passed a TreeNode<FloatingContext>, it will find and close the topmost open node in the tree.
|
|
26
|
-
*
|
|
27
|
-
* @param context - The floating context or tree node with open state and change handler.
|
|
28
|
-
* @param options - {@link UseEscapeKeyOptions}
|
|
29
|
-
*
|
|
30
|
-
* @example Basic standalone usage
|
|
31
|
-
* ```ts
|
|
32
|
-
* const context = useFloating(...)
|
|
33
|
-
* useEscapeKey(context) // Closes the floating element on escape
|
|
34
|
-
* ```
|
|
35
|
-
*
|
|
36
|
-
* @example Tree-aware usage
|
|
37
|
-
* ```ts
|
|
38
|
-
* const tree = useFloatingTree(...)
|
|
39
|
-
* const childNode = tree.addNode(...)
|
|
40
|
-
* useEscapeKey(childNode) // Closes the topmost open node in the tree
|
|
41
|
-
* ```
|
|
42
|
-
*
|
|
43
|
-
* @example Custom handler
|
|
44
|
-
* ```ts
|
|
45
|
-
* useEscapeKey(context, {
|
|
46
|
-
* onEscape: (event) => {
|
|
47
|
-
* if (hasUnsavedChanges.value) {
|
|
48
|
-
* showConfirmDialog.value = true
|
|
49
|
-
* } else {
|
|
50
|
-
* context.setOpen(false)
|
|
51
|
-
* }
|
|
52
|
-
* }
|
|
53
|
-
* })
|
|
54
|
-
* ```
|
|
55
|
-
*/
|
|
56
|
-
export declare function useEscapeKey(context: FloatingContext | TreeNode<FloatingContext>, options?: UseEscapeKeyOptions): void;
|
|
57
|
-
//# sourceMappingURL=use-escape-key.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-escape-key.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/use-escape-key.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,gBAAgB,EAAgB,MAAM,KAAK,CAAA;AACzD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAA;AAO3E,MAAM,WAAW,mBAAmB;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEnC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAA;CAC1C;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,wBAAgB,YAAY,CAC1B,OAAO,EAAE,eAAe,GAAG,QAAQ,CAAC,eAAe,CAAC,EACpD,OAAO,GAAE,mBAAwB,GAChC,IAAI,CAiCN"}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { MaybeRefOrGetter } from 'vue';
|
|
2
|
-
import { FloatingContext } from '../positioning/use-floating';
|
|
3
|
-
import { TreeNode } from '../positioning/use-floating-tree';
|
|
4
|
-
export interface UseFocusTrapOptions {
|
|
5
|
-
/** Enables the focus trap when true. @default true */
|
|
6
|
-
enabled?: MaybeRefOrGetter<boolean>;
|
|
7
|
-
/** When true, hides/inerts content outside the trap. @default false */
|
|
8
|
-
modal?: MaybeRefOrGetter<boolean>;
|
|
9
|
-
/** When true, inserts hidden focus guards to aid wrap-around. @default true */
|
|
10
|
-
guards?: MaybeRefOrGetter<boolean>;
|
|
11
|
-
/** Wrap order preference when cycling with Tab. @default ['content'] */
|
|
12
|
-
order?: MaybeRefOrGetter<Array<"content" | "reference" | "floating">>;
|
|
13
|
-
/** Initial focus target policy on activation. @default 'first' */
|
|
14
|
-
initialFocus?: MaybeRefOrGetter<number | HTMLElement | (() => HTMLElement | null) | "first" | "last">;
|
|
15
|
-
/** Returns focus to previously focused element on deactivate. @default true */
|
|
16
|
-
returnFocus?: MaybeRefOrGetter<boolean>;
|
|
17
|
-
/** Restores focus to nearest tabbable if active node disappears. @default false */
|
|
18
|
-
restoreFocus?: MaybeRefOrGetter<boolean>;
|
|
19
|
-
/** On non-modal, close when focus escapes the trap. @default false */
|
|
20
|
-
closeOnFocusOut?: MaybeRefOrGetter<boolean>;
|
|
21
|
-
/** Pass preventScroll to focus operations. @default true */
|
|
22
|
-
preventScroll?: MaybeRefOrGetter<boolean>;
|
|
23
|
-
/** Apply `inert` (when supported) to outside elements while modal. @default false */
|
|
24
|
-
outsideElementsInert?: MaybeRefOrGetter<boolean>;
|
|
25
|
-
}
|
|
26
|
-
export interface UseFocusTrapReturn {
|
|
27
|
-
cleanup: () => void;
|
|
28
|
-
}
|
|
29
|
-
/**
|
|
30
|
-
* Traps keyboard focus within the floating element, optionally in a modal manner.
|
|
31
|
-
*
|
|
32
|
-
* Supports nested traps; only the deepest open node activates trapping when used with a tree.
|
|
33
|
-
* Provides optional focus guards, initial focus, focus return, and close-on-escape behavior.
|
|
34
|
-
*
|
|
35
|
-
* @param context - FloatingContext or TreeNode<FloatingContext> to trap within
|
|
36
|
-
* @param options - Configuration options controlling trap behavior
|
|
37
|
-
* @returns Cleanup API
|
|
38
|
-
*/
|
|
39
|
-
export declare function useFocusTrap(context: FloatingContext | TreeNode<FloatingContext>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
|
|
40
|
-
export type { FloatingContext };
|
|
41
|
-
//# sourceMappingURL=use-focus-trap.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-focus-trap.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/use-focus-trap.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,gBAAgB,EAOtB,MAAM,KAAK,CAAA;AACZ,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAA;AAY3E,MAAM,WAAW,mBAAmB;IAClC,sDAAsD;IACtD,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACnC,uEAAuE;IACvE,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACjC,+EAA+E;IAC/E,MAAM,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAClC,wEAAwE;IACxE,KAAK,CAAC,EAAE,gBAAgB,CAAC,KAAK,CAAC,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC,CAAA;IACrE,kEAAkE;IAClE,YAAY,CAAC,EAAE,gBAAgB,CAC7B,MAAM,GAAG,WAAW,GAAG,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,OAAO,GAAG,MAAM,CACrE,CAAA;IACD,+EAA+E;IAC/E,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACvC,mFAAmF;IACnF,YAAY,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACxC,sEAAsE;IACtE,eAAe,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAC3C,4DAA4D;IAC5D,aAAa,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IACzC,qFAAqF;IACrF,oBAAoB,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;CACjD;AAED,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAMD;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAC1B,OAAO,EAAE,eAAe,GAAG,QAAQ,CAAC,eAAe,CAAC,EACpD,OAAO,GAAE,mBAAwB,GAChC,kBAAkB,CA+cpB;AAMD,YAAY,EAAE,eAAe,EAAE,CAAA"}
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
import { MaybeRefOrGetter } from 'vue';
|
|
2
|
-
import { FloatingContext } from '../positioning/use-floating';
|
|
3
|
-
import { Tree } from '../positioning/use-floating-tree';
|
|
4
|
-
/**
|
|
5
|
-
* Enables showing/hiding the floating element when the reference element receives or loses focus.
|
|
6
|
-
*
|
|
7
|
-
* Keyboard-only interaction hook. Compose with `useClick`, `useHover`, `useEscapeKey` for a complete UX.
|
|
8
|
-
*
|
|
9
|
-
* Tree-aware behavior is enabled by providing a `tree` option and passing the corresponding
|
|
10
|
-
* FloatingContext (i.e., the node's `.data`). IDs are only relevant for tree-aware usage and are
|
|
11
|
-
* automatically assigned when using `useFloatingTree().addNode(...)`.
|
|
12
|
-
*
|
|
13
|
-
* @param context - The floating context for this element (not a TreeNode).
|
|
14
|
-
* @param options - Configuration options. Provide `tree` to enable tree-aware behavior.
|
|
15
|
-
*
|
|
16
|
-
* @example Standalone
|
|
17
|
-
* ```ts
|
|
18
|
-
* const ctx = useFloating(...)
|
|
19
|
-
* useFocus(ctx)
|
|
20
|
-
* ```
|
|
21
|
-
*
|
|
22
|
-
* @example Tree-aware
|
|
23
|
-
* ```ts
|
|
24
|
-
* const tree = useFloatingTree(rootAnchor, rootFloating)
|
|
25
|
-
* const parent = tree.root
|
|
26
|
-
* const child = tree.addNode(childAnchor, childFloating, { parentId: parent.id })
|
|
27
|
-
*
|
|
28
|
-
* useFocus(parent.data, { tree })
|
|
29
|
-
* useFocus(child.data, { tree })
|
|
30
|
-
* ```
|
|
31
|
-
*/
|
|
32
|
-
export declare function useFocus(context: FloatingContext, options?: UseFocusOptions): UseFocusReturn;
|
|
33
|
-
export interface UseFocusOptions {
|
|
34
|
-
/**
|
|
35
|
-
* Whether focus event listeners are enabled
|
|
36
|
-
* @default true
|
|
37
|
-
*/
|
|
38
|
-
enabled?: MaybeRefOrGetter<boolean>;
|
|
39
|
-
/**
|
|
40
|
-
* Whether the open state only changes if the focus event is considered
|
|
41
|
-
* visible (`:focus-visible` CSS selector).
|
|
42
|
-
* @default true
|
|
43
|
-
*/
|
|
44
|
-
requireFocusVisible?: MaybeRefOrGetter<boolean>;
|
|
45
|
-
/**
|
|
46
|
-
* When provided, enables tree-aware focus handling.
|
|
47
|
-
*/
|
|
48
|
-
tree?: Tree<FloatingContext>;
|
|
49
|
-
}
|
|
50
|
-
/**
|
|
51
|
-
* Return value of the useFocus composable
|
|
52
|
-
*/
|
|
53
|
-
export interface UseFocusReturn {
|
|
54
|
-
/**
|
|
55
|
-
* Cleanup function that removes all event listeners and clears pending timeouts.
|
|
56
|
-
* Useful for manual cleanup in testing scenarios.
|
|
57
|
-
*/
|
|
58
|
-
cleanup: () => void;
|
|
59
|
-
}
|
|
60
|
-
//# sourceMappingURL=use-focus.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-focus.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/use-focus.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,gBAAgB,EAOtB,MAAM,KAAK,CAAA;AACZ,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,IAAI,EAAY,MAAM,6CAA6C,CAAA;AAmBjF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,wBAAgB,QAAQ,CACtB,OAAO,EAAE,eAAe,EACxB,OAAO,GAAE,eAAoB,GAC5B,cAAc,CAsMhB;AAMD,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEnC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAE/C;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,eAAe,CAAC,CAAA;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB"}
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
import { MaybeRef } from 'vue';
|
|
2
|
-
import { TreeNode } from '../positioning/use-floating-tree';
|
|
3
|
-
import { FloatingContext } from '../positioning/use-floating';
|
|
4
|
-
import { SafePolygonOptions } from './polygon';
|
|
5
|
-
export interface UseHoverOptions {
|
|
6
|
-
/**
|
|
7
|
-
* Whether hover event listeners are enabled.
|
|
8
|
-
* @default true
|
|
9
|
-
*/
|
|
10
|
-
enabled?: MaybeRef<boolean>;
|
|
11
|
-
/**
|
|
12
|
-
* Delay in milliseconds before showing/hiding the floating element.
|
|
13
|
-
* Can be a single number for both open and close, or an object
|
|
14
|
-
* specifying different delays.
|
|
15
|
-
* @default 0
|
|
16
|
-
*/
|
|
17
|
-
delay?: MaybeRef<number | {
|
|
18
|
-
open?: number;
|
|
19
|
-
close?: number;
|
|
20
|
-
}>;
|
|
21
|
-
/**
|
|
22
|
-
* Time in milliseconds the pointer must rest within the reference
|
|
23
|
-
* element before opening the floating element.
|
|
24
|
-
* this option is ignored if an open delay is specified.
|
|
25
|
-
* @default 0
|
|
26
|
-
*/
|
|
27
|
-
restMs?: MaybeRef<number>;
|
|
28
|
-
/**
|
|
29
|
-
* Whether hover events should only trigger for mouse like pointers (mouse, pen ,stylus ..etc).
|
|
30
|
-
* @default false
|
|
31
|
-
*/
|
|
32
|
-
mouseOnly?: MaybeRef<boolean>;
|
|
33
|
-
/**
|
|
34
|
-
* Enable floating-ui style safe polygon algorithm that keeps the
|
|
35
|
-
* floating element open while the pointer traverses the rectangle/triangle
|
|
36
|
-
* region between the reference and floating elements.
|
|
37
|
-
* – `true` → enabled with defaults
|
|
38
|
-
* – `false | undefined` → disabled (current behaviour)
|
|
39
|
-
* – `SafePolygonOptions` → enabled with custom buffer
|
|
40
|
-
*/
|
|
41
|
-
safePolygon?: MaybeRef<boolean | SafePolygonOptions>;
|
|
42
|
-
}
|
|
43
|
-
/**
|
|
44
|
-
* Enables showing/hiding the floating element when hovering the reference element
|
|
45
|
-
* with enhanced behaviors like delayed open/close, rest detection, and custom
|
|
46
|
-
* exit handling.
|
|
47
|
-
*
|
|
48
|
-
* The composable supports both standalone usage with FloatingContext and tree-aware
|
|
49
|
-
* usage with TreeNode<FloatingContext> for complex nested floating UI structures.
|
|
50
|
-
*
|
|
51
|
-
* @param context - The floating context or tree node with open state and change handler
|
|
52
|
-
* @param options - Configuration options for hover behavior
|
|
53
|
-
*
|
|
54
|
-
* @example Basic standalone usage
|
|
55
|
-
* ```ts
|
|
56
|
-
* const context = useFloating(...)
|
|
57
|
-
* useHover(context, {
|
|
58
|
-
* delay: { open: 100, close: 300 },
|
|
59
|
-
* restMs: 150
|
|
60
|
-
* })
|
|
61
|
-
* ```
|
|
62
|
-
*
|
|
63
|
-
* @example Tree-aware usage for nested floating elements
|
|
64
|
-
* ```ts
|
|
65
|
-
* const tree = useFloatingTree(rootContext)
|
|
66
|
-
* const parentNode = tree.root
|
|
67
|
-
* const childNode = tree.addNode(childContext, parentNode.id)
|
|
68
|
-
*
|
|
69
|
-
* // Tree-aware behavior: child hover won't end when hovering over child,
|
|
70
|
-
* // but will end when hovering outside the entire hierarchy
|
|
71
|
-
* useHover(childNode, {
|
|
72
|
-
* delay: { close: 300 },
|
|
73
|
-
* safePolygon: true
|
|
74
|
-
* })
|
|
75
|
-
* ```
|
|
76
|
-
*/
|
|
77
|
-
export declare function useHover(context: FloatingContext | TreeNode<FloatingContext>, options?: UseHoverOptions): void;
|
|
78
|
-
//# sourceMappingURL=use-hover.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-hover.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/use-hover.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,QAAQ,EAKd,MAAM,KAAK,CAAA;AACZ,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAA;AAE3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,KAAK,kBAAkB,EAAe,MAAM,WAAW,CAAA;AAWhE,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAA;IAE3B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAE5D;;;;;OAKG;IACH,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;IAEzB;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAA;IAE7B;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC,OAAO,GAAG,kBAAkB,CAAC,CAAA;CACrD;AAqED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,wBAAgB,QAAQ,CACtB,OAAO,EAAE,eAAe,GAAG,QAAQ,CAAC,eAAe,CAAC,EACpD,OAAO,GAAE,eAAoB,GAC5B,IAAI,CA8ON"}
|
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
import { MaybeRefOrGetter, Ref } from 'vue';
|
|
2
|
-
import { FloatingContext } from '../positioning/use-floating';
|
|
3
|
-
import { TreeNode } from '../positioning/use-floating-tree';
|
|
4
|
-
/**
|
|
5
|
-
* Options for configuring list-style keyboard/mouse navigation behavior.
|
|
6
|
-
*
|
|
7
|
-
* This interface drives how items in a floating list/grid are navigated,
|
|
8
|
-
* focused, and announced (including support for virtual focus).
|
|
9
|
-
*/
|
|
10
|
-
export interface UseListNavigationOptions {
|
|
11
|
-
/**
|
|
12
|
-
* Reactive collection of list item elements in DOM order.
|
|
13
|
-
* Null entries are allowed while items mount/unmount.
|
|
14
|
-
*/
|
|
15
|
-
listRef: Ref<Array<HTMLElement | null>>;
|
|
16
|
-
/**
|
|
17
|
-
* The currently active (navigated) index. Null means no active item.
|
|
18
|
-
*/
|
|
19
|
-
activeIndex?: MaybeRefOrGetter<number | null>;
|
|
20
|
-
/**
|
|
21
|
-
* Callback invoked when navigation sets a new active index.
|
|
22
|
-
*/
|
|
23
|
-
onNavigate?: (index: number | null) => void;
|
|
24
|
-
/**
|
|
25
|
-
* Whether navigation behavior is enabled.
|
|
26
|
-
*/
|
|
27
|
-
enabled?: MaybeRefOrGetter<boolean>;
|
|
28
|
-
/**
|
|
29
|
-
* If true, arrow-key navigation wraps from end-to-start and vice versa.
|
|
30
|
-
*/
|
|
31
|
-
loop?: MaybeRefOrGetter<boolean>;
|
|
32
|
-
/**
|
|
33
|
-
* Primary navigation orientation.
|
|
34
|
-
* - "vertical": Up/Down to navigate
|
|
35
|
-
* - "horizontal": Left/Right to navigate
|
|
36
|
-
* - "both": Grid navigation (supports cols/itemSizes)
|
|
37
|
-
*/
|
|
38
|
-
orientation?: MaybeRefOrGetter<"vertical" | "horizontal" | "both">;
|
|
39
|
-
/**
|
|
40
|
-
* Indices that should be treated as disabled and skipped by navigation.
|
|
41
|
-
* Can be an array of indices or a predicate.
|
|
42
|
-
*/
|
|
43
|
-
disabledIndices?: Array<number> | ((index: number) => boolean);
|
|
44
|
-
/**
|
|
45
|
-
* If true, hovering an item moves the active index to that item.
|
|
46
|
-
*/
|
|
47
|
-
focusItemOnHover?: MaybeRefOrGetter<boolean>;
|
|
48
|
-
/**
|
|
49
|
-
* If true, pressing an arrow key when closed opens and moves focus.
|
|
50
|
-
*/
|
|
51
|
-
openOnArrowKeyDown?: MaybeRefOrGetter<boolean>;
|
|
52
|
-
/**
|
|
53
|
-
* Controls automatic scrolling when the active item changes.
|
|
54
|
-
* true for default "nearest" behavior or a custom ScrollIntoViewOptions.
|
|
55
|
-
*/
|
|
56
|
-
scrollItemIntoView?: boolean | ScrollIntoViewOptions;
|
|
57
|
-
/**
|
|
58
|
-
* Index to prefer when opening (e.g., currently selected option).
|
|
59
|
-
*/
|
|
60
|
-
selectedIndex?: MaybeRefOrGetter<number | null>;
|
|
61
|
-
/**
|
|
62
|
-
* Controls focusing an item when the list opens.
|
|
63
|
-
* - true: always focus an item
|
|
64
|
-
* - false: never focus an item
|
|
65
|
-
* - "auto": focus based on input modality/heuristics
|
|
66
|
-
*/
|
|
67
|
-
focusItemOnOpen?: MaybeRefOrGetter<boolean | "auto">;
|
|
68
|
-
/**
|
|
69
|
-
* Whether this list is nested inside another navigable list.
|
|
70
|
-
* Affects cross-orientation close/open key handling.
|
|
71
|
-
*/
|
|
72
|
-
nested?: MaybeRefOrGetter<boolean>;
|
|
73
|
-
/**
|
|
74
|
-
* Parent list orientation when nested, for cross-navigation behavior.
|
|
75
|
-
*/
|
|
76
|
-
parentOrientation?: MaybeRefOrGetter<"vertical" | "horizontal" | "both">;
|
|
77
|
-
/**
|
|
78
|
-
* Right-to-left layout flag affecting horizontal arrow semantics.
|
|
79
|
-
*/
|
|
80
|
-
rtl?: MaybeRefOrGetter<boolean>;
|
|
81
|
-
/**
|
|
82
|
-
* Enables virtual focus mode (aria-activedescendant) instead of DOM focus.
|
|
83
|
-
*/
|
|
84
|
-
virtual?: MaybeRefOrGetter<boolean>;
|
|
85
|
-
/**
|
|
86
|
-
* Receives the HTMLElement corresponding to the virtual active item.
|
|
87
|
-
* Used for aria-activedescendant and screen reader announcement.
|
|
88
|
-
*/
|
|
89
|
-
virtualItemRef?: Ref<HTMLElement | null>;
|
|
90
|
-
/**
|
|
91
|
-
* Column count for grid navigation when orientation is "both".
|
|
92
|
-
*/
|
|
93
|
-
cols?: MaybeRefOrGetter<number>;
|
|
94
|
-
/**
|
|
95
|
-
* If true, allows escaping to a null active index via keyboard (e.g., ArrowDown on last).
|
|
96
|
-
*/
|
|
97
|
-
allowEscape?: MaybeRefOrGetter<boolean>;
|
|
98
|
-
/**
|
|
99
|
-
* Defines the wrapping behavior for grid navigation when moving horizontally past the end of a row.
|
|
100
|
-
* - "row": Wraps to the start of the *same* row (default).
|
|
101
|
-
* - "next": Moves to the start of the *next* row (or previous row if moving left).
|
|
102
|
-
*/
|
|
103
|
-
gridLoopDirection?: MaybeRefOrGetter<"row" | "next">;
|
|
104
|
-
}
|
|
105
|
-
export interface UseListNavigationReturn {
|
|
106
|
-
cleanup: () => void;
|
|
107
|
-
}
|
|
108
|
-
export declare function useListNavigation(context: FloatingContext | TreeNode<FloatingContext>, options: UseListNavigationOptions): UseListNavigationReturn;
|
|
109
|
-
//# sourceMappingURL=use-list-navigation.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"use-list-navigation.d.ts","sourceRoot":"","sources":["../../../src/composables/interactions/use-list-navigation.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,gBAAgB,EAErB,KAAK,GAAG,EAKT,MAAM,KAAK,CAAA;AACZ,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAC7E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAA;AAY3E;;;;;GAKG;AACH,MAAM,WAAW,wBAAwB;IACvC;;;OAGG;IACH,OAAO,EAAE,GAAG,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC,CAAA;IAEvC;;OAEG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,MAAM,GAAG,IAAI,CAAC,CAAA;IAE7C;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IAE3C;;OAEG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEnC;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEhC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC,CAAA;IAElE;;;OAGG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,CAAA;IAE9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAE5C;;OAEG;IACH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAE9C;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,GAAG,qBAAqB,CAAA;IAEpD;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC,MAAM,GAAG,IAAI,CAAC,CAAA;IAE/C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC,OAAO,GAAG,MAAM,CAAC,CAAA;IAEpD;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAElC;;OAEG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,CAAC,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC,CAAA;IAExE;;OAEG;IACH,GAAG,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAE/B;;OAEG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEnC;;;OAGG;IACH,cAAc,CAAC,EAAE,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAExC;;OAEG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAA;IAE/B;;OAEG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAA;IAEvC;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,CAAC,KAAK,GAAG,MAAM,CAAC,CAAA;CACrD;AAED,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,eAAe,GAAG,QAAQ,CAAC,eAAe,CAAC,EACpD,OAAO,EAAE,wBAAwB,GAChC,uBAAuB,CA+VzB"}
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { Middleware, Padding } from '@floating-ui/dom';
|
|
2
|
-
import { Ref } from 'vue';
|
|
3
|
-
/**
|
|
4
|
-
* Options for configuring arrow positioning within floating elements
|
|
5
|
-
*/
|
|
6
|
-
export interface ArrowMiddlewareOptions {
|
|
7
|
-
/**
|
|
8
|
-
* Padding to apply around the arrow element
|
|
9
|
-
*/
|
|
10
|
-
padding?: Padding;
|
|
11
|
-
/**
|
|
12
|
-
* Reference to the arrow element
|
|
13
|
-
*/
|
|
14
|
-
element: Ref<HTMLElement | null>;
|
|
15
|
-
}
|
|
16
|
-
/**
|
|
17
|
-
* Positions an inner element of the floating element such that it is centered to the anchor element.
|
|
18
|
-
*
|
|
19
|
-
* This middleware is used to position arrow elements within floating elements.
|
|
20
|
-
*
|
|
21
|
-
* @param options - The arrow options including padding and element reference
|
|
22
|
-
* @returns A middleware function for arrow positioning
|
|
23
|
-
*/
|
|
24
|
-
export declare function arrow(options: ArrowMiddlewareOptions): Middleware;
|
|
25
|
-
//# sourceMappingURL=arrow.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"arrow.d.ts","sourceRoot":"","sources":["../../../src/composables/middlewares/arrow.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAE3D,OAAO,EAAE,KAAK,GAAG,EAAW,MAAM,KAAK,CAAA;AAMvC;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB;;OAEG;IACH,OAAO,EAAE,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;CACjC;AAMD;;;;;;;GAOG;AACH,wBAAgB,KAAK,CAAC,OAAO,EAAE,sBAAsB,GAAG,UAAU,CAcjE"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/composables/middlewares/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AACjF,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/composables/positioning/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,qBAAqB,CAAA"}
|