@universal-material/web 3.0.31 → 3.0.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-material/web",
3
- "version": "3.0.31",
3
+ "version": "3.0.33",
4
4
  "description": "Material web components",
5
5
  "type": "module",
6
6
  "keywords": [
@@ -16,13 +16,13 @@ export const styles = css `
16
16
 
17
17
  @keyframes u-focus-pulse {
18
18
  0% {
19
- outline: 0 solid var(--u-color-primary);
19
+ outline: 0 solid var(--_color-primary);
20
20
  }
21
21
  50% {
22
- outline: 6px solid var(--u-color-primary);
22
+ outline: 6px solid var(--_color-primary);
23
23
  }
24
24
  100% {
25
- outline: 4px solid var(--u-color-primary);
25
+ outline: 4px solid var(--_color-primary);
26
26
  }
27
27
  }
28
28
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"base.styles.js","sourceRoot":"","sources":["../../src/shared/base.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host,\n * {\n font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n box-sizing: border-box;\n outline: 0;\n }\n\n .focus-ring:focus-visible {\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n animation: u-focus-pulse 500ms ease;\n animation-fill-mode: forwards;\n outline-offset: 2px;\n }\n\n @keyframes u-focus-pulse {\n 0% {\n outline: 0 solid var(--u-color-primary);\n }\n 50% {\n outline: 6px solid var(--u-color-primary);\n }\n 100% {\n outline: 4px solid var(--u-color-primary);\n }\n }\n`;\n"]}
1
+ {"version":3,"file":"base.styles.js","sourceRoot":"","sources":["../../src/shared/base.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host,\n * {\n font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n box-sizing: border-box;\n outline: 0;\n }\n\n .focus-ring:focus-visible {\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n animation: u-focus-pulse 500ms ease;\n animation-fill-mode: forwards;\n outline-offset: 2px;\n }\n\n @keyframes u-focus-pulse {\n 0% {\n outline: 0 solid var(--_color-primary);\n }\n 50% {\n outline: 6px solid var(--_color-primary);\n }\n 100% {\n outline: 4px solid var(--_color-primary);\n }\n }\n`;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAG7B,8BAAsB,eAAgB,SAAQ,UAAU;IAEtD;;OAEG;IACuC,QAAQ,UAAS;IAE3D;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAe;IAC5C,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAM/C,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,UAAU;IAgBlB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAOjB,oBAAoB;IAOpB,KAAK;IAIL,IAAI;IAKb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI,GAAG,OAAO,OAAO;IAKxD,OAAO,CAAC,iBAAiB;IAWzB,OAAO,CAAC,iBAAiB;IAazB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAGxC"}
1
+ {"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAGpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAG7B,8BAAsB,eAAgB,SAAQ,UAAU;IAEtD;;OAEG;IACuC,QAAQ,UAAS;IAE3D;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAe;IAC5C,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAM/C,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,UAAU;IAgBlB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAOjB,oBAAoB;IAOpB,KAAK;IAIL,IAAI;IAKb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI,GAAG,OAAO,OAAO;IAIxD,OAAO,CAAC,iBAAiB;IAWzB,OAAO,CAAC,iBAAiB;IAazB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAGxC"}
@@ -72,7 +72,6 @@ export class UmButtonWrapper extends LitElement {
72
72
  this.buttonElement?.blur();
73
73
  }
74
74
  getAriaLabel() {
75
- console.log(this.ariaLabel);
76
75
  return this.ariaLabel || nothing;
77
76
  }
78
77
  innerFocusHandler() {
@@ -1 +1 @@
1
- {"version":3,"file":"button-wrapper.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\nimport { UmRipple } from '../ripple/ripple.js';\n\nexport abstract class UmButtonWrapper extends LitElement {\n\n /**\n * Whether the button is disabled or not.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * The URL that the link button points to.\n */\n @property() href: string | undefined;\n\n /**\n * Where to display the linked `href` URL for a link button. Common options\n * include `_blank` to open in a new tab.\n */\n @property() target: string | undefined;\n\n @property() name: string | undefined;\n\n @query('.button') private readonly buttonElement!: HTMLElement;\n @query('u-ripple') private readonly ripple!: UmRipple;\n\n protected innerRole: string | null = null;\n\n get pathname(): string {\n return (<HTMLAnchorElement>this.buttonElement)?.pathname\n }\n\n protected override render(): HTMLTemplateResult {\n return typeof this.href === 'string'\n ? this.renderLink()\n : this.renderButton();\n }\n\n private renderButton() {\n return html`\n <button\n id=\"button\"\n class=\"button\"\n ?disabled=${this.disabled}\n aria-label=${this.ariaLabel || nothing}\n aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n .role=${this.innerRole}\n type=\"button\">\n <u-ripple ?disabled=${this.disabled}></u-ripple>\n <u-elevation></u-elevation>\n </button>\n <div class=\"content\">${this.renderContent()}</div>`;\n\n }\n\n private renderLink() {\n return html`<a\n id=\"link\"\n class=\"button\"\n href=${this.disabled ? nothing : this.href}\n aria-disabled=${this.disabled || nothing}\n aria-label=${this.ariaLabel || nothing}\n aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n .role=${this.innerRole}\n target=${this.target || nothing}>\n <u-elevation></u-elevation>\n <u-ripple ?disabled=${this.disabled}></u-ripple>\n </a>\n <div class=\"content\">${this.renderContent()}</div>`;\n }\n\n protected abstract renderContent(): HTMLTemplateResult;\n\n override connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('click', this.innerClickHandler);\n this.addEventListener('focus', this.innerFocusHandler)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener('click', this.innerClickHandler);\n this.removeEventListener('focus', this.innerFocusHandler);\n }\n\n override focus() {\n this.buttonElement?.focus();\n }\n\n override blur() {\n\n this.buttonElement?.blur();\n }\n\n protected getAriaLabel(): string | null | typeof nothing {\n console.log(this.ariaLabel);\n return this.ariaLabel || nothing;\n }\n\n private innerFocusHandler(): void {\n const tabIndexAttributeValue = this.getAttribute('tabindex');\n\n if (tabIndexAttributeValue !== \"0\") {\n return;\n }\n \n this.removeAttribute('tabindex');\n setTimeout(() => this.buttonElement?.focus());\n }\n\n private innerClickHandler(event: MouseEvent): void {\n\n if (this.disabled) {\n return;\n }\n\n if (!(<PointerEvent>event).pointerType) {\n this.ripple.createRipple();\n }\n\n this.handleClick(event);\n }\n\n protected handleClick(_: UIEvent): void {\n\n }\n}\n"]}
1
+ {"version":3,"file":"button-wrapper.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\nimport { UmRipple } from '../ripple/ripple.js';\n\nexport abstract class UmButtonWrapper extends LitElement {\n\n /**\n * Whether the button is disabled or not.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * The URL that the link button points to.\n */\n @property() href: string | undefined;\n\n /**\n * Where to display the linked `href` URL for a link button. Common options\n * include `_blank` to open in a new tab.\n */\n @property() target: string | undefined;\n\n @property() name: string | undefined;\n\n @query('.button') private readonly buttonElement!: HTMLElement;\n @query('u-ripple') private readonly ripple!: UmRipple;\n\n protected innerRole: string | null = null;\n\n get pathname(): string {\n return (<HTMLAnchorElement>this.buttonElement)?.pathname\n }\n\n protected override render(): HTMLTemplateResult {\n return typeof this.href === 'string'\n ? this.renderLink()\n : this.renderButton();\n }\n\n private renderButton() {\n return html`\n <button\n id=\"button\"\n class=\"button\"\n ?disabled=${this.disabled}\n aria-label=${this.ariaLabel || nothing}\n aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n .role=${this.innerRole}\n type=\"button\">\n <u-ripple ?disabled=${this.disabled}></u-ripple>\n <u-elevation></u-elevation>\n </button>\n <div class=\"content\">${this.renderContent()}</div>`;\n\n }\n\n private renderLink() {\n return html`<a\n id=\"link\"\n class=\"button\"\n href=${this.disabled ? nothing : this.href}\n aria-disabled=${this.disabled || nothing}\n aria-label=${this.ariaLabel || nothing}\n aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n .role=${this.innerRole}\n target=${this.target || nothing}>\n <u-elevation></u-elevation>\n <u-ripple ?disabled=${this.disabled}></u-ripple>\n </a>\n <div class=\"content\">${this.renderContent()}</div>`;\n }\n\n protected abstract renderContent(): HTMLTemplateResult;\n\n override connectedCallback() {\n super.connectedCallback();\n\n this.addEventListener('click', this.innerClickHandler);\n this.addEventListener('focus', this.innerFocusHandler)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n\n this.removeEventListener('click', this.innerClickHandler);\n this.removeEventListener('focus', this.innerFocusHandler);\n }\n\n override focus() {\n this.buttonElement?.focus();\n }\n\n override blur() {\n\n this.buttonElement?.blur();\n }\n\n protected getAriaLabel(): string | null | typeof nothing {\n return this.ariaLabel || nothing;\n }\n\n private innerFocusHandler(): void {\n const tabIndexAttributeValue = this.getAttribute('tabindex');\n\n if (tabIndexAttributeValue !== \"0\") {\n return;\n }\n \n this.removeAttribute('tabindex');\n setTimeout(() => this.buttonElement?.focus());\n }\n\n private innerClickHandler(event: MouseEvent): void {\n\n if (this.disabled) {\n return;\n }\n\n if (!(<PointerEvent>event).pointerType) {\n this.ripple.createRipple();\n }\n\n this.handleClick(event);\n }\n\n protected handleClick(_: UIEvent): void {\n\n }\n}\n"]}
@@ -1 +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,EAIzB;IAED,SAAS;IAKA,iBAAiB;IAKjB,oBAAoB;cAKV,MAAM,IAAI,kBAAkB;CAoBhD"}
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"}
@@ -29,7 +29,6 @@ export class UmSelectionControl extends LitElement {
29
29
  return __classPrivateFieldGet(this, _UmSelectionControl_checked, "f");
30
30
  }
31
31
  set checked(value) {
32
- console.log(value);
33
32
  __classPrivateFieldSet(this, _UmSelectionControl_checked, value, "f");
34
33
  this.elementInternals.setFormValue(value ? this.value : null);
35
34
  }
@@ -1 +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,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QACnB,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;;QAjCE,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;QAcvB,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;AAtEe,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 console.log(value);\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"]}
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"]}