@primer/view-components 0.44.0-rc.f46ac63e → 0.44.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.
@@ -11,10 +11,6 @@ export declare class ActionMenuElement extends HTMLElement {
11
11
  #private;
12
12
  includeFragment: IncludeFragmentElement;
13
13
  overlay: AnchoredPositionElement;
14
- list: HTMLElement;
15
- static validItemRoles: string[];
16
- static validSelectors: string[];
17
- static menuItemSelectors: string[];
18
14
  get selectVariant(): SelectVariant;
19
15
  set selectVariant(variant: SelectVariant);
20
16
  get dynamicLabelPrefix(): string;
@@ -22,7 +18,6 @@ export declare class ActionMenuElement extends HTMLElement {
22
18
  get dynamicLabel(): boolean;
23
19
  set dynamicLabel(value: boolean);
24
20
  get popoverElement(): HTMLElement | null;
25
- get childPopoverElements(): HTMLElement[];
26
21
  get invokerElement(): HTMLButtonElement | null;
27
22
  get invokerLabel(): HTMLElement | null;
28
23
  get selectedItems(): SelectedItem[];
@@ -15,14 +15,13 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
15
15
  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
16
16
  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
17
17
  };
18
- var _ActionMenuElement_instances, _a, _ActionMenuElement_abortController, _ActionMenuElement_originalLabel, _ActionMenuElement_inputName, _ActionMenuElement_invokerBeingClicked, _ActionMenuElement_intersectionObserver, _ActionMenuElement_focusZoneStack, _ActionMenuElement_updateLevels, _ActionMenuElement_softDisableItems, _ActionMenuElement_potentiallyDisallowActivation, _ActionMenuElement_isAnchorActivationViaSpace, _ActionMenuElement_isClipboardActivationViaKeyboard, _ActionMenuElement_isActivation, _ActionMenuElement_handleItemKeyboardEvent, _ActionMenuElement_handleToggleEvent, _ActionMenuElement_handleInvokerActivated, _ActionMenuElement_handleDialogItemActivated, _ActionMenuElement_handleItemActivated, _ActionMenuElement_handleIncludeFragmentReplaced, _ActionMenuElement_handleFocusOut, _ActionMenuElement_show, _ActionMenuElement_hide, _ActionMenuElement_isOpen, _ActionMenuElement_setDynamicLabel, _ActionMenuElement_updateInput, _ActionMenuElement_firstItem_get, _ActionMenuElement_subMenuForItem, _ActionMenuElement_itemForSubMenu;
19
- var ActionMenuElement_1;
18
+ var _ActionMenuElement_instances, _ActionMenuElement_abortController, _ActionMenuElement_originalLabel, _ActionMenuElement_inputName, _ActionMenuElement_invokerBeingClicked, _ActionMenuElement_intersectionObserver, _ActionMenuElement_softDisableItems, _ActionMenuElement_potentiallyDisallowActivation, _ActionMenuElement_isAnchorActivationViaSpace, _ActionMenuElement_isActivation, _ActionMenuElement_handleInvokerActivated, _ActionMenuElement_handleDialogItemActivated, _ActionMenuElement_handleItemActivated, _ActionMenuElement_handleIncludeFragmentReplaced, _ActionMenuElement_handleFocusOut, _ActionMenuElement_show, _ActionMenuElement_hide, _ActionMenuElement_isOpen, _ActionMenuElement_setDynamicLabel, _ActionMenuElement_updateInput, _ActionMenuElement_firstItem_get;
20
19
  import { controller, target } from '@github/catalyst';
21
20
  import '@oddbird/popover-polyfill';
22
21
  import { observeMutationsUntilConditionMet } from '../../utils';
23
- import { ActionMenuFocusZoneStack } from './action_menu_focus_zone_stack';
24
- import { ClipboardCopyElement } from '@github/clipboard-copy-element';
25
- let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement extends HTMLElement {
22
+ const validSelectors = ['[role="menuitem"]', '[role="menuitemcheckbox"]', '[role="menuitemradio"]'];
23
+ const menuItemSelectors = validSelectors.map(selector => `:not([hidden]) > ${selector}`);
24
+ let ActionMenuElement = class ActionMenuElement extends HTMLElement {
26
25
  constructor() {
27
26
  super(...arguments);
28
27
  _ActionMenuElement_instances.add(this);
@@ -31,7 +30,6 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
31
30
  _ActionMenuElement_inputName.set(this, '');
32
31
  _ActionMenuElement_invokerBeingClicked.set(this, false);
33
32
  _ActionMenuElement_intersectionObserver.set(this, void 0);
34
- _ActionMenuElement_focusZoneStack.set(this, void 0);
35
33
  }
36
34
  get selectVariant() {
37
35
  return this.getAttribute('data-select-variant');
@@ -62,10 +60,6 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
62
60
  get popoverElement() {
63
61
  return this.invokerElement?.popoverTargetElement || null;
64
62
  }
65
- // i.e. sub-menus
66
- get childPopoverElements() {
67
- return Array.from(this.overlay.querySelectorAll('anchored-position'));
68
- }
69
63
  get invokerElement() {
70
64
  const id = this.querySelector('[role=menu]')?.id;
71
65
  if (!id)
@@ -102,7 +96,7 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
102
96
  this.addEventListener('mouseover', this, { signal });
103
97
  this.addEventListener('focusout', this, { signal });
104
98
  this.addEventListener('mousedown', this, { signal });
105
- this.addEventListener('toggle', this, { signal, capture: true });
99
+ this.popoverElement?.addEventListener('toggle', this, { signal });
106
100
  __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_setDynamicLabel).call(this);
107
101
  __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_updateInput).call(this);
108
102
  __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_softDisableItems).call(this);
@@ -140,10 +134,6 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
140
134
  if (!this.includeFragment) {
141
135
  this.setAttribute('data-ready', 'true');
142
136
  }
143
- const levelObserver = new MutationObserver(() => __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_updateLevels).call(this));
144
- levelObserver.observe(this, { childList: true, subtree: true });
145
- __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_updateLevels).call(this);
146
- __classPrivateFieldSet(this, _ActionMenuElement_focusZoneStack, new ActionMenuFocusZoneStack(), "f");
147
137
  }
148
138
  disconnectedCallback() {
149
139
  __classPrivateFieldGet(this, _ActionMenuElement_abortController, "f").abort();
@@ -151,9 +141,10 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
151
141
  handleEvent(event) {
152
142
  const targetIsInvoker = this.invokerElement?.contains(event.target);
153
143
  const eventIsActivation = __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_isActivation).call(this, event);
154
- if (event.type === 'toggle' && event instanceof ToggleEvent) {
155
- __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_handleToggleEvent).call(this, event);
156
- return;
144
+ if (event.type === 'toggle' && event.newState === 'open') {
145
+ window.requestAnimationFrame(() => {
146
+ __classPrivateFieldGet(this, _ActionMenuElement_instances, "a", _ActionMenuElement_firstItem_get)?.focus();
147
+ });
157
148
  }
158
149
  if (targetIsInvoker && event.type === 'mousedown') {
159
150
  __classPrivateFieldSet(this, _ActionMenuElement_invokerBeingClicked, true, "f");
@@ -181,7 +172,7 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
181
172
  });
182
173
  return;
183
174
  }
184
- const item = event.target.closest(ActionMenuElement_1.menuItemSelectors.join(','));
175
+ const item = event.target.closest(menuItemSelectors.join(','));
185
176
  const targetIsItem = item !== null;
186
177
  if (targetIsItem && eventIsActivation) {
187
178
  if (__classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_potentiallyDisallowActivation).call(this, event))
@@ -200,26 +191,15 @@ let ActionMenuElement = ActionMenuElement_1 = _a = class ActionMenuElement exten
200
191
  event.preventDefault();
201
192
  item.click();
202
193
  }
203
- const subMenu = __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_subMenuForItem).call(this, item);
204
- if (subMenu) {
205
- // Prevent submitting a form when clicking on sub-menu items
206
- event.preventDefault();
207
- subMenu.showPopover();
208
- return;
209
- }
210
194
  __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_handleItemActivated).call(this, item);
211
195
  return;
212
196
  }
213
197
  if (event.type === 'include-fragment-replaced') {
214
198
  __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_handleIncludeFragmentReplaced).call(this);
215
- return;
216
- }
217
- if (targetIsItem && event instanceof KeyboardEvent) {
218
- __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_handleItemKeyboardEvent).call(this, event, item);
219
199
  }
220
200
  }
221
201
  get items() {
222
- return Array.from(this.querySelectorAll(ActionMenuElement_1.menuItemSelectors.join(',')));
202
+ return Array.from(this.querySelectorAll(menuItemSelectors.join(',')));
223
203
  }
224
204
  getItemById(itemId) {
225
205
  return this.querySelector(`li[data-item-id="${itemId}"`);
@@ -294,18 +274,10 @@ _ActionMenuElement_originalLabel = new WeakMap();
294
274
  _ActionMenuElement_inputName = new WeakMap();
295
275
  _ActionMenuElement_invokerBeingClicked = new WeakMap();
296
276
  _ActionMenuElement_intersectionObserver = new WeakMap();
297
- _ActionMenuElement_focusZoneStack = new WeakMap();
298
277
  _ActionMenuElement_instances = new WeakSet();
299
- _ActionMenuElement_updateLevels = function _ActionMenuElement_updateLevels() {
300
- let idx = 1;
301
- for (const menu of this.querySelectorAll('[role=menu]')) {
302
- menu.setAttribute('data-level', idx.toString());
303
- idx++;
304
- }
305
- };
306
278
  _ActionMenuElement_softDisableItems = function _ActionMenuElement_softDisableItems() {
307
279
  const { signal } = __classPrivateFieldGet(this, _ActionMenuElement_abortController, "f");
308
- for (const item of this.querySelectorAll(ActionMenuElement_1.validSelectors.join(','))) {
280
+ for (const item of this.querySelectorAll(validSelectors.join(','))) {
309
281
  item.addEventListener('click', __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_potentiallyDisallowActivation).bind(this), { signal });
310
282
  item.addEventListener('keydown', __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_potentiallyDisallowActivation).bind(this), { signal });
311
283
  }
@@ -313,7 +285,7 @@ _ActionMenuElement_softDisableItems = function _ActionMenuElement_softDisableIte
313
285
  _ActionMenuElement_potentiallyDisallowActivation = function _ActionMenuElement_potentiallyDisallowActivation(event) {
314
286
  if (!__classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_isActivation).call(this, event))
315
287
  return false;
316
- const item = event.target.closest(ActionMenuElement_1.menuItemSelectors.join(','));
288
+ const item = event.target.closest(menuItemSelectors.join(','));
317
289
  if (!item)
318
290
  return false;
319
291
  if (item.getAttribute('aria-disabled')) {
@@ -333,57 +305,11 @@ _ActionMenuElement_isAnchorActivationViaSpace = function _ActionMenuElement_isAn
333
305
  !(event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) &&
334
306
  event.key === ' ');
335
307
  };
336
- _ActionMenuElement_isClipboardActivationViaKeyboard = function _ActionMenuElement_isClipboardActivationViaKeyboard(event) {
337
- return (event.target instanceof ClipboardCopyElement &&
338
- event instanceof KeyboardEvent &&
339
- event.type === 'keydown' &&
340
- !(event.ctrlKey || event.altKey || event.metaKey || event.shiftKey) &&
341
- (event.key === ' ' || event.key === 'Enter'));
342
- };
343
308
  _ActionMenuElement_isActivation = function _ActionMenuElement_isActivation(event) {
344
309
  // Some browsers fire MouseEvents (Firefox) and others fire PointerEvents (Chrome). Activating an item via
345
310
  // enter or space counterintuitively fires one of these rather than a KeyboardEvent. Since PointerEvent
346
311
  // inherits from MouseEvent, it is enough to check for MouseEvent here.
347
- return ((event instanceof MouseEvent && event.type === 'click') ||
348
- __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_isAnchorActivationViaSpace).call(this, event) ||
349
- __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_isClipboardActivationViaKeyboard).call(this, event));
350
- };
351
- _ActionMenuElement_handleItemKeyboardEvent = function _ActionMenuElement_handleItemKeyboardEvent(event, item) {
352
- switch (event.key) {
353
- case 'ArrowRight': {
354
- const subMenu = __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_subMenuForItem).call(this, item);
355
- subMenu?.showPopover();
356
- break;
357
- }
358
- case 'ArrowLeft':
359
- if (item.closest('role[menu]') !== this.list) {
360
- const overlay = item.closest('anchored-position');
361
- overlay?.hidePopover();
362
- }
363
- break;
364
- }
365
- };
366
- _ActionMenuElement_handleToggleEvent = function _ActionMenuElement_handleToggleEvent(event) {
367
- const subMenu = event.target;
368
- if (event.newState === 'open') {
369
- // allow tabbing away from primary menu, but trap focus in sub-menus
370
- const isPrimaryMenu = subMenu === this.overlay;
371
- __classPrivateFieldGet(this, _ActionMenuElement_focusZoneStack, "f").push(subMenu, { trapFocus: !isPrimaryMenu });
372
- window.requestAnimationFrame(() => {
373
- const firstItem = subMenu.querySelector(ActionMenuElement_1.menuItemSelectors.join(','));
374
- firstItem?.focus();
375
- });
376
- }
377
- else {
378
- // Note that this will also cause focus to return to the invoker button, which is
379
- // desirable
380
- __classPrivateFieldGet(this, _ActionMenuElement_focusZoneStack, "f").pop(subMenu);
381
- const item = __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_itemForSubMenu).call(this, subMenu);
382
- const openPopover = document.querySelector(':popover-open');
383
- if (item && !openPopover) {
384
- item.focus();
385
- }
386
- }
312
+ return (event instanceof MouseEvent && event.type === 'click') || __classPrivateFieldGet(this, _ActionMenuElement_instances, "m", _ActionMenuElement_isAnchorActivationViaSpace).call(this, event);
387
313
  };
388
314
  _ActionMenuElement_handleInvokerActivated = function _ActionMenuElement_handleInvokerActivated(event) {
389
315
  event.preventDefault();
@@ -486,9 +412,6 @@ _ActionMenuElement_show = function _ActionMenuElement_show() {
486
412
  };
487
413
  _ActionMenuElement_hide = function _ActionMenuElement_hide() {
488
414
  this.popoverElement?.hidePopover();
489
- for (const child of this.childPopoverElements) {
490
- child.hidePopover();
491
- }
492
415
  };
493
416
  _ActionMenuElement_isOpen = function _ActionMenuElement_isOpen() {
494
417
  return this.popoverElement?.matches(':popover-open');
@@ -553,35 +476,15 @@ _ActionMenuElement_updateInput = function _ActionMenuElement_updateInput() {
553
476
  }
554
477
  };
555
478
  _ActionMenuElement_firstItem_get = function _ActionMenuElement_firstItem_get() {
556
- return this.querySelector(ActionMenuElement_1.menuItemSelectors.join(','));
557
- };
558
- _ActionMenuElement_subMenuForItem = function _ActionMenuElement_subMenuForItem(item) {
559
- const popoverId = item.getAttribute('popovertarget');
560
- if (popoverId) {
561
- return this.querySelector(`[id="${popoverId}"]`);
562
- }
563
- return null;
479
+ return this.querySelector(menuItemSelectors.join(','));
564
480
  };
565
- _ActionMenuElement_itemForSubMenu = function _ActionMenuElement_itemForSubMenu(subMenu) {
566
- const anchorId = subMenu.getAttribute('anchor');
567
- if (anchorId) {
568
- return this.querySelector(`[id="${anchorId}"]`);
569
- }
570
- return null;
571
- };
572
- ActionMenuElement.validItemRoles = ['menuitem', 'menuitemcheckbox', 'menuitemradio'];
573
- ActionMenuElement.validSelectors = ActionMenuElement_1.validItemRoles.map(role => `[role="${role}"]`);
574
- ActionMenuElement.menuItemSelectors = ActionMenuElement_1.validSelectors.map(selector => `:not([hidden]) > ${selector}`);
575
481
  __decorate([
576
482
  target
577
483
  ], ActionMenuElement.prototype, "includeFragment", void 0);
578
484
  __decorate([
579
485
  target
580
486
  ], ActionMenuElement.prototype, "overlay", void 0);
581
- __decorate([
582
- target
583
- ], ActionMenuElement.prototype, "list", void 0);
584
- ActionMenuElement = ActionMenuElement_1 = __decorate([
487
+ ActionMenuElement = __decorate([
585
488
  controller
586
489
  ], ActionMenuElement);
587
490
  export { ActionMenuElement };
@@ -1 +1 @@
1
- .breadcrumb-item{display:inline-block;list-style:none;margin-left:-.35em;max-width:100%}.breadcrumb-item:after{border-right:.1em solid var(--borderColor-neutral-emphasis);content:"";display:inline-block;height:.8em;margin:0 .5em;transform:rotate(15deg) translateY(.0625em)}.breadcrumb-item:first-child{margin-left:0}:is(.breadcrumb-item-selected,.breadcrumb-item[aria-current]:not([aria-current=false])):after{content:none}.breadcrumb-item-selected a{color:var(--fgColor-default);cursor:default!important;-webkit-text-decoration:none!important;text-decoration:none!important}
1
+ .breadcrumb-item{display:inline-block;list-style:none;max-width:100%}.breadcrumb-item:after{border-right:.1em solid var(--borderColor-neutral-emphasis);content:"";display:inline-block;height:.8em;margin:0 .15em 0 .5em;transform:rotate(15deg) translateY(.0625em)}:is(.breadcrumb-item-selected,.breadcrumb-item[aria-current]:not([aria-current=false])):after{content:none}.breadcrumb-item-selected a{color:var(--fgColor-default);cursor:default!important;-webkit-text-decoration:none!important;text-decoration:none!important}
@@ -3,7 +3,6 @@
3
3
  "selectors": [
4
4
  ".breadcrumb-item",
5
5
  ".breadcrumb-item:after",
6
- ".breadcrumb-item:first-child",
7
6
  ":is(.breadcrumb-item-selected,.breadcrumb-item[aria-current]:not([aria-current=false])):after",
8
7
  ".breadcrumb-item-selected a"
9
8
  ]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/view-components",
3
- "version": "0.44.0-rc.f46ac63e",
3
+ "version": "0.44.0",
4
4
  "description": "ViewComponents for the Primer Design System",
5
5
  "main": "app/assets/javascripts/primer_view_components.js",
6
6
  "module": "app/components/primer/primer.js",
@@ -1,17 +0,0 @@
1
- import AnchoredPositionElement from '../../anchored_position';
2
- type StackEntry = {
3
- element: AnchoredPositionElement;
4
- abortController?: AbortController;
5
- };
6
- export declare class ActionMenuFocusZoneStack {
7
- #private;
8
- constructor();
9
- get current(): StackEntry | undefined;
10
- push(next: AnchoredPositionElement, options?: {
11
- trapFocus: boolean;
12
- }): void;
13
- pop(target?: AnchoredPositionElement): void;
14
- elementIsMenuItem(element: HTMLElement): boolean;
15
- get isEmpty(): boolean;
16
- }
17
- export {};
@@ -1,17 +0,0 @@
1
- import AnchoredPositionElement from '../../anchored_position';
2
- type StackEntry = {
3
- element: AnchoredPositionElement;
4
- abortController?: AbortController;
5
- };
6
- export declare class ActionMenuFocusZoneStack {
7
- #private;
8
- constructor();
9
- get current(): StackEntry | undefined;
10
- push(next: AnchoredPositionElement, options?: {
11
- trapFocus: boolean;
12
- }): void;
13
- pop(target?: AnchoredPositionElement): void;
14
- elementIsMenuItem(element: HTMLElement): boolean;
15
- get isEmpty(): boolean;
16
- }
17
- export {};
@@ -1,62 +0,0 @@
1
- var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
2
- if (kind === "m") throw new TypeError("Private method is not writable");
3
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
4
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
5
- return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
6
- };
7
- var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
8
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
9
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
10
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
11
- };
12
- var _ActionMenuFocusZoneStack_instances, _ActionMenuFocusZoneStack_stack, _ActionMenuFocusZoneStack_setupFocusZone, _ActionMenuFocusZoneStack_validItemRoles_get;
13
- import { FocusKeys, focusTrap, focusZone } from '@primer/behaviors';
14
- import { ActionMenuElement } from './action_menu_element';
15
- export class ActionMenuFocusZoneStack {
16
- constructor() {
17
- _ActionMenuFocusZoneStack_instances.add(this);
18
- _ActionMenuFocusZoneStack_stack.set(this, void 0);
19
- __classPrivateFieldSet(this, _ActionMenuFocusZoneStack_stack, [], "f");
20
- }
21
- get current() {
22
- return __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f")[__classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f").length - 1];
23
- }
24
- push(next, options = { trapFocus: true }) {
25
- const { trapFocus } = options;
26
- __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f").push({ element: next, abortController: __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_instances, "m", _ActionMenuFocusZoneStack_setupFocusZone).call(this, next, trapFocus) });
27
- }
28
- pop(target) {
29
- if (target) {
30
- while (__classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f").length > 0 && this.current?.element !== target) {
31
- const entry = __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f").pop();
32
- entry?.abortController?.abort();
33
- }
34
- }
35
- const entry = __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f").pop();
36
- entry?.abortController?.abort();
37
- }
38
- elementIsMenuItem(element) {
39
- return __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_instances, "a", _ActionMenuFocusZoneStack_validItemRoles_get).includes(element.getAttribute('role') || '');
40
- }
41
- get isEmpty() {
42
- return __classPrivateFieldGet(this, _ActionMenuFocusZoneStack_stack, "f").length === 0;
43
- }
44
- }
45
- _ActionMenuFocusZoneStack_stack = new WeakMap(), _ActionMenuFocusZoneStack_instances = new WeakSet(), _ActionMenuFocusZoneStack_setupFocusZone = function _ActionMenuFocusZoneStack_setupFocusZone(containerEl, trapFocus) {
46
- const focusZoneAbortController = focusZone(containerEl, {
47
- bindKeys: FocusKeys.ArrowVertical | FocusKeys.ArrowHorizontal | FocusKeys.HomeAndEnd | FocusKeys.Backspace,
48
- focusOutBehavior: 'wrap',
49
- focusableElementFilter: (element) => {
50
- return this.elementIsMenuItem(element) && element.closest('anchored-position') === containerEl;
51
- },
52
- });
53
- if (trapFocus) {
54
- const { signal: focusZoneSignal } = focusZoneAbortController;
55
- return focusTrap(containerEl, undefined, focusZoneSignal);
56
- }
57
- else {
58
- return focusZoneAbortController;
59
- }
60
- }, _ActionMenuFocusZoneStack_validItemRoles_get = function _ActionMenuFocusZoneStack_validItemRoles_get() {
61
- return ActionMenuElement.validItemRoles;
62
- };