@featherk/composables 0.10.10 → 0.11.1
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/featherk-composables.es.js +850 -833
- package/dist/featherk-composables.es.js.map +1 -1
- package/dist/featherk-composables.umd.js +1 -1
- package/dist/featherk-composables.umd.js.map +1 -1
- package/dist/menu/usePopupMenu.d.ts +5 -5
- package/docs/menu/usePopupMenu.md +6 -3
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type ComponentPublicInstance, type Ref } from "vue";
|
|
2
2
|
/** A template ref that may point to an element or a Vue/Kendo component. */
|
|
3
3
|
export type PopupMenuElementRef = Ref<HTMLElement | ComponentPublicInstance | null>;
|
|
4
|
+
export type PopupMenuTriggerMode = "button" | "row";
|
|
4
5
|
/** Why the popup was closed, including the focus policy for mouse paths. */
|
|
5
6
|
export type PopupMenuCloseReason = "keyboard" | "mouse-selection" | "outside-click" | "trigger-click" | null;
|
|
6
7
|
export type PopupMenuCloseTrigger = Exclude<PopupMenuCloseReason, null>;
|
|
@@ -40,11 +41,10 @@ export type UsePopupMenuOptions = {
|
|
|
40
41
|
* Defaults to `".k-menu-item:not(.k-disabled)"` for Kendo Menu.
|
|
41
42
|
*/
|
|
42
43
|
menuItemSelector?: string;
|
|
43
|
-
/**
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
manageAriaExpanded?: boolean;
|
|
44
|
+
/** Keeps menu-trigger ARIA attributes in sync with `isOpen`. Defaults to `true`. */
|
|
45
|
+
manageMenuTriggerAria?: boolean;
|
|
46
|
+
/** Allows a table row to own the menu trigger semantics without adding button behavior. */
|
|
47
|
+
triggerMode?: PopupMenuTriggerMode;
|
|
48
48
|
};
|
|
49
49
|
/** Functions returned by {@link usePopupMenu} for the action menu. */
|
|
50
50
|
export type UsePopupMenuReturn = {
|
|
@@ -19,7 +19,7 @@ Composable for accessible Kendo UI for Vue `Popup` + `Menu` action menus. It man
|
|
|
19
19
|
<button
|
|
20
20
|
ref="triggerRef"
|
|
21
21
|
type="button"
|
|
22
|
-
aria-haspopup="
|
|
22
|
+
aria-haspopup="menu"
|
|
23
23
|
@click="menu.handleActionButtonClick"
|
|
24
24
|
@keydown="menu.handleActionButtonKeydown"
|
|
25
25
|
>
|
|
@@ -141,7 +141,8 @@ const onSelect = (event: KendoMenuSelectEvent) => {
|
|
|
141
141
|
- `focusTargetRef?: PopupMenuElementRef`: Optional element/component to focus after a keyboard-driven close.
|
|
142
142
|
- `resolveFocusTarget?: () => HTMLElement | null`: Dynamic focus-target resolver. It takes precedence over `focusTargetRef` and is useful for virtualized grid rows.
|
|
143
143
|
- `menuItemSelector?: string`: Selector for the first enabled item. Defaults to `.k-menu-item:not(.k-disabled)`.
|
|
144
|
-
- `
|
|
144
|
+
- `manageMenuTriggerAria?: boolean`: Keeps `aria-haspopup="menu"` and `aria-expanded` in sync with `isOpen` on the resolved `triggerRef` element. Defaults to `true`; while enabled, the composable owns both attributes and removes them when the trigger is replaced or the component unmounts. Set to `false` to own both attributes yourself.
|
|
145
|
+
- `triggerMode?: "button" | "row"`: Selects the trigger semantics. Defaults to `"button"`; use `"row"` only when a `tr.k-table-row` owns the menu trigger. Row mode manages ARIA attributes but does not add `role`, `tabindex`, or keyboard behavior.
|
|
145
146
|
|
|
146
147
|
`PopupMenuElementRef` accepts a normal `HTMLElement` ref or a Vue/Kendo component ref that exposes `$el`.
|
|
147
148
|
|
|
@@ -172,7 +173,9 @@ export type KendoMenuSelectEvent = {
|
|
|
172
173
|
## Behavior
|
|
173
174
|
|
|
174
175
|
- Pointer click, `Enter`, and `Space` toggle the menu.
|
|
175
|
-
- `aria-expanded`
|
|
176
|
+
- `aria-haspopup="menu"` and `aria-expanded` are written to every resolved `triggerRef` element, including native buttons and Vue/Kendo component refs resolved through `$el`.
|
|
177
|
+
- A `tr.k-table-row` is managed only with `triggerMode: "row"`; rows are never automatically made keyboard buttons.
|
|
178
|
+
- Trigger replacement and virtualization are handled by re-resolving the ref. Managed attributes are removed from the previous trigger and on unmount. Set `manageMenuTriggerAria` to `false` when the consumer owns the attributes.
|
|
176
179
|
- Opening focuses the first enabled Kendo Menu item after Vue renders it.
|
|
177
180
|
- Outside clicks close the menu, while the trigger is ignored to prevent a close/reopen race.
|
|
178
181
|
- Menu selection records keyboard or mouse modality from the selection event type.
|