@universal-material/web 3.0.35 → 3.0.37

package/shared/normalize-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"normalize-text.d.ts","sourceRoot":"","sources":["../../src/shared/normalize-text.ts"],"names":[],"mappings":"AAAA,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAQlD"}

package/shared/normalize-text.js

@@ -0,0 +1,9 @@
+export function normalizeText(text) {
+    if (!text) {
+        return text;
+    }
+    return text
+        .normalize('NFD')
+        .replace(/[\u0300-\u036f]/g, '');
+}
+//# sourceMappingURL=normalize-text.js.map

package/shared/normalize-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"normalize-text.js","sourceRoot":"","sources":["../../src/shared/normalize-text.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,aAAa,CAAC,IAAY;IACxC,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,IAAI;SACR,SAAS,CAAC,KAAK,CAAC;SAChB,OAAO,CAAC,kBAAkB,EAAE,EAAE,CAAC,CAAC;AACrC,CAAC","sourcesContent":["export function normalizeText(text: string): string {\n  if (!text) {\n    return text;\n  }\n\n  return text\n    .normalize('NFD')\n    .replace(/[\\u0300-\\u036f]/g, '');\n}\n"]}

package/shared/redispatch-event.d.ts

@@ -0,0 +1,2 @@
+export declare function redispatchEvent(element: Element, event: Event): boolean;
+//# sourceMappingURL=redispatch-event.d.ts.map

package/shared/redispatch-event.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"redispatch-event.d.ts","sourceRoot":"","sources":["../../src/shared/redispatch-event.ts"],"names":[],"mappings":"AAAA,wBAAgB,eAAe,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,WAe7D"}

package/shared/redispatch-event.js

@@ -0,0 +1,14 @@
+export function redispatchEvent(element, event) {
+    // For bubbling events in SSR light DOM (or composed), stop their propagation
+    // and dispatch the copy.
+    if (event.bubbles && (!element.shadowRoot || event.composed)) {
+        event.stopPropagation();
+    }
+    const copy = Reflect.construct(event.constructor, [event.type, event]);
+    const dispatched = element.dispatchEvent(copy);
+    if (!dispatched) {
+        event.preventDefault();
+    }
+    return dispatched;
+}
+//# sourceMappingURL=redispatch-event.js.map

package/shared/redispatch-event.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"redispatch-event.js","sourceRoot":"","sources":["../../src/shared/redispatch-event.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,eAAe,CAAC,OAAgB,EAAE,KAAY;IAC5D,6EAA6E;IAC7E,yBAAyB;IACzB,IAAI,KAAK,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,UAAU,IAAI,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC7D,KAAK,CAAC,eAAe,EAAE,CAAC;IAC1B,CAAC;IAED,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;IACvE,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAE/C,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC;IAED,OAAO,UAAU,CAAC;AACpB,CAAC","sourcesContent":["export function redispatchEvent(element: Element, event: Event) {\n  // For bubbling events in SSR light DOM (or composed), stop their propagation\n  // and dispatch the copy.\n  if (event.bubbles && (!element.shadowRoot || event.composed)) {\n    event.stopPropagation();\n  }\n\n  const copy = Reflect.construct(event.constructor, [event.type, event]);\n  const dispatched = element.dispatchEvent(copy);\n\n  if (!dispatched) {\n    event.preventDefault();\n  }\n\n  return dispatched;\n}\n"]}

package/shared/selection-control/selection-control-list-item.d.ts

@@ -1,5 +1,4 @@
+import { MixinBase, MixinReturn } from '../mixin.js';
 import { UmSelectionControl } from './selection-control.js';
-export type MixinBase<ExpectedBase = object> = abstract new (...args: any[]) => ExpectedBase;
-export type MixinReturn<MixinBase, MixinClass = object> = (abstract new (...args: any[]) => MixinClass) & MixinBase;
-export declare const mixinSelectionControlListItem: <T extends MixinBase<UmSelectionControl>>(base: T) => MixinReturn<T, object>;
+export declare const mixinSelectionControlListItem: <T extends MixinBase<UmSelectionControl>>(base: T) => MixinReturn<T>;
 //# sourceMappingURL=selection-control-list-item.d.ts.map

package/shared/selection-control/selection-control-list-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control-list-item.d.ts","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control-list-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5D,MAAM,MAAM,SAAS,CAAC,YAAY,GAAG,MAAM,IAAI,QAAQ,MAGrD,GAAG,IAAI,EAAE,GAAG,EAAE,KACX,YAAY,CAAC;AAElB,MAAM,MAAM,WAAW,CAAC,SAAS,EAAE,UAAU,GAAG,MAAM,IAGpD,CAAC,QAAQ,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,UAAU,CAAC,GAAG,SAAS,CAAC;AAG5D,eAAO,MAAM,6BAA6B,8EAuBzC,CAAA"}
+{"version":3,"file":"selection-control-list-item.d.ts","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control-list-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAG5D,eAAO,MAAM,6BAA6B,sEAuBzC,CAAA"}

package/shared/selection-control/selection-control-list-item.js

@@ -5,12 +5,12 @@ export const mixinSelectionControlListItem = (base) => {
     class SelectionControlListItem extends base {
         render() {
             return html `
-        <u-list-item ?selectable=${!this.disabled}>
-          <slot></slot>
-          <div slot="trailing">
-            ${super.render()}
-          </div>
-        </u-list-item>`;
+          <u-list-item ?selectable=${!this.disabled}>
+            <label for="input"><slot></slot></label>
+            <div slot="trailing">
+              ${super.render()}
+            </div>
+          </u-list-item>`;
         }
     }
     SelectionControlListItem.styles = [

package/shared/selection-control/selection-control-list-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control-list-item.js","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control-list-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkC,MAAM,KAAK,CAAC;AAehE,aAAa;AACb,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAA0C,IAAO,EAAkB,EAAE;IAChH,aAAa;IACb,MAAe,wBAAyB,SAAQ,IAAI;QASzC,MAAM;YACb,OAAO,IAAI,CAAA;mCACkB,CAAC,IAAI,CAAC,QAAQ;;;cAGnC,KAAK,CAAC,MAAM,EAAE;;uBAEL,CAAC;QACpB,CAAC;;IAhBM,+BAAM,GAAG;QACb,IAAqC,CAAC,MAAM,IAAI,EAAE;QACnD,GAAG,CAAA;;;QAGD;KACH,CAAC;IAaJ,OAAO,wBAAwB,CAAC;AAClC,CAAC,CAAA","sourcesContent":["import { css, html, HTMLTemplateResult, LitElement } from 'lit';\n\nimport { UmSelectionControl } from './selection-control.js';\n\nexport type MixinBase<ExpectedBase = object> = abstract new (\n  // Mixins must have a constructor with `...args: any[]`\n  // @ts-ignore\n  ...args: any[]\n) => ExpectedBase;\n\nexport type MixinReturn<MixinBase, MixinClass = object> =\n// Mixins must have a constructor with `...args: any[]`\n// tslint:disable-next-line:no-any\n  (abstract new (...args: any[]) => MixinClass) & MixinBase;\n\n// @ts-ignore\nexport const mixinSelectionControlListItem = <T extends MixinBase<UmSelectionControl>>(base: T): MixinReturn<T> => {\n  // @ts-ignore\n  abstract class SelectionControlListItem extends base {\n    static styles = [\n      (base as unknown as typeof LitElement).styles ?? [],\n      css`:host {\n        --u-list-item-block-padding: 0;\n        display: block;\n      }`\n    ];\n\n    override render(): HTMLTemplateResult {\n      return html`\n        <u-list-item ?selectable=${!this.disabled}>\n          <slot></slot>\n          <div slot=\"trailing\">\n            ${super.render()}\n          </div>\n        </u-list-item>`;\n    }\n  }\n\n  return SelectionControlListItem;\n}\n"]}
+{"version":3,"file":"selection-control-list-item.js","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control-list-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkC,MAAM,KAAK,CAAC;AAKhE,aAAa;AACb,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAA0C,IAAO,EAAkB,EAAE;IAChH,aAAa;IACb,MAAe,wBAAyB,SAAQ,IAAI;QASzC,MAAM;YACb,OAAO,IAAI,CAAA;qCACoB,CAAC,IAAI,CAAC,QAAQ;;;gBAGnC,KAAK,CAAC,MAAM,EAAE;;yBAEL,CAAC;QACtB,CAAC;;IAhBM,+BAAM,GAAG;QACb,IAAqC,CAAC,MAAM,IAAI,EAAE;QACnD,GAAG,CAAA;;;QAGD;KACH,CAAC;IAaJ,OAAO,wBAAwB,CAAC;AAClC,CAAC,CAAA","sourcesContent":["import { css, html, HTMLTemplateResult, LitElement } from 'lit';\n\nimport { MixinBase, MixinReturn } from '../mixin.js';\nimport { UmSelectionControl } from './selection-control.js';\n\n// @ts-ignore\nexport const mixinSelectionControlListItem = <T extends MixinBase<UmSelectionControl>>(base: T): MixinReturn<T> => {\n  // @ts-ignore\n  abstract class SelectionControlListItem extends base {\n    static styles = [\n      (base as unknown as typeof LitElement).styles ?? [],\n      css`:host {\n        --u-list-item-block-padding: 0;\n        display: block;\n      }`\n    ];\n\n    override render(): HTMLTemplateResult {\n      return html`\n          <u-list-item ?selectable=${!this.disabled}>\n            <label for=\"input\"><slot></slot></label>\n            <div slot=\"trailing\">\n              ${super.render()}\n            </div>\n          </u-list-item>`;\n    }\n  }\n\n  return SelectionControlListItem;\n}\n"]}

package/shared/selection-control/selection-control.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control.d.ts","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAGpE,OAAO,wBAAwB,CAAC;AAEhC,8BAAsB,kBAAmB,SAAQ,UAAU;;IACzD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,SAAS,CAAC,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;IAE1C,IAAI,EAAE,MAAM,GAAG,SAAS,CAAM;IACA,QAAQ,UAAS;IAC3C,KAAK,EAAG,gBAAgB,CAAC;IAKzC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAGD,SAAS,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAc;IACvD,SAAS,CAAC,YAAY,UAAQ;IAE9B,SAAS,CAAC,QAAQ,CAAC,eAAe,IAAI,kBAAkB;IAExD;;OAEG;IACS,KAAK,SAAQ;IAEzB,IACI,OAAO,IAGQ,OAAO,CADzB;IACD,IAAI,OAAO,CAAC,KAAK,EAAE,OAAO,EAGzB;IAED,SAAS;IAKA,iBAAiB;IAKjB,oBAAoB;cAKV,MAAM,IAAI,kBAAkB;CAoBhD"}
+{"version":3,"file":"selection-control.d.ts","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAGpE,OAAO,wBAAwB,CAAC;AAEhC,8BAAsB,kBAAmB,SAAQ,UAAU;;IACzD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,SAAS,CAAC,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;IAE1C,IAAI,EAAE,MAAM,GAAG,SAAS,CAAM;IACA,QAAQ,UAAS;IAC3C,KAAK,EAAG,gBAAgB,CAAC;IAKzC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAGD,SAAS,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAc;IACvD,SAAS,CAAC,YAAY,UAAQ;IAE9B,SAAS,CAAC,QAAQ,CAAC,eAAe,IAAI,kBAAkB;IAExD;;OAEG;IACS,KAAK,SAAQ;IAEzB,IACI,OAAO,IAGQ,OAAO,CADzB;IACD,IAAI,OAAO,CAAC,KAAK,EAAE,OAAO,EAGzB;IAED,SAAS;IAKA,iBAAiB;IAKjB,oBAAoB;cAKV,MAAM,IAAI,kBAAkB;CA0BhD"}

package/shared/selection-control/selection-control.js

@@ -60,17 +60,22 @@ export class UmSelectionControl extends LitElement {
       <div class="container">
         ${this.renderRipple ? ripple : nothing}
         <input
+          id="input"
           type=${this.inputType}
           class="focus-ring"
-          ?name=${this.name}
+          .name=${this.name}
           .checked=${__classPrivateFieldGet(this, _UmSelectionControl_checked, "f")}
           .disabled=${this.disabled} />
         <div class="indicator-container">${this.renderIndicator()}</div>
       </div>`;
     }
 }
-_UmSelectionControl_checked = new WeakMap(), _UmSelectionControl_instances = new WeakSet(), _UmSelectionControl_handleClick = function _UmSelectionControl_handleClick() {
+_UmSelectionControl_checked = new WeakMap(), _UmSelectionControl_instances = new WeakSet(), _UmSelectionControl_handleClick = function _UmSelectionControl_handleClick(e) {
+    if (e.defaultPrevented) {
+        return;
+    }
     this.checked = this.inputType === 'radio' || !this.checked;
+    this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
     this.dispatchEvent(new Event('change', { bubbles: true }));
 };
 UmSelectionControl.formAssociated = true;

package/shared/selection-control/selection-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,wBAAwB,CAAC;AAEhC,MAAM,OAAgB,kBAAmB,SAAQ,UAAU;IASzD,2BAA2B;IAC3B,oBAAoB;IAEpB,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC;IACpC,CAAC;IAcD,IAAI,OAAO;QACT,OAAO,uBAAA,IAAI,mCAAS,CAAC;IACvB,CAAC;IACD,IAAI,OAAO,CAAC,KAAc;QACxB,uBAAA,IAAI,+BAAY,KAAK,MAAA,CAAC;QACtB,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAChE,CAAC;IAED;QACE,KAAK,EAAE,CAAC;;QAhCE,SAAI,GAAuB,EAAE,CAAC;QACA,aAAQ,GAAG,KAAK,CAAC;QAU3D,sCAAW,KAAK,EAAC;QACP,cAAS,GAAyB,UAAU,CAAC;QAC7C,iBAAY,GAAG,IAAI,CAAC;QAI9B;;WAEG;QACS,UAAK,GAAG,IAAI,CAAC;QAavB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IACjD,CAAC;IAEQ,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,uBAAA,IAAI,sEAAa,CAAC,CAAC;IACpD,CAAC;IAEQ,oBAAoB;QAC3B,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,uBAAA,IAAI,sEAAa,CAAC,CAAA;IACtD,CAAC;IAEkB,MAAM;QACvB,MAAM,MAAM,GAAG,IAAI,CAAA,uBAAuB,IAAI,CAAC,QAAQ,cAAc,CAAC;QAEtE,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;iBAE7B,IAAI,CAAC,SAAS;;kBAEb,IAAI,CAAC,IAAI;qBACN,uBAAA,IAAI,mCAAS;sBACZ,IAAI,CAAC,QAAQ;2CACQ,IAAI,CAAC,eAAe,EAAE;aACpD,CAAC;IACZ,CAAC;;;IAGC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;IAC3D,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;AAC3D,CAAC;AArEe,iCAAc,GAAG,IAAI,AAAP,CAAQ;AAI1B;IAAX,QAAQ,EAAE;gDAA+B;AACA;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDAAkB;AAC3C;IAAf,KAAK,CAAC,OAAO,CAAC;iDAA0B;AAkB7B;IAAX,QAAQ,EAAE;iDAAc;AAGzB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;iDAGzB","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../../ripple/ripple.js';\n\nexport abstract class UmSelectionControl extends LitElement {\n  static readonly formAssociated = true;\n\n  protected readonly elementInternals: ElementInternals;\n\n  @property() name: string | undefined = '';\n  @property({type: Boolean, reflect: true}) disabled = false;\n  @query('input') input!: HTMLInputElement;\n\n  // eslint-disable-next-line\n  // #value: any = '';\n\n  get form(): HTMLFormElement | null {\n    return this.elementInternals.form;\n  }\n\n  #checked = false;\n  protected inputType: 'checkbox' | 'radio' = 'checkbox';\n  protected renderRipple = true;\n\n  protected abstract renderIndicator(): HTMLTemplateResult;\n\n  /**\n   * The element value to use in form submission when checked.\n   */\n  @property() value = 'on';\n\n  @property({type: Boolean})\n  get checked() {\n    return this.#checked;\n  }\n  set checked(value: boolean) {\n    this.#checked = value;\n    this.elementInternals.setFormValue(value ? this.value : null);\n  }\n\n  protected constructor() {\n    super();\n    this.elementInternals = this.attachInternals();\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('click', this.#handleClick);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#handleClick)\n  }\n\n  protected override render(): HTMLTemplateResult {\n    const ripple = html`<u-ripple ?disabled=${this.disabled}></u-ripple>`;\n\n    return html`\n      <div class=\"container\">\n        ${this.renderRipple ? ripple : nothing}\n        <input\n          type=${this.inputType}\n          class=\"focus-ring\"\n          ?name=${this.name}\n          .checked=${this.#checked}\n          .disabled=${this.disabled} />\n        <div class=\"indicator-container\">${this.renderIndicator()}</div>\n      </div>`;\n  }\n\n  #handleClick() {\n    this.checked = this.inputType === 'radio' || !this.checked;\n    this.dispatchEvent(new Event('change', {bubbles: true}));\n  }\n}\n"]}
+{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,wBAAwB,CAAC;AAEhC,MAAM,OAAgB,kBAAmB,SAAQ,UAAU;IASzD,2BAA2B;IAC3B,oBAAoB;IAEpB,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC;IACpC,CAAC;IAcD,IAAI,OAAO;QACT,OAAO,uBAAA,IAAI,mCAAS,CAAC;IACvB,CAAC;IACD,IAAI,OAAO,CAAC,KAAc;QACxB,uBAAA,IAAI,+BAAY,KAAK,MAAA,CAAC;QACtB,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAChE,CAAC;IAED;QACE,KAAK,EAAE,CAAC;;QAhCE,SAAI,GAAuB,EAAE,CAAC;QACA,aAAQ,GAAG,KAAK,CAAC;QAU3D,sCAAW,KAAK,EAAC;QACP,cAAS,GAAyB,UAAU,CAAC;QAC7C,iBAAY,GAAG,IAAI,CAAC;QAI9B;;WAEG;QACS,UAAK,GAAG,IAAI,CAAC;QAavB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IACjD,CAAC;IAEQ,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,uBAAA,IAAI,sEAAa,CAAC,CAAC;IACpD,CAAC;IAEQ,oBAAoB;QAC3B,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,uBAAA,IAAI,sEAAa,CAAC,CAAA;IACtD,CAAC;IAEkB,MAAM;QACvB,MAAM,MAAM,GAAG,IAAI,CAAA,uBAAuB,IAAI,CAAC,QAAQ,cAAc,CAAC;QAEtE,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;;iBAG7B,IAAI,CAAC,SAAS;;kBAEb,IAAI,CAAC,IAAI;qBACN,uBAAA,IAAI,mCAAS;sBACZ,IAAI,CAAC,QAAQ;2CACQ,IAAI,CAAC,eAAe,EAAE;aACpD,CAAC;IACZ,CAAC;;uKAEY,CAAQ;IACnB,IAAI,CAAC,CAAC,gBAAgB,EAAE,CAAC;QACvB,OAAO;IACT,CAAC;IAED,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;IAC3D,IAAI,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,OAAO,EAAE,EAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;IAC7E,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;AAC3D,CAAC;AA3Ee,iCAAc,GAAG,IAAI,AAAP,CAAQ;AAI1B;IAAX,QAAQ,EAAE;gDAA+B;AACA;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDAAkB;AAC3C;IAAf,KAAK,CAAC,OAAO,CAAC;iDAA0B;AAkB7B;IAAX,QAAQ,EAAE;iDAAc;AAGzB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;iDAGzB","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../../ripple/ripple.js';\n\nexport abstract class UmSelectionControl extends LitElement {\n  static readonly formAssociated = true;\n\n  protected readonly elementInternals: ElementInternals;\n\n  @property() name: string | undefined = '';\n  @property({type: Boolean, reflect: true}) disabled = false;\n  @query('input') input!: HTMLInputElement;\n\n  // eslint-disable-next-line\n  // #value: any = '';\n\n  get form(): HTMLFormElement | null {\n    return this.elementInternals.form;\n  }\n\n  #checked = false;\n  protected inputType: 'checkbox' | 'radio' = 'checkbox';\n  protected renderRipple = true;\n\n  protected abstract renderIndicator(): HTMLTemplateResult;\n\n  /**\n   * The element value to use in form submission when checked.\n   */\n  @property() value = 'on';\n\n  @property({type: Boolean})\n  get checked() {\n    return this.#checked;\n  }\n  set checked(value: boolean) {\n    this.#checked = value;\n    this.elementInternals.setFormValue(value ? this.value : null);\n  }\n\n  protected constructor() {\n    super();\n    this.elementInternals = this.attachInternals();\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('click', this.#handleClick);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#handleClick)\n  }\n\n  protected override render(): HTMLTemplateResult {\n    const ripple = html`<u-ripple ?disabled=${this.disabled}></u-ripple>`;\n\n    return html`\n      <div class=\"container\">\n        ${this.renderRipple ? ripple : nothing}\n        <input\n          id=\"input\"\n          type=${this.inputType}\n          class=\"focus-ring\"\n          .name=${this.name}\n          .checked=${this.#checked}\n          .disabled=${this.disabled} />\n        <div class=\"indicator-container\">${this.renderIndicator()}</div>\n      </div>`;\n  }\n\n  #handleClick(e: Event) {\n    if (e.defaultPrevented) {\n      return;\n    }\n\n    this.checked = this.inputType === 'radio' || !this.checked;\n    this.dispatchEvent(new InputEvent('input', {bubbles: true, composed: true}));\n    this.dispatchEvent(new Event('change', {bubbles: true}));\n  }\n}\n"]}

package/shared/sets/set-base.d.ts

@@ -0,0 +1,9 @@
+import { HTMLTemplateResult, LitElement } from 'lit';
+export declare abstract class UmSetBase extends LitElement {
+    /**
+     * Set the alignment of the set at the `start`, `center` or at the `end`.
+     */
+    alignment: 'start' | 'center' | 'end';
+    render(): HTMLTemplateResult;
+}
+//# sourceMappingURL=set-base.d.ts.map

package/shared/sets/set-base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"set-base.d.ts","sourceRoot":"","sources":["../../../src/shared/sets/set-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAG3D,8BAAsB,SAAU,SAAQ,UAAU;IAEhD;;OAEG;IACwB,SAAS,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAW;IAElE,MAAM,IAAI,kBAAkB;CAItC"}

package/shared/sets/set-base.js

@@ -0,0 +1,25 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+export class UmSetBase extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Set the alignment of the set at the `start`, `center` or at the `end`.
+         */
+        this.alignment = 'start';
+    }
+    render() {
+        return html `
+      <slot></slot>`;
+    }
+}
+__decorate([
+    property({ reflect: true })
+], UmSetBase.prototype, "alignment", void 0);
+//# sourceMappingURL=set-base.js.map

package/shared/sets/set-base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"set-base.js","sourceRoot":"","sources":["../../../src/shared/sets/set-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,MAAM,OAAgB,SAAU,SAAQ,UAAU;IAAlD;;QAEE;;WAEG;QACwB,cAAS,GAA+B,OAAO,CAAC;IAM7E,CAAC;IAJU,MAAM;QACb,OAAO,IAAI,CAAA;oBACK,CAAC;IACnB,CAAC;CACF;AAN4B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAiD","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nexport abstract class UmSetBase extends LitElement {\n\n  /**\n   * Set the alignment of the set at the `start`, `center` or at the `end`.\n   */\n  @property({reflect: true}) alignment: 'start' | 'center' | 'end' = 'start';\n\n  override render(): HTMLTemplateResult {\n    return html`\n      <slot></slot>`;\n  }\n}\n"]}

package/switch/switch-list-item.d.ts

@@ -1,5 +1,5 @@
 import { UmSwitch } from './switch.js';
-declare const UmSwitchListItem_base: import("../shared/selection-control/selection-control-list-item.js").MixinReturn<typeof UmSwitch, object>;
+declare const UmSwitchListItem_base: import("../shared/mixin.js").MixinReturn<typeof UmSwitch>;
 export declare class UmSwitchListItem extends UmSwitchListItem_base {
 }
 declare global {

package/switch/switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/switch/switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAI/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kDAAkD,CAAC;AAGtF,qBACa,QAAS,SAAQ,kBAAkB;IAC9C,OAAgB,MAAM,4BAGpB;;IAMF,UAAmB,YAAY,UAAS;cAErB,eAAe,IAAI,kBAAkB;CAOzD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/switch/switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAM/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kDAAkD,CAAC;AAEtF,qBACa,QAAS,SAAQ,kBAAkB;IAC9C,OAAgB,MAAM,4BAGpB;;IAMF,UAAmB,YAAY,UAAS;cAErB,eAAe,IAAI,kBAAkB;CAOzD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}

package/switch/switch.js

@@ -7,8 +7,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html } from 'lit';
 import { customElement } from 'lit/decorators.js';
 import { styles as baseStyles } from '../shared/base.styles.js';
-import { UmSelectionControl } from '../shared/selection-control/selection-control.js';
 import { styles } from './switch.styles.js';
+import { UmSelectionControl } from '../shared/selection-control/selection-control.js';
 let UmSwitch = class UmSwitch extends UmSelectionControl {
     constructor() {
         super();

package/switch/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/switch/switch.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kDAAkD,CAAC;AACtF,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAGrC,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,kBAAkB;IAM9C;QACE,KAAK,EAAE,CAAC;QAGS,iBAAY,GAAG,KAAK,CAAC;IAFxC,CAAC;IAIkB,eAAe;QAChC,OAAO,IAAI,CAAA;;;;WAIJ,CAAC;IACV,CAAC;;AAjBe,eAAM,GAAG;IACvB,UAAU;IACV,MAAM;CACP,AAHqB,CAGpB;AAJS,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CAmBpB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { UmSelectionControl } from '../shared/selection-control/selection-control.js';\nimport { styles } from './switch.styles.js';\n\n@customElement('u-switch')\nexport class UmSwitch extends UmSelectionControl {\n  static override styles = [\n    baseStyles,\n    styles\n  ];\n\n  constructor() {\n    super();\n  }\n\n  protected override renderRipple = false;\n\n  protected override renderIndicator(): HTMLTemplateResult {\n    return html`<div class=\"indicator\">\n      <div class=\"state-layer\">\n        <div class=\"handle\"></div>\n      </div>\n    </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-switch': UmSwitch;\n  }\n}\n"]}
+{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/switch/switch.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kDAAkD,CAAC;AAG/E,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,kBAAkB;IAM9C;QACE,KAAK,EAAE,CAAC;QAGS,iBAAY,GAAG,KAAK,CAAC;IAFxC,CAAC;IAIkB,eAAe;QAChC,OAAO,IAAI,CAAA;;;;WAIJ,CAAC;IACV,CAAC;;AAjBe,eAAM,GAAG;IACvB,UAAU;IACV,MAAM;CACP,AAHqB,CAGpB;AAJS,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CAmBpB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './switch.styles.js';\n\nimport { UmSelectionControl } from '../shared/selection-control/selection-control.js';\n\n@customElement('u-switch')\nexport class UmSwitch extends UmSelectionControl {\n  static override styles = [\n    baseStyles,\n    styles\n  ];\n\n  constructor() {\n    super();\n  }\n\n  protected override renderRipple = false;\n\n  protected override renderIndicator(): HTMLTemplateResult {\n    return html`<div class=\"indicator\">\n      <div class=\"state-layer\">\n        <div class=\"handle\"></div>\n      </div>\n    </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-switch': UmSwitch;\n  }\n}\n"]}

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

@@ -1,18 +1,30 @@
 import { HTMLTemplateResult, LitElement } from 'lit';
 import '../field/field.js';
-export declare class UmTextField extends LitElement {
+declare const supportingTextAttribute = "supporting-text";
+declare const textFieldBase: import("../shared/mixin.js").MixinReturn<typeof LitElement>;
+export declare class UmTextField extends textFieldBase {
     #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);
     get value(): string;
     set value(value: string);
     input: HTMLInputElement;
     constructor();
+    focus(): void;
     protected render(): HTMLTemplateResult;
 }
 declare global {
@@ -20,4 +32,5 @@ declare global {
         '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;AAQpE,OAAO,mBAAmB,CAAC;AAE3B,qBACa,WAAY,SAAQ,UAAU;;IACzC,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,4BAAwB;IAElC,OAAO,wBAAmC;IAC1C,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAEI,QAAQ,UAAS;IACjB,OAAO,UAAS;IAI1D,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED,IACI,KAAK,IAGQ,MAAM,CADtB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAGtB;IAGe,KAAK,EAAG,gBAAgB,CAAC;;cAOtB,MAAM,IAAI,kBAAkB;CAkBhD;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,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;IACX,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,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"}

package/text-field/text-field.js

@@ -19,14 +19,26 @@ var _UmTextField_instances, _UmTextField_value, _UmTextField_elementInternals, _
 import { html, LitElement, nothing } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
 import { live } from 'lit/directives/live.js';
-import { config } from '../config.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';
-let UmTextField = class UmTextField extends LitElement {
+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;
+    }
     get value() {
         return __classPrivateFieldGet(this, _UmTextField_value, "f");
     }
@@ -44,34 +56,82 @@ let UmTextField = class UmTextField extends LitElement {
         _UmTextField_elementInternals.set(this, void 0);
         __classPrivateFieldSet(this, _UmTextField_elementInternals, this.attachInternals(), "f");
     }
+    focus() {
+        this.input.focus();
+    }
     render() {
-        const label = html `<label slot="label" id="label">${this.label}</label>`;
+        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>`;
+        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}
+        ?disabled=${this.disabled}
         ?empty=${!__classPrivateFieldGet(this, _UmTextField_value, "f")}>
-        ${this.label ? label : nothing}
+        ${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>`;
     }
 };
-_UmTextField_value = new WeakMap();
-_UmTextField_elementInternals = 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);
+__decorate([
+    property()
+], UmTextField.prototype, "counter", void 0);
+__decorate([
+    property({ reflect: true })
+], UmTextField.prototype, "placeholder", void 0);
+__decorate([
+    property({ attribute: supportingTextAttribute })
+], UmTextField.prototype, "supportingText", void 0);
+__decorate([
+    property({ attribute: errorTextAttribute })
+], UmTextField.prototype, "errorText", void 0);
+__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);

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":";;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpE,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,cAAc,CAAC;AACtC,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,OAAO,mBAAmB,CAAC;AAGpB,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAazC,IAAI,IAAI;QACN,OAAO,uBAAA,IAAI,qCAAkB,CAAC,IAAI,CAAC;IACrC,CAAC;IAGD,IAAI,KAAK;QACP,OAAO,uBAAA,IAAI,0BAAO,CAAC;IACrB,CAAC;IACD,IAAI,KAAK,CAAC,KAAa;QACrB,uBAAA,IAAI,sBAAU,KAAK,MAAA,CAAC;QACpB,uBAAA,IAAI,qCAAkB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC;IAKD;QACE,KAAK,EAAE,CAAC;;QAzBE,YAAO,GAAG,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC;QAGZ,aAAQ,GAAG,KAAK,CAAC;QACjB,YAAO,GAAG,KAAK,CAAC;QAE1D,6BAAiB,EAAE,EAAC;QAeX,gDAAoC;QAK3C,uBAAA,IAAI,iCAAqB,IAAI,CAAC,eAAe,EAAE,MAAA,CAAC;IAClD,CAAC;IAEkB,MAAM;QACvB,MAAM,KAAK,GAAG,IAAI,CAAA,kCAAkC,IAAI,CAAC,KAAK,UAAU,CAAC;QAEzE,OAAO,IAAI,CAAA;;iBAEE,CAAC,uBAAA,IAAI,0BAAO;UACnB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;;eAEvB,IAAI,CAAC,EAAE,IAAI,OAAO;;mBAEd,IAAI,CAAC,uBAAA,IAAI,0BAAO,CAAC;mBACjB,uBAAA,IAAI,wDAAa;iBACnB,CAAC;IAChB,CAAC;;;;;;IAGC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AAChC,CAAC;AAlDe,0BAAc,GAAG,IAAI,AAAP,CAAQ;AAEtB,kBAAM,GAAG,CAAC,UAAU,EAAE,MAAM,CAAC,AAAvB,CAAwB;AAElC;IAAX,QAAQ,EAAE;4CAA2C;AAC1C;IAAX,QAAQ,EAAE;0CAA2B;AAEI;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CAAkB;AACjB;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAiB;AAS1D;IADC,QAAQ,EAAE;wCAGV;AAOe;IAAf,KAAK,CAAC,OAAO,CAAC;0CAA0B;AA3B9B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAoDvB","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 { config } from '../config.js';\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './text-field.styles.js';\n\nimport '../field/field.js';\n\n@customElement('u-text-field')\nexport class UmTextField extends LitElement {\n  static readonly formAssociated = true;\n\n  static override styles = [baseStyles, styles];\n\n  @property() variant = config.fields.defaultAppearance;\n  @property() label: 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  @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  protected override render(): HTMLTemplateResult {\n    const label = html`<label slot=\"label\" id=\"label\">${this.label}</label>`;\n\n    return html`\n      <u-field\n        ?empty=${!this.#value}>\n        ${this.label ? label : nothing}\n        <input\n          id=${this.id || nothing}\n          aria-labelledby=\"label\"\n          .value=${live(this.#value)}\n          @input=${this.#handleInput} />\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":"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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: supportingTextAttribute}) supportingText: string | undefined;\n  @property({attribute: errorTextAttribute}) 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"]}

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,yBAElB,CAAC"}
+{"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"}

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

@@ -1,5 +1,24 @@
 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));
+  }
+
+  .suffix {
+    color: var(--u-field-suffix-color, var(--u-field-affix-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));
+    margin-inline-start: var(--u-suffix-margin, var(--u-affix-margin, 2px));
+  }
+
+  :host([disabled]) .prefix {
+    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))));
+  }
+  :host([disabled]) .suffix {
+    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))));
+  }
 `;
 //# sourceMappingURL=text-field.styles.js.map

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;;CAEzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\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;;;;;;;;;;;;;;;;;;;;;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"]}

package/typeahead/highlight.d.ts

@@ -0,0 +1,24 @@
+import { HTMLTemplateResult, LitElement } from 'lit';
+export declare class UmHighlight extends LitElement {
+    #private;
+    static styles: import("lit").CSSResult;
+    private parts;
+    /**
+     * The result text to display. If the term is found inside this text, it's highlighted
+     */
+    get result(): string | undefined;
+    set result(value: string | undefined);
+    /**
+     * The searched term
+     */
+    get term(): string | undefined;
+    set term(value: string | undefined);
+    protected render(): HTMLTemplateResult | HTMLTemplateResult[];
+    private setParts;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-highlight': UmHighlight;
+    }
+}
+//# sourceMappingURL=highlight.d.ts.map

package/typeahead/highlight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.d.ts","sourceRoot":"","sources":["../../src/typeahead/highlight.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAW3D,qBACa,WAAY,SAAQ,UAAU;;IACzC,OAAgB,MAAM,0BAAU;IAIvB,OAAO,CAAC,KAAK,CAAuB;IAE7C;;OAEG;IACH,IACI,MAAM,IAAI,MAAM,GAAG,SAAS,CAE/B;IACD,IAAI,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAInC;IAED;;OAEG;IACH,IACI,IAAI,IAAI,MAAM,GAAG,SAAS,CAE7B;IACD,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAIjC;cAEkB,MAAM,IAAI,kBAAkB,GAAG,kBAAkB,EAAE;IAUtE,OAAO,CAAC,QAAQ;CAmBjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,WAAW,CAAC;KAC5B;CACF"}

package/typeahead/highlight.js

@@ -0,0 +1,95 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    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 _UmHighlight_result, _UmHighlight_term;
+import { html, LitElement } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { styles } from './highlight.styles.js';
+import { normalizeText } from '../shared/normalize-text.js';
+function regExpEscape(text) {
+    return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
+}
+let UmHighlight = class UmHighlight extends LitElement {
+    constructor() {
+        super(...arguments);
+        _UmHighlight_result.set(this, void 0);
+        _UmHighlight_term.set(this, void 0);
+    }
+    /**
+     * The result text to display. If the term is found inside this text, it's highlighted
+     */
+    get result() {
+        return __classPrivateFieldGet(this, _UmHighlight_result, "f");
+    }
+    set result(value) {
+        __classPrivateFieldSet(this, _UmHighlight_result, value, "f");
+        this.setParts();
+    }
+    /**
+     * The searched term
+     */
+    get term() {
+        return __classPrivateFieldGet(this, _UmHighlight_term, "f");
+    }
+    set term(value) {
+        __classPrivateFieldSet(this, _UmHighlight_term, value, "f");
+        this.setParts();
+    }
+    render() {
+        return this.parts
+            ? this.parts.map((part, index) => {
+                return index % 2
+                    ? html `<strong>${part}</strong>`
+                    : html `<span>${part}</span>`;
+            })
+            : html `<span></span>`;
+    }
+    setParts() {
+        const resultStr = this.result || '';
+        const resultNormalized = normalizeText(resultStr).toLowerCase();
+        const termLC = normalizeText(this.term || '').toLowerCase();
+        let currentIdx = 0;
+        if (termLC.length <= 0) {
+            this.parts = [resultStr];
+            return;
+        }
+        this.parts = resultNormalized
+            .split(new RegExp(`(${regExpEscape(termLC)})`))
+            .map(part => {
+            const originalPart = resultStr.substring(currentIdx, currentIdx + part.length);
+            currentIdx += part.length;
+            return originalPart;
+        });
+    }
+};
+_UmHighlight_result = new WeakMap();
+_UmHighlight_term = new WeakMap();
+UmHighlight.styles = styles;
+__decorate([
+    state()
+], UmHighlight.prototype, "parts", void 0);
+__decorate([
+    property()
+], UmHighlight.prototype, "result", null);
+__decorate([
+    property()
+], UmHighlight.prototype, "term", null);
+UmHighlight = __decorate([
+    customElement('u-highlight')
+], UmHighlight);
+export { UmHighlight };
+//# sourceMappingURL=highlight.js.map

package/typeahead/highlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.js","sourceRoot":"","sources":["../../src/typeahead/highlight.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAE/C,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAE5D,SAAS,YAAY,CAAC,IAAY;IAChC,OAAO,IAAI,CAAC,OAAO,CAAC,0BAA0B,EAAE,MAAM,CAAC,CAAC;AAC1D,CAAC;AAGM,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAGL,sCAA4B;QAC5B,oCAA0B;IA0D5B,CAAC;IAvDC;;OAEG;IAEH,IAAI,MAAM;QACR,OAAO,uBAAA,IAAI,2BAAQ,CAAC;IACtB,CAAC;IACD,IAAI,MAAM,CAAC,KAAyB;QAClC,uBAAA,IAAI,uBAAW,KAAK,MAAA,CAAC;QAErB,IAAI,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAED;;OAEG;IAEH,IAAI,IAAI;QACN,OAAO,uBAAA,IAAI,yBAAM,CAAC;IACpB,CAAC;IACD,IAAI,IAAI,CAAC,KAAyB;QAChC,uBAAA,IAAI,qBAAS,KAAK,MAAA,CAAC;QAEnB,IAAI,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAC,KAAK;YACf,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAC/B,OAAO,KAAK,GAAG,CAAC;oBACd,CAAC,CAAC,IAAI,CAAA,WAAW,IAAI,WAAW;oBAChC,CAAC,CAAC,IAAI,CAAA,SAAS,IAAI,SAAS,CAAC;YACjC,CAAC,CAAC;YACF,CAAC,CAAC,IAAI,CAAA,eAAe,CAAC;IAC1B,CAAC;IAEO,QAAQ;QACd,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,IAAI,EAAE,CAAC;QACpC,MAAM,gBAAgB,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC,WAAW,EAAE,CAAC;QAChE,MAAM,MAAM,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;QAC5D,IAAI,UAAU,GAAG,CAAC,CAAC;QAEnB,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,CAAC,SAAS,CAAC,CAAC;YACzB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,KAAK,GAAG,gBAAgB;aAC1B,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,YAAY,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;aAC9C,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,MAAM,YAAY,GAAG,SAAS,CAAC,SAAS,CAAC,UAAU,EAAE,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/E,UAAU,IAAI,IAAI,CAAC,MAAM,CAAC;YAC1B,OAAO,YAAY,CAAC;QACtB,CAAC,CAAC,CAAC;IACP,CAAC;;;;AA5De,kBAAM,GAAG,MAAM,AAAT,CAAU;AAIf;IAAhB,KAAK,EAAE;0CAAqC;AAM7C;IADC,QAAQ,EAAE;yCAGV;AAWD;IADC,QAAQ,EAAE;uCAGV;AA1BU,WAAW;IADvB,aAAa,CAAC,aAAa,CAAC;GAChB,WAAW,CA8DvB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { styles } from './highlight.styles.js';\n\nimport { normalizeText } from '../shared/normalize-text.js';\n\nfunction regExpEscape(text: string) {\n  return text.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, '\\\\$&');\n}\n\n@customElement('u-highlight')\nexport class UmHighlight extends LitElement {\n  static override styles = styles;\n\n  #result: string | undefined;\n  #term: string | undefined;\n  @state() private parts: string[] | undefined;\n\n  /**\n   * The result text to display. If the term is found inside this text, it's highlighted\n   */\n  @property()\n  get result(): string | undefined {\n    return this.#result;\n  }\n  set result(value: string | undefined) {\n    this.#result = value;\n\n    this.setParts();\n  }\n\n  /**\n   * The searched term\n   */\n  @property()\n  get term(): string | undefined {\n    return this.#term;\n  }\n  set term(value: string | undefined) {\n    this.#term = value;\n\n    this.setParts();\n  }\n\n  protected override render(): HTMLTemplateResult | HTMLTemplateResult[] {\n    return this.parts\n      ? this.parts.map((part, index) => {\n        return index % 2\n          ? html`<strong>${part}</strong>`\n          : html`<span>${part}</span>`;\n      })\n      : html`<span></span>`;\n  }\n\n  private setParts() {\n    const resultStr = this.result || '';\n    const resultNormalized = normalizeText(resultStr).toLowerCase();\n    const termLC = normalizeText(this.term || '').toLowerCase();\n    let currentIdx = 0;\n\n    if (termLC.length <= 0) {\n      this.parts = [resultStr];\n      return;\n    }\n\n    this.parts = resultNormalized\n      .split(new RegExp(`(${regExpEscape(termLC)})`))\n      .map(part => {\n        const originalPart = resultStr.substring(currentIdx, currentIdx + part.length);\n        currentIdx += part.length;\n        return originalPart;\n      });\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-highlight': UmHighlight;\n  }\n}\n"]}

package/typeahead/highlight.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=highlight.styles.d.ts.map

package/typeahead/highlight.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.styles.d.ts","sourceRoot":"","sources":["../../src/typeahead/highlight.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAElB,CAAC"}