igniteui-webcomponents 7.3.1 → 7.4.0

package/internals/controllers/internals.d.ts

@@ -1,83 +1,60 @@
 import type { LitElement, ReactiveController, ReactiveControllerHost } from 'lit';
-import type { FormValueType } from '../mixins/forms/types.js';
-/** A subset of the ARIA attributes exposed through `ElementInternals`. */
-type ARIAState = {
+/** The value types that `ElementInternals.setFormValue` accepts. */
+export type FormValueType = string | File | FormData | null;
+/** A subset of the ARIA attributes that `ElementInternals` gives. */
+export type ARIAState = {
     [K in keyof ARIAMixin]?: ARIAMixin[K];
 };
-/** Configuration for the ElementInternalsController. */
-type ElementInternalsConfig<T extends keyof ARIAMixin = keyof ARIAMixin> = {
-    /** Initial ARIA attributes to set on the element internals. */
-    initialARIA?: Partial<Record<T, ARIAMixin[T]>>;
+type ElementInternalsConfig = {
+    initialARIA?: ARIAState;
     /**
-     * ARIA attributes derived from host state, recomputed on every host update.
-     * Keep the projection cheap - it runs whether or not the properties it reads
-     * have changed.
+     * ARIA attributes derived from the host state. It runs on every host
+     * update, so keep it cheap; only changed values reach the internals.
      */
     aria?: () => ARIAState;
     /**
-     * Whether to also mirror the internals `role` to a `role` content attribute
-     * on the host element.
+     * Whether the controller also mirrors the internals `role` onto a `role`
+     * content attribute of the host element.
      *
-     * Workaround for axe, which reads content attributes only and does not see
-     * `ElementInternals` ARIA. An author-supplied `role` attribute always wins -
-     * the controller only writes the attribute when it is absent or was written
-     * by the controller itself.
+     * @remarks
+     * Workaround: axe reads content attributes only and does not see
+     * `ElementInternals` ARIA. A `role` attribute from the author always wins.
      */
     reflectRole?: boolean;
+    /**
+     * Whether the controller also mirrors the internals `ariaLabel` onto an
+     * `aria-label` content attribute of the host element. Same rules as
+     * {@link reflectRole}.
+     */
+    reflectLabel?: boolean;
 };
 /**
- * A Lit ReactiveController to manage `ElementInternals` for a host element.
- * Provides methods to interact with custom element states and ARIA attributes..
+ * Manages the `ElementInternals` of a host element.
+ *
+ * @remarks
+ * The form-related members need a form associated host, that is, one with
+ * `static formAssociated = true`.
  */
 declare class ElementInternalsController implements ReactiveController {
     private readonly _host;
     private readonly _internals;
     private readonly _aria?;
-    private readonly _reflectRole;
-    /** The last `role` content attribute value written by this controller. */
-    private _reflectedRole;
+    /** Mirrored ARIA properties and the last value this controller wrote. */
+    private readonly _reflected;
     /**
-     * Gets the closest ancestor `<form>` element or `null`.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true` in order to return the parent form.
+     * The ARIA values this controller last wrote. Each write reaches the
+     * accessibility tree, so the controller writes only what changes.
      */
+    private readonly _ariaState;
+    /** Returns the closest ancestor `<form>` element, or `null`. */
     get form(): HTMLFormElement | null;
-    /**
-     * Returns a `ValidityState` object which represents the different validity states
-     * the element can be in, with respect to constraint validation.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
-     */
+    /** Returns the `ValidityState` object of the element. */
     get validity(): ValidityState;
-    /**
-     * Returns a string containing the validation message of this element.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
-     */
+    /** Returns the validation message of this element. */
     get validationMessage(): string;
-    /**
-     * Returns a boolean value which returns true if the element is a submittable element
-     * which is a candidate for constraint validation.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
-     */
+    /** Whether the element is submittable and constraint validated. */
     get willValidate(): boolean;
-    /**
-     * Returns a read-only array of the `<label>` elements associated with the host element, or `null` if there are no associated labels.
-     * The association is determined by the `for` attribute of `<label>` elements or by nesting the host element inside a `<label>`.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true` in order to return associated labels.
-     */
+    /** Returns the `<label>` elements of the host, or `null` when it has none. */
     get labels(): ReadonlyArray<Element> | null;
     constructor(host: ReactiveControllerHost & LitElement, config?: ElementInternalsConfig);
     /** @internal */
@@ -85,71 +62,43 @@ declare class ElementInternalsController implements ReactiveController {
     /** @internal */
     hostUpdate(): void;
     /**
-     * Mirrors the internals `role` onto a content attribute on the host, when
-     * {@link ElementInternalsConfig.reflectRole} is enabled.
-     *
-     * Deferred until the host is connected - custom elements must not gain
-     * attributes during construction.
+     * Copies an internals ARIA property onto its host content attribute. Waits
+     * for the connection, because a custom element must get no attribute while it
+     * is constructed.
      */
-    private _reflectRoleAttribute;
+    private _reflectAttribute;
     /** Sets ARIA attributes on the element's internals. */
-    setARIA<T extends keyof ARIAMixin = keyof ARIAMixin>(state: Partial<Record<T, ARIAMixin[T]>>): void;
+    setARIA(state: ARIAState): void;
     /**
-     * Returns an ARIA attribute set on the element's internals. Internals-based
-     * ARIA leaves no trace in the DOM, so this is the only way to read it back.
+     * Returns an ARIA attribute of the internals. Internals-based ARIA leaves no
+     * trace in the DOM, so this is the only way to read it back.
      */
     getARIA<T extends keyof ARIAMixin = keyof ARIAMixin>(name: T): ARIAMixin[T];
-    /**
-     * Adds or removes a custom state from the element's internals.
-     * Custom states can be styled via `:state()` selector in CSS.
-     */
+    /** Adds or removes a custom state, which CSS matches with `:state()`. */
     setState(state: string, value: boolean): void;
     /**
-     * Sets both the state and submission value of internals's target element to value.
-     *
-     * If value is null, the element won't participate in form submission.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
+     * Sets the state and the submission value of the host element. A `null`
+     * value keeps the element out of the form submission.
      */
     setFormValue(value: FormValueType, state?: FormValueType): void;
-    /**
-     * Sets the internal validity state of the host element as well as the validation
-     * message.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
-     */
+    /** Sets the validity state and the validation message of the host. */
     setValidity(flags?: ValidityStateFlags, message?: string): void;
-    /**
-     * Checks the internal validity of the host element and fires an `invalid` event if
-     * the host element fails validation constraints.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
-     */
+    /** Checks host validity, and sends an `invalid` event on a failure. */
     checkValidity(): boolean;
     /**
-     * Checks the internal validity of the host element and fires an `invalid` event if
-     * the host element fails validation constraints.
-     *
-     * @remarks
-     * The host element must be form associated, that is, it should have
-     * `static formAssociated = true`.
+     * Checks host validity and reports the result to the user. It sends an
+     * `invalid` event on a failure.
      */
     reportValidity(): boolean;
 }
-/** Creates and adds a {@link ElementInternalsController} to a LitElement host. */
+/** Creates an {@link ElementInternalsController} and adds it to a Lit host. */
 export declare function addInternalsController(host: ReactiveControllerHost & LitElement, config?: ElementInternalsConfig): ElementInternalsController;
 /**
- * Resolves the {@link ElementInternalsController} of the given element, if it has one.
+ * The {@link ElementInternalsController} of `element`, or `undefined`.
  *
- * Internal cross-component/spec lookup. Not part of the public API - lives under
- * `#internals` and must not be re-exported from the package entry point. Prefer this
- * over exposing `public` `@hidden @internal` members on component classes.
+ * @remarks
+ * An internal lookup for the components and the specs. The package entry point
+ * must not export it. Use it in place of a `@hidden` member on a component.
  */
 export declare function internalsOf(element: Element): ElementInternalsController | undefined;
 export type { ElementInternalsController };

package/internals/controllers/internals.js

@@ -1,3 +1,7 @@
+const reflectable = {
+    role: 'role',
+    ariaLabel: 'aria-label',
+};
 const registry = new WeakMap();
 class ElementInternalsController {
     get form() {
@@ -17,11 +21,17 @@ class ElementInternalsController {
         return labels && labels.length > 0 ? Array.from(labels) : null;
     }
     constructor(host, config) {
-        this._reflectedRole = null;
+        this._reflected = new Map();
+        this._ariaState = new Map();
         this._host = host;
         this._internals = this._host.attachInternals();
         this._aria = config?.aria;
-        this._reflectRole = config?.reflectRole ?? false;
+        if (config?.reflectRole) {
+            this._reflected.set('role', null);
+        }
+        if (config?.reflectLabel) {
+            this._reflected.set('ariaLabel', null);
+        }
         if (config?.initialARIA) {
             this.setARIA(config.initialARIA);
         }
@@ -29,30 +39,47 @@ class ElementInternalsController {
         host.addController(this);
     }
     hostConnected() {
-        this._reflectRoleAttribute();
+        for (const name of this._reflected.keys()) {
+            this._reflectAttribute(name);
+        }
     }
     hostUpdate() {
         if (this._aria) {
             this.setARIA(this._aria.call(this._host));
         }
     }
-    _reflectRoleAttribute() {
+    _reflectAttribute(name) {
         const host = this._host;
-        if (!(this._reflectRole && host.isConnected)) {
+        if (!host.isConnected) {
             return;
         }
-        const role = this._internals.role;
-        const current = host.getAttribute('role');
-        if (current !== null && current !== this._reflectedRole) {
+        const attribute = reflectable[name];
+        const value = this._internals[name];
+        const current = host.getAttribute(attribute);
+        if (current !== null && current !== this._reflected.get(name)) {
             return;
         }
-        role ? host.setAttribute('role', role) : host.removeAttribute('role');
-        this._reflectedRole = role;
+        if (current !== value) {
+            value === null
+                ? host.removeAttribute(attribute)
+                : host.setAttribute(attribute, value);
+        }
+        this._reflected.set(name, value);
     }
     setARIA(state) {
-        Object.assign(this._internals, state);
-        if ('role' in state) {
-            this._reflectRoleAttribute();
+        const internals = this._internals;
+        for (const key in state) {
+            const name = key;
+            const value = state[name];
+            if (!this._ariaState.has(name) || this._ariaState.get(name) !== value) {
+                this._ariaState.set(name, value);
+                internals[name] = value;
+            }
+        }
+        for (const name of this._reflected.keys()) {
+            if (name in state) {
+                this._reflectAttribute(name);
+            }
         }
     }
     getARIA(name) {

package/internals/controllers/internals.js.map

@@ -1 +1 @@
-{"version":3,"file":"internals.js","sourceRoot":"","sources":["../../../src/internals/controllers/internals.ts"],"names":[],"mappings":"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","sourcesContent":["import type {\n  LitElement,\n  ReactiveController,\n  ReactiveControllerHost,\n} from 'lit';\nimport type { FormValueType } from '../mixins/forms/types.js';\n\n/** A subset of the ARIA attributes exposed through `ElementInternals`. */\ntype ARIAState = { [K in keyof ARIAMixin]?: ARIAMixin[K] };\n\n/** Configuration for the ElementInternalsController. */\ntype ElementInternalsConfig<T extends keyof ARIAMixin = keyof ARIAMixin> = {\n  /** Initial ARIA attributes to set on the element internals. */\n  initialARIA?: Partial<Record<T, ARIAMixin[T]>>;\n  /**\n   * ARIA attributes derived from host state, recomputed on every host update.\n   * Keep the projection cheap - it runs whether or not the properties it reads\n   * have changed.\n   */\n  aria?: () => ARIAState;\n  /**\n   * Whether to also mirror the internals `role` to a `role` content attribute\n   * on the host element.\n   *\n   * Workaround for axe, which reads content attributes only and does not see\n   * `ElementInternals` ARIA. An author-supplied `role` attribute always wins -\n   * the controller only writes the attribute when it is absent or was written\n   * by the controller itself.\n   */\n  reflectRole?: boolean;\n};\n\n/**\n * Internal registry resolving a host element to its internals controller.\n *\n * `attachInternals()` throws when called twice on the same element, so a host\n * maps to at most one controller.\n */\nconst registry = new WeakMap<Element, ElementInternalsController>();\n\n/**\n * A Lit ReactiveController to manage `ElementInternals` for a host element.\n * Provides methods to interact with custom element states and ARIA attributes..\n */\nclass ElementInternalsController implements ReactiveController {\n  private readonly _host: ReactiveControllerHost & LitElement;\n  private readonly _internals: ElementInternals;\n  private readonly _aria?: () => ARIAState;\n  private readonly _reflectRole: boolean;\n\n  /** The last `role` content attribute value written by this controller. */\n  private _reflectedRole: string | null = null;\n\n  /**\n   * Gets the closest ancestor `<form>` element or `null`.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true` in order to return the parent form.\n   */\n  public get form(): HTMLFormElement | null {\n    return this._internals.form;\n  }\n\n  /**\n   * Returns a `ValidityState` object which represents the different validity states\n   * the element can be in, with respect to constraint validation.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public get validity(): ValidityState {\n    return this._internals.validity;\n  }\n\n  /**\n   * Returns a string containing the validation message of this element.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public get validationMessage(): string {\n    return this._internals.validationMessage;\n  }\n\n  /**\n   * Returns a boolean value which returns true if the element is a submittable element\n   * which is a candidate for constraint validation.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public get willValidate(): boolean {\n    return this._internals.willValidate;\n  }\n\n  /**\n   * Returns a read-only array of the `<label>` elements associated with the host element, or `null` if there are no associated labels.\n   * The association is determined by the `for` attribute of `<label>` elements or by nesting the host element inside a `<label>`.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true` in order to return associated labels.\n   */\n  public get labels(): ReadonlyArray<Element> | null {\n    const labels = this._internals.labels as NodeListOf<Element> | null;\n    return labels && labels.length > 0 ? Array.from(labels) : null;\n  }\n\n  constructor(\n    host: ReactiveControllerHost & LitElement,\n    config?: ElementInternalsConfig\n  ) {\n    this._host = host;\n    this._internals = this._host.attachInternals();\n    this._aria = config?.aria;\n    this._reflectRole = config?.reflectRole ?? false;\n\n    if (config?.initialARIA) {\n      this.setARIA(config.initialARIA);\n    }\n\n    registry.set(host, this);\n    host.addController(this);\n  }\n\n  /** @internal */\n  public hostConnected(): void {\n    this._reflectRoleAttribute();\n  }\n\n  /** @internal */\n  public hostUpdate(): void {\n    if (this._aria) {\n      this.setARIA(this._aria.call(this._host));\n    }\n  }\n\n  /**\n   * Mirrors the internals `role` onto a content attribute on the host, when\n   * {@link ElementInternalsConfig.reflectRole} is enabled.\n   *\n   * Deferred until the host is connected - custom elements must not gain\n   * attributes during construction.\n   */\n  private _reflectRoleAttribute(): void {\n    const host = this._host;\n\n    if (!(this._reflectRole && host.isConnected)) {\n      return;\n    }\n\n    const role = this._internals.role;\n    const current = host.getAttribute('role');\n\n    // Write only when the attribute is absent or still holds the value this\n    // controller wrote - an attribute changed by the author is theirs to keep.\n    if (current !== null && current !== this._reflectedRole) {\n      return;\n    }\n\n    // A cleared role takes its attribute with it, or the host would keep\n    // semantics that its internals no longer report.\n    role ? host.setAttribute('role', role) : host.removeAttribute('role');\n    this._reflectedRole = role;\n  }\n\n  /** Sets ARIA attributes on the element's internals. */\n  public setARIA<T extends keyof ARIAMixin = keyof ARIAMixin>(\n    state: Partial<Record<T, ARIAMixin[T]>>\n  ): void {\n    Object.assign(this._internals, state);\n\n    if ('role' in state) {\n      this._reflectRoleAttribute();\n    }\n  }\n\n  /**\n   * Returns an ARIA attribute set on the element's internals. Internals-based\n   * ARIA leaves no trace in the DOM, so this is the only way to read it back.\n   */\n  public getARIA<T extends keyof ARIAMixin = keyof ARIAMixin>(\n    name: T\n  ): ARIAMixin[T] {\n    return this._internals[name];\n  }\n\n  /**\n   * Adds or removes a custom state from the element's internals.\n   * Custom states can be styled via `:state()` selector in CSS.\n   */\n  public setState(state: string, value: boolean): void {\n    value\n      ? this._internals.states.add(state)\n      : this._internals.states.delete(state);\n  }\n\n  /**\n   * Sets both the state and submission value of internals's target element to value.\n   *\n   * If value is null, the element won't participate in form submission.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public setFormValue(value: FormValueType, state?: FormValueType): void {\n    this._internals.setFormValue(value, state);\n  }\n\n  /**\n   * Sets the internal validity state of the host element as well as the validation\n   * message.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public setValidity(flags?: ValidityStateFlags, message?: string): void {\n    this._internals.setValidity(flags, message);\n  }\n\n  /**\n   * Checks the internal validity of the host element and fires an `invalid` event if\n   * the host element fails validation constraints.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public checkValidity(): boolean {\n    return this._internals.checkValidity();\n  }\n\n  /**\n   * Checks the internal validity of the host element and fires an `invalid` event if\n   * the host element fails validation constraints.\n   *\n   * @remarks\n   * The host element must be form associated, that is, it should have\n   * `static formAssociated = true`.\n   */\n  public reportValidity(): boolean {\n    return this._internals.reportValidity();\n  }\n}\n\n/** Creates and adds a {@link ElementInternalsController} to a LitElement host. */\nexport function addInternalsController(\n  host: ReactiveControllerHost & LitElement,\n  config?: ElementInternalsConfig\n): ElementInternalsController {\n  return new ElementInternalsController(host, config);\n}\n\n/**\n * Resolves the {@link ElementInternalsController} of the given element, if it has one.\n *\n * Internal cross-component/spec lookup. Not part of the public API - lives under\n * `#internals` and must not be re-exported from the package entry point. Prefer this\n * over exposing `public` `@hidden @internal` members on component classes.\n */\nexport function internalsOf(\n  element: Element\n): ElementInternalsController | undefined {\n  return registry.get(element);\n}\n\nexport type { ElementInternalsController };\n"]}
+{"version":3,"file":"internals.js","sourceRoot":"","sources":["../../../src/internals/controllers/internals.ts"],"names":[],"mappings":"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","sourcesContent":["import type {\n  LitElement,\n  ReactiveController,\n  ReactiveControllerHost,\n} from 'lit';\n\n/** The value types that `ElementInternals.setFormValue` accepts. */\nexport type FormValueType = string | File | FormData | null;\n\n/** A subset of the ARIA attributes that `ElementInternals` gives. */\nexport type ARIAState = { [K in keyof ARIAMixin]?: ARIAMixin[K] };\n\ntype ElementInternalsConfig = {\n  initialARIA?: ARIAState;\n  /**\n   * ARIA attributes derived from the host state. It runs on every host\n   * update, so keep it cheap; only changed values reach the internals.\n   */\n  aria?: () => ARIAState;\n  /**\n   * Whether the controller also mirrors the internals `role` onto a `role`\n   * content attribute of the host element.\n   *\n   * @remarks\n   * Workaround: axe reads content attributes only and does not see\n   * `ElementInternals` ARIA. A `role` attribute from the author always wins.\n   */\n  reflectRole?: boolean;\n  /**\n   * Whether the controller also mirrors the internals `ariaLabel` onto an\n   * `aria-label` content attribute of the host element. Same rules as\n   * {@link reflectRole}.\n   */\n  reflectLabel?: boolean;\n};\n\n/** The mirrored internals ARIA properties and their content attributes. */\nconst reflectable = {\n  role: 'role',\n  ariaLabel: 'aria-label',\n} as const;\n\ntype ReflectableARIA = keyof typeof reflectable;\n\n/**\n * Resolves a host element to its internals controller. `attachInternals()`\n * throws on a second call, so a host has one controller at most.\n */\nconst registry = new WeakMap<Element, ElementInternalsController>();\n\n/**\n * Manages the `ElementInternals` of a host element.\n *\n * @remarks\n * The form-related members need a form associated host, that is, one with\n * `static formAssociated = true`.\n */\nclass ElementInternalsController implements ReactiveController {\n  private readonly _host: ReactiveControllerHost & LitElement;\n  private readonly _internals: ElementInternals;\n  private readonly _aria?: () => ARIAState;\n  /** Mirrored ARIA properties and the last value this controller wrote. */\n  private readonly _reflected = new Map<ReflectableARIA, string | null>();\n\n  /**\n   * The ARIA values this controller last wrote. Each write reaches the\n   * accessibility tree, so the controller writes only what changes.\n   */\n  private readonly _ariaState = new Map<keyof ARIAMixin, unknown>();\n\n  /** Returns the closest ancestor `<form>` element, or `null`. */\n  public get form(): HTMLFormElement | null {\n    return this._internals.form;\n  }\n\n  /** Returns the `ValidityState` object of the element. */\n  public get validity(): ValidityState {\n    return this._internals.validity;\n  }\n\n  /** Returns the validation message of this element. */\n  public get validationMessage(): string {\n    return this._internals.validationMessage;\n  }\n\n  /** Whether the element is submittable and constraint validated. */\n  public get willValidate(): boolean {\n    return this._internals.willValidate;\n  }\n\n  /** Returns the `<label>` elements of the host, or `null` when it has none. */\n  public get labels(): ReadonlyArray<Element> | null {\n    const labels = this._internals.labels as NodeListOf<Element> | null;\n    return labels && labels.length > 0 ? Array.from(labels) : null;\n  }\n\n  constructor(\n    host: ReactiveControllerHost & LitElement,\n    config?: ElementInternalsConfig\n  ) {\n    this._host = host;\n    this._internals = this._host.attachInternals();\n    this._aria = config?.aria;\n\n    if (config?.reflectRole) {\n      this._reflected.set('role', null);\n    }\n    if (config?.reflectLabel) {\n      this._reflected.set('ariaLabel', null);\n    }\n\n    if (config?.initialARIA) {\n      this.setARIA(config.initialARIA);\n    }\n\n    registry.set(host, this);\n    host.addController(this);\n  }\n\n  /** @internal */\n  public hostConnected(): void {\n    for (const name of this._reflected.keys()) {\n      this._reflectAttribute(name);\n    }\n  }\n\n  /** @internal */\n  public hostUpdate(): void {\n    if (this._aria) {\n      this.setARIA(this._aria.call(this._host));\n    }\n  }\n\n  /**\n   * Copies an internals ARIA property onto its host content attribute. Waits\n   * for the connection, because a custom element must get no attribute while it\n   * is constructed.\n   */\n  private _reflectAttribute(name: ReflectableARIA): void {\n    const host = this._host;\n\n    if (!host.isConnected) {\n      return;\n    }\n\n    const attribute = reflectable[name];\n    const value = this._internals[name];\n    const current = host.getAttribute(attribute);\n\n    // An attribute that the author set or changed stays as the author left it.\n    if (current !== null && current !== this._reflected.get(name)) {\n      return;\n    }\n\n    // Only null removes the attribute; an empty string is a valid ARIA value.\n    if (current !== value) {\n      value === null\n        ? host.removeAttribute(attribute)\n        : host.setAttribute(attribute, value);\n    }\n\n    this._reflected.set(name, value);\n  }\n\n  /** Sets ARIA attributes on the element's internals. */\n  public setARIA(state: ARIAState): void {\n    // A write through a key of the union needs an index signature.\n    const internals = this._internals as unknown as Record<string, unknown>;\n\n    for (const key in state) {\n      const name = key as keyof ARIAMixin;\n      const value = state[name];\n\n      if (!this._ariaState.has(name) || this._ariaState.get(name) !== value) {\n        this._ariaState.set(name, value);\n        internals[name] = value;\n      }\n    }\n\n    // Always reflect a key that the state carries: the internals value alone\n    // does not reveal an attribute that the author removed.\n    for (const name of this._reflected.keys()) {\n      if (name in state) {\n        this._reflectAttribute(name);\n      }\n    }\n  }\n\n  /**\n   * Returns an ARIA attribute of the internals. Internals-based ARIA leaves no\n   * trace in the DOM, so this is the only way to read it back.\n   */\n  public getARIA<T extends keyof ARIAMixin = keyof ARIAMixin>(\n    name: T\n  ): ARIAMixin[T] {\n    return this._internals[name];\n  }\n\n  /** Adds or removes a custom state, which CSS matches with `:state()`. */\n  public setState(state: string, value: boolean): void {\n    value\n      ? this._internals.states.add(state)\n      : this._internals.states.delete(state);\n  }\n\n  /**\n   * Sets the state and the submission value of the host element. A `null`\n   * value keeps the element out of the form submission.\n   */\n  public setFormValue(value: FormValueType, state?: FormValueType): void {\n    this._internals.setFormValue(value, state);\n  }\n\n  /** Sets the validity state and the validation message of the host. */\n  public setValidity(flags?: ValidityStateFlags, message?: string): void {\n    this._internals.setValidity(flags, message);\n  }\n\n  /** Checks host validity, and sends an `invalid` event on a failure. */\n  public checkValidity(): boolean {\n    return this._internals.checkValidity();\n  }\n\n  /**\n   * Checks host validity and reports the result to the user. It sends an\n   * `invalid` event on a failure.\n   */\n  public reportValidity(): boolean {\n    return this._internals.reportValidity();\n  }\n}\n\n/** Creates an {@link ElementInternalsController} and adds it to a Lit host. */\nexport function addInternalsController(\n  host: ReactiveControllerHost & LitElement,\n  config?: ElementInternalsConfig\n): ElementInternalsController {\n  return new ElementInternalsController(host, config);\n}\n\n/**\n * The {@link ElementInternalsController} of `element`, or `undefined`.\n *\n * @remarks\n * An internal lookup for the components and the specs. The package entry point\n * must not export it. Use it in place of a `@hidden` member on a component.\n */\nexport function internalsOf(\n  element: Element\n): ElementInternalsController | undefined {\n  return registry.get(element);\n}\n\nexport type { ElementInternalsController };\n"]}