@vaadin/component-base 23.1.2 → 23.1.5

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/component-base",
3
- "version": "23.1.2",
3
+ "version": "23.1.5",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -42,5 +42,5 @@
42
42
  "@vaadin/testing-helpers": "^0.3.2",
43
43
  "sinon": "^13.0.2"
44
44
  },
45
- "gitHead": "6fb205c6e9a761feadfb779dd5d7af96d3102e56"
45
+ "gitHead": "326938919a54353231af25d341ba6076c249afee"
46
46
  }
@@ -7,4 +7,4 @@
7
7
  /**
8
8
  * Cause a text string to be announced by screen readers.
9
9
  */
10
- export function announce(text: string, options?: { mode?: 'polite' | 'assertive' | 'alert'; timeout?: number }): void;
10
+ export function announce(text: string, options?: { mode?: 'alert' | 'assertive' | 'polite'; timeout?: number }): void;
@@ -18,7 +18,7 @@ import { KeyboardMixinClass } from './keyboard-mixin.js';
18
18
  */
19
19
  export declare function ActiveMixin<T extends Constructor<HTMLElement>>(
20
20
  base: T,
21
- ): T & Constructor<ActiveMixinClass> & Constructor<DisabledMixinClass> & Constructor<KeyboardMixinClass>;
21
+ ): Constructor<ActiveMixinClass> & Constructor<DisabledMixinClass> & Constructor<KeyboardMixinClass> & T;
22
22
 
23
23
  export declare class ActiveMixinClass {
24
24
  /**
@@ -79,21 +79,18 @@ export const ActiveMixin = (superclass) =>
79
79
 
80
80
  if (this._shouldSetActive(event) && this._activeKeys.includes(event.key)) {
81
81
  this._setActive(true);
82
- }
83
- }
84
-
85
- /**
86
- * Removes the `active` attribute from the element if the activation key is released.
87
- *
88
- * @param {KeyboardEvent} event
89
- * @protected
90
- * @override
91
- */
92
- _onKeyUp(event) {
93
- super._onKeyUp(event);
94
82
 
95
- if (this._activeKeys.includes(event.key)) {
96
- this._setActive(false);
83
+ // Element can become hidden before the `keyup` event, e.g. on button click.
84
+ // Use document listener to ensure `active` attribute is removed correctly.
85
+ document.addEventListener(
86
+ 'keyup',
87
+ (e) => {
88
+ if (this._activeKeys.includes(e.key)) {
89
+ this._setActive(false);
90
+ }
91
+ },
92
+ { once: true },
93
+ );
97
94
  }
98
95
  }
99
96
 
@@ -11,7 +11,7 @@ import { ReactiveController, ReactiveControllerHost } from 'lit';
11
11
  */
12
12
  export declare function ControllerMixin<T extends Constructor<HTMLElement>>(
13
13
  superclass: T,
14
- ): T & Constructor<ControllerMixinClass>;
14
+ ): Constructor<ControllerMixinClass> & T;
15
15
 
16
16
  export declare class ControllerMixinClass
17
17
  implements Pick<ReactiveControllerHost, 'addController' | 'removeController'>
@@ -8,7 +8,7 @@ import { Constructor } from '@open-wc/dedupe-mixin';
8
8
  /**
9
9
  * A mixin to handle `dir` attribute based on the one set on the `<html>` element.
10
10
  */
11
- export declare function DirMixin<T extends Constructor<HTMLElement>>(base: T): T & Constructor<DirMixinClass>;
11
+ export declare function DirMixin<T extends Constructor<HTMLElement>>(base: T): Constructor<DirMixinClass> & T;
12
12
 
13
13
  export declare class DirMixinClass {
14
14
  protected __getNormalizedScrollLeft(element: Element | null): number;
@@ -13,7 +13,7 @@ import { DirMixinClass } from './dir-mixin.js';
13
13
  */
14
14
  export declare function ElementMixin<T extends Constructor<HTMLElement>>(
15
15
  superclass: T,
16
- ): T & Constructor<DirMixinClass> & Constructor<ElementMixinClass>;
16
+ ): Constructor<DirMixinClass> & Constructor<ElementMixinClass> & T;
17
17
 
18
18
  export declare class ElementMixinClass {
19
19
  static version: string;
@@ -39,7 +39,7 @@ const registered = new Set();
39
39
  export const ElementMixin = (superClass) =>
40
40
  class VaadinElementMixin extends DirMixin(superClass) {
41
41
  static get version() {
42
- return '23.1.2';
42
+ return '23.1.5';
43
43
  }
44
44
 
45
45
  /** @protected */
@@ -8,7 +8,7 @@ import { Constructor } from '@open-wc/dedupe-mixin';
8
8
  /**
9
9
  * A mixin to handle `focused` and `focus-ring` attributes based on focus.
10
10
  */
11
- export declare function FocusMixin<T extends Constructor<HTMLElement>>(base: T): T & Constructor<FocusMixinClass>;
11
+ export declare function FocusMixin<T extends Constructor<HTMLElement>>(base: T): Constructor<FocusMixinClass> & T;
12
12
 
13
13
  export declare class FocusMixinClass {
14
14
  protected readonly _keyboardActive: boolean;
@@ -125,7 +125,11 @@ export class FocusTrapController {
125
125
  const step = backward ? -1 : 1;
126
126
  const currentIndex = this.__focusedElementIndex;
127
127
  const nextIndex = (focusableElements.length + currentIndex + step) % focusableElements.length;
128
- focusableElements[nextIndex].focus();
128
+ const element = focusableElements[nextIndex];
129
+ element.focus();
130
+ if (element.localName === 'input') {
131
+ element.select();
132
+ }
129
133
  }
130
134
 
131
135
  /**
@@ -10,7 +10,7 @@ import { Constructor } from '@open-wc/dedupe-mixin';
10
10
  * The mixin subscribes to the keyboard events while an actual implementation
11
11
  * for the event handlers is left to the client (a component or another mixin).
12
12
  */
13
- export declare function KeyboardMixin<T extends Constructor<HTMLElement>>(base: T): T & Constructor<KeyboardMixinClass>;
13
+ export declare function KeyboardMixin<T extends Constructor<HTMLElement>>(base: T): Constructor<KeyboardMixinClass> & T;
14
14
 
15
15
  export declare class KeyboardMixinClass {
16
16
  /**
@@ -6,7 +6,7 @@
6
6
  import { Constructor } from '@open-wc/dedupe-mixin';
7
7
  import { LitElement } from 'lit';
8
8
 
9
- export declare function PolylitMixin<T extends Constructor<LitElement>>(base: T): T & Constructor<PolylitMixinClass>;
9
+ export declare function PolylitMixin<T extends Constructor<LitElement>>(base: T): Constructor<PolylitMixinClass> & T;
10
10
 
11
11
  export declare class PolylitMixinClass {
12
12
  ready(): void;
@@ -8,7 +8,7 @@ import { Constructor } from '@open-wc/dedupe-mixin';
8
8
  /**
9
9
  * A mixin that uses a ResizeObserver to listen to host size changes.
10
10
  */
11
- export declare function ResizeMixin<T extends Constructor<HTMLElement>>(base: T): T & Constructor<ResizeMixinClass>;
11
+ export declare function ResizeMixin<T extends Constructor<HTMLElement>>(base: T): Constructor<ResizeMixinClass> & T;
12
12
 
13
13
  export declare class ResizeMixinClass {
14
14
  /**
@@ -8,7 +8,7 @@ import { Constructor } from '@open-wc/dedupe-mixin';
8
8
  /**
9
9
  * A mixin to provide content for named slots defined by component.
10
10
  */
11
- export declare function SlotMixin<T extends Constructor<HTMLElement>>(base: T): T & Constructor<SlotMixinClass>;
11
+ export declare function SlotMixin<T extends Constructor<HTMLElement>>(base: T): Constructor<SlotMixinClass> & T;
12
12
 
13
13
  export declare class SlotMixinClass {
14
14
  /**
@@ -14,23 +14,23 @@ import { DisabledMixinClass } from './disabled-mixin.js';
14
14
  */
15
15
  export declare function TabindexMixin<T extends Constructor<HTMLElement>>(
16
16
  base: T,
17
- ): T & Constructor<DisabledMixinClass> & Constructor<TabindexMixinClass>;
17
+ ): Constructor<DisabledMixinClass> & Constructor<TabindexMixinClass> & T;
18
18
 
19
19
  export declare class TabindexMixinClass {
20
20
  /**
21
21
  * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.
22
22
  */
23
- tabindex: number | undefined | null;
23
+ tabindex: number | null | undefined;
24
24
 
25
25
  /**
26
26
  * Stores the last known tabindex since the element has been disabled.
27
27
  */
28
- protected _lastTabIndex: number | undefined | null;
28
+ protected _lastTabIndex: number | null | undefined;
29
29
 
30
30
  /**
31
31
  * When the user has changed tabindex while the element is disabled,
32
32
  * the observer reverts tabindex to -1 and rather saves the new tabindex value to apply it later.
33
33
  * The new value will be applied as soon as the element becomes enabled.
34
34
  */
35
- protected _tabindexChanged(tabindex: number | undefined | null): void;
35
+ protected _tabindexChanged(tabindex: number | null | undefined): void;
36
36
  }