@universal-material/web 3.0.38 → 3.0.40

package/text-field/text-field.d.ts

@@ -1,36 +1,21 @@
-import { HTMLTemplateResult, LitElement } from 'lit';
-import '../field/field.js';
-declare const supportingTextAttribute = "supporting-text";
-declare const textFieldBase: import("../shared/mixin.js").MixinReturn<typeof LitElement>;
-export declare class UmTextField extends textFieldBase {
+import { CSSResultGroup } from '@lit/reactive-element/css-tag';
+import { HTMLTemplateResult } from 'lit';
+import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
+export declare class UmTextField extends UmTextFieldBase {
     #private;
-    static readonly formAssociated = true;
-    static styles: import("lit").CSSResult[];
-    static shadowRootOptions: ShadowRootInit;
-    variant: "filled" | "outlined";
-    label: string | undefined;
-    counter: string | undefined;
-    placeholder: string | undefined;
-    supportingText: string | undefined;
-    errorText: string | undefined;
-    prefixText: string | undefined;
-    suffixText: string | undefined;
-    disabled: boolean;
-    invalid: boolean;
-    get form(): HTMLFormElement | null;
-    get [supportingTextAttribute](): string | undefined;
-    set [supportingTextAttribute](value: string | undefined);
+    static styles: CSSResultGroup;
     get value(): string;
     set value(value: string);
+    prefixText: string | undefined;
+    suffixText: string | undefined;
     input: HTMLInputElement;
-    constructor();
     focus(): void;
-    protected render(): HTMLTemplateResult;
+    protected renderContent(): HTMLTemplateResult;
+    get empty(): boolean;
 }
 declare global {
     interface HTMLElementTagNameMap {
         'u-text-field': UmTextField;
     }
 }
-export {};
 //# sourceMappingURL=text-field.d.ts.map

package/text-field/text-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../src/text-field/text-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAUpE,OAAO,mBAAmB,CAAC;AAE3B,QAAA,MAAM,uBAAuB,oBAAoB,CAAC;AAKlD,QAAA,MAAM,aAAa,6DAKG,CAAC;AAEvB,qBACa,WAAY,SAAQ,aAAa;;IAC5C,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,4BAAwB;IAE9C,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEU,OAAO,wBAAmC;IAC1C,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IACb,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IACjB,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,QAAQ,UAAS;IACjB,OAAO,UAAS;IAI1D,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED,IAAI,CAAC,uBAAuB,CAAC,IAAI,MAAM,GAAG,SAAS,CAElD;IACD,IAAI,CAAC,uBAAuB,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAEtD;IAED,IACI,KAAK,IAGQ,MAAM,CADtB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAGtB;IAGe,KAAK,EAAG,gBAAgB,CAAC;;IAOhC,KAAK;cAIK,MAAM,IAAI,kBAAkB;CA8ChD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
+{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../src/text-field/text-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC/D,OAAO,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAMxD,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAE/E,qBACa,WAAY,SAAQ,eAAe;;IAE9C,OAAgB,MAAM,EAAE,cAAc,CAGpC;IAIF,IACI,KAAK,IAGQ,MAAM,CADtB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAGtB;IAEqC,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAErD,KAAK,EAAG,gBAAgB,CAAC;IAEhC,KAAK;cAIK,aAAa,IAAI,kBAAkB;IAkBtD,IAAa,KAAK,IAAI,OAAO,CAE5B;CAKF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}

package/text-field/text-field.js

@@ -15,132 +15,65 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
     return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _UmTextField_instances, _UmTextField_value, _UmTextField_elementInternals, _UmTextField_handleInput;
-import { html, LitElement, nothing } from 'lit';
+var _UmTextField_instances, _UmTextField_value, _UmTextField_handleInput;
+import { html, nothing } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
 import { live } from 'lit/directives/live.js';
-import { styles as baseStyles } from '../shared/base.styles.js';
 import { styles } from './text-field.styles.js';
-import { config } from '../config.js';
-import { mixinAttributeProperties } from '../shared/mixin-attribute-properties.js';
-import '../field/field.js';
-const supportingTextAttribute = 'supporting-text';
-const errorTextAttribute = 'error-text';
-const prefixTextAttribute = 'prefix-text';
-const suffixTextAttribute = 'suffix-text';
-const textFieldBase = mixinAttributeProperties(LitElement, supportingTextAttribute, errorTextAttribute, prefixTextAttribute, suffixTextAttribute);
-let UmTextField = class UmTextField extends textFieldBase {
-    get form() {
-        return __classPrivateFieldGet(this, _UmTextField_elementInternals, "f").form;
-    }
-    get [(_UmTextField_value = new WeakMap(), _UmTextField_elementInternals = new WeakMap(), _UmTextField_instances = new WeakSet(), supportingTextAttribute)]() {
-        return this.supportingText;
-    }
-    set [supportingTextAttribute](value) {
-        this.supportingText = value;
+import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
+let UmTextField = class UmTextField extends UmTextFieldBase {
+    constructor() {
+        super(...arguments);
+        _UmTextField_instances.add(this);
+        _UmTextField_value.set(this, '');
     }
     get value() {
         return __classPrivateFieldGet(this, _UmTextField_value, "f");
     }
     set value(value) {
         __classPrivateFieldSet(this, _UmTextField_value, value, "f");
-        __classPrivateFieldGet(this, _UmTextField_elementInternals, "f").setFormValue(value);
-    }
-    constructor() {
-        super();
-        _UmTextField_instances.add(this);
-        this.variant = config.fields.defaultAppearance;
-        this.disabled = false;
-        this.invalid = false;
-        _UmTextField_value.set(this, '');
-        _UmTextField_elementInternals.set(this, void 0);
-        __classPrivateFieldSet(this, _UmTextField_elementInternals, this.attachInternals(), "f");
+        this.elementInternals.setFormValue(value);
     }
     focus() {
         this.input.focus();
     }
-    render() {
-        const label = this.label
-            ? html `<label slot="label" id="label">${this.label}</label>`
-            : html `<slot slot="label" name="label"></slot>`;
-        const supportingText = this.supportingText
-            ? html `<span slot="supporting-text">${this.supportingText}</span>`
-            : html `<slot slot="supporting-text" name="supporting-text"></slot>`;
-        const errorText = this.errorText
-            ? html `<span slot="error-text">${this.errorText}</span>`
-            : html `<slot slot="error-text" name="error-text"></slot>`;
+    renderContent() {
         const prefix = html `<span class="prefix" slot="prefix">${this.prefixText || html `<slot name="prefix"></slot>`}</span>`;
         const suffix = html `<span class="suffix" slot="suffix">${this.suffixText || html `<slot name="suffix"></slot>`}</span>`;
-        const counter = this.counter
-            ? html `<span slot="counter">${this.counter}</span>`
-            : html `<slot slot="counter" name="counter"></slot>`;
         return html `
-      <u-field
-        .variant=${this.variant}
-        ?invalid=${this.invalid}
+      ${prefix}
+      <input
+        part="input"
+        id=${this.id || nothing}
+        aria-labelledby="label"
         ?disabled=${this.disabled}
-        ?empty=${!__classPrivateFieldGet(this, _UmTextField_value, "f")}>
-        ${label}
-        <slot slot="leading-icon" name="leading-icon"></slot>
-        ${prefix}
-        <input
-          part="input"
-          id=${this.id || nothing}
-          aria-labelledby="label"
-          ?disabled=${this.disabled}
-          placeholder=${this.placeholder || nothing}
-          .value=${live(__classPrivateFieldGet(this, _UmTextField_value, "f"))}
-          @input=${__classPrivateFieldGet(this, _UmTextField_instances, "m", _UmTextField_handleInput)} />
-        ${suffix}
-        <slot slot="trailing-icon" name="trailing-icon"></slot>
-        ${supportingText}
-        ${errorText}
-        ${counter}
-      </u-field>`;
+        placeholder=${this.placeholder || nothing}
+        .value=${live(__classPrivateFieldGet(this, _UmTextField_value, "f"))}
+        @input=${__classPrivateFieldGet(this, _UmTextField_instances, "m", _UmTextField_handleInput)} />
+      ${suffix}`;
+    }
+    get empty() {
+        return !__classPrivateFieldGet(this, _UmTextField_value, "f");
     }
 };
+_UmTextField_value = new WeakMap();
+_UmTextField_instances = new WeakSet();
 _UmTextField_handleInput = function _UmTextField_handleInput() {
     this.value = this.input.value;
 };
-UmTextField.formAssociated = true;
-UmTextField.styles = [baseStyles, styles];
-UmTextField.shadowRootOptions = {
-    ...LitElement.shadowRootOptions,
-    delegatesFocus: true,
-};
-__decorate([
-    property()
-], UmTextField.prototype, "variant", void 0);
-__decorate([
-    property()
-], UmTextField.prototype, "label", void 0);
+UmTextField.styles = [
+    UmTextFieldBase.styles,
+    styles
+];
 __decorate([
     property()
-], UmTextField.prototype, "counter", void 0);
-__decorate([
-    property({ reflect: true })
-], UmTextField.prototype, "placeholder", void 0);
-__decorate([
-    property({ attribute: 'supporting-text' })
-], UmTextField.prototype, "supportingText", void 0);
-__decorate([
-    property({ attribute: 'error-text' })
-], UmTextField.prototype, "errorText", void 0);
+], UmTextField.prototype, "value", null);
 __decorate([
     property({ attribute: 'prefix-text' })
 ], UmTextField.prototype, "prefixText", void 0);
 __decorate([
     property({ attribute: 'suffix-text' })
 ], UmTextField.prototype, "suffixText", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], UmTextField.prototype, "disabled", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], UmTextField.prototype, "invalid", void 0);
-__decorate([
-    property()
-], UmTextField.prototype, "value", null);
 __decorate([
     query('input')
 ], UmTextField.prototype, "input", void 0);

package/text-field/text-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../src/text-field/text-field.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { live } from 'lit/directives/live.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './text-field.styles.js';\n\nimport { config } from '../config.js';\nimport { mixinAttributeProperties } from '../shared/mixin-attribute-properties.js';\n\nimport '../field/field.js';\n\nconst supportingTextAttribute = 'supporting-text';\nconst errorTextAttribute = 'error-text';\nconst prefixTextAttribute = 'prefix-text';\nconst suffixTextAttribute = 'suffix-text';\n\nconst textFieldBase = mixinAttributeProperties(\n  LitElement,\n  supportingTextAttribute,\n  errorTextAttribute,\n  prefixTextAttribute,\n  suffixTextAttribute);\n\n@customElement('u-text-field')\nexport class UmTextField extends textFieldBase {\n  static readonly formAssociated = true;\n\n  static override styles = [baseStyles, styles];\n\n  static override shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @property() variant = config.fields.defaultAppearance;\n  @property() label: string | undefined;\n  @property() counter: string | undefined;\n  @property({reflect: true}) placeholder: string | undefined;\n  @property({attribute: 'supporting-text'}) supportingText: string | undefined;\n  @property({attribute: 'error-text'}) errorText: string | undefined;\n  @property({attribute: 'prefix-text'}) prefixText: string | undefined;\n  @property({attribute: 'suffix-text'}) suffixText: string | undefined;\n\n  @property({type: Boolean, reflect: true}) disabled = false;\n  @property({type: Boolean, reflect: true}) invalid = false;\n\n  #value: string = '';\n\n  get form(): HTMLFormElement | null {\n    return this.#elementInternals.form;\n  }\n\n  get [supportingTextAttribute](): string | undefined {\n    return this.supportingText;\n  }\n  set [supportingTextAttribute](value: string | undefined) {\n    this.supportingText = value;\n  }\n\n  @property()\n  get value() {\n    return this.#value;\n  }\n  set value(value: string) {\n    this.#value = value;\n    this.#elementInternals.setFormValue(value);\n  }\n\n  readonly #elementInternals: ElementInternals;\n  @query('input') input!: HTMLInputElement;\n\n  constructor() {\n    super();\n    this.#elementInternals = this.attachInternals();\n  }\n\n  override focus() {\n    this.input.focus();\n  }\n\n  protected override render(): HTMLTemplateResult {\n    const label = this.label\n      ? html`<label slot=\"label\" id=\"label\">${this.label}</label>`\n      : html`<slot slot=\"label\" name=\"label\"></slot>`;\n\n    const supportingText = this.supportingText\n      ? html`<span slot=\"supporting-text\">${this.supportingText}</span>`\n      : html`<slot slot=\"supporting-text\" name=\"supporting-text\"></slot>`;\n\n    const errorText = this.errorText\n      ? html`<span slot=\"error-text\">${this.errorText}</span>`\n      : html`<slot slot=\"error-text\" name=\"error-text\"></slot>`;\n    const prefix = html`<span class=\"prefix\" slot=\"prefix\">${this.prefixText || html`<slot name=\"prefix\"></slot>`}</span>`;\n    const suffix = html`<span class=\"suffix\" slot=\"suffix\">${this.suffixText || html`<slot name=\"suffix\"></slot>`}</span>`;\n    const counter = this.counter\n      ? html`<span slot=\"counter\">${this.counter}</span>`\n      : html`<slot slot=\"counter\" name=\"counter\"></slot>`;\n\n    return html`\n      <u-field\n        .variant=${this.variant}\n        ?invalid=${this.invalid}\n        ?disabled=${this.disabled}\n        ?empty=${!this.#value}>\n        ${label}\n        <slot slot=\"leading-icon\" name=\"leading-icon\"></slot>\n        ${prefix}\n        <input\n          part=\"input\"\n          id=${this.id || nothing}\n          aria-labelledby=\"label\"\n          ?disabled=${this.disabled}\n          placeholder=${this.placeholder || nothing}\n          .value=${live(this.#value)}\n          @input=${this.#handleInput} />\n        ${suffix}\n        <slot slot=\"trailing-icon\" name=\"trailing-icon\"></slot>\n        ${supportingText}\n        ${errorText}\n        ${counter}\n      </u-field>`;\n  }\n\n  #handleInput() {\n    this.value = this.input.value;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-text-field': UmTextField;\n  }\n}\n"]}
+{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../src/text-field/text-field.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAGxE,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,eAAe;IAAzC;;;QAOL,6BAAiB,EAAE,EAAC;IA6CtB,CAAC;IA1CC,IAAI,KAAK;QACP,OAAO,uBAAA,IAAI,0BAAO,CAAC;IACrB,CAAC;IACD,IAAI,KAAK,CAAC,KAAa;QACrB,uBAAA,IAAI,sBAAU,KAAK,MAAA,CAAC;QACpB,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC;IAOQ,KAAK;QACZ,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACrB,CAAC;IAEkB,aAAa;QAE9B,MAAM,MAAM,GAAG,IAAI,CAAA,sCAAsC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAA,6BAA6B,SAAS,CAAC;QACvH,MAAM,MAAM,GAAG,IAAI,CAAA,sCAAsC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAA,6BAA6B,SAAS,CAAC;QAEvH,OAAO,IAAI,CAAA;QACP,MAAM;;;aAGD,IAAI,CAAC,EAAE,IAAI,OAAO;;oBAEX,IAAI,CAAC,QAAQ;sBACX,IAAI,CAAC,WAAW,IAAI,OAAO;iBAChC,IAAI,CAAC,uBAAA,IAAI,0BAAO,CAAC;iBACjB,uBAAA,IAAI,wDAAa;QAC1B,MAAM,EAAE,CAAC;IACf,CAAC;IAED,IAAa,KAAK;QAChB,OAAO,CAAC,uBAAA,IAAI,0BAAO,CAAA;IACrB,CAAC;;;;;IAGC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AAChC,CAAC;AAjDe,kBAAM,GAAmB;IACvC,eAAe,CAAC,MAAM;IACtB,MAAM;CACP,AAHqB,CAGpB;AAKF;IADC,QAAQ,EAAE;wCAGV;AAMqC;IAArC,QAAQ,CAAC,EAAC,SAAS,EAAE,aAAa,EAAC,CAAC;+CAAgC;AAC/B;IAArC,QAAQ,CAAC,EAAC,SAAS,EAAE,aAAa,EAAC,CAAC;+CAAgC;AAErD;IAAf,KAAK,CAAC,OAAO,CAAC;0CAA0B;AArB9B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAoDvB","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\nimport { html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { live } from 'lit/directives/live.js';\n\nimport { styles } from './text-field.styles.js';\n\nimport { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';\n\n@customElement('u-text-field')\nexport class UmTextField extends UmTextFieldBase {\n\n  static override styles: CSSResultGroup = [\n    UmTextFieldBase.styles,\n    styles\n  ];\n\n  #value: string = '';\n\n  @property()\n  get value() {\n    return this.#value;\n  }\n  set value(value: string) {\n    this.#value = value;\n    this.elementInternals.setFormValue(value);\n  }\n\n  @property({attribute: 'prefix-text'}) prefixText: string | undefined;\n  @property({attribute: 'suffix-text'}) suffixText: string | undefined;\n\n  @query('input') input!: HTMLInputElement;\n\n  override focus() {\n    this.input.focus();\n  }\n\n  protected override renderContent(): HTMLTemplateResult {\n\n    const prefix = html`<span class=\"prefix\" slot=\"prefix\">${this.prefixText || html`<slot name=\"prefix\"></slot>`}</span>`;\n    const suffix = html`<span class=\"suffix\" slot=\"suffix\">${this.suffixText || html`<slot name=\"suffix\"></slot>`}</span>`;\n\n    return html`\n      ${prefix}\n      <input\n        part=\"input\"\n        id=${this.id || nothing}\n        aria-labelledby=\"label\"\n        ?disabled=${this.disabled}\n        placeholder=${this.placeholder || nothing}\n        .value=${live(this.#value)}\n        @input=${this.#handleInput} />\n      ${suffix}`;\n  }\n\n  override get empty(): boolean {\n    return !this.#value\n  }\n\n  #handleInput() {\n    this.value = this.input.value;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-text-field': UmTextField;\n  }\n}\n"]}

package/text-field/text-field.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.styles.d.ts","sourceRoot":"","sources":["../../src/text-field/text-field.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAqBlB,CAAC"}
+{"version":3,"file":"text-field.styles.d.ts","sourceRoot":"","sources":["../../src/text-field/text-field.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAiBlB,CAAC"}

package/text-field/text-field.styles.js

@@ -1,9 +1,5 @@
 import { css } from 'lit';
 export const styles = css `
-  :host {
-    cursor: text;
-  }
-
   .prefix {
     color: var(--u-field-prefix-color, var(--u-field-affix-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));
     margin-inline-end: var(--u-prefix-margin, var(--u-affix-margin, 2px));

package/text-field/text-field.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-field.styles.js","sourceRoot":"","sources":["../../src/text-field/text-field.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;CAqBzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    cursor: text;\n  }\n\n  .prefix {\n    color: var(--u-field-prefix-color, var(--u-field-affix-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n    margin-inline-end: var(--u-prefix-margin, var(--u-affix-margin, 2px));\n  }\n\n  .suffix {\n    color: var(--u-field-suffix-color, var(--u-field-affix-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n    margin-inline-start: var(--u-suffix-margin, var(--u-affix-margin, 2px));\n  }\n\n  :host([disabled]) .prefix {\n    color: var(--u-text-field-prefix-color, var(--u-text-field-affix-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, 0.38))));\n  }\n  :host([disabled]) .suffix {\n    color: var(--u-text-field-suffix-color, var(--u-text-field-affix-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, 0.38))));\n  }\n`;\n"]}
+{"version":3,"file":"text-field.styles.js","sourceRoot":"","sources":["../../src/text-field/text-field.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;CAiBzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  .prefix {\n    color: var(--u-field-prefix-color, var(--u-field-affix-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n    margin-inline-end: var(--u-prefix-margin, var(--u-affix-margin, 2px));\n  }\n\n  .suffix {\n    color: var(--u-field-suffix-color, var(--u-field-affix-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n    margin-inline-start: var(--u-suffix-margin, var(--u-affix-margin, 2px));\n  }\n\n  :host([disabled]) .prefix {\n    color: var(--u-text-field-prefix-color, var(--u-text-field-affix-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, 0.38))));\n  }\n  :host([disabled]) .suffix {\n    color: var(--u-text-field-suffix-color, var(--u-text-field-affix-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-field-disabled-opacity, 0.38))));\n  }\n`;\n"]}

package/typeahead/typeahead.d.ts

@@ -28,6 +28,7 @@ export declare class UmTypeahead extends LitElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected render(): HTMLTemplateResult;
+    private getTargetValue;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/typeahead/typeahead.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"typeahead.d.ts","sourceRoot":"","sources":["../../src/typeahead/typeahead.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAGzC,OAAO,gBAAgB,CAAC;AAExB,MAAM,WAAW,IAAI;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,qBACa,WAAY,SAAQ,UAAU;;IACzC,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,0BAAU;IAKhC,OAAO,CAAC,MAAM,CAA8C;IAQnD,OAAO,EAAE,IAAI,EAAE,CAAC;IAEb,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,MAAM,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IACrD,SAAS,EAAE,CAAC,CAAC,KAAK,EAAE,GAAG,KAAK,MAAM,CAAC,GAAG,SAAS,CAAC;IAEnB,QAAQ,SAAO;IACf,KAAK,SAAM;IACX,SAAS,SAAK;IACe,WAAW,UAAS;IAE1F,QAAQ,UAAS;IAEjB,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED,IAAI,KAAK,IAAI,GAAG,CAEf;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,GAAG,EAOnB;IAED,IACI,GAAG,IAAI,MAAM,GAAG,SAAS,CAE5B;IACD,IAAI,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAMhC;IAEgB,IAAI,EAAG,MAAM,CAAC;;IAOtB,iBAAiB;IAQjB,oBAAoB;cA2EV,MAAM,IAAI,kBAAkB;CAgFhD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,WAAW,CAAC;KAC5B;CACF"}
+{"version":3,"file":"typeahead.d.ts","sourceRoot":"","sources":["../../src/typeahead/typeahead.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAK3D,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAGzC,OAAO,gBAAgB,CAAC;AAExB,MAAM,WAAW,IAAI;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,qBACa,WAAY,SAAQ,UAAU;;IACzC,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,0BAAU;IAKhC,OAAO,CAAC,MAAM,CAAwE;IAQ7E,OAAO,EAAE,IAAI,EAAE,CAAC;IAEb,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,MAAM,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IACrD,SAAS,EAAE,CAAC,CAAC,KAAK,EAAE,GAAG,KAAK,MAAM,CAAC,GAAG,SAAS,CAAC;IAEnB,QAAQ,SAAO;IACf,KAAK,SAAM;IACX,SAAS,SAAK;IACe,WAAW,UAAS;IAE1F,QAAQ,UAAS;IAEjB,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED,IAAI,KAAK,IAAI,GAAG,CAEf;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,GAAG,EAOnB;IAED,IACI,GAAG,IAAI,MAAM,GAAG,SAAS,CAE5B;IACD,IAAI,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAMhC;IAEgB,IAAI,EAAG,MAAM,CAAC;;IAOtB,iBAAiB;IAQjB,oBAAoB;cAwFV,MAAM,IAAI,kBAAkB;IAqF/C,OAAO,CAAC,cAAc;CAGvB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,WAAW,CAAC;KAC5B;CACF"}

package/typeahead/typeahead.js

@@ -69,7 +69,7 @@ let UmTypeahead = class UmTypeahead extends LitElement {
             if (__classPrivateFieldGet(this, _UmTypeahead_debounceTimeout, "f")) {
                 clearTimeout(__classPrivateFieldGet(this, _UmTypeahead_debounceTimeout, "f"));
             }
-            __classPrivateFieldGet(this, _UmTypeahead_instances, "m", _UmTypeahead_setValueAndDispatchEvents).call(this, this.editable ? this.target.value : null, true);
+            __classPrivateFieldGet(this, _UmTypeahead_instances, "m", _UmTypeahead_setValueAndDispatchEvents).call(this, this.editable ? this.getTargetValue() : null, true);
             __classPrivateFieldSet(this, _UmTypeahead_debounceTimeout, setTimeout(async () => await __classPrivateFieldGet(this, _UmTypeahead_instances, "m", _UmTypeahead_updateResults).call(this, true), this.debounce), "f");
         });
         __classPrivateFieldSet(this, _UmTypeahead_elementInternals, this.attachInternals(), "f");
@@ -104,6 +104,9 @@ let UmTypeahead = class UmTypeahead extends LitElement {
       </u-menu>
     `;
     }
+    getTargetValue() {
+        return this.target.input?.value ?? this.target.value;
+    }
 };
 _UmTypeahead_for = new WeakMap();
 _UmTypeahead_connected = new WeakMap();
@@ -141,7 +144,17 @@ _UmTypeahead_detach = function _UmTypeahead_detach() {
     this.target?.removeEventListener('focus', __classPrivateFieldGet(this, _UmTypeahead_handleFocus, "f"));
 };
 _UmTypeahead_getItemClickHandler = function _UmTypeahead_getItemClickHandler(data) {
-    return () => __classPrivateFieldGet(this, _UmTypeahead_instances, "m", _UmTypeahead_setValueAndDispatchEvents).call(this, data.value);
+    return () => {
+        const selectedEvent = new CustomEvent('selected', {
+            cancelable: true,
+            detail: data.value
+        });
+        this.dispatchEvent(selectedEvent);
+        if (selectedEvent.defaultPrevented) {
+            return;
+        }
+        __classPrivateFieldGet(this, _UmTypeahead_instances, "m", _UmTypeahead_setValueAndDispatchEvents).call(this, data.value);
+    };
 };
 _UmTypeahead_setValueAndDispatchEvents = function _UmTypeahead_setValueAndDispatchEvents(value, direct = false) {
     if (!direct) {
@@ -155,7 +168,7 @@ _UmTypeahead_setValueAndDispatchEvents = function _UmTypeahead_setValueAndDispat
     this.dispatchEvent(new Event('change', { bubbles: true }));
 };
 _UmTypeahead_updateResults = async function _UmTypeahead_updateResults(lazy = false) {
-    const term = this.target.value;
+    const term = this.getTargetValue();
     const termNormalized = normalizeText(term).toLowerCase();
     if (lazy && termNormalized === __classPrivateFieldGet(this, _UmTypeahead_termNormalized, "f")) {
         return;
@@ -199,7 +212,12 @@ _UmTypeahead_setValueOnTarget = function _UmTypeahead_setValueOnTarget() {
     const value = this.formatter
         ? this.formatter(this.value)
         : this.value;
-    this.target.value = value;
+    if (this.target.input) {
+        this.target.input.value = value;
+    }
+    else {
+        this.target.value = value;
+    }
     __classPrivateFieldSet(this, _UmTypeahead_termNormalized, normalizeText(value)?.toLowerCase(), "f");
 };
 UmTypeahead.formAssociated = true;

package/typeahead/typeahead.js.map

@@ -1 +1 @@
-{"version":3,"file":"typeahead.js","sourceRoot":"","sources":["../../src/typeahead/typeahead.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\n\nimport { styles } from './typeahead.styles.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { normalizeText } from '../shared/normalize-text.js';\n\nimport './highlight.js';\n\nexport interface Data {\n  label: string;\n  value: any;\n}\n\n@customElement('u-typeahead')\nexport class UmTypeahead extends LitElement {\n  static readonly formAssociated = true;\n\n  static override styles = styles;\n\n  #for: string | undefined;\n\n  #connected = false;\n  private target: HTMLElement & {value: string} | null = null;\n  #documentMutationObserver: MutationObserver | null = null;\n  #termNormalized: string = '';\n  #debounceTimeout: number | null = null;\n  #value: any;\n  readonly #elementInternals: ElementInternals;\n\n  // @ts-ignore\n  @state() results: Data[];\n\n  @property() source: (any[] | (() => Promise<any[]>)) | undefined;\n  @property() formatter: ((value: any) => string) | undefined;\n\n  @property({type: Number, reflect: true}) debounce = 300;\n  @property({type: Number, reflect: true}) limit = 10;\n  @property({type: Number, reflect: true}) minLength = 2;\n  @property({type: Boolean, attribute: 'open-on-focus', reflect: true}) openOnFocus = false;\n  @property({type: Boolean, reflect: true})\n  editable = false;\n\n  get form(): HTMLFormElement | null {\n    return this.#elementInternals.form;\n  }\n\n  get value(): any {\n    return this.#value;\n  }\n  set value(value: any) {\n    this.#value = value;\n    this.#elementInternals.setFormValue(value);\n\n    if (this.#connected) {\n      this.#setValueOnTarget();\n    }\n  }\n\n  @property({reflect: true})\n  get for(): string | undefined {\n    return this.#for;\n  }\n  set for(value: string | undefined) {\n    this.#for = value;\n\n    if (this.#connected) {\n      this.#attach();\n    }\n  }\n\n  @query('u-menu') menu!: UmMenu;\n\n  constructor() {\n    super();\n    this.#elementInternals = this.attachInternals();\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.#connected = true;\n    this.#attach();\n    this.#documentMutationObserver = new MutationObserver(() => this.#attach())\n    this.#documentMutationObserver.observe(document, {attributes: true, childList: true});\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#connected = false;\n    this.#detach();\n    this.#documentMutationObserver!.disconnect();\n    this.#documentMutationObserver = null;\n  }\n\n  #attach() {\n    if (!this.for) {\n      this.#detach();\n      return;\n    }\n\n    const newTarget = document.getElementById(this.for) as HTMLInputElement;\n\n    if (newTarget === this.target) {\n      return;\n    }\n\n    this.#detach();\n\n    if (!newTarget) {\n      return;\n    }\n\n    // @ts-ignore\n    this.target = newTarget;\n\n    newTarget.addEventListener('input', this.#handleInput);\n    newTarget.addEventListener('focus', this.#handleFocus);\n\n    if (this.value) {\n      this.#setValueOnTarget();\n    }\n  }\n\n  #detach() {\n    this.target?.removeEventListener('input', this.#handleInput);\n    this.target?.removeEventListener('focus', this.#handleFocus);\n  }\n\n  #handleFocus = async () => {\n    if (this.openOnFocus) {\n      await this.#updateResults();\n    }\n  }\n\n  #handleInput = () => {\n    if (this.#debounceTimeout) {\n      clearTimeout(this.#debounceTimeout);\n    }\n\n    this.#setValueAndDispatchEvents(this.editable ? this.target!.value : null, true);\n\n    this.#debounceTimeout = setTimeout(async () => await this.#updateResults(true), this.debounce);\n  }\n\n  #getItemClickHandler(data: Data) {\n    return () => this.#setValueAndDispatchEvents(data.value)\n  }\n\n  #setValueAndDispatchEvents(value: any, direct = false) {\n\n    if (!direct) {\n      this.value = value;\n    } else {\n      this.#value = value;\n      this.#elementInternals.setFormValue(value);\n    }\n\n    this.dispatchEvent(new InputEvent('input', {bubbles: true, composed: true}));\n    this.dispatchEvent(new Event('change', {bubbles: true}));\n  }\n\n  protected override render(): HTMLTemplateResult {\n    console.log('render');\n\n    if (!this.results?.length) {\n      return html``;\n    }\n\n    setTimeout(() => this.menu.open = true, 200);\n    return html`\n      <u-menu manualFocus>\n        ${this.results\n          .map(result => html`\n            <u-menu-item @click=${this.#getItemClickHandler(result)}>\n              <u-highlight .term=${this.#termNormalized} .result=${result.label}></u-highlight>\n            </u-menu-item>`)}\n      </u-menu>\n    `;\n  }\n\n  async #updateResults(lazy = false) {\n\n    const term = this.target!.value;\n\n    const termNormalized = normalizeText(term).toLowerCase();\n\n    if (lazy && termNormalized === this.#termNormalized) {\n      return;\n    }\n\n    this.#termNormalized = termNormalized;\n\n    if (termNormalized.length < this.minLength) {\n      this.results = [];\n      return;\n    }\n\n    const data = await this.#getData();\n    this.results = data\n      .filter(t => normalizeText(t.label)\n        .toLowerCase()\n        .includes(termNormalized));\n    this.results = this.results.slice(0, this.limit || this.results.length);\n  }\n\n  async #getData(): Promise<Data[]> {\n    if (!this.source) {\n      return [];\n    }\n\n    let values: any[]\n\n    if (this.source instanceof Array) {\n      values = this.source;\n    } else {\n      const source = this.source as (() => Promise<any[]>);\n      values = await source();\n    }\n\n    return values\n      .map(source => ({\n        label: this.formatter\n          ? this.formatter(source)\n          : source.toString(),\n        value: source\n      }));\n  }\n\n  #setValueOnTarget() {\n    if (!this.target) {\n      return;\n    }\n\n    const value = this.formatter\n      ? this.formatter(this.value)\n      : this.value;\n\n    this.target.value = value;\n\n    this.#termNormalized = normalizeText(value)?.toLowerCase();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-typeahead': UmTypeahead;\n  }\n}\n"]}
+{"version":3,"file":"typeahead.js","sourceRoot":"","sources":["../../src/typeahead/typeahead.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\n\nimport { styles } from './typeahead.styles.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { normalizeText } from '../shared/normalize-text.js';\n\nimport './highlight.js';\n\nexport interface Data {\n  label: string;\n  value: any;\n}\n\n@customElement('u-typeahead')\nexport class UmTypeahead extends LitElement {\n  static readonly formAssociated = true;\n\n  static override styles = styles;\n\n  #for: string | undefined;\n\n  #connected = false;\n  private target: HTMLElement & {input?: HTMLInputElement; value: string} | null = null;\n  #documentMutationObserver: MutationObserver | null = null;\n  #termNormalized: string = '';\n  #debounceTimeout: number | null = null;\n  #value: any;\n  readonly #elementInternals: ElementInternals;\n\n  // @ts-ignore\n  @state() results: Data[];\n\n  @property() source: (any[] | (() => Promise<any[]>)) | undefined;\n  @property() formatter: ((value: any) => string) | undefined;\n\n  @property({type: Number, reflect: true}) debounce = 300;\n  @property({type: Number, reflect: true}) limit = 10;\n  @property({type: Number, reflect: true}) minLength = 2;\n  @property({type: Boolean, attribute: 'open-on-focus', reflect: true}) openOnFocus = false;\n  @property({type: Boolean, reflect: true})\n  editable = false;\n\n  get form(): HTMLFormElement | null {\n    return this.#elementInternals.form;\n  }\n\n  get value(): any {\n    return this.#value;\n  }\n  set value(value: any) {\n    this.#value = value;\n    this.#elementInternals.setFormValue(value);\n\n    if (this.#connected) {\n      this.#setValueOnTarget();\n    }\n  }\n\n  @property({reflect: true})\n  get for(): string | undefined {\n    return this.#for;\n  }\n  set for(value: string | undefined) {\n    this.#for = value;\n\n    if (this.#connected) {\n      this.#attach();\n    }\n  }\n\n  @query('u-menu') menu!: UmMenu;\n\n  constructor() {\n    super();\n    this.#elementInternals = this.attachInternals();\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.#connected = true;\n    this.#attach();\n    this.#documentMutationObserver = new MutationObserver(() => this.#attach())\n    this.#documentMutationObserver.observe(document, {attributes: true, childList: true});\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#connected = false;\n    this.#detach();\n    this.#documentMutationObserver!.disconnect();\n    this.#documentMutationObserver = null;\n  }\n\n  #attach() {\n    if (!this.for) {\n      this.#detach();\n      return;\n    }\n\n    const newTarget = document.getElementById(this.for) as HTMLInputElement;\n\n    if (newTarget === this.target) {\n      return;\n    }\n\n    this.#detach();\n\n    if (!newTarget) {\n      return;\n    }\n\n    // @ts-ignore\n    this.target = newTarget;\n\n    newTarget.addEventListener('input', this.#handleInput);\n    newTarget.addEventListener('focus', this.#handleFocus);\n\n    if (this.value) {\n      this.#setValueOnTarget();\n    }\n  }\n\n  #detach() {\n    this.target?.removeEventListener('input', this.#handleInput);\n    this.target?.removeEventListener('focus', this.#handleFocus);\n  }\n\n  #handleFocus = async () => {\n    if (this.openOnFocus) {\n      await this.#updateResults();\n    }\n  }\n\n  #handleInput = () => {\n    if (this.#debounceTimeout) {\n      clearTimeout(this.#debounceTimeout);\n    }\n\n    this.#setValueAndDispatchEvents(this.editable ? this.getTargetValue() : null, true);\n\n    this.#debounceTimeout = setTimeout(async () => await this.#updateResults(true), this.debounce);\n  }\n\n  #getItemClickHandler(data: Data) {\n    return () => {\n      const selectedEvent = new CustomEvent('selected', {\n        cancelable: true,\n        detail: data.value\n      });\n\n      this.dispatchEvent(selectedEvent);\n\n      if (selectedEvent.defaultPrevented) {\n        return;\n      }\n\n      this.#setValueAndDispatchEvents(data.value);\n    }\n  }\n\n  #setValueAndDispatchEvents(value: any, direct = false) {\n\n    if (!direct) {\n      this.value = value;\n    } else {\n      this.#value = value;\n      this.#elementInternals.setFormValue(value);\n    }\n\n    this.dispatchEvent(new InputEvent('input', {bubbles: true, composed: true}));\n    this.dispatchEvent(new Event('change', {bubbles: true}));\n  }\n\n  protected override render(): HTMLTemplateResult {\n    console.log('render');\n\n    if (!this.results?.length) {\n      return html``;\n    }\n\n    setTimeout(() => this.menu.open = true, 200);\n    return html`\n      <u-menu manualFocus>\n        ${this.results\n          .map(result => html`\n            <u-menu-item @click=${this.#getItemClickHandler(result)}>\n              <u-highlight .term=${this.#termNormalized} .result=${result.label}></u-highlight>\n            </u-menu-item>`)}\n      </u-menu>\n    `;\n  }\n\n  async #updateResults(lazy = false) {\n\n    const term = this.getTargetValue();\n\n    const termNormalized = normalizeText(term).toLowerCase();\n\n    if (lazy && termNormalized === this.#termNormalized) {\n      return;\n    }\n\n    this.#termNormalized = termNormalized;\n\n    if (termNormalized.length < this.minLength) {\n      this.results = [];\n      return;\n    }\n\n    const data = await this.#getData();\n    this.results = data\n      .filter(t => normalizeText(t.label)\n        .toLowerCase()\n        .includes(termNormalized));\n    this.results = this.results.slice(0, this.limit || this.results.length);\n  }\n\n  async #getData(): Promise<Data[]> {\n    if (!this.source) {\n      return [];\n    }\n\n    let values: any[]\n\n    if (this.source instanceof Array) {\n      values = this.source;\n    } else {\n      const source = this.source as (() => Promise<any[]>);\n      values = await source();\n    }\n\n    return values\n      .map(source => ({\n        label: this.formatter\n          ? this.formatter(source)\n          : source.toString(),\n        value: source\n      }));\n  }\n\n  #setValueOnTarget() {\n    if (!this.target) {\n      return;\n    }\n\n    const value = this.formatter\n      ? this.formatter(this.value)\n      : this.value;\n\n    if (this.target!.input) {\n      this.target.input.value = value;\n    } else {\n      this.target.value = value;\n    }\n\n    this.#termNormalized = normalizeText(value)?.toLowerCase();\n  }\n\n  private getTargetValue(): string {\n    return this.target!.input?.value ?? this.target!.value;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-typeahead': UmTypeahead;\n  }\n}\n"]}