@italia/globals 0.1.0-alpha.1 → 1.0.0-alpha.4

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.
Files changed (58) hide show
  1. package/custom-elements.json +1655 -168
  2. package/dist/src/base-component/base-component.d.ts +28 -13
  3. package/dist/src/base-component/base-component.d.ts.map +1 -1
  4. package/dist/src/base-component/base-component.js +27 -17
  5. package/dist/src/base-component/base-component.js.map +1 -1
  6. package/dist/src/controllers/aria-keyboard-accordion-controller.d.ts +15 -0
  7. package/dist/src/controllers/aria-keyboard-accordion-controller.d.ts.map +1 -0
  8. package/dist/src/controllers/aria-keyboard-accordion-controller.js +52 -0
  9. package/dist/src/controllers/aria-keyboard-accordion-controller.js.map +1 -0
  10. package/dist/src/controllers/aria-keyboard-list-controller.d.ts +18 -0
  11. package/dist/src/controllers/aria-keyboard-list-controller.d.ts.map +1 -0
  12. package/dist/src/controllers/aria-keyboard-list-controller.js +58 -0
  13. package/dist/src/controllers/aria-keyboard-list-controller.js.map +1 -0
  14. package/dist/src/controllers/collapse-controller.d.ts +12 -0
  15. package/dist/src/controllers/collapse-controller.d.ts.map +1 -0
  16. package/dist/src/controllers/collapse-controller.js +95 -0
  17. package/dist/src/controllers/collapse-controller.js.map +1 -0
  18. package/dist/src/controllers/roving-tabindex-controller.d.ts +85 -0
  19. package/dist/src/controllers/roving-tabindex-controller.d.ts.map +1 -0
  20. package/dist/src/controllers/roving-tabindex-controller.js +200 -0
  21. package/dist/src/controllers/roving-tabindex-controller.js.map +1 -0
  22. package/dist/src/form/form-control.d.ts +61 -0
  23. package/dist/src/form/form-control.d.ts.map +1 -0
  24. package/dist/src/form/form-control.js +259 -0
  25. package/dist/src/form/form-control.js.map +1 -0
  26. package/dist/src/form/form-controller.d.ts +68 -0
  27. package/dist/src/form/form-controller.d.ts.map +1 -0
  28. package/dist/src/form/form-controller.js +398 -0
  29. package/dist/src/form/form-controller.js.map +1 -0
  30. package/dist/src/form/locales/it.d.ts +4 -0
  31. package/dist/src/form/locales/it.d.ts.map +1 -0
  32. package/dist/src/form/locales/it.js +12 -0
  33. package/dist/src/form/locales/it.js.map +1 -0
  34. package/dist/src/index.d.ts +20 -4
  35. package/dist/src/index.d.ts.map +1 -1
  36. package/dist/src/index.js +18 -4
  37. package/dist/src/index.js.map +1 -1
  38. package/dist/src/mixins/validity.d.ts +19 -19
  39. package/dist/src/mixins/validity.d.ts.map +1 -1
  40. package/dist/src/mixins/validity.js +6 -68
  41. package/dist/src/mixins/validity.js.map +1 -1
  42. package/dist/src/stories/formControlReusableStories.d.ts +19 -0
  43. package/dist/src/stories/formControlReusableStories.d.ts.map +1 -0
  44. package/dist/src/stories/formControlReusableStories.js +64 -0
  45. package/dist/src/stories/formControlReusableStories.js.map +1 -0
  46. package/dist/src/stories/reusableUsageGuidelinesStories.d.ts +13 -0
  47. package/dist/src/stories/reusableUsageGuidelinesStories.d.ts.map +1 -0
  48. package/dist/src/stories/reusableUsageGuidelinesStories.js +39 -0
  49. package/dist/src/stories/reusableUsageGuidelinesStories.js.map +1 -0
  50. package/dist/src/window-manager.d.ts +20 -0
  51. package/dist/src/window-manager.d.ts.map +1 -0
  52. package/dist/src/window-manager.js +47 -0
  53. package/dist/src/window-manager.js.map +1 -0
  54. package/package.json +10 -8
  55. package/dist/src/mixins/form.d.ts +0 -363
  56. package/dist/src/mixins/form.d.ts.map +0 -1
  57. package/dist/src/mixins/form.js +0 -36
  58. package/dist/src/mixins/form.js.map +0 -1
@@ -1,9 +1,10 @@
1
+ import clsx from 'clsx';
1
2
  import { LitElement } from 'lit';
2
3
  import { Constructor } from '../index.js';
3
4
  import { Logger } from '../utils/logger.js';
4
5
  export interface BaseComponentInterface {
5
6
  addFocus(element: HTMLElement): void;
6
- composeClass(...classes: any): string;
7
+ composeClass: typeof clsx;
7
8
  }
8
9
  export type BaseComponentType = typeof LitElement & Constructor<BaseComponentInterface>;
9
10
  /**
@@ -12,20 +13,20 @@ export type BaseComponentType = typeof LitElement & Constructor<BaseComponentInt
12
13
  */
13
14
  export declare class BaseComponent extends LitElement {
14
15
  protected logger: Logger;
15
- protected _ariaAttributes: Record<string, string>;
16
+ protected composeClass: typeof clsx;
16
17
  protected _id?: string;
17
18
  constructor();
19
+ protected get _ariaAttributes(): Record<string, string>;
18
20
  generateId(prefix: string): string;
19
21
  addFocus(element: HTMLElement): void;
20
- composeClass(...classes: any): string;
21
- getAriaAttributes(): void;
22
+ protected getActiveElement<T extends HTMLElement>(): T | null;
23
+ get focusElement(): HTMLElement | null;
24
+ protected get prefersReducedMotion(): boolean;
22
25
  connectedCallback(): void;
23
26
  }
24
27
  export declare const BaseLocalizedComponent: (new (...args: any[]) => {
25
28
  localize: import("@italia/i18n").LocalizeController;
26
- dir: string;
27
- lang: string;
28
- readonly $localize: import("@italia/i18n").LocalizeController<import("@italia/i18n").DefaultTranslation>;
29
+ get $localize(): import("@italia/i18n").LocalizeController<import("@italia/i18n").DefaultTranslation>;
29
30
  $t(t: string): string;
30
31
  $d(d: Date | string, p: Intl.DateTimeFormatOptions): string;
31
32
  $n(d: number, p: Intl.NumberFormatOptions): string;
@@ -36,10 +37,13 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
36
37
  accessKey: string;
37
38
  readonly accessKeyLabel: string;
38
39
  autocapitalize: string;
40
+ autocorrect: boolean;
41
+ dir: string;
39
42
  draggable: boolean;
40
43
  hidden: boolean;
41
44
  inert: boolean;
42
45
  innerText: string;
46
+ lang: string;
43
47
  readonly offsetHeight: number;
44
48
  readonly offsetLeft: number;
45
49
  readonly offsetParent: Element | null;
@@ -141,6 +145,8 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
141
145
  setPointerCapture(pointerId: number): void;
142
146
  toggleAttribute(qualifiedName: string, force?: boolean): boolean;
143
147
  webkitMatchesSelector(selectors: string): boolean;
148
+ get textContent(): string;
149
+ set textContent(value: string | null): any;
144
150
  readonly baseURI: string;
145
151
  readonly childNodes: NodeListOf<ChildNode>;
146
152
  readonly firstChild: ChildNode | null;
@@ -153,7 +159,6 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
153
159
  readonly parentElement: HTMLElement | null;
154
160
  readonly parentNode: ParentNode | null;
155
161
  readonly previousSibling: ChildNode | null;
156
- textContent: string | null;
157
162
  appendChild<T_1 extends Node>(node: T_1): T_1;
158
163
  cloneNode(subtree?: boolean): Node;
159
164
  compareDocumentPosition(other: Node): number;
@@ -188,6 +193,7 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
188
193
  readonly DOCUMENT_POSITION_CONTAINED_BY: 16;
189
194
  readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32;
190
195
  dispatchEvent(event: Event): boolean;
196
+ ariaActiveDescendantElement: Element | null;
191
197
  ariaAtomic: string | null;
192
198
  ariaAutoComplete: string | null;
193
199
  ariaBrailleLabel: string | null;
@@ -198,21 +204,28 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
198
204
  ariaColIndex: string | null;
199
205
  ariaColIndexText: string | null;
200
206
  ariaColSpan: string | null;
207
+ ariaControlsElements: ReadonlyArray<Element> | null;
201
208
  ariaCurrent: string | null;
209
+ ariaDescribedByElements: ReadonlyArray<Element> | null;
202
210
  ariaDescription: string | null;
211
+ ariaDetailsElements: ReadonlyArray<Element> | null;
203
212
  ariaDisabled: string | null;
213
+ ariaErrorMessageElements: ReadonlyArray<Element> | null;
204
214
  ariaExpanded: string | null;
215
+ ariaFlowToElements: ReadonlyArray<Element> | null;
205
216
  ariaHasPopup: string | null;
206
217
  ariaHidden: string | null;
207
218
  ariaInvalid: string | null;
208
219
  ariaKeyShortcuts: string | null;
209
220
  ariaLabel: string | null;
221
+ ariaLabelledByElements: ReadonlyArray<Element> | null;
210
222
  ariaLevel: string | null;
211
223
  ariaLive: string | null;
212
224
  ariaModal: string | null;
213
225
  ariaMultiLine: string | null;
214
226
  ariaMultiSelectable: string | null;
215
227
  ariaOrientation: string | null;
228
+ ariaOwnsElements: ReadonlyArray<Element> | null;
216
229
  ariaPlaceholder: string | null;
217
230
  ariaPosInSet: string | null;
218
231
  ariaPressed: string | null;
@@ -270,18 +283,19 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
270
283
  onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
271
284
  onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
272
285
  onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
273
- onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
286
+ onauxclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
274
287
  onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
275
- onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
288
+ onbeforematch: ((this: GlobalEventHandlers, ev: Event) => any) | null;
289
+ onbeforetoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => any) | null;
276
290
  onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
277
291
  oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
278
292
  oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
279
293
  oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
280
294
  onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
281
- onclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
295
+ onclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
282
296
  onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
283
297
  oncontextlost: ((this: GlobalEventHandlers, ev: Event) => any) | null;
284
- oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
298
+ oncontextmenu: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
285
299
  oncontextrestored: ((this: GlobalEventHandlers, ev: Event) => any) | null;
286
300
  oncopy: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
287
301
  oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -329,6 +343,7 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
329
343
  onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
330
344
  onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
331
345
  onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
346
+ onpointerrawupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
332
347
  onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
333
348
  onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent) => any) | null;
334
349
  onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -347,7 +362,7 @@ export declare const BaseLocalizedComponent: (new (...args: any[]) => {
347
362
  onsubmit: ((this: GlobalEventHandlers, ev: SubmitEvent) => any) | null;
348
363
  onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
349
364
  ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
350
- ontoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
365
+ ontoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => any) | null;
351
366
  ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
352
367
  ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
353
368
  ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"base-component.d.ts","sourceRoot":"","sources":["../../../src/base-component/base-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAI5C,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IACrC,YAAY,CAAC,GAAG,OAAO,EAAE,GAAG,GAAG,MAAM,CAAC;CACvC;AAED,MAAM,MAAM,iBAAiB,GAAG,OAAO,UAAU,GAAG,WAAW,CAAC,sBAAsB,CAAC,CAAC;AAExF;;;GAGG;AAEH,qBAAa,aAAc,SAAQ,UAAU;IAC3C,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC;IAEzB,SAAS,CAAC,eAAe,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAEvD,SAAS,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;;IAQvB,UAAU,CAAC,MAAM,EAAE,MAAM;IAKzB,QAAQ,CAAC,OAAO,EAAE,WAAW;IAK7B,YAAY,CAAC,GAAG,OAAO,EAAE,GAAG;IAU5B,iBAAiB;IAQjB,iBAAiB;CASlB;AAED,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBAC4wF,CAAC;4IAAqK,CAAC;wFAAwI,CAAC;+IAA+L,CAAC;2FAAwI,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAA8nC,CAAC;;;;;;;;;;;;;;;;;;;;;;;mBAA0jE,CAAC;;;;;;;;;;;;;6BAA4xB,CAAC;8BAAuE,CAAC;kBAA4D,CAAC;;oBAA8F,CAAC;;sBAAkG,CAAC;oBAAkE,CAAC;;;;;;;;gDAAme,CAAC;;;;;;;;;;;;;;;;qBAA8sB,CAAC;;;uBAAkJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4EAA+jG,CAAC;yBAA8E,CAAC;UAAoD,GAAG;WAAgD,GAAG;;gBAA6E,GAAG;;;;;;;WAA4V,GAAG;YAAiD,GAAG;;;;;;;;;;;oBAAupC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAA42N,CAAC;cAA6F,CAAC;eAA8F,CAAC;gBAA+F,CAAC;;;;;;;;;;;;;;SAAulC,CAAC;;;iBAA+E,CAAC;yBADrrsB,CAAC"}
1
+ {"version":3,"file":"base-component.d.ts","sourceRoot":"","sources":["../../../src/base-component/base-component.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAI5C,MAAM,WAAW,sBAAsB;IACrC,QAAQ,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IACrC,YAAY,EAAE,OAAO,IAAI,CAAC;CAC3B;AAED,MAAM,MAAM,iBAAiB,GAAG,OAAO,UAAU,GAAG,WAAW,CAAC,sBAAsB,CAAC,CAAC;AAExF;;;GAGG;AAEH,qBAAa,aAAc,SAAQ,UAAU;IAC3C,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC;IAEzB,SAAS,CAAC,YAAY,cAAQ;IAE9B,SAAS,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;;IAOvB,SAAS,KAAK,eAAe,IAAI,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAUtD;IAGD,UAAU,CAAC,MAAM,EAAE,MAAM;IAKzB,QAAQ,CAAC,OAAO,EAAE,WAAW;IAK7B,SAAS,CAAC,gBAAgB,CAAC,CAAC,SAAS,WAAW,KAAK,CAAC,GAAG,IAAI;IAQ7D,IAAI,YAAY,IAAI,WAAW,GAAG,IAAI,CAErC;IAGD,SAAS,KAAK,oBAAoB,IAAI,OAAO,CAE5C;IAED,iBAAiB;CAOlB;AAED,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBACi6E,CAAC;4IAAqK,CAAC;wFAAwI,CAAC;+IAA+L,CAAC;2FAAwI,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAA8nC,CAAC;;;;;;;;;;;;;;;;;;;;;;;mBAA0jE,CAAC;;;;;;;;;;;;;6BAA4xB,CAAC;8BAAuE,CAAC;kBAA4D,CAAC;;oBAA8F,CAAC;;sBAAkG,CAAC;oBAAkE,CAAC;;;;;;;;gDAAme,CAAC;;;;;;;;;;;;;;;;;qBAA4vB,CAAC;;;uBAAkJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4EAAiiH,CAAC;yBAA8E,CAAC;UAAoD,GAAG;WAAgD,GAAG;;gBAA6E,GAAG;;;;;;;WAA4V,GAAG;YAAiD,GAAG;;;;;;;;;;;oBAAupC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAiiO,CAAC;cAA6F,CAAC;eAA8F,CAAC;gBAA+F,CAAC;;;;;;;;;;;;;;SAAulC,CAAC;;;iBAA+E,CAAC;yBAD/gtB,CAAC"}
@@ -1,3 +1,4 @@
1
+ import clsx from 'clsx';
1
2
  import { LitElement } from 'lit';
2
3
  import { LocalizeMixin } from '@italia/i18n';
3
4
  import { Logger } from '../utils/logger.js';
@@ -8,9 +9,21 @@ import { Logger } from '../utils/logger.js';
8
9
  export class BaseComponent extends LitElement {
9
10
  constructor() {
10
11
  super();
11
- this._ariaAttributes = {}; // tutti gli attributi aria-* passati al Web component
12
+ this.composeClass = clsx;
12
13
  this.logger = new Logger(this.tagName.toLowerCase());
13
14
  }
15
+ get _ariaAttributes() {
16
+ const attributes = {};
17
+ for (const attr of this.getAttributeNames()) {
18
+ if (attr === 'it-role') {
19
+ attributes.role = this.getAttribute(attr);
20
+ }
21
+ else if (attr.startsWith('it-aria-')) {
22
+ attributes[attr.replace(/^it-/, '')] = this.getAttribute(attr);
23
+ }
24
+ }
25
+ return attributes;
26
+ }
14
27
  // eslint-disable-next-line class-methods-use-this
15
28
  generateId(prefix) {
16
29
  return `${prefix}-${Math.random().toString(36).slice(2)}`;
@@ -20,25 +33,22 @@ export class BaseComponent extends LitElement {
20
33
  // new TrackFocus(element); // per il momento è stato disattivato perchè ci sono le pseudo classi ::focus-visible per fare quello che fa TrackFocus. Si possono aggiungere regole css in bsi-italia 3 dato che stiamo facendo una breaking release di bsi.
21
34
  }
22
35
  // eslint-disable-next-line class-methods-use-this
23
- composeClass(...classes) {
24
- let composedClass = '';
25
- classes
26
- .filter((c) => c.length > 0)
27
- .forEach((newClass) => {
28
- composedClass += ` ${newClass}`;
29
- });
30
- return composedClass.trim();
31
- }
32
- getAriaAttributes() {
33
- for (const attr of this.getAttributeNames()) {
34
- if (attr.startsWith('aria-')) {
35
- this._ariaAttributes[attr] = this.getAttribute(attr);
36
- }
36
+ getActiveElement() {
37
+ let active = document.activeElement;
38
+ while (active && active.shadowRoot && active.shadowRoot.activeElement) {
39
+ active = active.shadowRoot.activeElement;
37
40
  }
41
+ return active;
42
+ }
43
+ get focusElement() {
44
+ return this;
45
+ }
46
+ // eslint-disable-next-line class-methods-use-this
47
+ get prefersReducedMotion() {
48
+ return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
38
49
  }
39
50
  connectedCallback() {
40
- super.connectedCallback?.();
41
- this.getAriaAttributes();
51
+ super.connectedCallback();
42
52
  // generate internal _id
43
53
  const prefix = this.id?.length > 0 ? this.id : this.tagName.toLowerCase();
44
54
  this._id = this.generateId(prefix);
@@ -1 +1 @@
1
- {"version":3,"file":"base-component.js","sourceRoot":"","sources":["../../../src/base-component/base-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAW5C;;;GAGG;AAEH,MAAM,OAAO,aAAc,SAAQ,UAAU;IAO3C;QACE,KAAK,EAAE,CAAC;QALA,oBAAe,GAA2B,EAAE,CAAC,CAAC,sDAAsD;QAM5G,IAAI,CAAC,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;IACvD,CAAC;IAED,kDAAkD;IAClD,UAAU,CAAC,MAAc;QACvB,OAAO,GAAG,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5D,CAAC;IAED,qFAAqF;IACrF,QAAQ,CAAC,OAAoB;QAC3B,0PAA0P;IAC5P,CAAC;IAED,kDAAkD;IAClD,YAAY,CAAC,GAAG,OAAY;QAC1B,IAAI,aAAa,GAAG,EAAE,CAAC;QACvB,OAAO;aACJ,MAAM,CAAC,CAAC,CAAS,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;aACnC,OAAO,CAAC,CAAC,QAAgB,EAAE,EAAE;YAC5B,aAAa,IAAI,IAAI,QAAQ,EAAE,CAAC;QAClC,CAAC,CAAC,CAAC;QACL,OAAO,aAAa,CAAC,IAAI,EAAE,CAAC;IAC9B,CAAC;IAED,iBAAiB;QACf,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,iBAAiB,EAAE,EAAE,CAAC;YAC5C,IAAI,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC;gBAC7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAE,CAAC;YACxD,CAAC;QACH,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,EAAE,CAAC;QAE5B,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAEzB,wBAAwB;QACxB,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,EAAE,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;QAC1E,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IACrC,CAAC;CACF;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAC,aAAa,CAAC,CAAC","sourcesContent":["import { LitElement } from 'lit';\nimport { LocalizeMixin } from '@italia/i18n';\nimport { Constructor } from '../index.js';\nimport { Logger } from '../utils/logger.js';\n\n// import TrackFocus from '../utils/track-focus.js';\n\nexport interface BaseComponentInterface {\n addFocus(element: HTMLElement): void;\n composeClass(...classes: any): string;\n}\n\nexport type BaseComponentType = typeof LitElement & Constructor<BaseComponentInterface>;\n\n/**\n * Factory function per creare una base class estendibile\n * con stili personalizzati.\n */\n\nexport class BaseComponent extends LitElement {\n protected logger: Logger;\n\n protected _ariaAttributes: Record<string, string> = {}; // tutti gli attributi aria-* passati al Web component\n\n protected _id?: string; // id interno del componente, da usare sui veri elementi HTML\n\n constructor() {\n super();\n this.logger = new Logger(this.tagName.toLowerCase());\n }\n\n // eslint-disable-next-line class-methods-use-this\n generateId(prefix: string) {\n return `${prefix}-${Math.random().toString(36).slice(2)}`;\n }\n\n // eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars\n addFocus(element: HTMLElement) {\n // new TrackFocus(element); // per il momento è stato disattivato perchè ci sono le pseudo classi ::focus-visible per fare quello che fa TrackFocus. Si possono aggiungere regole css in bsi-italia 3 dato che stiamo facendo una breaking release di bsi.\n }\n\n // eslint-disable-next-line class-methods-use-this\n composeClass(...classes: any) {\n let composedClass = '';\n classes\n .filter((c: string) => c.length > 0)\n .forEach((newClass: string) => {\n composedClass += ` ${newClass}`;\n });\n return composedClass.trim();\n }\n\n getAriaAttributes() {\n for (const attr of this.getAttributeNames()) {\n if (attr.startsWith('aria-')) {\n this._ariaAttributes[attr] = this.getAttribute(attr)!;\n }\n }\n }\n\n connectedCallback() {\n super.connectedCallback?.();\n\n this.getAriaAttributes();\n\n // generate internal _id\n const prefix = this.id?.length > 0 ? this.id : this.tagName.toLowerCase();\n this._id = this.generateId(prefix);\n }\n}\n\nexport const BaseLocalizedComponent = LocalizeMixin(BaseComponent);\n"]}
1
+ {"version":3,"file":"base-component.js","sourceRoot":"","sources":["../../../src/base-component/base-component.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAW5C;;;GAGG;AAEH,MAAM,OAAO,aAAc,SAAQ,UAAU;IAO3C;QACE,KAAK,EAAE,CAAC;QALA,iBAAY,GAAG,IAAI,CAAC;QAM5B,IAAI,CAAC,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;IACvD,CAAC;IAED,IAAc,eAAe;QAC3B,MAAM,UAAU,GAA2B,EAAE,CAAC;QAC9C,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,iBAAiB,EAAE,EAAE,CAAC;YAC5C,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;gBACvB,UAAU,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAE,CAAC;YAC7C,CAAC;iBAAM,IAAI,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,CAAC;gBACvC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAE,CAAC;YAClE,CAAC;QACH,CAAC;QACD,OAAO,UAAU,CAAC;IACpB,CAAC;IAED,kDAAkD;IAClD,UAAU,CAAC,MAAc;QACvB,OAAO,GAAG,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5D,CAAC;IAED,qFAAqF;IACrF,QAAQ,CAAC,OAAoB;QAC3B,0PAA0P;IAC5P,CAAC;IAED,kDAAkD;IACxC,gBAAgB;QACxB,IAAI,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC;QACpC,OAAO,MAAM,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,aAAa,EAAE,CAAC;YACtE,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC;QAC3C,CAAC;QACD,OAAO,MAAkB,CAAC;IAC5B,CAAC;IAED,IAAI,YAAY;QACd,OAAO,IAAI,CAAC;IACd,CAAC;IAED,kDAAkD;IAClD,IAAc,oBAAoB;QAChC,OAAO,MAAM,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC,OAAO,CAAC;IACvE,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,wBAAwB;QACxB,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,EAAE,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;QAC1E,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IACrC,CAAC;CACF;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAC,aAAa,CAAC,CAAC","sourcesContent":["import clsx from 'clsx';\nimport { LitElement } from 'lit';\nimport { LocalizeMixin } from '@italia/i18n';\nimport { Constructor } from '../index.js';\nimport { Logger } from '../utils/logger.js';\n\n// import TrackFocus from '../utils/track-focus.js';\n\nexport interface BaseComponentInterface {\n addFocus(element: HTMLElement): void;\n composeClass: typeof clsx;\n}\n\nexport type BaseComponentType = typeof LitElement & Constructor<BaseComponentInterface>;\n\n/**\n * Factory function per creare una base class estendibile\n * con stili personalizzati.\n */\n\nexport class BaseComponent extends LitElement {\n protected logger: Logger;\n\n protected composeClass = clsx;\n\n protected _id?: string; // id interno del componente, da usare sui veri elementi HTML\n\n constructor() {\n super();\n this.logger = new Logger(this.tagName.toLowerCase());\n }\n\n protected get _ariaAttributes(): Record<string, string> {\n const attributes: Record<string, string> = {};\n for (const attr of this.getAttributeNames()) {\n if (attr === 'it-role') {\n attributes.role = this.getAttribute(attr)!;\n } else if (attr.startsWith('it-aria-')) {\n attributes[attr.replace(/^it-/, '')] = this.getAttribute(attr)!;\n }\n }\n return attributes;\n }\n\n // eslint-disable-next-line class-methods-use-this\n generateId(prefix: string) {\n return `${prefix}-${Math.random().toString(36).slice(2)}`;\n }\n\n // eslint-disable-next-line class-methods-use-this, @typescript-eslint/no-unused-vars\n addFocus(element: HTMLElement) {\n // new TrackFocus(element); // per il momento è stato disattivato perchè ci sono le pseudo classi ::focus-visible per fare quello che fa TrackFocus. Si possono aggiungere regole css in bsi-italia 3 dato che stiamo facendo una breaking release di bsi.\n }\n\n // eslint-disable-next-line class-methods-use-this\n protected getActiveElement<T extends HTMLElement>(): T | null {\n let active = document.activeElement;\n while (active && active.shadowRoot && active.shadowRoot.activeElement) {\n active = active.shadowRoot.activeElement;\n }\n return active as T | null;\n }\n\n get focusElement(): HTMLElement | null {\n return this;\n }\n\n // eslint-disable-next-line class-methods-use-this\n protected get prefersReducedMotion(): boolean {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n // generate internal _id\n const prefix = this.id?.length > 0 ? this.id : this.tagName.toLowerCase();\n this._id = this.generateId(prefix);\n }\n}\n\nexport const BaseLocalizedComponent = LocalizeMixin(BaseComponent);\n"]}
@@ -0,0 +1,15 @@
1
+ import { ReactiveController, ReactiveControllerHost } from 'lit';
2
+ export interface AriaKeyboardAccordionConfig {
3
+ getItems: () => HTMLElement[];
4
+ setActive: (idx: number) => void;
5
+ }
6
+ export declare class AriaKeyboardAccordionController implements ReactiveController {
7
+ private host;
8
+ private config;
9
+ constructor(host: ReactiveControllerHost);
10
+ setConfig(config: AriaKeyboardAccordionConfig): void;
11
+ hostDisconnected(): void;
12
+ private getActiveElement;
13
+ handleKeyDown(event: KeyboardEvent): void;
14
+ }
15
+ //# sourceMappingURL=aria-keyboard-accordion-controller.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aria-keyboard-accordion-controller.d.ts","sourceRoot":"","sources":["../../../src/controllers/aria-keyboard-accordion-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAEjE,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,MAAM,WAAW,EAAE,CAAC;IAC9B,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC;AAED,qBAAa,+BAAgC,YAAW,kBAAkB;IACxE,OAAO,CAAC,IAAI,CAAyB;IAErC,OAAO,CAAC,MAAM,CAA+B;gBAEjC,IAAI,EAAE,sBAAsB;IAKxC,SAAS,CAAC,MAAM,EAAE,2BAA2B;IAI7C,gBAAgB;IAKhB,OAAO,CAAC,gBAAgB;IAQxB,aAAa,CAAC,KAAK,EAAE,aAAa;CA2BnC"}
@@ -0,0 +1,52 @@
1
+ export class AriaKeyboardAccordionController {
2
+ constructor(host) {
3
+ this.host = host;
4
+ this.host.addController(this);
5
+ }
6
+ setConfig(config) {
7
+ this.config = config;
8
+ }
9
+ hostDisconnected() {
10
+ this.host.removeController(this);
11
+ }
12
+ // eslint-disable-next-line class-methods-use-this
13
+ getActiveElement() {
14
+ let active = document.activeElement;
15
+ while (active && active.shadowRoot && active.shadowRoot.activeElement) {
16
+ active = active.shadowRoot.activeElement;
17
+ }
18
+ return active;
19
+ }
20
+ handleKeyDown(event) {
21
+ if (!this.config)
22
+ return;
23
+ const items = this.config.getItems();
24
+ const activeElement = this.getActiveElement();
25
+ const currentIndex = items.indexOf(activeElement);
26
+ switch (event.key) {
27
+ case 'ArrowDown':
28
+ event.preventDefault();
29
+ if (items.length)
30
+ this.config.setActive(currentIndex < 0 ? 0 : (currentIndex + 1) % items.length);
31
+ break;
32
+ case 'ArrowUp':
33
+ event.preventDefault();
34
+ if (items.length)
35
+ this.config.setActive(currentIndex < 0 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length);
36
+ break;
37
+ case 'Home':
38
+ event.preventDefault();
39
+ if (items.length)
40
+ this.config.setActive(0);
41
+ break;
42
+ case 'End':
43
+ event.preventDefault();
44
+ if (items.length)
45
+ this.config.setActive(items.length - 1);
46
+ break;
47
+ default:
48
+ break;
49
+ }
50
+ }
51
+ }
52
+ //# sourceMappingURL=aria-keyboard-accordion-controller.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aria-keyboard-accordion-controller.js","sourceRoot":"","sources":["../../../src/controllers/aria-keyboard-accordion-controller.ts"],"names":[],"mappings":"AAOA,MAAM,OAAO,+BAA+B;IAK1C,YAAY,IAA4B;QACtC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;IAED,SAAS,CAAC,MAAmC;QAC3C,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC;IAED,kDAAkD;IAC1C,gBAAgB;QACtB,IAAI,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC;QACpC,OAAO,MAAM,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,aAAa,EAAE,CAAC;YACtE,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC;QAC3C,CAAC;QACD,OAAO,MAA4B,CAAC;IACtC,CAAC;IAED,aAAa,CAAC,KAAoB;QAChC,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE,OAAO;QACzB,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;QACrC,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAC9C,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,aAAkC,CAAC,CAAC;QACvE,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBAAE,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;gBAClG,MAAM;YACR,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBACd,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;gBAChH,MAAM;YACR,KAAK,MAAM;gBACT,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBAAE,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;gBAC3C,MAAM;YACR,KAAK,KAAK;gBACR,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBAAE,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;gBAC1D,MAAM;YACR;gBACE,MAAM;QACV,CAAC;IACH,CAAC;CACF","sourcesContent":["import { ReactiveController, ReactiveControllerHost } from 'lit';\n\nexport interface AriaKeyboardAccordionConfig {\n getItems: () => HTMLElement[];\n setActive: (idx: number) => void;\n}\n\nexport class AriaKeyboardAccordionController implements ReactiveController {\n private host: ReactiveControllerHost;\n\n private config!: AriaKeyboardAccordionConfig;\n\n constructor(host: ReactiveControllerHost) {\n this.host = host;\n this.host.addController(this);\n }\n\n setConfig(config: AriaKeyboardAccordionConfig) {\n this.config = config;\n }\n\n hostDisconnected() {\n this.host.removeController(this);\n }\n\n // eslint-disable-next-line class-methods-use-this\n private getActiveElement(): HTMLElement | null {\n let active = document.activeElement;\n while (active && active.shadowRoot && active.shadowRoot.activeElement) {\n active = active.shadowRoot.activeElement;\n }\n return active as HTMLElement | null;\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (!this.config) return;\n const items = this.config.getItems();\n const activeElement = this.getActiveElement();\n const currentIndex = items.indexOf(activeElement as HTMLButtonElement);\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (items.length) this.config.setActive(currentIndex < 0 ? 0 : (currentIndex + 1) % items.length);\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (items.length)\n this.config.setActive(currentIndex < 0 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length);\n break;\n case 'Home':\n event.preventDefault();\n if (items.length) this.config.setActive(0);\n break;\n case 'End':\n event.preventDefault();\n if (items.length) this.config.setActive(items.length - 1);\n break;\n default:\n break;\n }\n }\n}\n"]}
@@ -0,0 +1,18 @@
1
+ import { ReactiveController, ReactiveControllerHost } from 'lit';
2
+ export type AriaKeyboardConfig = {
3
+ getItems: () => HTMLElement[];
4
+ setActive: (idx: number) => void;
5
+ closeMenu: () => void;
6
+ trigger?: HTMLElement | null;
7
+ };
8
+ declare class AriaKeyboardListController implements ReactiveController {
9
+ private host;
10
+ private config;
11
+ constructor(host: ReactiveControllerHost);
12
+ setConfig(config: AriaKeyboardConfig): void;
13
+ hostDisconnected(): void;
14
+ private getActiveElement;
15
+ handleKeyDown(event: KeyboardEvent): void;
16
+ }
17
+ export default AriaKeyboardListController;
18
+ //# sourceMappingURL=aria-keyboard-list-controller.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aria-keyboard-list-controller.d.ts","sourceRoot":"","sources":["../../../src/controllers/aria-keyboard-list-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAEjE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,MAAM,WAAW,EAAE,CAAC;IAC9B,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CAC9B,CAAC;AAEF,cAAM,0BAA2B,YAAW,kBAAkB;IAC5D,OAAO,CAAC,IAAI,CAAyB;IAErC,OAAO,CAAC,MAAM,CAAsB;gBAExB,IAAI,EAAE,sBAAsB;IAKxC,SAAS,CAAC,MAAM,EAAE,kBAAkB;IAIpC,gBAAgB;IAKhB,OAAO,CAAC,gBAAgB;IAQxB,aAAa,CAAC,KAAK,EAAE,aAAa;CAiCnC;AAED,eAAe,0BAA0B,CAAC"}
@@ -0,0 +1,58 @@
1
+ class AriaKeyboardListController {
2
+ constructor(host) {
3
+ this.host = host;
4
+ this.host.addController(this);
5
+ }
6
+ setConfig(config) {
7
+ this.config = config;
8
+ }
9
+ hostDisconnected() {
10
+ this.host.removeController(this);
11
+ }
12
+ // eslint-disable-next-line class-methods-use-this
13
+ getActiveElement() {
14
+ let active = document.activeElement;
15
+ while (active && active.shadowRoot && active.shadowRoot.activeElement) {
16
+ active = active.shadowRoot.activeElement;
17
+ }
18
+ return active;
19
+ }
20
+ handleKeyDown(event) {
21
+ if (!this.config)
22
+ return;
23
+ const items = this.config.getItems();
24
+ const currentIndex = items.indexOf(this.getActiveElement());
25
+ switch (event.key) {
26
+ case 'ArrowDown':
27
+ // case 'ArrowRight':
28
+ event.preventDefault();
29
+ if (items.length && currentIndex < items.length - 1)
30
+ this.config.setActive(currentIndex < 0 ? 0 : currentIndex + 1);
31
+ break;
32
+ case 'ArrowUp':
33
+ // case 'ArrowLeft':
34
+ event.preventDefault();
35
+ if (items.length)
36
+ this.config.setActive(currentIndex < 0 ? items.length - 1 : currentIndex - 1);
37
+ break;
38
+ case 'Home':
39
+ event.preventDefault();
40
+ if (items.length)
41
+ this.config.setActive(0);
42
+ break;
43
+ case 'End':
44
+ event.preventDefault();
45
+ if (items.length)
46
+ this.config.setActive(items.length - 1);
47
+ break;
48
+ case 'Escape':
49
+ event.preventDefault();
50
+ this.config.closeMenu();
51
+ break;
52
+ default:
53
+ break;
54
+ }
55
+ }
56
+ }
57
+ export default AriaKeyboardListController;
58
+ //# sourceMappingURL=aria-keyboard-list-controller.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aria-keyboard-list-controller.js","sourceRoot":"","sources":["../../../src/controllers/aria-keyboard-list-controller.ts"],"names":[],"mappings":"AASA,MAAM,0BAA0B;IAK9B,YAAY,IAA4B;QACtC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;IAED,SAAS,CAAC,MAA0B;QAClC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC;IAED,kDAAkD;IAC1C,gBAAgB;QACtB,IAAI,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC;QACpC,OAAO,MAAM,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,aAAa,EAAE,CAAC;YACtE,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC;QAC3C,CAAC;QACD,OAAO,MAA4B,CAAC;IACtC,CAAC;IAED,aAAa,CAAC,KAAoB;QAChC,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE,OAAO;QACzB,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;QAErC,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAiB,CAAC,CAAC;QAC3E,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,WAAW;gBACd,qBAAqB;gBACrB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM,IAAI,YAAY,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC;oBACjD,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;gBACjE,MAAM;YACR,KAAK,SAAS;gBACZ,oBAAoB;gBACpB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBAAE,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC;gBAChG,MAAM;YACR,KAAK,MAAM;gBACT,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBAAE,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;gBAC3C,MAAM;YACR,KAAK,KAAK;gBACR,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,KAAK,CAAC,MAAM;oBAAE,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;gBAC1D,MAAM;YACR,KAAK,QAAQ;gBACX,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;gBACxB,MAAM;YACR;gBACE,MAAM;QACV,CAAC;IACH,CAAC;CACF;AAED,eAAe,0BAA0B,CAAC","sourcesContent":["import { ReactiveController, ReactiveControllerHost } from 'lit';\n\nexport type AriaKeyboardConfig = {\n getItems: () => HTMLElement[];\n setActive: (idx: number) => void;\n closeMenu: () => void;\n trigger?: HTMLElement | null;\n};\n\nclass AriaKeyboardListController implements ReactiveController {\n private host: ReactiveControllerHost;\n\n private config!: AriaKeyboardConfig;\n\n constructor(host: ReactiveControllerHost) {\n this.host = host;\n this.host.addController(this);\n }\n\n setConfig(config: AriaKeyboardConfig) {\n this.config = config;\n }\n\n hostDisconnected() {\n this.host.removeController(this);\n }\n\n // eslint-disable-next-line class-methods-use-this\n private getActiveElement(): HTMLElement | null {\n let active = document.activeElement;\n while (active && active.shadowRoot && active.shadowRoot.activeElement) {\n active = active.shadowRoot.activeElement;\n }\n return active as HTMLElement | null;\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (!this.config) return;\n const items = this.config.getItems();\n\n const currentIndex = items.indexOf(this.getActiveElement() as HTMLElement);\n switch (event.key) {\n case 'ArrowDown':\n // case 'ArrowRight':\n event.preventDefault();\n if (items.length && currentIndex < items.length - 1)\n this.config.setActive(currentIndex < 0 ? 0 : currentIndex + 1);\n break;\n case 'ArrowUp':\n // case 'ArrowLeft':\n event.preventDefault();\n if (items.length) this.config.setActive(currentIndex < 0 ? items.length - 1 : currentIndex - 1);\n break;\n case 'Home':\n event.preventDefault();\n if (items.length) this.config.setActive(0);\n break;\n case 'End':\n event.preventDefault();\n if (items.length) this.config.setActive(items.length - 1);\n break;\n case 'Escape':\n event.preventDefault();\n this.config.closeMenu();\n break;\n default:\n break;\n }\n }\n}\n\nexport default AriaKeyboardListController;\n"]}
@@ -0,0 +1,12 @@
1
+ import { ReactiveController, ReactiveControllerHost } from 'lit';
2
+ export declare class CollapseAnimationController implements ReactiveController {
3
+ private host;
4
+ private animating;
5
+ constructor(host: ReactiveControllerHost);
6
+ hostDisconnected(): void;
7
+ toggle(element: HTMLElement, triggerElement?: HTMLElement): void;
8
+ show(element: HTMLElement, triggerElement?: HTMLElement): void;
9
+ hide(element: HTMLElement, triggerElement?: HTMLElement): void;
10
+ isOpen(element: HTMLElement): boolean;
11
+ }
12
+ //# sourceMappingURL=collapse-controller.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"collapse-controller.d.ts","sourceRoot":"","sources":["../../../src/controllers/collapse-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAEjE,qBAAa,2BAA4B,YAAW,kBAAkB;IACpE,OAAO,CAAC,IAAI,CAAyB;IAErC,OAAO,CAAC,SAAS,CAAuB;gBAE5B,IAAI,EAAE,sBAAsB;IAQxC,gBAAgB;IAIhB,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,cAAc,CAAC,EAAE,WAAW,GAAG,IAAI;IAYhE,IAAI,CAAC,OAAO,EAAE,WAAW,EAAE,cAAc,CAAC,EAAE,WAAW,GAAG,IAAI;IA2C9D,IAAI,CAAC,OAAO,EAAE,WAAW,EAAE,cAAc,CAAC,EAAE,WAAW,GAAG,IAAI;IAiC9D,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO;CAGtC"}
@@ -0,0 +1,95 @@
1
+ export class CollapseAnimationController {
2
+ constructor(host) {
3
+ this.host = host;
4
+ this.animating = new WeakSet();
5
+ this.host.addController(this);
6
+ }
7
+ // hostConnected() {}
8
+ hostDisconnected() {
9
+ this.host.removeController(this);
10
+ }
11
+ toggle(element, triggerElement) {
12
+ // if (this.animating.has(element)) return;
13
+ const isOpen = element.classList.contains('show');
14
+ if (isOpen) {
15
+ this.hide(element, triggerElement);
16
+ }
17
+ else {
18
+ this.show(element, triggerElement);
19
+ }
20
+ }
21
+ // eslint-disable-next-line class-methods-use-this
22
+ show(element, triggerElement) {
23
+ const target = element;
24
+ if (!target)
25
+ return;
26
+ if (triggerElement) {
27
+ // eslint-disable-next-line no-param-reassign
28
+ if ('expanded' in triggerElement)
29
+ triggerElement.expanded = true;
30
+ triggerElement.classList.remove('collapsed');
31
+ }
32
+ // Get target height
33
+ target.style.display = 'block';
34
+ const targetHeight = target.scrollHeight;
35
+ target.style.display = '';
36
+ target.style.setProperty('--collapse-target-height', `${targetHeight}px`);
37
+ requestAnimationFrame(() => {
38
+ // SOSTITUISCI .collapse con .collapsing durante l'animazione
39
+ target.classList.remove('collapse');
40
+ target.classList.add('collapsing');
41
+ requestAnimationFrame(() => {
42
+ // Quando l'animazione finisce: rimuovi .collapsing, ripristina .collapse + .show
43
+ target.classList.remove('collapsing');
44
+ target.classList.add('collapse', 'show');
45
+ target.style.removeProperty('--collapse-target-height');
46
+ });
47
+ });
48
+ // requestAnimationFrame(() => {
49
+ // target.style.height = `${targetHeight}px`;
50
+ // const onEnd = (e: TransitionEvent) => {
51
+ // if (e.propertyName !== 'height') return;
52
+ // target.removeEventListener('transitionend', onEnd);
53
+ // target.classList.remove('collapsing');
54
+ // target.classList.add('collapse', 'show');
55
+ // target.style.height = 'auto';
56
+ // this.animating.delete(target);
57
+ // };
58
+ // target.addEventListener('transitionend', onEnd);
59
+ // });
60
+ }
61
+ // eslint-disable-next-line class-methods-use-this
62
+ hide(element, triggerElement) {
63
+ if (triggerElement) {
64
+ // eslint-disable-next-line no-param-reassign
65
+ if ('expanded' in triggerElement)
66
+ triggerElement.expanded = false;
67
+ triggerElement.classList.add('collapsed');
68
+ }
69
+ const currentHeight = element.offsetHeight;
70
+ element.style.setProperty('--collapse-target-height', `${currentHeight}px`);
71
+ requestAnimationFrame(() => {
72
+ // SOSTITUISCI .collapse.show con .collapsing durante l'animazione
73
+ element.classList.remove('collapse', 'show');
74
+ element.classList.add('collapsing');
75
+ requestAnimationFrame(() => {
76
+ element.style.setProperty('--collapse-target-height', '0px');
77
+ element.classList.remove('collapsing');
78
+ element.classList.add('collapse');
79
+ element.style.removeProperty('--collapse-target-height');
80
+ // Quando l'animazione finisce: rimuovi .collapsing, ripristina .collapse
81
+ setTimeout(() => {
82
+ element.classList.remove('collapsing');
83
+ element.classList.add('collapse');
84
+ element.style.removeProperty('--collapse-target-height');
85
+ }, 350); // Match transition duration
86
+ });
87
+ });
88
+ }
89
+ // ...existing code...
90
+ // eslint-disable-next-line class-methods-use-this
91
+ isOpen(element) {
92
+ return element.classList.contains('show');
93
+ }
94
+ }
95
+ //# sourceMappingURL=collapse-controller.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"collapse-controller.js","sourceRoot":"","sources":["../../../src/controllers/collapse-controller.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,2BAA2B;IAKtC,YAAY,IAA4B;QACtC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,SAAS,GAAG,IAAI,OAAO,EAAE,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;IAED,qBAAqB;IAErB,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC;IAED,MAAM,CAAC,OAAoB,EAAE,cAA4B;QACvD,2CAA2C;QAC3C,MAAM,MAAM,GAAG,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QAElD,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QACrC,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QACrC,CAAC;IACH,CAAC;IAED,kDAAkD;IAClD,IAAI,CAAC,OAAoB,EAAE,cAA4B;QACrD,MAAM,MAAM,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,MAAM;YAAE,OAAO;QACpB,IAAI,cAAc,EAAE,CAAC;YACnB,6CAA6C;YAC7C,IAAI,UAAU,IAAI,cAAc;gBAAE,cAAc,CAAC,QAAQ,GAAG,IAAI,CAAC;YACjE,cAAc,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QAC/C,CAAC;QAED,oBAAoB;QACpB,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;QAC/B,MAAM,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC;QACzC,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;QAC1B,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,0BAA0B,EAAE,GAAG,YAAY,IAAI,CAAC,CAAC;QAE1E,qBAAqB,CAAC,GAAG,EAAE;YACzB,6DAA6D;YAC7D,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;YACpC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;YAEnC,qBAAqB,CAAC,GAAG,EAAE;gBACzB,iFAAiF;gBACjF,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;gBACtC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;gBACzC,MAAM,CAAC,KAAK,CAAC,cAAc,CAAC,0BAA0B,CAAC,CAAC;YAC1D,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QACH,gCAAgC;QAChC,+CAA+C;QAE/C,4CAA4C;QAC5C,+CAA+C;QAC/C,0DAA0D;QAC1D,6CAA6C;QAC7C,gDAAgD;QAChD,oCAAoC;QACpC,qCAAqC;QACrC,OAAO;QACP,qDAAqD;QACrD,MAAM;IACR,CAAC;IAED,kDAAkD;IAClD,IAAI,CAAC,OAAoB,EAAE,cAA4B;QACrD,IAAI,cAAc,EAAE,CAAC;YACnB,6CAA6C;YAC7C,IAAI,UAAU,IAAI,cAAc;gBAAE,cAAc,CAAC,QAAQ,GAAG,KAAK,CAAC;YAClE,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QAC5C,CAAC;QAED,MAAM,aAAa,GAAG,OAAO,CAAC,YAAY,CAAC;QAC3C,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,0BAA0B,EAAE,GAAG,aAAa,IAAI,CAAC,CAAC;QAC5E,qBAAqB,CAAC,GAAG,EAAE;YACzB,kEAAkE;YAClE,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;YAC7C,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;YAEpC,qBAAqB,CAAC,GAAG,EAAE;gBACzB,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;gBAC7D,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;gBACvC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;gBAClC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,0BAA0B,CAAC,CAAC;gBAEzD,yEAAyE;gBACzE,UAAU,CAAC,GAAG,EAAE;oBACd,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;oBACvC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;oBAClC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,0BAA0B,CAAC,CAAC;gBAC3D,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,4BAA4B;YACvC,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,sBAAsB;IAEtB,kDAAkD;IAClD,MAAM,CAAC,OAAoB;QACzB,OAAO,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC5C,CAAC;CACF","sourcesContent":["import { ReactiveController, ReactiveControllerHost } from 'lit';\n\nexport class CollapseAnimationController implements ReactiveController {\n private host: ReactiveControllerHost;\n\n private animating: WeakSet<HTMLElement>;\n\n constructor(host: ReactiveControllerHost) {\n this.host = host;\n this.animating = new WeakSet();\n this.host.addController(this);\n }\n\n // hostConnected() {}\n\n hostDisconnected() {\n this.host.removeController(this);\n }\n\n toggle(element: HTMLElement, triggerElement?: HTMLElement): void {\n // if (this.animating.has(element)) return;\n const isOpen = element.classList.contains('show');\n\n if (isOpen) {\n this.hide(element, triggerElement);\n } else {\n this.show(element, triggerElement);\n }\n }\n\n // eslint-disable-next-line class-methods-use-this\n show(element: HTMLElement, triggerElement?: HTMLElement): void {\n const target = element;\n if (!target) return;\n if (triggerElement) {\n // eslint-disable-next-line no-param-reassign\n if ('expanded' in triggerElement) triggerElement.expanded = true;\n triggerElement.classList.remove('collapsed');\n }\n\n // Get target height\n target.style.display = 'block';\n const targetHeight = target.scrollHeight;\n target.style.display = '';\n target.style.setProperty('--collapse-target-height', `${targetHeight}px`);\n\n requestAnimationFrame(() => {\n // SOSTITUISCI .collapse con .collapsing durante l'animazione\n target.classList.remove('collapse');\n target.classList.add('collapsing');\n\n requestAnimationFrame(() => {\n // Quando l'animazione finisce: rimuovi .collapsing, ripristina .collapse + .show\n target.classList.remove('collapsing');\n target.classList.add('collapse', 'show');\n target.style.removeProperty('--collapse-target-height');\n });\n });\n // requestAnimationFrame(() => {\n // target.style.height = `${targetHeight}px`;\n\n // const onEnd = (e: TransitionEvent) => {\n // if (e.propertyName !== 'height') return;\n // target.removeEventListener('transitionend', onEnd);\n // target.classList.remove('collapsing');\n // target.classList.add('collapse', 'show');\n // target.style.height = 'auto';\n // this.animating.delete(target);\n // };\n // target.addEventListener('transitionend', onEnd);\n // });\n }\n\n // eslint-disable-next-line class-methods-use-this\n hide(element: HTMLElement, triggerElement?: HTMLElement): void {\n if (triggerElement) {\n // eslint-disable-next-line no-param-reassign\n if ('expanded' in triggerElement) triggerElement.expanded = false;\n triggerElement.classList.add('collapsed');\n }\n\n const currentHeight = element.offsetHeight;\n element.style.setProperty('--collapse-target-height', `${currentHeight}px`);\n requestAnimationFrame(() => {\n // SOSTITUISCI .collapse.show con .collapsing durante l'animazione\n element.classList.remove('collapse', 'show');\n element.classList.add('collapsing');\n\n requestAnimationFrame(() => {\n element.style.setProperty('--collapse-target-height', '0px');\n element.classList.remove('collapsing');\n element.classList.add('collapse');\n element.style.removeProperty('--collapse-target-height');\n\n // Quando l'animazione finisce: rimuovi .collapsing, ripristina .collapse\n setTimeout(() => {\n element.classList.remove('collapsing');\n element.classList.add('collapse');\n element.style.removeProperty('--collapse-target-height');\n }, 350); // Match transition duration\n });\n });\n }\n\n // ...existing code...\n\n // eslint-disable-next-line class-methods-use-this\n isOpen(element: HTMLElement): boolean {\n return element.classList.contains('show');\n }\n}\n"]}
@@ -0,0 +1,85 @@
1
+ import { ReactiveController, ReactiveControllerHost } from 'lit';
2
+ export interface RovingTabindexConfig<T extends HTMLElement> {
3
+ /**
4
+ * Selector or function to get the items to manage
5
+ */
6
+ getItems: () => T[];
7
+ /**
8
+ * Callback when an item is selected/activated
9
+ */
10
+ onSelect?: (item: T, event: KeyboardEvent | PointerEvent | MouseEvent) => void;
11
+ /**
12
+ * Whether items wrap around (last -> first and vice versa)
13
+ * @default true
14
+ */
15
+ wrap?: boolean;
16
+ /**
17
+ * Direction of navigation
18
+ * @default 'both'
19
+ */
20
+ direction?: 'horizontal' | 'vertical' | 'both';
21
+ /**
22
+ * Whether to select items on focus (vs just focusing)
23
+ * @default false
24
+ */
25
+ selectOnFocus?: boolean;
26
+ /**
27
+ * Custom logic to determine if an item should be skipped
28
+ * @default (item) => item.hasAttribute('disabled')
29
+ */
30
+ skipItem?: (item: T) => boolean;
31
+ }
32
+ /**
33
+ * Roving Tabindex Controller
34
+ *
35
+ * Implements the ARIA roving tabindex pattern for keyboard navigation.
36
+ * See: https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex
37
+ *
38
+ * Usage:
39
+ * ```ts
40
+ * private rovingTabindex = new RovingTabindexController(this, {
41
+ * getItems: () => Array.from(this.querySelectorAll('my-item')),
42
+ * onSelect: (item) => this.selectItem(item),
43
+ * });
44
+ * ```
45
+ */
46
+ export declare class RovingTabindexController<T extends HTMLElement> implements ReactiveController {
47
+ private host;
48
+ private config;
49
+ constructor(host: ReactiveControllerHost, config: RovingTabindexConfig<T>);
50
+ hostConnected(): void;
51
+ hostDisconnected(): void;
52
+ /**
53
+ * Update tabindex values for all items
54
+ * @param activeIndex - Index of the item that should be tabbable (default: 0 or first non-disabled)
55
+ */
56
+ updateTabindices(activeIndex?: number): void;
57
+ /**
58
+ * Handle keyboard navigation
59
+ * @param currentItem - The currently focused item
60
+ * @param event - The keyboard event
61
+ * @returns true if the event was handled, false otherwise
62
+ */
63
+ handleKeydown(currentItem: T, event: KeyboardEvent): boolean;
64
+ /**
65
+ * Get the next index based on direction
66
+ */
67
+ private getNextIndex;
68
+ /**
69
+ * Find the next valid (non-disabled) index
70
+ */
71
+ private findNextValidIndex;
72
+ /**
73
+ * Set focus to a specific item
74
+ */
75
+ focusItem(item: T): void;
76
+ /**
77
+ * Set focus to the first non-disabled item
78
+ */
79
+ focusFirst(): void;
80
+ /**
81
+ * Set focus to the last non-disabled item
82
+ */
83
+ focusLast(): void;
84
+ }
85
+ //# sourceMappingURL=roving-tabindex-controller.d.ts.map