@politiet/sheriff-web-components 1.0.0-rc.5 → 1.0.0-rc.6
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/dist/sds-button/sds-button.js +2 -2
- package/dist/sds-button/sds-button.js.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.d.ts +4 -0
- package/dist/sds-checkbox/sds-checkbox.d.ts.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.js +21 -2
- package/dist/sds-checkbox/sds-checkbox.js.map +1 -1
- package/dist/sds-chip/sds-chip.d.ts +7 -0
- package/dist/sds-chip/sds-chip.d.ts.map +1 -1
- package/dist/sds-chip/sds-chip.js +24 -2
- package/dist/sds-chip/sds-chip.js.map +1 -1
- package/dist/sds-icon/sds-icon-loader.d.ts +1 -2
- package/dist/sds-icon/sds-icon-loader.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon-loader.js +7 -33
- package/dist/sds-icon/sds-icon-loader.js.map +1 -1
- package/dist/sds-icon/sds-icon.js +2 -2
- package/dist/sds-icon/sds-icon.js.map +1 -1
- package/dist/sds-switch/sds-switch.d.ts.map +1 -1
- package/dist/sds-switch/sds-switch.js +6 -4
- package/dist/sds-switch/sds-switch.js.map +1 -1
- package/dist/sds-textfield/sds-textfield.d.ts +5 -0
- package/dist/sds-textfield/sds-textfield.d.ts.map +1 -1
- package/dist/sds-textfield/sds-textfield.js +15 -2
- package/dist/sds-textfield/sds-textfield.js.map +1 -1
- package/dist/sheriff-web-components.js +111 -57
- package/package.json +6 -2
|
@@ -33,10 +33,10 @@ let SDSButton = class SDSButton extends LitElement {
|
|
|
33
33
|
if (this.form) {
|
|
34
34
|
const root = this.getRootNode();
|
|
35
35
|
const formElement = root.querySelector(`form#${this.form}`);
|
|
36
|
-
formElement?.
|
|
36
|
+
formElement?.requestSubmit();
|
|
37
37
|
}
|
|
38
38
|
else if (this.internals.form) {
|
|
39
|
-
this.internals.form.
|
|
39
|
+
this.internals.form.requestSubmit();
|
|
40
40
|
}
|
|
41
41
|
}
|
|
42
42
|
break;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-button.js","sourceRoot":"","sources":["../../src/sds-button/sds-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAoBtC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAoBxC;QACC,KAAK,EAAE,CAAC;QAdT,SAAI,GAAe,QAAQ,CAAC;QAG5B,YAAO,GAAkB,SAAS,CAAC;QAGnC,SAAI,GAAe,OAAO,CAAC;QAEiB,aAAQ,GAAY,KAAK,CAAC;QAE3B,UAAK,GAAW,EAAE,CAAC;QAS7C,iBAAY,GAAG,CAAC,KAAiB,EAAE,EAAE;YACrD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;YAEjC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACpB,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;oBACnB,KAAK,QAAQ,CAAC,CAAC,CAAC;wBACf,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC,QAAQ,EAAE;4BAC7C,OAAO,EAAE,IAAI;4BACb,QAAQ,EAAE,IAAI;4BACd,UAAU,EAAE,IAAI;yBAChB,CAAC,CAAC;wBACH,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;wBAErD,IAAI,YAAY,EAAE,CAAC;4BAClB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gCACf,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAA2B,CAAC;gCACzD,MAAM,WAAW,GAA2B,IAAI,CAAC,aAAa,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;gCACpF,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"sds-button.js","sourceRoot":"","sources":["../../src/sds-button/sds-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAoBtC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAoBxC;QACC,KAAK,EAAE,CAAC;QAdT,SAAI,GAAe,QAAQ,CAAC;QAG5B,YAAO,GAAkB,SAAS,CAAC;QAGnC,SAAI,GAAe,OAAO,CAAC;QAEiB,aAAQ,GAAY,KAAK,CAAC;QAE3B,UAAK,GAAW,EAAE,CAAC;QAS7C,iBAAY,GAAG,CAAC,KAAiB,EAAE,EAAE;YACrD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;YAEjC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACpB,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;oBACnB,KAAK,QAAQ,CAAC,CAAC,CAAC;wBACf,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC,QAAQ,EAAE;4BAC7C,OAAO,EAAE,IAAI;4BACb,QAAQ,EAAE,IAAI;4BACd,UAAU,EAAE,IAAI;yBAChB,CAAC,CAAC;wBACH,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;wBAErD,IAAI,YAAY,EAAE,CAAC;4BAClB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gCACf,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAA2B,CAAC;gCACzD,MAAM,WAAW,GAA2B,IAAI,CAAC,aAAa,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;gCACpF,WAAW,EAAE,aAAa,EAAE,CAAC;4BAC9B,CAAC;iCAAM,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;gCAChC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;4BACrC,CAAC;wBACF,CAAC;wBACD,MAAM;oBACP,CAAC;oBAED,KAAK,OAAO,CAAC,CAAC,CAAC;wBACd,MAAM,UAAU,GAAG,IAAI,WAAW,CAAC,OAAO,EAAE;4BAC3C,OAAO,EAAE,IAAI;4BACb,QAAQ,EAAE,IAAI;4BACd,UAAU,EAAE,IAAI;yBAChB,CAAC,CAAC;wBACH,MAAM,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;wBAEnD,IAAI,WAAW,EAAE,CAAC;4BACjB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gCACf,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAA2B,CAAC;gCACzD,MAAM,WAAW,GAA2B,IAAI,CAAC,aAAa,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;gCACpF,WAAW,EAAE,KAAK,EAAE,CAAC;4BACtB,CAAC;iCAAM,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;gCAChC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;4BAC7B,CAAC;wBACF,CAAC;wBACD,MAAM;oBACP,CAAC;oBAED;wBACC,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,OAAO,EAAE;4BACxB,OAAO,EAAE,IAAI;4BACb,QAAQ,EAAE,IAAI;yBACd,CAAC,CACF,CAAC;gBACJ,CAAC;YACF,CAAC;QACF,CAAC,CAAC;QA3DD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACxC,IAAI,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,CAAC;IAC3D,CAAC;IA2DQ,KAAK;QACb,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;IACvE,CAAC;IAEQ,IAAI;QACZ,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC;IACtE,CAAC;IAEQ,KAAK;QACb,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;IACvE,CAAC;IAEQ,MAAM;QACd,MAAM,aAAa,GAAG;YACrB,YAAY,EAAE,IAAI;YAClB,uBAAuB,EAAE,IAAI,CAAC,OAAO,KAAK,WAAW;YACrD,sBAAsB,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU;YACnD,sBAAsB,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU;YACnD,oBAAoB,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;YAC5C,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;SAC1C,CAAC;QAEF,OAAO,IAAI,CAAA;;;YAGD,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;aACnB,QAAQ,CAAC,aAAa,CAAC;YACxB,IAAI,CAAC,IAAI;YACT,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;aACnB,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;iBACjB,IAAI,CAAC,QAAQ;cAChB,IAAI,CAAC,YAAY;;;;;;GAM5B,CAAC;IACH,CAAC;;AAxHe,gBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAE3B,wBAAc,GAAG,IAAI,AAAP,CAAQ;AAI7B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCACd;AAG5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CACP;AAGnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCACf;AAEiB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CAA2B;AAC3B;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAe;AACd;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAAoB;AACnB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAe;AAlB7C,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA0HrB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styles } from './sds-button.styles';\n\ntype ButtonType = 'button' | 'submit' | 'reset';\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'critical';\ntype ButtonSize = 'large' | 'medium' | 'small';\n\nexport interface SDSButtonProps {\n\ttype?: ButtonType;\n\tvariant?: ButtonVariant;\n\tsize?: ButtonSize;\n\tdisabled?: boolean;\n\tname?: string;\n\tvalue?: string;\n\tform?: string;\n\tonClick?: (event: CustomEvent) => void;\n\tonSubmit?: (event: CustomEvent) => void;\n\tonReset?: (event: CustomEvent) => void;\n}\n\n@customElement('sds-button')\nexport class SDSButton extends LitElement {\n\tstatic override styles = [styles];\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\t@property({ type: String, reflect: true })\n\ttype: ButtonType = 'button';\n\n\t@property({ type: String, reflect: true })\n\tvariant: ButtonVariant = 'primary';\n\n\t@property({ type: String, reflect: true })\n\tsize: ButtonSize = 'large';\n\n\t@property({ type: Boolean, reflect: true }) disabled: boolean = false;\n\t@property({ type: String, reflect: true }) name?: string;\n\t@property({ type: String, reflect: true }) value: string = '';\n\t@property({ type: String, reflect: true }) form?: string;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t\tthis.attachShadow({ mode: 'open', delegatesFocus: true });\n\t}\n\n\tprivate readonly _handleClick = (event: MouseEvent) => {\n\t\tevent.preventDefault();\n\t\tevent.stopImmediatePropagation();\n\n\t\tif (!this.disabled) {\n\t\t\tswitch (this.type) {\n\t\t\t\tcase 'submit': {\n\t\t\t\t\tconst submitEvent = new CustomEvent('submit', {\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\tcancelable: true,\n\t\t\t\t\t});\n\t\t\t\t\tconst shouldSubmit = this.dispatchEvent(submitEvent);\n\n\t\t\t\t\tif (shouldSubmit) {\n\t\t\t\t\t\tif (this.form) {\n\t\t\t\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\t\t\t\tconst formElement: HTMLFormElement | null = root.querySelector(`form#${this.form}`);\n\t\t\t\t\t\t\tformElement?.requestSubmit();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.requestSubmit();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tcase 'reset': {\n\t\t\t\t\tconst resetEvent = new CustomEvent('reset', {\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\tcancelable: true,\n\t\t\t\t\t});\n\t\t\t\t\tconst shouldReset = this.dispatchEvent(resetEvent);\n\n\t\t\t\t\tif (shouldReset) {\n\t\t\t\t\t\tif (this.form) {\n\t\t\t\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\t\t\t\tconst formElement: HTMLFormElement | null = root.querySelector(`form#${this.form}`);\n\t\t\t\t\t\t\tformElement?.reset();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.reset();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tdefault:\n\t\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\t\tnew CustomEvent('click', {\n\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t\t})\n\t\t\t\t\t);\n\t\t\t}\n\t\t}\n\t};\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('button')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('button')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('button')?.click();\n\t}\n\n\toverride render() {\n\t\tconst buttonClasses = {\n\t\t\t'sds-button': true,\n\t\t\t'sds-button--secondary': this.variant === 'secondary',\n\t\t\t'sds-button--tertiary': this.variant === 'tertiary',\n\t\t\t'sds-button--critical': this.variant === 'critical',\n\t\t\t'sds-button--medium': this.size === 'medium',\n\t\t\t'sds-button--small': this.size === 'small',\n\t\t};\n\n\t\treturn html`\n\t\t\t<button\n\t\t\t\tid=\"control\"\n\t\t\t\tform=\"${ifDefined(this.form)}\"\n\t\t\t\tclass=\"${classMap(buttonClasses)}\"\n\t\t\t\ttype=\"${this.type}\"\n\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t@click=\"${this._handleClick}\"\n\t\t\t>\n\t\t\t\t<slot name=\"before\"></slot>\n\t\t\t\t<slot></slot>\n\t\t\t\t<slot name=\"after\"></slot>\n\t\t\t</button>\n\t\t`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-button': SDSButton;\n\t}\n}\n"]}
|
|
@@ -27,7 +27,11 @@ export declare class SDSCheckbox extends LitElement {
|
|
|
27
27
|
checked: boolean;
|
|
28
28
|
disabled: boolean;
|
|
29
29
|
error: boolean;
|
|
30
|
+
control: HTMLInputElement;
|
|
31
|
+
private _initialChecked;
|
|
30
32
|
constructor();
|
|
33
|
+
connectedCallback(): void;
|
|
34
|
+
formResetCallback(): void;
|
|
31
35
|
private readonly _handleChange;
|
|
32
36
|
private readonly _handleFocus;
|
|
33
37
|
private readonly _handleBlur;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-checkbox.d.ts","sourceRoot":"","sources":["../../src/sds-checkbox/sds-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-checkbox.d.ts","sourceRoot":"","sources":["../../src/sds-checkbox/sds-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD,MAAM,WAAW,gBAAgB;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC7E,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC7D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;CAC5D;AAED,qBACa,WAAY,SAAQ,UAAU;IAE1C,OAAgB,MAAM,4BAAY;IAElC,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;IAGD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACC,OAAO,UAAS;IAChB,QAAQ,UAAS;IACjB,KAAK,UAAS;IAEvC,OAAO,EAAG,gBAAgB,CAAC;IAE9C,OAAO,CAAC,eAAe,CAAkB;;IAQhC,iBAAiB;IAS1B,iBAAiB;IAOjB,OAAO,CAAC,QAAQ,CAAC,aAAa,CAc5B;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAS3B;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAS1B;IAEO,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;CA+Bf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,WAAW,CAAC;KAC5B;CACD"}
|
|
@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
7
|
import { LitElement, html, nothing } from 'lit';
|
|
8
|
-
import { customElement, property } from 'lit/decorators.js';
|
|
8
|
+
import { customElement, property, query } from 'lit/decorators.js';
|
|
9
9
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
10
10
|
import { classMap } from 'lit/directives/class-map.js';
|
|
11
11
|
import { styles } from './sds-checkbox.styles';
|
|
@@ -15,12 +15,13 @@ let SDSCheckbox = class SDSCheckbox extends LitElement {
|
|
|
15
15
|
this.checked = false;
|
|
16
16
|
this.disabled = false;
|
|
17
17
|
this.error = false;
|
|
18
|
-
|
|
18
|
+
this._initialChecked = false;
|
|
19
19
|
this._handleChange = (event) => {
|
|
20
20
|
event.stopImmediatePropagation();
|
|
21
21
|
if (!this.disabled) {
|
|
22
22
|
const elem = event.target;
|
|
23
23
|
this.checked = elem.checked;
|
|
24
|
+
this.internals.setFormValue(elem.checked ? elem.value : '');
|
|
24
25
|
this.dispatchEvent(new CustomEvent('change', {
|
|
25
26
|
detail: { checked: this.checked, value: elem.value },
|
|
26
27
|
bubbles: true,
|
|
@@ -47,6 +48,20 @@ let SDSCheckbox = class SDSCheckbox extends LitElement {
|
|
|
47
48
|
this.internals = this.attachInternals();
|
|
48
49
|
this.attachShadow({ mode: 'open', delegatesFocus: true });
|
|
49
50
|
}
|
|
51
|
+
connectedCallback() {
|
|
52
|
+
super.connectedCallback();
|
|
53
|
+
this._initialChecked = this.checked;
|
|
54
|
+
this.internals.role = 'checkbox';
|
|
55
|
+
if (this.checked) {
|
|
56
|
+
this.internals.setFormValue(this.value ? this.value : '');
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
formResetCallback() {
|
|
60
|
+
this.checked = this._initialChecked;
|
|
61
|
+
this.control.checked = this._initialChecked;
|
|
62
|
+
const resetValue = this.checked && this.value ? this.value : '';
|
|
63
|
+
this.internals.setFormValue(resetValue);
|
|
64
|
+
}
|
|
50
65
|
focus() {
|
|
51
66
|
if (!this.disabled)
|
|
52
67
|
this.shadowRoot?.querySelector('input')?.focus();
|
|
@@ -72,6 +87,7 @@ let SDSCheckbox = class SDSCheckbox extends LitElement {
|
|
|
72
87
|
<div class="${classMap(checkboxClasses)}">
|
|
73
88
|
<label class="sds-checkbox__label">
|
|
74
89
|
<input
|
|
90
|
+
id="control"
|
|
75
91
|
type="checkbox"
|
|
76
92
|
name="${ifDefined(this.name)}"
|
|
77
93
|
value="${ifDefined(this.value)}"
|
|
@@ -109,6 +125,9 @@ __decorate([
|
|
|
109
125
|
__decorate([
|
|
110
126
|
property({ type: Boolean, reflect: true })
|
|
111
127
|
], SDSCheckbox.prototype, "error", void 0);
|
|
128
|
+
__decorate([
|
|
129
|
+
query('#control')
|
|
130
|
+
], SDSCheckbox.prototype, "control", void 0);
|
|
112
131
|
SDSCheckbox = __decorate([
|
|
113
132
|
customElement('sds-checkbox')
|
|
114
133
|
], SDSCheckbox);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-checkbox.js","sourceRoot":"","sources":["../../src/sds-checkbox/sds-checkbox.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-checkbox.js","sourceRoot":"","sources":["../../src/sds-checkbox/sds-checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-checkbox.styles';\n\nexport interface SDSCheckboxProps {\n\tname?: string;\n\tlabel?: string;\n\tvalue?: string;\n\tchecked?: boolean;\n\tdisabled?: boolean;\n\terror?: boolean;\n\tonChange?: (event: CustomEvent<{ checked: boolean; value: string }>) => void;\n\tonFocus?: (event: CustomEvent<{ checked: boolean }>) => void;\n\tonBlur?: (event: CustomEvent<{ checked: boolean }>) => void;\n}\n\n@customElement('sds-checkbox')\nexport class SDSCheckbox extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\t// Props\n\t@property({ type: String, reflect: true }) name?: string;\n\t@property({ type: String, reflect: true }) label?: string;\n\t@property({ type: String }) value?: string;\n\t@property({ type: Boolean, reflect: true }) checked = false;\n\t@property({ type: Boolean, reflect: true }) disabled = false;\n\t@property({ type: Boolean, reflect: true }) error = false;\n\n\t@query('#control') control!: HTMLInputElement;\n\n\tprivate _initialChecked: boolean = false;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t\tthis.attachShadow({ mode: 'open', delegatesFocus: true });\n\t}\n\n\toverride connectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis._initialChecked = this.checked;\n\t\tthis.internals.role = 'checkbox';\n\t\tif (this.checked) {\n\t\t\tthis.internals.setFormValue(this.value ? this.value : '');\n\t\t}\n\t}\n\n\tformResetCallback() {\n\t\tthis.checked = this._initialChecked;\n\t\tthis.control.checked = this._initialChecked;\n\t\tconst resetValue = this.checked && this.value ? this.value : '';\n\t\tthis.internals.setFormValue(resetValue);\n\t}\n\n\tprivate readonly _handleChange = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tconst elem = event.target as HTMLInputElement;\n\t\t\tthis.checked = elem.checked;\n\t\t\tthis.internals.setFormValue(elem.checked ? elem.value : '');\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('change', {\n\t\t\t\t\tdetail: { checked: this.checked, value: elem.value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('focus', {\n\t\t\t\tdetail: { checked: this.checked },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('blur', {\n\t\t\t\tdetail: { checked: this.checked },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.click();\n\t}\n\n\toverride render() {\n\t\tconst checkboxClasses = {\n\t\t\t'sds-checkbox': true,\n\t\t\t'sds-checkbox--error': Boolean(this.error),\n\t\t};\n\n\t\tconst inputClasses = {\n\t\t\t'sds-checkbox__input': true,\n\t\t\t'sds-checkbox__input--error': Boolean(this.error),\n\t\t};\n\n\t\treturn html`\n\t\t\t<div class=\"${classMap(checkboxClasses)}\">\n\t\t\t\t<label class=\"sds-checkbox__label\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tid=\"control\"\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t\t\t?checked=\"${this.checked}\"\n\t\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t\t@change=\"${this._handleChange}\"\n\t\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t\t\tclass=\"${classMap(inputClasses)}\"\n\t\t\t\t\t/>\n\t\t\t\t\t${this.label ? html`<span class=\"sds-checkbox__text\">${this.label}</span>` : nothing}\n\t\t\t\t</label>\n\t\t\t</div>\n\t\t`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-checkbox': SDSCheckbox;\n\t}\n}\n"]}
|
|
@@ -17,12 +17,19 @@ export interface SDSChipProps {
|
|
|
17
17
|
}
|
|
18
18
|
export declare class SDSChip extends LitElement {
|
|
19
19
|
static styles: import("lit").CSSResult[];
|
|
20
|
+
static formAssociated: boolean;
|
|
21
|
+
readonly internals: ElementInternals;
|
|
20
22
|
variant: ChipVariant;
|
|
21
23
|
size: ChipSize;
|
|
22
24
|
checked: boolean;
|
|
23
25
|
name?: string;
|
|
24
26
|
value?: string;
|
|
25
27
|
disabled: boolean;
|
|
28
|
+
control: HTMLInputElement;
|
|
29
|
+
private _initialChecked;
|
|
30
|
+
constructor();
|
|
31
|
+
connectedCallback(): void;
|
|
32
|
+
formResetCallback(): void;
|
|
26
33
|
focus(): void;
|
|
27
34
|
blur(): void;
|
|
28
35
|
click(): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-chip.d.ts","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,OAAO,sBAAsB,CAAC;AAE9B,KAAK,WAAW,GAAG,YAAY,GAAG,WAAW,CAAC;AAC9C,KAAK,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;AAElC,MAAM,WAAW,YAAY;IAC5B,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;QAAC,SAAS,EAAE,OAAO,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC3F,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;CAC3C;AAED,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;
|
|
1
|
+
{"version":3,"file":"sds-chip.d.ts","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,OAAO,sBAAsB,CAAC;AAE9B,KAAK,WAAW,GAAG,YAAY,GAAG,WAAW,CAAC;AAC9C,KAAK,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC;AAElC,MAAM,WAAW,YAAY;IAC5B,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;QAAC,SAAS,EAAE,OAAO,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC3F,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;CAC3C;AAED,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;IAElC,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;IAGD,OAAO,EAAE,WAAW,CAAgB;IACpC,IAAI,EAAE,QAAQ,CAAW;IACxB,OAAO,UAAS;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACC,QAAQ,UAAS;IAE1C,OAAO,EAAG,gBAAgB,CAAC;IAE9C,OAAO,CAAC,eAAe,CAAkB;;IAQhC,iBAAiB;IAS1B,iBAAiB;IAMR,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;IA0Bf,OAAO,CAAC,QAAQ,CAAC,OAAO,CAatB;IAEF,OAAO,CAAC,QAAQ,CAAC,OAAO,CAOtB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}
|
|
@@ -5,23 +5,25 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
7
|
import { LitElement, html } from 'lit';
|
|
8
|
-
import { customElement, property } from 'lit/decorators.js';
|
|
8
|
+
import { customElement, property, query } from 'lit/decorators.js';
|
|
9
9
|
import { classMap } from 'lit/directives/class-map.js';
|
|
10
10
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
11
11
|
import { styles } from './sds-chip.styles';
|
|
12
12
|
import '../sds-icon/sds-icon';
|
|
13
13
|
let SDSChip = class SDSChip extends LitElement {
|
|
14
14
|
constructor() {
|
|
15
|
-
super(
|
|
15
|
+
super();
|
|
16
16
|
// Reactive Props
|
|
17
17
|
this.variant = 'selectable';
|
|
18
18
|
this.size = 'large';
|
|
19
19
|
this.checked = false;
|
|
20
20
|
this.disabled = false;
|
|
21
|
+
this._initialChecked = false;
|
|
21
22
|
this._toggle = (event) => {
|
|
22
23
|
event.preventDefault();
|
|
23
24
|
event.stopImmediatePropagation();
|
|
24
25
|
this.checked = !this.checked;
|
|
26
|
+
this.internals.setFormValue(this.checked && this.value ? this.value : '');
|
|
25
27
|
this.dispatchEvent(new CustomEvent('change', {
|
|
26
28
|
detail: { value: this.value, isChecked: this.checked },
|
|
27
29
|
bubbles: true,
|
|
@@ -34,6 +36,21 @@ let SDSChip = class SDSChip extends LitElement {
|
|
|
34
36
|
composed: true,
|
|
35
37
|
}));
|
|
36
38
|
};
|
|
39
|
+
this.internals = this.attachInternals();
|
|
40
|
+
this.attachShadow({ mode: 'open', delegatesFocus: true });
|
|
41
|
+
}
|
|
42
|
+
connectedCallback() {
|
|
43
|
+
super.connectedCallback();
|
|
44
|
+
this._initialChecked = this.checked;
|
|
45
|
+
this.internals.role = 'checkbox';
|
|
46
|
+
if (this.checked) {
|
|
47
|
+
this.internals.setFormValue(this.value ? this.value : '');
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
formResetCallback() {
|
|
51
|
+
this.checked = this._initialChecked;
|
|
52
|
+
const resetValue = this.checked && this.value ? this.value : '';
|
|
53
|
+
this.internals.setFormValue(resetValue);
|
|
37
54
|
}
|
|
38
55
|
focus() {
|
|
39
56
|
if (!this.disabled)
|
|
@@ -60,6 +77,7 @@ let SDSChip = class SDSChip extends LitElement {
|
|
|
60
77
|
}
|
|
61
78
|
return html `<label class="${classMap(chipClasses)}" @click="${this._toggle}">
|
|
62
79
|
<input
|
|
80
|
+
id="control"
|
|
63
81
|
type="checkbox"
|
|
64
82
|
name="${ifDefined(this.name)}"
|
|
65
83
|
value="${ifDefined(this.value)}"
|
|
@@ -72,6 +90,7 @@ let SDSChip = class SDSChip extends LitElement {
|
|
|
72
90
|
};
|
|
73
91
|
// Styling
|
|
74
92
|
SDSChip.styles = [styles];
|
|
93
|
+
SDSChip.formAssociated = true;
|
|
75
94
|
__decorate([
|
|
76
95
|
property({ type: String, reflect: true })
|
|
77
96
|
], SDSChip.prototype, "variant", void 0);
|
|
@@ -90,6 +109,9 @@ __decorate([
|
|
|
90
109
|
__decorate([
|
|
91
110
|
property({ type: Boolean, reflect: true })
|
|
92
111
|
], SDSChip.prototype, "disabled", void 0);
|
|
112
|
+
__decorate([
|
|
113
|
+
query('#control')
|
|
114
|
+
], SDSChip.prototype, "control", void 0);
|
|
93
115
|
SDSChip = __decorate([
|
|
94
116
|
customElement('sds-chip')
|
|
95
117
|
], SDSChip);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-chip.js","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-chip.js","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styles } from './sds-chip.styles';\n\nimport '../sds-icon/sds-icon';\n\ntype ChipVariant = 'selectable' | 'removable';\ntype ChipSize = 'large' | 'small';\n\nexport interface SDSChipProps {\n\tvariant?: ChipVariant;\n\tsize?: ChipSize;\n\tchecked?: boolean;\n\tname?: string;\n\tvalue?: string;\n\tdisabled?: boolean;\n\tonChange?: (event: CustomEvent<{ value: string | undefined; isChecked: boolean }>) => void;\n\tonSdsRemove?: (event: CustomEvent) => void;\n}\n\n@customElement('sds-chip')\nexport class SDSChip extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\t// Reactive Props\n\t@property({ type: String, reflect: true }) variant: ChipVariant = 'selectable';\n\t@property({ type: String, reflect: true }) size: ChipSize = 'large';\n\t@property({ type: Boolean, reflect: true }) checked = false;\n\t@property({ type: String, reflect: true }) name?: string;\n\t@property({ type: String }) value?: string;\n\t@property({ type: Boolean, reflect: true }) disabled = false;\n\n\t@query('#control') control!: HTMLInputElement;\n\n\tprivate _initialChecked: boolean = false;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t\tthis.attachShadow({ mode: 'open', delegatesFocus: true });\n\t}\n\n\toverride connectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis._initialChecked = this.checked;\n\t\tthis.internals.role = 'checkbox';\n\t\tif (this.checked) {\n\t\t\tthis.internals.setFormValue(this.value ? this.value : '');\n\t\t}\n\t}\n\n\tformResetCallback() {\n\t\tthis.checked = this._initialChecked;\n\t\tconst resetValue = this.checked && this.value ? this.value : '';\n\t\tthis.internals.setFormValue(resetValue);\n\t}\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.click();\n\t}\n\n\toverride render() {\n\t\tconst chipClasses = {\n\t\t\t'sds-chip': true,\n\t\t\t'sds-chip--small': this.size === 'small',\n\t\t};\n\n\t\tif (this.variant === 'removable') {\n\t\t\treturn html`<button class=\"${classMap(chipClasses)}\" @click=${this._remove}>\n\t\t\t\t<slot></slot>\n\t\t\t\t<sds-icon name=\"close-material-outlined\" size=\"s\"></sds-icon>\n\t\t\t</button>`;\n\t\t}\n\n\t\treturn html`<label class=\"${classMap(chipClasses)}\" @click=\"${this._toggle}\">\n\t\t\t<input\n\t\t\t\tid=\"control\"\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t?checked=\"${this.checked}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t/>\n\t\t\t<slot></slot>\n\t\t</label>`;\n\t}\n\n\tprivate readonly _toggle = (event: MouseEvent) => {\n\t\tevent.preventDefault();\n\t\tevent.stopImmediatePropagation();\n\n\t\tthis.checked = !this.checked;\n\t\tthis.internals.setFormValue(this.checked && this.value ? this.value : '');\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('change', {\n\t\t\t\tdetail: { value: this.value, isChecked: this.checked },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tprivate readonly _remove = () => {\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('sds-remove', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-chip': SDSChip;\n\t}\n}\n"]}
|
|
@@ -4,11 +4,10 @@ export declare const loadLocalIcons: IconPromise;
|
|
|
4
4
|
export declare class SDSIconLoader {
|
|
5
5
|
private readonly cache;
|
|
6
6
|
static defaultResolver: IconPromise;
|
|
7
|
-
static loadCdnIcons: IconPromise;
|
|
8
|
-
static loadLocalIcons: IconPromise;
|
|
9
7
|
resolver: IconPromise;
|
|
10
8
|
constructor();
|
|
11
9
|
resolve(name: string, onResolved: (svg: string) => void): void;
|
|
12
10
|
static setCustomResolver(resolver: IconPromise): void;
|
|
11
|
+
get currentLoader(): IconPromise;
|
|
13
12
|
}
|
|
14
13
|
//# sourceMappingURL=sds-icon-loader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-icon-loader.d.ts","sourceRoot":"","sources":["../../src/sds-icon/sds-icon-loader.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;AAEhE,eAAO,MAAM,YAAY,EAAE,WAMxB,CAAC;AAEJ,eAAO,MAAM,cAAc,EAAE,WAQ5B,CAAC;AAEF,qBAAa,aAAa;IACzB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;
|
|
1
|
+
{"version":3,"file":"sds-icon-loader.d.ts","sourceRoot":"","sources":["../../src/sds-icon/sds-icon-loader.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;AAEhE,eAAO,MAAM,YAAY,EAAE,WAMxB,CAAC;AAEJ,eAAO,MAAM,cAAc,EAAE,WAQ5B,CAAC;AAEF,qBAAa,aAAa;IACzB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;IACnD,MAAM,CAAC,eAAe,EAAE,WAAW,CAAkB;IACrD,QAAQ,EAAE,WAAW,CAAC;;IAMtB,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,GAAG,IAAI;IAkB9D,MAAM,CAAC,iBAAiB,CAAC,QAAQ,EAAE,WAAW,GAAG,IAAI;IAIrD,IAAI,aAAa,IAAI,WAAW,CAE/B;CACD"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
var _a;
|
|
2
1
|
export const loadCdnIcons = async (name) => await fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {
|
|
3
2
|
if (!response.ok) {
|
|
4
3
|
throw new TypeError(`Sheriff: unknown icon: '${name}'`);
|
|
@@ -12,13 +11,13 @@ export const loadLocalIcons = async (name) => {
|
|
|
12
11
|
}
|
|
13
12
|
catch (error) {
|
|
14
13
|
console.warn(`Local icon '${name}' could not be loaded. Falling back to CDN.`);
|
|
15
|
-
return loadCdnIcons(name);
|
|
14
|
+
return loadCdnIcons(name);
|
|
16
15
|
}
|
|
17
16
|
};
|
|
18
17
|
export class SDSIconLoader {
|
|
19
18
|
constructor() {
|
|
20
19
|
this.cache = new Map();
|
|
21
|
-
this.resolver =
|
|
20
|
+
this.resolver = SDSIconLoader.defaultResolver;
|
|
22
21
|
}
|
|
23
22
|
resolve(name, onResolved) {
|
|
24
23
|
const cached = this.cache.get(name);
|
|
@@ -36,37 +35,12 @@ export class SDSIconLoader {
|
|
|
36
35
|
onResolved(svg);
|
|
37
36
|
});
|
|
38
37
|
}
|
|
39
|
-
// Allow consumers to override the resolver
|
|
40
38
|
static setCustomResolver(resolver) {
|
|
41
|
-
|
|
39
|
+
SDSIconLoader.defaultResolver = resolver;
|
|
42
40
|
}
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
// Default resolver: First try CDN, then fallback to local node_modules
|
|
46
|
-
SDSIconLoader.defaultResolver = async (name) => {
|
|
47
|
-
try {
|
|
48
|
-
// Try to load from CDN
|
|
49
|
-
return await _a.loadCdnIcons(name);
|
|
50
|
-
}
|
|
51
|
-
catch (error) {
|
|
52
|
-
console.warn(`CDN icon '${name}' not found, falling back to local.`);
|
|
53
|
-
return _a.loadLocalIcons(name);
|
|
41
|
+
get currentLoader() {
|
|
42
|
+
return this.resolver;
|
|
54
43
|
}
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
SDSIconLoader.loadCdnIcons = async (name) => fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {
|
|
58
|
-
if (!response.ok)
|
|
59
|
-
throw new Error(`Sheriff: unknown icon '${name}'`);
|
|
60
|
-
return response.text();
|
|
61
|
-
});
|
|
62
|
-
// Local Resolver (fallback)
|
|
63
|
-
SDSIconLoader.loadLocalIcons = async (name) => {
|
|
64
|
-
try {
|
|
65
|
-
const { default: svg } = await import(`@politiet/sheriff-icons/dist/${name}.js`);
|
|
66
|
-
return svg;
|
|
67
|
-
}
|
|
68
|
-
catch (error) {
|
|
69
|
-
throw new Error(`Local icon '${name}' could not be loaded.`);
|
|
70
|
-
}
|
|
71
|
-
};
|
|
44
|
+
}
|
|
45
|
+
SDSIconLoader.defaultResolver = loadLocalIcons;
|
|
72
46
|
//# sourceMappingURL=sds-icon-loader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-icon-loader.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon-loader.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sds-icon-loader.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon-loader.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,YAAY,GAAgB,KAAK,EAAE,IAAY,EAAE,EAAE,CAC/D,MAAM,KAAK,CAAC,kDAAkD,IAAI,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;IAC3F,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;QAClB,MAAM,IAAI,SAAS,CAAC,2BAA2B,IAAI,GAAG,CAAC,CAAC;IACzD,CAAC;IACD,OAAO,QAAQ,CAAC,IAAI,EAAE,CAAC;AACxB,CAAC,CAAC,CAAC;AAEJ,MAAM,CAAC,MAAM,cAAc,GAAgB,KAAK,EAAE,IAAY,EAAE,EAAE;IACjE,IAAI,CAAC;QACJ,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,MAAM,MAAM,CAAC,gCAAgC,IAAI,KAAK,CAAC,CAAC;QACjF,OAAO,GAAG,CAAC;IACZ,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QAChB,OAAO,CAAC,IAAI,CAAC,eAAe,IAAI,6CAA6C,CAAC,CAAC;QAC/E,OAAO,YAAY,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;AACF,CAAC,CAAC;AAEF,MAAM,OAAO,aAAa;IAKzB;QAJiB,UAAK,GAAG,IAAI,GAAG,EAAkB,CAAC;QAKlD,IAAI,CAAC,QAAQ,GAAG,aAAa,CAAC,eAAe,CAAC;IAC/C,CAAC;IAED,OAAO,CAAC,IAAY,EAAE,UAAiC;QACtD,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACpC,IAAI,MAAM,IAAI,IAAI,EAAE,CAAC;YACpB,UAAU,CAAC,MAAM,CAAC,CAAC;YACnB,OAAO;QACR,CAAC;QAED,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;aACjB,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;YAChB,OAAO,CAAC,KAAK,CAAC,yBAAyB,IAAI,IAAI,EAAE,KAAK,CAAC,CAAC;YACxD,OAAO,EAAE,CAAC;QACX,CAAC,CAAC;aACD,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;YACb,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;YAC1B,UAAU,CAAC,GAAG,CAAC,CAAC;QACjB,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,CAAC,iBAAiB,CAAC,QAAqB;QAC7C,aAAa,CAAC,eAAe,GAAG,QAAQ,CAAC;IAC1C,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACtB,CAAC;;AA/BM,6BAAe,GAAgB,cAAc,AAA9B,CAA+B","sourcesContent":["export type IconPromise = (iconName: string) => Promise<string>;\n\nexport const loadCdnIcons: IconPromise = async (name: string) =>\n\tawait fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {\n\t\tif (!response.ok) {\n\t\t\tthrow new TypeError(`Sheriff: unknown icon: '${name}'`);\n\t\t}\n\t\treturn response.text();\n\t});\n\nexport const loadLocalIcons: IconPromise = async (name: string) => {\n\ttry {\n\t\tconst { default: svg } = await import(`@politiet/sheriff-icons/dist/${name}.js`);\n\t\treturn svg;\n\t} catch (error) {\n\t\tconsole.warn(`Local icon '${name}' could not be loaded. Falling back to CDN.`);\n\t\treturn loadCdnIcons(name);\n\t}\n};\n\nexport class SDSIconLoader {\n\tprivate readonly cache = new Map<string, string>();\n\tstatic defaultResolver: IconPromise = loadLocalIcons;\n\tresolver: IconPromise;\n\n\tconstructor() {\n\t\tthis.resolver = SDSIconLoader.defaultResolver;\n\t}\n\n\tresolve(name: string, onResolved: (svg: string) => void): void {\n\t\tconst cached = this.cache.get(name);\n\t\tif (cached != null) {\n\t\t\tonResolved(cached);\n\t\t\treturn;\n\t\t}\n\n\t\tthis.resolver(name)\n\t\t\t.catch((error) => {\n\t\t\t\tconsole.error(`Failed to fetch icon '${name}':`, error);\n\t\t\t\treturn '';\n\t\t\t})\n\t\t\t.then((svg) => {\n\t\t\t\tthis.cache.set(name, svg);\n\t\t\t\tonResolved(svg);\n\t\t\t});\n\t}\n\n\tstatic setCustomResolver(resolver: IconPromise): void {\n\t\tSDSIconLoader.defaultResolver = resolver;\n\t}\n\n\tget currentLoader(): IconPromise {\n\t\treturn this.resolver;\n\t}\n}\n"]}
|
|
@@ -8,7 +8,7 @@ var SDSIcon_1;
|
|
|
8
8
|
import { LitElement, html } from 'lit';
|
|
9
9
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
10
10
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
11
|
-
import {
|
|
11
|
+
import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
|
|
12
12
|
import { SDSIconLoader } from './sds-icon-loader';
|
|
13
13
|
import { styles } from './sds-icon.styles';
|
|
14
14
|
let SDSIcon = SDSIcon_1 = class SDSIcon extends LitElement {
|
|
@@ -53,7 +53,7 @@ let SDSIcon = SDSIcon_1 = class SDSIcon extends LitElement {
|
|
|
53
53
|
aria-label="${ifDefined(this.label)}"
|
|
54
54
|
>
|
|
55
55
|
${this.name
|
|
56
|
-
? html `<slot aria-hidden="true">${
|
|
56
|
+
? html `<slot aria-hidden="true">${unsafeSVG(this.svg)}</slot>`
|
|
57
57
|
: html `<slot aria-hidden="true"></slot>`}
|
|
58
58
|
</div>`;
|
|
59
59
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-icon.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"sds-icon.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { SDSIconLoader, type IconPromise } from './sds-icon-loader';\nimport { styles } from './sds-icon.styles';\n\n// Types\nimport { type IconType } from './sds-icon.icon-types';\nimport { type ColorType } from './sds-icon.color-types';\ntype IconSize = 's' | 'm';\ntype IconTypes = IconType | '';\ntype IconColors = ColorType | '';\n\nexport interface SDSIconProps {\n\tname?: IconTypes;\n\tsize?: IconSize;\n\tcolor?: IconColors;\n\tlabel?: string;\n}\n\n@customElement('sds-icon')\nexport class SDSIcon extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\tprivate static readonly iconLoader = new SDSIconLoader();\n\n\tstatic registerResolver(resolver: IconPromise): void {\n\t\tthis.iconLoader.resolver = resolver;\n\t}\n\n\t@property({ type: String, reflect: true }) name: IconTypes = '';\n\t@property({ type: String, reflect: true }) size: IconSize = 'm';\n\t@property({ type: String, reflect: true }) color: IconColors = '';\n\t@property({ type: String, reflect: true }) label: string = '';\n\n\t@state() private svg: string = '';\n\n\tprivate async fetchIcon() {\n\t\tif (!this.name) {\n\t\t\tthis.svg = '';\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tconst svg = await new Promise<string>((resolve) => {\n\t\t\t\tSDSIcon.iconLoader.resolve(this.name, resolve);\n\t\t\t});\n\t\t\tthis.svg = svg;\n\t\t} catch (error) {\n\t\t\tconsole.error(`Failed to fetch SVG for icon '${this.name}':`, error);\n\t\t\tthis.svg = '';\n\t\t}\n\t}\n\n\toverride updated(changedProperties: Map<string | number | symbol, unknown>): void {\n\t\tsuper.updated(changedProperties);\n\n\t\tif (changedProperties.has('name') && this.name) {\n\t\t\tvoid this.fetchIcon();\n\t\t}\n\t}\n\n\toverride render() {\n\t\treturn html`<div\n\t\t\tclass=\"sds-icon\"\n\t\t\trole=\"${ifDefined(this.label ? 'img' : undefined)}\"\n\t\t\tstyle=\"${ifDefined(this.color ? `color:${this.color}` : undefined)}\"\n\t\t\taria-label=\"${ifDefined(this.label)}\"\n\t\t>\n\t\t\t${this.name\n\t\t\t\t? html`<slot aria-hidden=\"true\">${unsafeSVG(this.svg)}</slot>`\n\t\t\t\t: html`<slot aria-hidden=\"true\"></slot>`}\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-icon': SDSIcon;\n\t}\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-switch.d.ts","sourceRoot":"","sources":["../../src/sds-switch/sds-switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,KAAK,UAAU,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5B,MAAM,WAAW,cAAc;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC7E,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC5E,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;CAC3E;AAED,qBACa,SAAU,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAAY;IAEU,QAAQ,EAAE,OAAO,CAAS;IAC3B,KAAK,EAAE,MAAM,CAAM;IACO,SAAS,EAAE,OAAO,CAAS;IACpD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAM;IACnB,OAAO,EAAE,OAAO,CAAS;IACzB,OAAO,EAAE,OAAO,CAAS;IAC1B,IAAI,EAAE,UAAU,CAAO;IAE/C,OAAO,EAAG,gBAAgB,CAAC;IAE9C,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;IAC5C,OAAO,CAAC,eAAe,CAAkB;;IAQhC,iBAAiB,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"sds-switch.d.ts","sourceRoot":"","sources":["../../src/sds-switch/sds-switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,KAAK,UAAU,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5B,MAAM,WAAW,cAAc;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC7E,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC5E,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;CAC3E;AAED,qBACa,SAAU,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAAY;IAEU,QAAQ,EAAE,OAAO,CAAS;IAC3B,KAAK,EAAE,MAAM,CAAM;IACO,SAAS,EAAE,OAAO,CAAS;IACpD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAM;IACnB,OAAO,EAAE,OAAO,CAAS;IACzB,OAAO,EAAE,OAAO,CAAS;IAC1B,IAAI,EAAE,UAAU,CAAO;IAE/C,OAAO,EAAG,gBAAgB,CAAC;IAE9C,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;IAC5C,OAAO,CAAC,eAAe,CAAkB;;IAQhC,iBAAiB,IAAI,IAAI;IAQzB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC;IAO1E,iBAAiB;IAMjB,wBAAwB,CAAC,KAAK,EAAE,OAAO;IAIvC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAc5B;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAW3B;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAW1B;IAEO,MAAM;CA4Bf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}
|
|
@@ -25,6 +25,7 @@ let SDSSwitch = class SDSSwitch extends LitElement {
|
|
|
25
25
|
if (!this.disabled) {
|
|
26
26
|
const elem = event.target;
|
|
27
27
|
this.checked = elem.checked;
|
|
28
|
+
this.internals.setFormValue(this.checked ? this.value : '');
|
|
28
29
|
this.dispatchEvent(new CustomEvent('change', {
|
|
29
30
|
detail: { checked: this.checked, value: this.value },
|
|
30
31
|
bubbles: true,
|
|
@@ -57,20 +58,21 @@ let SDSSwitch = class SDSSwitch extends LitElement {
|
|
|
57
58
|
}
|
|
58
59
|
connectedCallback() {
|
|
59
60
|
super.connectedCallback();
|
|
60
|
-
|
|
61
|
-
|
|
61
|
+
this._initialChecked = this.checked;
|
|
62
|
+
if (this.checked) {
|
|
63
|
+
this.internals.setFormValue(this.value ? this.value : '');
|
|
62
64
|
}
|
|
63
65
|
}
|
|
64
66
|
updated(changedProperties) {
|
|
65
67
|
if (changedProperties.has('checked')) {
|
|
66
68
|
this.control.checked = this.checked;
|
|
67
|
-
this.internals.setFormValue(this.checked ? this.value :
|
|
69
|
+
this.internals.setFormValue(this.checked ? this.value : '');
|
|
68
70
|
}
|
|
69
71
|
}
|
|
70
72
|
formResetCallback() {
|
|
71
73
|
this.checked = this._initialChecked;
|
|
72
74
|
this.control.checked = this._initialChecked;
|
|
73
|
-
this.internals.setFormValue(this._initialChecked ? this.value :
|
|
75
|
+
this.internals.setFormValue(this._initialChecked ? this.value : '');
|
|
74
76
|
}
|
|
75
77
|
formStateRestoreCallback(state) {
|
|
76
78
|
this.checked = state;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-switch.js","sourceRoot":"","sources":["../../src/sds-switch/sds-switch.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAmBtC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAkBxC;QACC,KAAK,EAAE,CAAC;QAhBmC,aAAQ,GAAY,KAAK,CAAC;QAC3B,UAAK,GAAW,EAAE,CAAC;QACO,cAAS,GAAY,KAAK,CAAC;QAEpD,UAAK,GAAW,EAAE,CAAC;QACnB,YAAO,GAAY,KAAK,CAAC;QACzB,YAAO,GAAY,KAAK,CAAC;QAC1B,SAAI,GAAe,GAAG,CAAC;QAM1D,oBAAe,GAAY,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-switch.js","sourceRoot":"","sources":["../../src/sds-switch/sds-switch.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-switch.styles';\n\ntype SwitchSize = 's' | 'l';\n\nexport interface SDSSwitchProps {\n\tdisabled?: boolean;\n\tlabel?: string;\n\t'hide-label'?: boolean;\n\tname?: string;\n\tvalue?: string;\n\treverse?: boolean;\n\tchecked?: boolean;\n\tsize?: SwitchSize;\n\tonChange?: (event: CustomEvent<{ checked: boolean; value: string }>) => void;\n\tonFocus?: (event: CustomEvent<{ checked: boolean; value: string }>) => void;\n\tonBlur?: (event: CustomEvent<{ checked: boolean; value: string }>) => void;\n}\n\n@customElement('sds-switch')\nexport class SDSSwitch extends LitElement {\n\tstatic override styles = [styles];\n\n\t@property({ type: Boolean, reflect: true }) disabled: boolean = false;\n\t@property({ type: String, reflect: true }) label: string = '';\n\t@property({ type: Boolean, reflect: true, attribute: 'hide-label' }) hideLabel: boolean = false;\n\t@property({ type: String, reflect: false }) name?: string;\n\t@property({ type: String, reflect: false }) value: string = '';\n\t@property({ type: Boolean, reflect: true }) reverse: boolean = false;\n\t@property({ type: Boolean, reflect: true }) checked: boolean = false;\n\t@property({ type: String, reflect: true }) size: SwitchSize = 'l';\n\n\t@query('#control') control!: HTMLInputElement;\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\tprivate _initialChecked: boolean = false;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t\tthis.attachShadow({ mode: 'open', delegatesFocus: true });\n\t}\n\n\toverride connectedCallback(): void {\n\t\tsuper.connectedCallback();\n\t\tthis._initialChecked = this.checked;\n\t\tif (this.checked) {\n\t\t\tthis.internals.setFormValue(this.value ? this.value : '');\n\t\t}\n\t}\n\n\toverride updated(changedProperties: Map<string | number | symbol, unknown>) {\n\t\tif (changedProperties.has('checked')) {\n\t\t\tthis.control.checked = this.checked;\n\t\t\tthis.internals.setFormValue(this.checked ? this.value : '');\n\t\t}\n\t}\n\n\tformResetCallback() {\n\t\tthis.checked = this._initialChecked;\n\t\tthis.control.checked = this._initialChecked;\n\t\tthis.internals.setFormValue(this._initialChecked ? this.value : '');\n\t}\n\n\tformStateRestoreCallback(state: unknown) {\n\t\tthis.checked = state as boolean;\n\t}\n\n\tprivate readonly _handleChange = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tconst elem = event.target as HTMLInputElement;\n\t\t\tthis.checked = elem.checked;\n\t\t\tthis.internals.setFormValue(this.checked ? this.value : '');\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('change', {\n\t\t\t\t\tdetail: { checked: this.checked, value: this.value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('focus', {\n\t\t\t\t\tdetail: { checked: this.checked, value: this.value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleBlur = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('blur', {\n\t\t\t\t\tdetail: { checked: this.checked, value: this.value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\toverride render() {\n\t\tconst switchClasses = {\n\t\t\t'sds-switch': true,\n\t\t\t'sds-switch--small': this.size === 's',\n\t\t};\n\n\t\tconst labelClasses = {\n\t\t\t'sds-switch__label': true,\n\t\t\t'sds-switch__label--hidden': this.hideLabel,\n\t\t};\n\n\t\tconst inputTemplate = html`<input\n\t\t\tclass=\"sds-switch__input\"\n\t\t\tid=\"control\"\n\t\t\ttype=\"checkbox\"\n\t\t\trole=\"switch\"\n\t\t\t?checked=\"${this.checked}\"\n\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t@change=\"${this._handleChange}\"\n\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t@blur=\"${this._handleBlur}\"\n\t\t/>`;\n\t\tconst labelTemplate = html`<label class=\"${classMap(labelClasses)}\" for=\"control\">${this.label}</label>`;\n\t\treturn html`<div class=\"${classMap(switchClasses)}\">\n\t\t\t${this.reverse ? [labelTemplate, inputTemplate] : [inputTemplate, labelTemplate]}\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-switch': SDSSwitch;\n\t}\n}\n"]}
|
|
@@ -41,12 +41,17 @@ export declare class SDSTextField extends LitElement {
|
|
|
41
41
|
readOnly: boolean;
|
|
42
42
|
autocomplete: boolean;
|
|
43
43
|
private hasIcon;
|
|
44
|
+
control: HTMLInputElement;
|
|
45
|
+
static formAssociated: boolean;
|
|
46
|
+
readonly internals: ElementInternals;
|
|
47
|
+
constructor();
|
|
44
48
|
private readonly handleSlotChange;
|
|
45
49
|
private readonly _handleInput;
|
|
46
50
|
private readonly _handleChange;
|
|
47
51
|
private readonly _handleSelect;
|
|
48
52
|
private readonly _handleFocus;
|
|
49
53
|
private readonly _handleBlur;
|
|
54
|
+
formResetCallback(): void;
|
|
50
55
|
select(): void;
|
|
51
56
|
focus(): void;
|
|
52
57
|
blur(): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-textfield.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD,OAAO,sBAAsB,CAAC;AAE9B,KAAK,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,KAAK,CAAC;AAErF,MAAM,WAAW,iBAAiB;IACjC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC1D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,YAAY,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC1D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;CACzD;AAED,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,SAAS,CAAU;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACG,QAAQ,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACjD,QAAQ,EAAE,OAAO,CAAS;IACH,QAAQ,EAAE,OAAO,CAAS;IACjD,YAAY,EAAE,OAAO,CAAS;IAGlD,OAAO,CAAC,OAAO,CAAS;
|
|
1
|
+
{"version":3,"file":"sds-textfield.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD,OAAO,sBAAsB,CAAC;AAE9B,KAAK,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,KAAK,CAAC;AAErF,MAAM,WAAW,iBAAiB;IACjC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC1D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,YAAY,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC1D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;CACzD;AAED,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,SAAS,CAAU;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACG,QAAQ,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACjD,QAAQ,EAAE,OAAO,CAAS;IACH,QAAQ,EAAE,OAAO,CAAS;IACjD,YAAY,EAAE,OAAO,CAAS;IAGlD,OAAO,CAAC,OAAO,CAAS;IAER,OAAO,EAAG,gBAAgB,CAAC;IAEpD,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;;IAQ5C,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAG/B;IAGF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAa3B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAa5B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAc5B;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAS3B;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAS1B;IAEF,iBAAiB;IAMjB,MAAM,IAAI,IAAI;IAIL,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;CA+Cf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;CACD"}
|
|
@@ -5,14 +5,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
7
|
import { LitElement, html, nothing } from 'lit';
|
|
8
|
-
import { customElement, property, state } from 'lit/decorators.js';
|
|
8
|
+
import { customElement, property, state, query } from 'lit/decorators.js';
|
|
9
9
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
10
10
|
import { classMap } from 'lit/directives/class-map.js';
|
|
11
11
|
import { styles } from './sds-textfield.styles';
|
|
12
12
|
import '../sds-icon/sds-icon';
|
|
13
13
|
let SDSTextField = class SDSTextField extends LitElement {
|
|
14
14
|
constructor() {
|
|
15
|
-
super(
|
|
15
|
+
super();
|
|
16
16
|
// Props
|
|
17
17
|
this.type = 'text';
|
|
18
18
|
this.disabled = false;
|
|
@@ -28,6 +28,7 @@ let SDSTextField = class SDSTextField extends LitElement {
|
|
|
28
28
|
this._handleInput = (event) => {
|
|
29
29
|
event.stopImmediatePropagation();
|
|
30
30
|
if (!this.disabled) {
|
|
31
|
+
this.internals.setFormValue(event.target.value);
|
|
31
32
|
this.dispatchEvent(new CustomEvent('input', {
|
|
32
33
|
detail: { value: event.target.value },
|
|
33
34
|
bubbles: true,
|
|
@@ -38,6 +39,7 @@ let SDSTextField = class SDSTextField extends LitElement {
|
|
|
38
39
|
this._handleChange = (event) => {
|
|
39
40
|
event.stopImmediatePropagation();
|
|
40
41
|
if (!this.disabled) {
|
|
42
|
+
this.internals.setFormValue(event.target.value);
|
|
41
43
|
this.dispatchEvent(new CustomEvent('change', {
|
|
42
44
|
detail: { value: event.target.value },
|
|
43
45
|
bubbles: true,
|
|
@@ -73,6 +75,13 @@ let SDSTextField = class SDSTextField extends LitElement {
|
|
|
73
75
|
composed: true,
|
|
74
76
|
}));
|
|
75
77
|
};
|
|
78
|
+
this.internals = this.attachInternals();
|
|
79
|
+
this.attachShadow({ mode: 'open', delegatesFocus: true });
|
|
80
|
+
}
|
|
81
|
+
formResetCallback() {
|
|
82
|
+
const resetValue = this.value ? this.value : '';
|
|
83
|
+
this.control.value = resetValue;
|
|
84
|
+
this.internals.setFormValue(resetValue);
|
|
76
85
|
}
|
|
77
86
|
select() {
|
|
78
87
|
if (!this.disabled)
|
|
@@ -139,6 +148,7 @@ let SDSTextField = class SDSTextField extends LitElement {
|
|
|
139
148
|
};
|
|
140
149
|
// Styling
|
|
141
150
|
SDSTextField.styles = [styles];
|
|
151
|
+
SDSTextField.formAssociated = true;
|
|
142
152
|
__decorate([
|
|
143
153
|
property({ type: String })
|
|
144
154
|
], SDSTextField.prototype, "type", void 0);
|
|
@@ -172,6 +182,9 @@ __decorate([
|
|
|
172
182
|
__decorate([
|
|
173
183
|
state()
|
|
174
184
|
], SDSTextField.prototype, "hasIcon", void 0);
|
|
185
|
+
__decorate([
|
|
186
|
+
query('#sds-textfield')
|
|
187
|
+
], SDSTextField.prototype, "control", void 0);
|
|
175
188
|
SDSTextField = __decorate([
|
|
176
189
|
customElement('sds-textfield')
|
|
177
190
|
], SDSTextField);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-textfield.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,OAAO,sBAAsB,CAAC;AAuBvB,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAIN,QAAQ;QACoB,SAAI,GAAc,MAAM,CAAC;QAOxB,aAAQ,GAAY,KAAK,CAAC;QACH,aAAQ,GAAY,KAAK,CAAC;QACjD,iBAAY,GAAY,KAAK,CAAC;QAE3D,QAAQ;QACS,YAAO,GAAG,KAAK,CAAC;QAEhB,qBAAgB,GAAG,CAAC,CAAQ,EAAE,EAAE;YAChD,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAC;YACzC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;QACjE,CAAC,CAAC;QAEF,iBAAiB;QACA,iBAAY,GAAG,CAAC,KAAiB,EAAE,EAAE;YACrD,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACjC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACpB,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,OAAO,EAAE;oBACxB,MAAM,EAAE,EAAE,KAAK,EAAG,KAAK,CAAC,MAA2B,CAAC,KAAK,EAAE;oBAC3D,OAAO,EAAE,IAAI;oBACb,QAAQ,EAAE,IAAI;iBACd,CAAC,CACF,CAAC;YACH,CAAC;QACF,CAAC,CAAC;QAEe,kBAAa,GAAG,CAAC,KAAY,EAAE,EAAE;YACjD,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACjC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACpB,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,QAAQ,EAAE;oBACzB,MAAM,EAAE,EAAE,KAAK,EAAG,KAAK,CAAC,MAA2B,CAAC,KAAK,EAAE;oBAC3D,OAAO,EAAE,IAAI;oBACb,QAAQ,EAAE,IAAI;iBACd,CAAC,CACF,CAAC;YACH,CAAC;QACF,CAAC,CAAC;QAEe,kBAAa,GAAG,CAAC,KAAY,EAAE,EAAE;YACjD,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACjC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACpB,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;gBAChD,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,cAAc,IAAI,CAAC,EAAE,MAAM,CAAC,YAAY,IAAI,CAAC,CAAC,CAAC;gBAElG,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,QAAQ,EAAE;oBACzB,MAAM,EAAE,EAAE,YAAY,EAAE;oBACxB,OAAO,EAAE,IAAI;oBACb,QAAQ,EAAE,IAAI;iBACd,CAAC,CACF,CAAC;YACH,CAAC;QACF,CAAC,CAAC;QAEe,iBAAY,GAAG,CAAC,KAAiB,EAAE,EAAE;YACrD,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACjC,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,OAAO,EAAE;gBACxB,MAAM,EAAE,EAAE,KAAK,EAAG,KAAK,CAAC,MAA2B,CAAC,KAAK,EAAE;gBAC3D,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACd,CAAC,CACF,CAAC;QACH,CAAC,CAAC;QAEe,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;YACpD,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACjC,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,MAAM,EAAE;gBACvB,MAAM,EAAE,EAAE,KAAK,EAAG,KAAK,CAAC,MAA2B,CAAC,KAAK,EAAE;gBAC3D,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACd,CAAC,CACF,CAAC;QACH,CAAC,CAAC;IAiEH,CAAC;IA/DA,MAAM;QACL,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACvE,CAAC;IAEQ,KAAK;QACb,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC;IACtE,CAAC;IAEQ,IAAI;QACZ,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC;IACrE,CAAC;IAEQ,KAAK;QACb,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC;IACtE,CAAC;IAEQ,MAAM;QACd,MAAM,gBAAgB,GAAG;YACxB,eAAe,EAAE,IAAI;YACrB,sBAAsB,EAAE,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC;YAClD,yBAAyB,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC;YACjD,yBAAyB,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC;YACjD,yBAAyB,EAAE,IAAI,CAAC,OAAO;SACvC,CAAC;QAEF,OAAO,IAAI,CAAA,gBAAgB,QAAQ,CAAC,gBAAgB,CAAC;KAClD,IAAI,CAAC,KAAK;YACX,CAAC,CAAC,IAAI,CAAA,2DAA2D,IAAI,CAAC,KAAK,UAAU;YACrF,CAAC,CAAC,OAAO;KACR,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,uCAAuC,IAAI,CAAC,QAAQ,MAAM,CAAC,CAAC,CAAC,OAAO;;;;aAIhF,IAAI,CAAC,IAAI;;kBAEJ,IAAI,CAAC,QAAQ;kBACb,IAAI,CAAC,QAAQ;oBACX,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC;cACjC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;aACtB,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;qBACZ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK;eACtC,IAAI,CAAC,YAAY;gBAChB,IAAI,CAAC,aAAa;gBAClB,IAAI,CAAC,aAAa;eACnB,IAAI,CAAC,YAAY;cAClB,IAAI,CAAC,WAAW;;sCAEQ,IAAI,CAAC,gBAAgB;;KAEtD,IAAI,CAAC,YAAY;YAClB,CAAC,CAAC,IAAI,CAAA;;;;gBAIM,CAAC,IAAI,CAAC,QAAQ;gBACtB,CAAC,CAAC,yCAAyC;gBAC3C,CAAC,CAAC,yCAAyC;;SAE1C,IAAI,CAAC,YAAY;UAChB;YACN,CAAC,CAAC,OAAO;SACJ,CAAC;IACT,CAAC;;AAtJD,UAAU;AACM,mBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAA0B;AACzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAgB;AACf;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAgB;AACf;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAsB;AACG;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;8CAAmB;AACd;IAAvD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;kDAAuB;AACjD;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CAA2B;AACH;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;8CAA2B;AACjD;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDAA+B;AAG1C;IAAhB,KAAK,EAAE;6CAAyB;AAjBrB,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAwJxB","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-textfield.styles';\n\nimport '../sds-icon/sds-icon';\n\ntype InputType = 'text' | 'email' | 'tel' | 'number' | 'password' | 'search' | 'url';\n\nexport interface SDSTextFieldProps {\n\ttype?: InputType;\n\tvalue?: string;\n\tname?: string;\n\tlabel?: string;\n\tplaceholder?: string;\n\t'help-text'?: string;\n\t'error-message'?: string;\n\tdisabled?: boolean;\n\treadonly?: boolean;\n\tautocomplete?: boolean;\n\tonInput?: (event: CustomEvent<{ value: string }>) => void;\n\tonChange?: (event: CustomEvent<{ value: string }>) => void;\n\tonSelect?: (event: CustomEvent<{ selectedText: string }>) => void;\n\tonFocus?: (event: CustomEvent<{ value: string }>) => void;\n\tonBlur?: (event: CustomEvent<{ value: string }>) => void;\n}\n\n@customElement('sds-textfield')\nexport class SDSTextField extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Props\n\t@property({ type: String }) type: InputType = 'text';\n\t@property({ type: String }) value?: string;\n\t@property({ type: String }) name?: string;\n\t@property({ type: String }) label?: string;\n\t@property({ type: String }) placeholder?: string;\n\t@property({ type: String, attribute: 'help-text' }) helpText?: string;\n\t@property({ type: String, attribute: 'error-message' }) errorMessage?: string;\n\t@property({ type: Boolean }) disabled: boolean = false;\n\t@property({ type: Boolean, attribute: 'readonly' }) readOnly: boolean = false;\n\t@property({ type: Boolean }) autocomplete: boolean = false;\n\n\t// State\n\t@state() private hasIcon = false;\n\n\tprivate readonly handleSlotChange = (e: Event) => {\n\t\tconst slot = e.target as HTMLSlotElement;\n\t\tthis.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;\n\t};\n\n\t// Event handling\n\tprivate readonly _handleInput = (event: InputEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('input', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleChange = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('change', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleSelect = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tconst target = event.target as HTMLInputElement;\n\t\t\tconst selectedText = target.value.substring(target.selectionStart ?? 0, target.selectionEnd ?? 0);\n\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('select', {\n\t\t\t\t\tdetail: { selectedText },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('focus', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('blur', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tselect(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.select();\n\t}\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.click();\n\t}\n\n\toverride render() {\n\t\tconst textfieldClasses = {\n\t\t\t'sds-textfield': true,\n\t\t\t'sds-textfield--error': Boolean(this.errorMessage),\n\t\t\t'sds-textfield--disabled': Boolean(this.disabled),\n\t\t\t'sds-textfield--readonly': Boolean(this.readOnly),\n\t\t\t'sds-textfield--has-icon': this.hasIcon,\n\t\t};\n\n\t\treturn html` <div class=\"${classMap(textfieldClasses)}\">\n\t\t\t${this.label\n\t\t\t\t? html`<label for=\"sds-textfield\" class=\"sds-textfield__label\">${this.label}</label>`\n\t\t\t\t: nothing}\n\t\t\t${this.helpText ? html`<p class=\"sds-textfield__help-text\">${this.helpText}</p>` : nothing}\n\t\t\t<div class=\"sds-textfield__input-container\">\n\t\t\t\t<input\n\t\t\t\t\tclass=\"sds-textfield__input\"\n\t\t\t\t\ttype=\"${this.type}\"\n\t\t\t\t\tid=\"sds-textfield\"\n\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\tautocomplete=\"${this.autocomplete ? 'on' : 'off'}\"\n\t\t\t\t\t@input=\"${this._handleInput}\"\n\t\t\t\t\t@change=\"${this._handleChange}\"\n\t\t\t\t\t@select=\"${this._handleSelect}\"\n\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t/>\n\t\t\t\t<slot name=\"after\" @slotchange=\"${this.handleSlotChange}\" aria-hidden=\"true\"></slot>\n\t\t\t</div>\n\t\t\t${this.errorMessage\n\t\t\t\t? html`<p class=\"sds-textfield__error-message\">\n\t\t\t\t\t\t<sds-icon\n\t\t\t\t\t\t\tname=\"warning-material-filled\"\n\t\t\t\t\t\t\tsize=\"m\"\n\t\t\t\t\t\t\tcolor=\"${!this.disabled\n\t\t\t\t\t\t\t\t? `var(--sds-color-semantic-icon-critical)`\n\t\t\t\t\t\t\t\t: `var(--sds-color-semantic-icon-disabled)`}\"\n\t\t\t\t\t\t></sds-icon\n\t\t\t\t\t\t>${this.errorMessage}\n\t\t\t\t\t</p>`\n\t\t\t\t: nothing}\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-textfield': SDSTextField;\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"sds-textfield.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-textfield.styles';\n\nimport '../sds-icon/sds-icon';\n\ntype InputType = 'text' | 'email' | 'tel' | 'number' | 'password' | 'search' | 'url';\n\nexport interface SDSTextFieldProps {\n\ttype?: InputType;\n\tvalue?: string;\n\tname?: string;\n\tlabel?: string;\n\tplaceholder?: string;\n\t'help-text'?: string;\n\t'error-message'?: string;\n\tdisabled?: boolean;\n\treadonly?: boolean;\n\tautocomplete?: boolean;\n\tonInput?: (event: CustomEvent<{ value: string }>) => void;\n\tonChange?: (event: CustomEvent<{ value: string }>) => void;\n\tonSelect?: (event: CustomEvent<{ selectedText: string }>) => void;\n\tonFocus?: (event: CustomEvent<{ value: string }>) => void;\n\tonBlur?: (event: CustomEvent<{ value: string }>) => void;\n}\n\n@customElement('sds-textfield')\nexport class SDSTextField extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Props\n\t@property({ type: String }) type: InputType = 'text';\n\t@property({ type: String }) value?: string;\n\t@property({ type: String }) name?: string;\n\t@property({ type: String }) label?: string;\n\t@property({ type: String }) placeholder?: string;\n\t@property({ type: String, attribute: 'help-text' }) helpText?: string;\n\t@property({ type: String, attribute: 'error-message' }) errorMessage?: string;\n\t@property({ type: Boolean }) disabled: boolean = false;\n\t@property({ type: Boolean, attribute: 'readonly' }) readOnly: boolean = false;\n\t@property({ type: Boolean }) autocomplete: boolean = false;\n\n\t// State\n\t@state() private hasIcon = false;\n\n\t@query('#sds-textfield') control!: HTMLInputElement;\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t\tthis.attachShadow({ mode: 'open', delegatesFocus: true });\n\t}\n\n\tprivate readonly handleSlotChange = (e: Event) => {\n\t\tconst slot = e.target as HTMLSlotElement;\n\t\tthis.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;\n\t};\n\n\t// Event handling\n\tprivate readonly _handleInput = (event: InputEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.internals.setFormValue((event.target as HTMLInputElement).value);\n\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('input', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleChange = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.internals.setFormValue((event.target as HTMLInputElement).value);\n\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('change', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleSelect = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tconst target = event.target as HTMLInputElement;\n\t\t\tconst selectedText = target.value.substring(target.selectionStart ?? 0, target.selectionEnd ?? 0);\n\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('select', {\n\t\t\t\t\tdetail: { selectedText },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('focus', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('blur', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tformResetCallback() {\n\t\tconst resetValue: string = this.value ? this.value : '';\n\t\tthis.control.value = resetValue;\n\t\tthis.internals.setFormValue(resetValue);\n\t}\n\n\tselect(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.select();\n\t}\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.click();\n\t}\n\n\toverride render() {\n\t\tconst textfieldClasses = {\n\t\t\t'sds-textfield': true,\n\t\t\t'sds-textfield--error': Boolean(this.errorMessage),\n\t\t\t'sds-textfield--disabled': Boolean(this.disabled),\n\t\t\t'sds-textfield--readonly': Boolean(this.readOnly),\n\t\t\t'sds-textfield--has-icon': this.hasIcon,\n\t\t};\n\n\t\treturn html` <div class=\"${classMap(textfieldClasses)}\">\n\t\t\t${this.label\n\t\t\t\t? html`<label for=\"sds-textfield\" class=\"sds-textfield__label\">${this.label}</label>`\n\t\t\t\t: nothing}\n\t\t\t${this.helpText ? html`<p class=\"sds-textfield__help-text\">${this.helpText}</p>` : nothing}\n\t\t\t<div class=\"sds-textfield__input-container\">\n\t\t\t\t<input\n\t\t\t\t\tclass=\"sds-textfield__input\"\n\t\t\t\t\ttype=\"${this.type}\"\n\t\t\t\t\tid=\"sds-textfield\"\n\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\tautocomplete=\"${this.autocomplete ? 'on' : 'off'}\"\n\t\t\t\t\t@input=\"${this._handleInput}\"\n\t\t\t\t\t@change=\"${this._handleChange}\"\n\t\t\t\t\t@select=\"${this._handleSelect}\"\n\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t/>\n\t\t\t\t<slot name=\"after\" @slotchange=\"${this.handleSlotChange}\" aria-hidden=\"true\"></slot>\n\t\t\t</div>\n\t\t\t${this.errorMessage\n\t\t\t\t? html`<p class=\"sds-textfield__error-message\">\n\t\t\t\t\t\t<sds-icon\n\t\t\t\t\t\t\tname=\"warning-material-filled\"\n\t\t\t\t\t\t\tsize=\"m\"\n\t\t\t\t\t\t\tcolor=\"${!this.disabled\n\t\t\t\t\t\t\t\t? `var(--sds-color-semantic-icon-critical)`\n\t\t\t\t\t\t\t\t: `var(--sds-color-semantic-icon-disabled)`}\"\n\t\t\t\t\t\t></sds-icon\n\t\t\t\t\t\t>${this.errorMessage}\n\t\t\t\t\t</p>`\n\t\t\t\t: nothing}\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-textfield': SDSTextField;\n\t}\n}\n"]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Copyright 2019 Google LLC
|
|
4
4
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
5
|
*/
|
|
6
|
-
const t$
|
|
6
|
+
const t$4 = globalThis, e$7 = t$4.ShadowRoot && (void 0 === t$4.ShadyCSS || t$4.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, s$1 = Symbol(), o$5 = /* @__PURE__ */ new WeakMap();
|
|
7
7
|
let n$3 = class n {
|
|
8
8
|
constructor(t2, e2, o2) {
|
|
9
9
|
if (this._$cssResult$ = true, o2 !== s$1) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
|
|
@@ -32,7 +32,7 @@ const r$5 = (t2) => new n$3("string" == typeof t2 ? t2 : t2 + "", void 0, s$1),
|
|
|
32
32
|
}, S$1 = (s2, o2) => {
|
|
33
33
|
if (e$7) s2.adoptedStyleSheets = o2.map((t2) => t2 instanceof CSSStyleSheet ? t2 : t2.styleSheet);
|
|
34
34
|
else for (const e2 of o2) {
|
|
35
|
-
const o3 = document.createElement("style"), n3 = t$
|
|
35
|
+
const o3 = document.createElement("style"), n3 = t$4.litNonce;
|
|
36
36
|
void 0 !== n3 && o3.setAttribute("nonce", n3), o3.textContent = e2.cssText, s2.appendChild(o3);
|
|
37
37
|
}
|
|
38
38
|
}, c$2 = e$7 ? (t2) => t2 : (t2) => t2 instanceof CSSStyleSheet ? ((t3) => {
|
|
@@ -258,7 +258,7 @@ b.elementStyles = [], b.shadowRootOptions = { mode: "open" }, b[d$1("elementProp
|
|
|
258
258
|
* Copyright 2017 Google LLC
|
|
259
259
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
260
260
|
*/
|
|
261
|
-
const t$
|
|
261
|
+
const t$3 = globalThis, i$2 = t$3.trustedTypes, s = i$2 ? i$2.createPolicy("lit-html", { createHTML: (t2) => t2 }) : void 0, e$5 = "$lit$", h = `lit$${Math.random().toFixed(9).slice(2)}$`, o$3 = "?" + h, n$1 = `<${o$3}>`, r$3 = document, l = () => r$3.createComment(""), c = (t2) => null === t2 || "object" != typeof t2 && "function" != typeof t2, a = Array.isArray, u = (t2) => a(t2) || "function" == typeof t2?.[Symbol.iterator], d = "[ \n\f\r]", f = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, v = /-->/g, _ = />/g, m = RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^
|
|
262
262
|
\f\r"'\`<>=]|("|')|))|$)`, "g"), p = /'/g, g = /"/g, $ = /^(?:script|style|textarea|title)$/i, y = (t2) => (i2, ...s2) => ({ _$litType$: t2, strings: i2, values: s2 }), x = y(1), T = Symbol.for("lit-noChange"), E = Symbol.for("lit-nothing"), A = /* @__PURE__ */ new WeakMap(), C = r$3.createTreeWalker(r$3, 129);
|
|
263
263
|
function P(t2, i2) {
|
|
264
264
|
if (!a(t2) || !t2.hasOwnProperty("raw")) throw Error("invalid template strings array");
|
|
@@ -471,8 +471,8 @@ class z {
|
|
|
471
471
|
S(this, t2);
|
|
472
472
|
}
|
|
473
473
|
}
|
|
474
|
-
const j = t$
|
|
475
|
-
j?.(N, R), (t$
|
|
474
|
+
const j = t$3.litHtmlPolyfillSupport;
|
|
475
|
+
j?.(N, R), (t$3.litHtmlVersions ??= []).push("3.2.1");
|
|
476
476
|
const B = (t2, i2, s2) => {
|
|
477
477
|
const e2 = s2?.renderBefore ?? i2;
|
|
478
478
|
let h2 = e2._$litPart$;
|
|
@@ -518,7 +518,7 @@ i$1?.({ LitElement: r$2 });
|
|
|
518
518
|
* Copyright 2017 Google LLC
|
|
519
519
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
520
520
|
*/
|
|
521
|
-
const t$
|
|
521
|
+
const t$2 = (t2) => (e2, o2) => {
|
|
522
522
|
void 0 !== o2 ? o2.addInitializer(() => {
|
|
523
523
|
customElements.define(t2, e2);
|
|
524
524
|
}) : customElements.define(t2, e2);
|
|
@@ -587,7 +587,7 @@ function e$3(e2, r3) {
|
|
|
587
587
|
* Copyright 2017 Google LLC
|
|
588
588
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
589
589
|
*/
|
|
590
|
-
const t = { ATTRIBUTE: 1, CHILD: 2 }, e$2 = (t2) => (...e2) => ({ _$litDirective$: t2, values: e2 });
|
|
590
|
+
const t$1 = { ATTRIBUTE: 1, CHILD: 2 }, e$2 = (t2) => (...e2) => ({ _$litDirective$: t2, values: e2 });
|
|
591
591
|
class i {
|
|
592
592
|
constructor(t2) {
|
|
593
593
|
}
|
|
@@ -610,8 +610,8 @@ class i {
|
|
|
610
610
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
611
611
|
*/
|
|
612
612
|
const e$1 = e$2(class extends i {
|
|
613
|
-
constructor(
|
|
614
|
-
if (super(
|
|
613
|
+
constructor(t2) {
|
|
614
|
+
if (super(t2), t2.type !== t$1.ATTRIBUTE || "class" !== t2.name || t2.strings?.length > 2) throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.");
|
|
615
615
|
}
|
|
616
616
|
render(t2) {
|
|
617
617
|
return " " + Object.keys(t2).filter((s2) => t2[s2]).join(" ") + " ";
|
|
@@ -816,9 +816,9 @@ let SDSButton = class extends r$2 {
|
|
|
816
816
|
if (this.form) {
|
|
817
817
|
const root = this.getRootNode();
|
|
818
818
|
const formElement = root.querySelector(`form#${this.form}`);
|
|
819
|
-
formElement?.
|
|
819
|
+
formElement?.requestSubmit();
|
|
820
820
|
} else if (this.internals.form) {
|
|
821
|
-
this.internals.form.
|
|
821
|
+
this.internals.form.requestSubmit();
|
|
822
822
|
}
|
|
823
823
|
}
|
|
824
824
|
break;
|
|
@@ -914,7 +914,7 @@ __decorateClass$h([
|
|
|
914
914
|
n2({ type: String, reflect: true })
|
|
915
915
|
], SDSButton.prototype, "form", 2);
|
|
916
916
|
SDSButton = __decorateClass$h([
|
|
917
|
-
t$
|
|
917
|
+
t$2("sds-button")
|
|
918
918
|
], SDSButton);
|
|
919
919
|
const styles$g = i$4`
|
|
920
920
|
:host {
|
|
@@ -1040,11 +1040,13 @@ let SDSCheckbox = class extends r$2 {
|
|
|
1040
1040
|
this.checked = false;
|
|
1041
1041
|
this.disabled = false;
|
|
1042
1042
|
this.error = false;
|
|
1043
|
+
this._initialChecked = false;
|
|
1043
1044
|
this._handleChange = (event) => {
|
|
1044
1045
|
event.stopImmediatePropagation();
|
|
1045
1046
|
if (!this.disabled) {
|
|
1046
1047
|
const elem = event.target;
|
|
1047
1048
|
this.checked = elem.checked;
|
|
1049
|
+
this.internals.setFormValue(elem.checked ? elem.value : "");
|
|
1048
1050
|
this.dispatchEvent(
|
|
1049
1051
|
new CustomEvent("change", {
|
|
1050
1052
|
detail: { checked: this.checked, value: elem.value },
|
|
@@ -1077,6 +1079,20 @@ let SDSCheckbox = class extends r$2 {
|
|
|
1077
1079
|
this.internals = this.attachInternals();
|
|
1078
1080
|
this.attachShadow({ mode: "open", delegatesFocus: true });
|
|
1079
1081
|
}
|
|
1082
|
+
connectedCallback() {
|
|
1083
|
+
super.connectedCallback();
|
|
1084
|
+
this._initialChecked = this.checked;
|
|
1085
|
+
this.internals.role = "checkbox";
|
|
1086
|
+
if (this.checked) {
|
|
1087
|
+
this.internals.setFormValue(this.value ? this.value : "");
|
|
1088
|
+
}
|
|
1089
|
+
}
|
|
1090
|
+
formResetCallback() {
|
|
1091
|
+
this.checked = this._initialChecked;
|
|
1092
|
+
this.control.checked = this._initialChecked;
|
|
1093
|
+
const resetValue = this.checked && this.value ? this.value : "";
|
|
1094
|
+
this.internals.setFormValue(resetValue);
|
|
1095
|
+
}
|
|
1080
1096
|
focus() {
|
|
1081
1097
|
if (!this.disabled) this.shadowRoot?.querySelector("input")?.focus();
|
|
1082
1098
|
}
|
|
@@ -1099,6 +1115,7 @@ let SDSCheckbox = class extends r$2 {
|
|
|
1099
1115
|
<div class="${e$1(checkboxClasses)}">
|
|
1100
1116
|
<label class="sds-checkbox__label">
|
|
1101
1117
|
<input
|
|
1118
|
+
id="control"
|
|
1102
1119
|
type="checkbox"
|
|
1103
1120
|
name="${o$1(this.name)}"
|
|
1104
1121
|
value="${o$1(this.value)}"
|
|
@@ -1135,8 +1152,11 @@ __decorateClass$g([
|
|
|
1135
1152
|
__decorateClass$g([
|
|
1136
1153
|
n2({ type: Boolean, reflect: true })
|
|
1137
1154
|
], SDSCheckbox.prototype, "error", 2);
|
|
1155
|
+
__decorateClass$g([
|
|
1156
|
+
e$3("#control")
|
|
1157
|
+
], SDSCheckbox.prototype, "control", 2);
|
|
1138
1158
|
SDSCheckbox = __decorateClass$g([
|
|
1139
|
-
t$
|
|
1159
|
+
t$2("sds-checkbox")
|
|
1140
1160
|
], SDSCheckbox);
|
|
1141
1161
|
const styles$f = i$4`
|
|
1142
1162
|
:host {
|
|
@@ -1195,7 +1215,7 @@ const styles$f = i$4`
|
|
|
1195
1215
|
*/
|
|
1196
1216
|
class e extends i {
|
|
1197
1217
|
constructor(i2) {
|
|
1198
|
-
if (super(i2), this.it = E, i2.type !== t.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
|
|
1218
|
+
if (super(i2), this.it = E, i2.type !== t$1.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
|
|
1199
1219
|
}
|
|
1200
1220
|
render(r3) {
|
|
1201
1221
|
if (r3 === E || null == r3) return this._t = void 0, this.it = r3;
|
|
@@ -1208,7 +1228,21 @@ class e extends i {
|
|
|
1208
1228
|
}
|
|
1209
1229
|
}
|
|
1210
1230
|
e.directiveName = "unsafeHTML", e.resultType = 1;
|
|
1211
|
-
|
|
1231
|
+
/**
|
|
1232
|
+
* @license
|
|
1233
|
+
* Copyright 2017 Google LLC
|
|
1234
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
1235
|
+
*/
|
|
1236
|
+
class t extends e {
|
|
1237
|
+
}
|
|
1238
|
+
t.directiveName = "unsafeSVG", t.resultType = 2;
|
|
1239
|
+
const o = e$2(t);
|
|
1240
|
+
const loadCdnIcons = async (name) => await fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {
|
|
1241
|
+
if (!response.ok) {
|
|
1242
|
+
throw new TypeError(`Sheriff: unknown icon: '${name}'`);
|
|
1243
|
+
}
|
|
1244
|
+
return response.text();
|
|
1245
|
+
});
|
|
1212
1246
|
const _SDSIconLoader = class _SDSIconLoader {
|
|
1213
1247
|
constructor() {
|
|
1214
1248
|
this.cache = /* @__PURE__ */ new Map();
|
|
@@ -1228,31 +1262,14 @@ const _SDSIconLoader = class _SDSIconLoader {
|
|
|
1228
1262
|
onResolved(svg);
|
|
1229
1263
|
});
|
|
1230
1264
|
}
|
|
1231
|
-
// Allow consumers to override the resolver
|
|
1232
1265
|
static setCustomResolver(resolver) {
|
|
1233
1266
|
_SDSIconLoader.defaultResolver = resolver;
|
|
1234
1267
|
}
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
try {
|
|
1238
|
-
return await _SDSIconLoader.loadCdnIcons(name);
|
|
1239
|
-
} catch (error) {
|
|
1240
|
-
console.warn(`CDN icon '${name}' not found, falling back to local.`);
|
|
1241
|
-
return _SDSIconLoader.loadLocalIcons(name);
|
|
1242
|
-
}
|
|
1243
|
-
};
|
|
1244
|
-
_SDSIconLoader.loadCdnIcons = async (name) => fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {
|
|
1245
|
-
if (!response.ok) throw new Error(`Sheriff: unknown icon '${name}'`);
|
|
1246
|
-
return response.text();
|
|
1247
|
-
});
|
|
1248
|
-
_SDSIconLoader.loadLocalIcons = async (name) => {
|
|
1249
|
-
try {
|
|
1250
|
-
const { default: svg } = await import(`@politiet/sheriff-icons/dist/${name}.js`);
|
|
1251
|
-
return svg;
|
|
1252
|
-
} catch (error) {
|
|
1253
|
-
throw new Error(`Local icon '${name}' could not be loaded.`);
|
|
1268
|
+
get currentLoader() {
|
|
1269
|
+
return this.resolver;
|
|
1254
1270
|
}
|
|
1255
1271
|
};
|
|
1272
|
+
_SDSIconLoader.defaultResolver = loadCdnIcons;
|
|
1256
1273
|
let SDSIconLoader = _SDSIconLoader;
|
|
1257
1274
|
const styles$e = i$4`
|
|
1258
1275
|
:host {
|
|
@@ -1339,7 +1356,7 @@ __decorateClass$f([
|
|
|
1339
1356
|
r2()
|
|
1340
1357
|
], SDSIcon.prototype, "svg", 2);
|
|
1341
1358
|
SDSIcon = __decorateClass$f([
|
|
1342
|
-
t$
|
|
1359
|
+
t$2("sds-icon")
|
|
1343
1360
|
], SDSIcon);
|
|
1344
1361
|
var __defProp$e = Object.defineProperty;
|
|
1345
1362
|
var __getOwnPropDesc$e = Object.getOwnPropertyDescriptor;
|
|
@@ -1407,7 +1424,7 @@ __decorateClass$e([
|
|
|
1407
1424
|
r2()
|
|
1408
1425
|
], SDSCheckboxGroup.prototype, "selectedValues", 2);
|
|
1409
1426
|
SDSCheckboxGroup = __decorateClass$e([
|
|
1410
|
-
t$
|
|
1427
|
+
t$2("sds-checkbox-group")
|
|
1411
1428
|
], SDSCheckboxGroup);
|
|
1412
1429
|
const styles$d = i$4`
|
|
1413
1430
|
.sds-chip {
|
|
@@ -1495,15 +1512,17 @@ var __decorateClass$d = (decorators, target, key, kind) => {
|
|
|
1495
1512
|
};
|
|
1496
1513
|
let SDSChip = class extends r$2 {
|
|
1497
1514
|
constructor() {
|
|
1498
|
-
super(
|
|
1515
|
+
super();
|
|
1499
1516
|
this.variant = "selectable";
|
|
1500
1517
|
this.size = "large";
|
|
1501
1518
|
this.checked = false;
|
|
1502
1519
|
this.disabled = false;
|
|
1520
|
+
this._initialChecked = false;
|
|
1503
1521
|
this._toggle = (event) => {
|
|
1504
1522
|
event.preventDefault();
|
|
1505
1523
|
event.stopImmediatePropagation();
|
|
1506
1524
|
this.checked = !this.checked;
|
|
1525
|
+
this.internals.setFormValue(this.checked && this.value ? this.value : "");
|
|
1507
1526
|
this.dispatchEvent(
|
|
1508
1527
|
new CustomEvent("change", {
|
|
1509
1528
|
detail: { value: this.value, isChecked: this.checked },
|
|
@@ -1520,6 +1539,21 @@ let SDSChip = class extends r$2 {
|
|
|
1520
1539
|
})
|
|
1521
1540
|
);
|
|
1522
1541
|
};
|
|
1542
|
+
this.internals = this.attachInternals();
|
|
1543
|
+
this.attachShadow({ mode: "open", delegatesFocus: true });
|
|
1544
|
+
}
|
|
1545
|
+
connectedCallback() {
|
|
1546
|
+
super.connectedCallback();
|
|
1547
|
+
this._initialChecked = this.checked;
|
|
1548
|
+
this.internals.role = "checkbox";
|
|
1549
|
+
if (this.checked) {
|
|
1550
|
+
this.internals.setFormValue(this.value ? this.value : "");
|
|
1551
|
+
}
|
|
1552
|
+
}
|
|
1553
|
+
formResetCallback() {
|
|
1554
|
+
this.checked = this._initialChecked;
|
|
1555
|
+
const resetValue = this.checked && this.value ? this.value : "";
|
|
1556
|
+
this.internals.setFormValue(resetValue);
|
|
1523
1557
|
}
|
|
1524
1558
|
focus() {
|
|
1525
1559
|
if (!this.disabled) this.shadowRoot?.querySelector("input")?.focus();
|
|
@@ -1543,6 +1577,7 @@ let SDSChip = class extends r$2 {
|
|
|
1543
1577
|
}
|
|
1544
1578
|
return x`<label class="${e$1(chipClasses)}" @click="${this._toggle}">
|
|
1545
1579
|
<input
|
|
1580
|
+
id="control"
|
|
1546
1581
|
type="checkbox"
|
|
1547
1582
|
name="${o$1(this.name)}"
|
|
1548
1583
|
value="${o$1(this.value)}"
|
|
@@ -1554,6 +1589,7 @@ let SDSChip = class extends r$2 {
|
|
|
1554
1589
|
}
|
|
1555
1590
|
};
|
|
1556
1591
|
SDSChip.styles = [styles$d];
|
|
1592
|
+
SDSChip.formAssociated = true;
|
|
1557
1593
|
__decorateClass$d([
|
|
1558
1594
|
n2({ type: String, reflect: true })
|
|
1559
1595
|
], SDSChip.prototype, "variant", 2);
|
|
@@ -1572,8 +1608,11 @@ __decorateClass$d([
|
|
|
1572
1608
|
__decorateClass$d([
|
|
1573
1609
|
n2({ type: Boolean, reflect: true })
|
|
1574
1610
|
], SDSChip.prototype, "disabled", 2);
|
|
1611
|
+
__decorateClass$d([
|
|
1612
|
+
e$3("#control")
|
|
1613
|
+
], SDSChip.prototype, "control", 2);
|
|
1575
1614
|
SDSChip = __decorateClass$d([
|
|
1576
|
-
t$
|
|
1615
|
+
t$2("sds-chip")
|
|
1577
1616
|
], SDSChip);
|
|
1578
1617
|
const styles$c = i$4`
|
|
1579
1618
|
:host {
|
|
@@ -1628,7 +1667,7 @@ __decorateClass$c([
|
|
|
1628
1667
|
n2({ type: String })
|
|
1629
1668
|
], SDSDetail.prototype, "variation", 2);
|
|
1630
1669
|
SDSDetail = __decorateClass$c([
|
|
1631
|
-
t$
|
|
1670
|
+
t$2("sds-detail")
|
|
1632
1671
|
], SDSDetail);
|
|
1633
1672
|
const styles$b = i$4`
|
|
1634
1673
|
:host {
|
|
@@ -1784,7 +1823,7 @@ __decorateClass$b([
|
|
|
1784
1823
|
n2({ type: String })
|
|
1785
1824
|
], SDSHeading.prototype, "as", 2);
|
|
1786
1825
|
SDSHeading = __decorateClass$b([
|
|
1787
|
-
t$
|
|
1826
|
+
t$2("sds-heading")
|
|
1788
1827
|
], SDSHeading);
|
|
1789
1828
|
const styles$a = i$4`
|
|
1790
1829
|
:host {
|
|
@@ -1849,7 +1888,7 @@ __decorateClass$a([
|
|
|
1849
1888
|
n2({ type: String })
|
|
1850
1889
|
], SDSLabel.prototype, "for", 2);
|
|
1851
1890
|
SDSLabel = __decorateClass$a([
|
|
1852
|
-
t$
|
|
1891
|
+
t$2("sds-label")
|
|
1853
1892
|
], SDSLabel);
|
|
1854
1893
|
const styles$9 = i$4`
|
|
1855
1894
|
:host {
|
|
@@ -1962,7 +2001,7 @@ __decorateClass$9([
|
|
|
1962
2001
|
n2({ type: String })
|
|
1963
2002
|
], SDSLink.prototype, "target", 2);
|
|
1964
2003
|
SDSLink = __decorateClass$9([
|
|
1965
|
-
t$
|
|
2004
|
+
t$2("sds-link")
|
|
1966
2005
|
], SDSLink);
|
|
1967
2006
|
const styles$8 = i$4`
|
|
1968
2007
|
:host {
|
|
@@ -2034,7 +2073,7 @@ __decorateClass$8([
|
|
|
2034
2073
|
n2({ type: String, reflect: true })
|
|
2035
2074
|
], SDSLoader.prototype, "color", 2);
|
|
2036
2075
|
SDSLoader = __decorateClass$8([
|
|
2037
|
-
t$
|
|
2076
|
+
t$2("sds-loader")
|
|
2038
2077
|
], SDSLoader);
|
|
2039
2078
|
const styles$7 = i$4`
|
|
2040
2079
|
:host {
|
|
@@ -2277,7 +2316,7 @@ __decorateClass$7([
|
|
|
2277
2316
|
e$3("slot")
|
|
2278
2317
|
], SDSNavCard.prototype, "iconSlot", 2);
|
|
2279
2318
|
SDSNavCard = __decorateClass$7([
|
|
2280
|
-
t$
|
|
2319
|
+
t$2("sds-nav-card")
|
|
2281
2320
|
], SDSNavCard);
|
|
2282
2321
|
const styles$6 = i$4`
|
|
2283
2322
|
:host {
|
|
@@ -2500,7 +2539,7 @@ __decorateClass$6([
|
|
|
2500
2539
|
n2({ type: String, attribute: "removable-label", reflect: true })
|
|
2501
2540
|
], SDSNotification.prototype, "removableLabel", 2);
|
|
2502
2541
|
SDSNotification = __decorateClass$6([
|
|
2503
|
-
t$
|
|
2542
|
+
t$2("sds-notification")
|
|
2504
2543
|
], SDSNotification);
|
|
2505
2544
|
const styles$5 = i$4`
|
|
2506
2545
|
:host {
|
|
@@ -2568,7 +2607,7 @@ __decorateClass$5([
|
|
|
2568
2607
|
n2({ type: String })
|
|
2569
2608
|
], SDSParagraph.prototype, "size", 2);
|
|
2570
2609
|
SDSParagraph = __decorateClass$5([
|
|
2571
|
-
t$
|
|
2610
|
+
t$2("sds-paragraph")
|
|
2572
2611
|
], SDSParagraph);
|
|
2573
2612
|
const styles$4 = i$4`
|
|
2574
2613
|
:host {
|
|
@@ -2898,7 +2937,7 @@ __decorateClass$4([
|
|
|
2898
2937
|
e$3("#control")
|
|
2899
2938
|
], SDSRadio.prototype, "control", 2);
|
|
2900
2939
|
SDSRadio = __decorateClass$4([
|
|
2901
|
-
t$
|
|
2940
|
+
t$2("sds-radio")
|
|
2902
2941
|
], SDSRadio);
|
|
2903
2942
|
const styles$3 = i$4`
|
|
2904
2943
|
.sds-radio-group {
|
|
@@ -3007,7 +3046,7 @@ __decorateClass$3([
|
|
|
3007
3046
|
r2()
|
|
3008
3047
|
], SDSRadioGroup.prototype, "selectedValue", 2);
|
|
3009
3048
|
SDSRadioGroup = __decorateClass$3([
|
|
3010
|
-
t$
|
|
3049
|
+
t$2("sds-radio-group")
|
|
3011
3050
|
], SDSRadioGroup);
|
|
3012
3051
|
const styles$2 = i$4`
|
|
3013
3052
|
:host {
|
|
@@ -3158,6 +3197,7 @@ let SDSSwitch = class extends r$2 {
|
|
|
3158
3197
|
if (!this.disabled) {
|
|
3159
3198
|
const elem = event.target;
|
|
3160
3199
|
this.checked = elem.checked;
|
|
3200
|
+
this.internals.setFormValue(this.checked ? this.value : "");
|
|
3161
3201
|
this.dispatchEvent(
|
|
3162
3202
|
new CustomEvent("change", {
|
|
3163
3203
|
detail: { checked: this.checked, value: this.value },
|
|
@@ -3196,20 +3236,21 @@ let SDSSwitch = class extends r$2 {
|
|
|
3196
3236
|
}
|
|
3197
3237
|
connectedCallback() {
|
|
3198
3238
|
super.connectedCallback();
|
|
3199
|
-
|
|
3200
|
-
|
|
3239
|
+
this._initialChecked = this.checked;
|
|
3240
|
+
if (this.checked) {
|
|
3241
|
+
this.internals.setFormValue(this.value ? this.value : "");
|
|
3201
3242
|
}
|
|
3202
3243
|
}
|
|
3203
3244
|
updated(changedProperties) {
|
|
3204
3245
|
if (changedProperties.has("checked")) {
|
|
3205
3246
|
this.control.checked = this.checked;
|
|
3206
|
-
this.internals.setFormValue(this.checked ? this.value :
|
|
3247
|
+
this.internals.setFormValue(this.checked ? this.value : "");
|
|
3207
3248
|
}
|
|
3208
3249
|
}
|
|
3209
3250
|
formResetCallback() {
|
|
3210
3251
|
this.checked = this._initialChecked;
|
|
3211
3252
|
this.control.checked = this._initialChecked;
|
|
3212
|
-
this.internals.setFormValue(this._initialChecked ? this.value :
|
|
3253
|
+
this.internals.setFormValue(this._initialChecked ? this.value : "");
|
|
3213
3254
|
}
|
|
3214
3255
|
formStateRestoreCallback(state) {
|
|
3215
3256
|
this.checked = state;
|
|
@@ -3271,7 +3312,7 @@ __decorateClass$2([
|
|
|
3271
3312
|
e$3("#control")
|
|
3272
3313
|
], SDSSwitch.prototype, "control", 2);
|
|
3273
3314
|
SDSSwitch = __decorateClass$2([
|
|
3274
|
-
t$
|
|
3315
|
+
t$2("sds-switch")
|
|
3275
3316
|
], SDSSwitch);
|
|
3276
3317
|
const styles$1 = i$4`
|
|
3277
3318
|
:host {
|
|
@@ -3333,7 +3374,7 @@ __decorateClass$1([
|
|
|
3333
3374
|
n2({ type: String })
|
|
3334
3375
|
], SDSText.prototype, "size", 2);
|
|
3335
3376
|
SDSText = __decorateClass$1([
|
|
3336
|
-
t$
|
|
3377
|
+
t$2("sds-text")
|
|
3337
3378
|
], SDSText);
|
|
3338
3379
|
const styles = i$4`
|
|
3339
3380
|
:host {
|
|
@@ -3461,7 +3502,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
3461
3502
|
};
|
|
3462
3503
|
let SDSTextField = class extends r$2 {
|
|
3463
3504
|
constructor() {
|
|
3464
|
-
super(
|
|
3505
|
+
super();
|
|
3465
3506
|
this.type = "text";
|
|
3466
3507
|
this.disabled = false;
|
|
3467
3508
|
this.readOnly = false;
|
|
@@ -3474,6 +3515,7 @@ let SDSTextField = class extends r$2 {
|
|
|
3474
3515
|
this._handleInput = (event) => {
|
|
3475
3516
|
event.stopImmediatePropagation();
|
|
3476
3517
|
if (!this.disabled) {
|
|
3518
|
+
this.internals.setFormValue(event.target.value);
|
|
3477
3519
|
this.dispatchEvent(
|
|
3478
3520
|
new CustomEvent("input", {
|
|
3479
3521
|
detail: { value: event.target.value },
|
|
@@ -3486,6 +3528,7 @@ let SDSTextField = class extends r$2 {
|
|
|
3486
3528
|
this._handleChange = (event) => {
|
|
3487
3529
|
event.stopImmediatePropagation();
|
|
3488
3530
|
if (!this.disabled) {
|
|
3531
|
+
this.internals.setFormValue(event.target.value);
|
|
3489
3532
|
this.dispatchEvent(
|
|
3490
3533
|
new CustomEvent("change", {
|
|
3491
3534
|
detail: { value: event.target.value },
|
|
@@ -3529,6 +3572,13 @@ let SDSTextField = class extends r$2 {
|
|
|
3529
3572
|
})
|
|
3530
3573
|
);
|
|
3531
3574
|
};
|
|
3575
|
+
this.internals = this.attachInternals();
|
|
3576
|
+
this.attachShadow({ mode: "open", delegatesFocus: true });
|
|
3577
|
+
}
|
|
3578
|
+
formResetCallback() {
|
|
3579
|
+
const resetValue = this.value ? this.value : "";
|
|
3580
|
+
this.control.value = resetValue;
|
|
3581
|
+
this.internals.setFormValue(resetValue);
|
|
3532
3582
|
}
|
|
3533
3583
|
select() {
|
|
3534
3584
|
if (!this.disabled) this.shadowRoot?.querySelector("input")?.select();
|
|
@@ -3584,6 +3634,7 @@ let SDSTextField = class extends r$2 {
|
|
|
3584
3634
|
}
|
|
3585
3635
|
};
|
|
3586
3636
|
SDSTextField.styles = [styles];
|
|
3637
|
+
SDSTextField.formAssociated = true;
|
|
3587
3638
|
__decorateClass([
|
|
3588
3639
|
n2({ type: String })
|
|
3589
3640
|
], SDSTextField.prototype, "type", 2);
|
|
@@ -3617,8 +3668,11 @@ __decorateClass([
|
|
|
3617
3668
|
__decorateClass([
|
|
3618
3669
|
r2()
|
|
3619
3670
|
], SDSTextField.prototype, "hasIcon", 2);
|
|
3671
|
+
__decorateClass([
|
|
3672
|
+
e$3("#sds-textfield")
|
|
3673
|
+
], SDSTextField.prototype, "control", 2);
|
|
3620
3674
|
SDSTextField = __decorateClass([
|
|
3621
|
-
t$
|
|
3675
|
+
t$2("sds-textfield")
|
|
3622
3676
|
], SDSTextField);
|
|
3623
3677
|
export {
|
|
3624
3678
|
SDSButton,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@politiet/sheriff-web-components",
|
|
3
|
-
"version": "1.0.0-rc.
|
|
3
|
+
"version": "1.0.0-rc.6",
|
|
4
4
|
"description": "Sheriff Design System Web Components Library",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -140,8 +140,12 @@
|
|
|
140
140
|
"dependencies": {
|
|
141
141
|
"lit": "^3.2.0"
|
|
142
142
|
},
|
|
143
|
+
"optionalDependencies": {
|
|
144
|
+
"@lit/react": "^1.0.7",
|
|
145
|
+
"@politiet/sheriff-icons": "^1.0.0-rc.0"
|
|
146
|
+
},
|
|
143
147
|
"peerDependencies": {
|
|
144
|
-
"@politiet/sheriff-css-framework": "^1.0.0-rc.
|
|
148
|
+
"@politiet/sheriff-css-framework": "^1.0.0-rc.2"
|
|
145
149
|
},
|
|
146
150
|
"author": "Politiets IT-enhet",
|
|
147
151
|
"license": "ISC"
|