@politiet/sheriff-web-components 0.6.1 → 0.6.3
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/index.d.ts +18 -18
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +18 -18
- package/dist/index.js.map +1 -1
- package/dist/sds-button/sds-button.d.ts +17 -0
- package/dist/sds-button/sds-button.d.ts.map +1 -1
- package/dist/sds-button/sds-button.js +23 -3
- package/dist/sds-button/sds-button.js.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.d.ts +24 -0
- package/dist/sds-checkbox/sds-checkbox.d.ts.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.js +21 -0
- package/dist/sds-checkbox/sds-checkbox.js.map +1 -1
- package/dist/sds-checkbox-group/sds-checkbox-group.d.ts +14 -0
- package/dist/sds-checkbox-group/sds-checkbox-group.d.ts.map +1 -1
- package/dist/sds-checkbox-group/sds-checkbox-group.js +23 -2
- package/dist/sds-checkbox-group/sds-checkbox-group.js.map +1 -1
- package/dist/sds-chip/sds-chip.d.ts +18 -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-detail/sds-detail.d.ts +8 -0
- package/dist/sds-detail/sds-detail.d.ts.map +1 -1
- package/dist/sds-detail/sds-detail.js +21 -0
- package/dist/sds-detail/sds-detail.js.map +1 -1
- package/dist/sds-heading/sds-heading.d.ts +9 -0
- package/dist/sds-heading/sds-heading.d.ts.map +1 -1
- package/dist/sds-heading/sds-heading.js +21 -0
- package/dist/sds-heading/sds-heading.js.map +1 -1
- package/dist/sds-icon/sds-icon.d.ts +11 -0
- package/dist/sds-icon/sds-icon.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon.js +21 -0
- package/dist/sds-icon/sds-icon.js.map +1 -1
- package/dist/sds-label/sds-label.d.ts +9 -0
- package/dist/sds-label/sds-label.d.ts.map +1 -1
- package/dist/sds-label/sds-label.js +22 -3
- package/dist/sds-label/sds-label.js.map +1 -1
- package/dist/sds-link/sds-link.d.ts +10 -0
- package/dist/sds-link/sds-link.d.ts.map +1 -1
- package/dist/sds-link/sds-link.js +21 -0
- package/dist/sds-link/sds-link.js.map +1 -1
- package/dist/sds-loader/sds-loader.d.ts +9 -0
- package/dist/sds-loader/sds-loader.d.ts.map +1 -1
- package/dist/sds-loader/sds-loader.js +22 -1
- package/dist/sds-loader/sds-loader.js.map +1 -1
- package/dist/sds-nav-card/sds-nav-card.d.ts +16 -11
- package/dist/sds-nav-card/sds-nav-card.d.ts.map +1 -1
- package/dist/sds-nav-card/sds-nav-card.js +21 -11
- package/dist/sds-nav-card/sds-nav-card.js.map +1 -1
- package/dist/sds-notification/sds-notification.d.ts +10 -0
- package/dist/sds-notification/sds-notification.d.ts.map +1 -1
- package/dist/sds-notification/sds-notification.js +21 -0
- package/dist/sds-notification/sds-notification.js.map +1 -1
- package/dist/sds-paragraph/sds-paragraph.d.ts +8 -0
- package/dist/sds-paragraph/sds-paragraph.d.ts.map +1 -1
- package/dist/sds-paragraph/sds-paragraph.js +21 -0
- package/dist/sds-paragraph/sds-paragraph.js.map +1 -1
- package/dist/sds-radio/sds-radio.d.ts +25 -6
- package/dist/sds-radio/sds-radio.d.ts.map +1 -1
- package/dist/sds-radio/sds-radio.js +23 -9
- package/dist/sds-radio/sds-radio.js.map +1 -1
- package/dist/sds-radio-group/sds-radio-group.d.ts +14 -0
- package/dist/sds-radio-group/sds-radio-group.d.ts.map +1 -1
- package/dist/sds-radio-group/sds-radio-group.js +23 -6
- package/dist/sds-radio-group/sds-radio-group.js.map +1 -1
- package/dist/sds-switch/sds-switch.d.ts +3 -30
- package/dist/sds-switch/sds-switch.d.ts.map +1 -1
- package/dist/sds-switch/sds-switch.js +24 -54
- package/dist/sds-switch/sds-switch.js.map +1 -1
- package/dist/sds-text/sds-text.d.ts +8 -0
- package/dist/sds-text/sds-text.d.ts.map +1 -1
- package/dist/sds-text/sds-text.js +21 -0
- package/dist/sds-text/sds-text.js.map +1 -1
- package/dist/sds-textfield/sds-textfield.d.ts +35 -3
- package/dist/sds-textfield/sds-textfield.d.ts.map +1 -1
- package/dist/sds-textfield/sds-textfield.js +21 -0
- package/dist/sds-textfield/sds-textfield.js.map +1 -1
- package/package.json +91 -1
|
@@ -1 +1 @@
|
|
|
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\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: 's' | 'l' = 'l';\n\n\t@query('#control')\n\tcontrol!: 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\tif (!this._initialChecked) {\n\t\t\tthis._initialChecked = this.checked;\n\t\t}\n\t}\n\n\toverride updated(changedProperties: Map<string | number | symbol, unknown>) {\n\t\tif (changedProperties.has('checked')) {\n\t\t\tif (this.checked) {\n\t\t\t\tthis.control.checked = this.checked;\n\t\t\t\tthis.internals.setFormValue(this.value ?? null);\n\t\t\t} else {\n\t\t\t\tthis.control.checked = this.checked;\n\t\t\t\tthis.internals.setFormValue(null);\n\t\t\t}\n\t\t}\n\t}\n\n\t// ElementInternals callback when a form is reset\n\tformResetCallback() {\n\t\tthis.checked = this._initialChecked;\n\t\tthis.control.checked = this._initialChecked;\n\t\tthis.internals.setFormValue(this._initialChecked ? this.value ?? null : null);\n\t}\n\n\t// ElementInternals callback when a form is restored to its state from session history\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.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.control.focus();\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.control.blur();\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\tget form() {\n\t\treturn this.internals.form;\n\t}\n\n\tget type() {\n\t\treturn this.localName;\n\t}\n\n\tget validity() {\n\t\treturn this.internals.validity;\n\t}\n\n\tget validationMessage() {\n\t\treturn this.internals.validationMessage;\n\t}\n\n\tget willValidate() {\n\t\treturn this.internals.willValidate;\n\t}\n\n\tcheckValidity(): boolean {\n\t\treturn this.internals.checkValidity();\n\t}\n\n\treportValidity(): boolean {\n\t\treturn this.internals.reportValidity();\n\t}\n\n\tsetCustomValidity(message: string): void {\n\t\tthis.internals.setValidity({ customError: !!message }, message);\n\t}\n\n\tformDisabledCallback(disabled: boolean): void {\n\t\tthis.disabled = disabled;\n\t\tif (this.control) this.control.disabled = disabled;\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 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\tnamespace JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t'sds-switch': {\n\t\t\t\tdisabled?: boolean;\n\t\t\t\tlabel?: string;\n\t\t\t\t'hide-label'?: boolean;\n\t\t\t\tname?: string;\n\t\t\t\tvalue?: string;\n\t\t\t\treverse?: boolean;\n\t\t\t\tchecked?: boolean;\n\t\t\t\tsize?: 's' | 'l';\n\t\t\t\tonChange?: (event: CustomEvent) => void;\n\t\t\t\tonFocus?: (event: CustomEvent) => void;\n\t\t\t\tonBlur?: (event: CustomEvent) => void;\n\t\t\t} & React.DetailedHTMLProps<React.HTMLAttributes<SDSSwitch>, SDSSwitch>;\n\t\t}\n\t}\n}\n"]}
|
|
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\ninterface 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\tif (!this._initialChecked) {\n\t\t\tthis._initialChecked = this.checked;\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 : null);\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 : null);\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.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\n// HTML\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-switch': SDSSwitch;\n\t}\n}\n\n// React\ndeclare namespace JSX {\n\tinterface IntrinsicElements {\n\t\t'sds-switch': SDSSwitchProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\n\t}\n}\n/*\n// Angular\ndeclare module '@angular/core' {\n\tinterface IntrinsicElements {\n\t\t'sds-switch': SDSSwitchProps;\n\t}\n}\n\n// Vue\ndeclare module 'vue' {\n\texport interface GlobalComponents {\n\t\t'sds-switch': SDSSwitchProps;\n\t}\n}\n\n// Svelte\ndeclare namespace svelteHTML {\n\tinterface HTMLAttributes<T> {\n\t\t'sds-switch'?: SDSSwitchProps;\n\t}\n} */\n"]}
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
type Size = 'l' | 'm' | 's';
|
|
3
|
+
interface SDSTextProps {
|
|
4
|
+
size?: Size;
|
|
5
|
+
}
|
|
3
6
|
export declare class SDSText extends LitElement {
|
|
4
7
|
static styles: import("lit").CSSResult[];
|
|
5
8
|
size: Size;
|
|
@@ -9,6 +12,11 @@ declare global {
|
|
|
9
12
|
interface HTMLElementTagNameMap {
|
|
10
13
|
'sds-text': SDSText;
|
|
11
14
|
}
|
|
15
|
+
namespace JSX {
|
|
16
|
+
interface IntrinsicElements {
|
|
17
|
+
'sds-text': SDSTextProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
12
20
|
}
|
|
13
21
|
export {};
|
|
14
22
|
//# sourceMappingURL=sds-text.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-text.d.ts","sourceRoot":"","sources":["../../src/sds-text/sds-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,KAAK,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5B,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;
|
|
1
|
+
{"version":3,"file":"sds-text.d.ts","sourceRoot":"","sources":["../../src/sds-text/sds-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,KAAK,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5B,UAAU,YAAY;IACrB,IAAI,CAAC,EAAE,IAAI,CAAC;CACZ;AAED,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,IAAI,CAAO;IAEpC,MAAM;CAYf;AAED,OAAO,CAAC,MAAM,CAAC;IAEd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;IAGD,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,UAAU,EAAE,YAAY,GAAG,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,CAAC;SACnG;KACD;CACD"}
|
|
@@ -34,4 +34,25 @@ SDSText = __decorate([
|
|
|
34
34
|
customElement('sds-text')
|
|
35
35
|
], SDSText);
|
|
36
36
|
export { SDSText };
|
|
37
|
+
/*
|
|
38
|
+
// Angular
|
|
39
|
+
declare module '@angular/core' {
|
|
40
|
+
interface IntrinsicElements {
|
|
41
|
+
'sds-text': SDSTextProps;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
// Vue
|
|
46
|
+
declare module 'vue' {
|
|
47
|
+
export interface GlobalComponents {
|
|
48
|
+
'sds-text': SDSTextProps;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// Svelte
|
|
53
|
+
declare namespace svelteHTML {
|
|
54
|
+
interface HTMLAttributes<T> {
|
|
55
|
+
'sds-text'?: SDSTextProps;
|
|
56
|
+
}
|
|
57
|
+
} */
|
|
37
58
|
//# sourceMappingURL=sds-text.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-text.js","sourceRoot":"","sources":["../../src/sds-text/sds-text.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,MAAM,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-text.js","sourceRoot":"","sources":["../../src/sds-text/sds-text.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,MAAM,EAAE,MAAM,mBAAmB,CAAC;AASpC,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QAIN,iBAAiB;QACW,SAAI,GAAS,GAAG,CAAC;IAc9C,CAAC;IAZS,MAAM;QACd,MAAM,YAAY,GAAG;YACpB,UAAU,EAAE,IAAI;YAChB,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YAChC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YAChC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;SAChC,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;QAEvC,OAAO,IAAI,CAAA,YAAY,OAAO,oBAAoB,CAAC;IACpD,CAAC;;AAjBD,UAAU;AACM,cAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAkB;AALjC,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAmBnB;;AAgBD;;;;;;;;;;;;;;;;;;;;IAoBI","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-text.styles';\n\ntype Size = 'l' | 'm' | 's';\n\ninterface SDSTextProps {\n\tsize?: Size;\n}\n\n@customElement('sds-text')\nexport class SDSText extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) size: Size = 'l';\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-text': true,\n\t\t\t'sds-text--l': this.size === 'l',\n\t\t\t'sds-text--m': this.size === 'm',\n\t\t\t'sds-text--s': this.size === 's',\n\t\t};\n\n\t\tconst classes = classMap(styleClasses);\n\n\t\treturn html`<p class=${classes}><slot></slot></p>`;\n\t}\n}\n\ndeclare global {\n\t// HTML\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-text': SDSText;\n\t}\n\n\t// React\n\tnamespace JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t'sds-text': SDSTextProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\n\t\t}\n\t}\n}\n\n/*\n// Angular\ndeclare module '@angular/core' {\n\tinterface IntrinsicElements {\n\t\t'sds-text': SDSTextProps;\n\t}\n}\n\n// Vue\ndeclare module 'vue' {\n\texport interface GlobalComponents {\n\t\t'sds-text': SDSTextProps;\n\t}\n}\n\n// Svelte\ndeclare namespace svelteHTML {\n\tinterface HTMLAttributes<T> {\n\t\t'sds-text'?: SDSTextProps;\n\t}\n} */\n"]}
|
|
@@ -1,6 +1,33 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
import '../sds-icon/sds-icon';
|
|
3
3
|
type InputType = 'text' | 'email' | 'tel' | 'number' | 'password' | 'search' | 'url';
|
|
4
|
+
interface SDSTextFieldProps {
|
|
5
|
+
type?: InputType;
|
|
6
|
+
value?: string;
|
|
7
|
+
name?: string;
|
|
8
|
+
label?: string;
|
|
9
|
+
placeholder?: string;
|
|
10
|
+
'help-text'?: string;
|
|
11
|
+
'error-message'?: string;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
readonly?: boolean;
|
|
14
|
+
autocomplete?: boolean;
|
|
15
|
+
onInput?: (event: CustomEvent<{
|
|
16
|
+
value: string;
|
|
17
|
+
}>) => void;
|
|
18
|
+
onChange?: (event: CustomEvent<{
|
|
19
|
+
value: string;
|
|
20
|
+
}>) => void;
|
|
21
|
+
onSelect?: (event: CustomEvent<{
|
|
22
|
+
selectedText: string;
|
|
23
|
+
}>) => void;
|
|
24
|
+
onFocus?: (event: CustomEvent<{
|
|
25
|
+
value: string;
|
|
26
|
+
}>) => void;
|
|
27
|
+
onBlur?: (event: CustomEvent<{
|
|
28
|
+
value: string;
|
|
29
|
+
}>) => void;
|
|
30
|
+
}
|
|
4
31
|
export declare class SDSTextField extends LitElement {
|
|
5
32
|
static styles: import("lit").CSSResult[];
|
|
6
33
|
type: InputType;
|
|
@@ -10,9 +37,9 @@ export declare class SDSTextField extends LitElement {
|
|
|
10
37
|
placeholder?: string;
|
|
11
38
|
helpText?: string;
|
|
12
39
|
errorMessage?: string;
|
|
13
|
-
disabled
|
|
14
|
-
readOnly
|
|
15
|
-
autocomplete
|
|
40
|
+
disabled: boolean;
|
|
41
|
+
readOnly: boolean;
|
|
42
|
+
autocomplete: boolean;
|
|
16
43
|
private hasIcon;
|
|
17
44
|
private readonly handleSlotChange;
|
|
18
45
|
private readonly _handleInput;
|
|
@@ -30,6 +57,11 @@ declare global {
|
|
|
30
57
|
interface HTMLElementTagNameMap {
|
|
31
58
|
'sds-textfield': SDSTextField;
|
|
32
59
|
}
|
|
60
|
+
namespace JSX {
|
|
61
|
+
interface IntrinsicElements {
|
|
62
|
+
'sds-textfield': SDSTextFieldProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
33
65
|
}
|
|
34
66
|
export {};
|
|
35
67
|
//# sourceMappingURL=sds-textfield.d.ts.map
|
|
@@ -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,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;
|
|
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,UAAU,iBAAiB;IAC1B,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;IAEjC,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAG/B;IAGF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAW3B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAW5B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAc5B;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAS3B;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAS1B;IAEF,MAAM,IAAI,IAAI;IAIL,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;CA+Cf;AAED,OAAO,CAAC,MAAM,CAAC;IAEd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;IAGD,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,eAAe,EAAE,iBAAiB,GACjC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,CAAC;SACzE;KACD;CACD"}
|
|
@@ -176,4 +176,25 @@ SDSTextField = __decorate([
|
|
|
176
176
|
customElement('sds-textfield')
|
|
177
177
|
], SDSTextField);
|
|
178
178
|
export { SDSTextField };
|
|
179
|
+
/*
|
|
180
|
+
// Angular
|
|
181
|
+
declare module '@angular/core' {
|
|
182
|
+
interface IntrinsicElements {
|
|
183
|
+
'sds-textfield': SDSTextFieldProps;
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
// Vue
|
|
188
|
+
declare module 'vue' {
|
|
189
|
+
export interface GlobalComponents {
|
|
190
|
+
'sds-textfield': SDSTextFieldProps;
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
// Svelte
|
|
195
|
+
declare namespace svelteHTML {
|
|
196
|
+
interface HTMLAttributes<T> {
|
|
197
|
+
'sds-textfield'?: SDSTextFieldProps;
|
|
198
|
+
}
|
|
199
|
+
} */
|
|
179
200
|
//# sourceMappingURL=sds-textfield.js.map
|
|
@@ -1 +1 @@
|
|
|
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 } 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\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 })\n\ttype: InputType = 'text';\n\n\t@property({ type: String })\n\tvalue?: string;\n\n\t@property({ type: String })\n\tname?: string;\n\n\t@property({ type: String })\n\tlabel?: string;\n\n\t@property({ type: String })\n\tplaceholder?: string;\n\n\t@property({ type: String, attribute: 'help-text' })\n\thelpText?: string;\n\n\t@property({ type: String, attribute: 'error-message' })\n\terrorMessage?: string;\n\n\t@property({ type: Boolean })\n\tdisabled?: boolean = false;\n\n\t@property({ type: Boolean, attribute: 'readonly' })\n\treadOnly?: boolean = false;\n\n\t@property({ type: Boolean })\n\tautocomplete?: boolean = false;\n\n\t// State\n\t@state()\n\tprivate 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 } 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\ninterface 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\t// HTML\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-textfield': SDSTextField;\n\t}\n\n\t// React\n\tnamespace JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t'sds-textfield': SDSTextFieldProps &\n\t\t\t\tReact.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\n\t\t}\n\t}\n}\n\n/*\n// Angular\ndeclare module '@angular/core' {\n\tinterface IntrinsicElements {\n\t\t'sds-textfield': SDSTextFieldProps;\n\t}\n}\n\n// Vue\ndeclare module 'vue' {\n\texport interface GlobalComponents {\n\t\t'sds-textfield': SDSTextFieldProps;\n\t}\n}\n\n// Svelte\ndeclare namespace svelteHTML {\n\tinterface HTMLAttributes<T> {\n\t\t'sds-textfield'?: SDSTextFieldProps;\n\t}\n} */\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@politiet/sheriff-web-components",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.3",
|
|
4
4
|
"description": "Sheriff Design System Web Components Library",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -20,6 +20,96 @@
|
|
|
20
20
|
"import": "./dist/react-wrappers/index.js",
|
|
21
21
|
"require": "./dist/react-wrappers/index.js",
|
|
22
22
|
"types": "./dist/react-wrappers/index.d.ts"
|
|
23
|
+
},
|
|
24
|
+
"./sds-button": {
|
|
25
|
+
"import": "./dist/sds-button/sds-button.js",
|
|
26
|
+
"require": "./dist/sds-button/sds-button.js",
|
|
27
|
+
"types": "./dist/sds-button/sds-button.d.ts"
|
|
28
|
+
},
|
|
29
|
+
"./sds-checkbox": {
|
|
30
|
+
"import": "./dist/sds-checkbox/sds-checkbox.js",
|
|
31
|
+
"require": "./dist/sds-checkbox/sds-checkbox.js",
|
|
32
|
+
"types": "./dist/sds-checkbox/sds-checkbox.d.ts"
|
|
33
|
+
},
|
|
34
|
+
"./sds-checkbox-group": {
|
|
35
|
+
"import": "./dist/sds-checkbox-group/sds-checkbox-group.js",
|
|
36
|
+
"require": "./dist/sds-checkbox-group/sds-checkbox-group.js",
|
|
37
|
+
"types": "./dist/sds-checkbox-group/sds-checkbox-group.d.ts"
|
|
38
|
+
},
|
|
39
|
+
"./sds-chip": {
|
|
40
|
+
"import": "./dist/sds-chip/sds-chip.js",
|
|
41
|
+
"require": "./dist/sds-chip/sds-chip.js",
|
|
42
|
+
"types": "./dist/sds-chip/sds-chip.d.ts"
|
|
43
|
+
},
|
|
44
|
+
"./sds-detail": {
|
|
45
|
+
"import": "./dist/sds-detail/sds-detail.js",
|
|
46
|
+
"require": "./dist/sds-detail/sds-detail.js",
|
|
47
|
+
"types": "./dist/sds-detail/sds-detail.d.ts"
|
|
48
|
+
},
|
|
49
|
+
"./sds-heading": {
|
|
50
|
+
"import": "./dist/sds-heading/sds-heading.js",
|
|
51
|
+
"require": "./dist/sds-heading/sds-heading.js",
|
|
52
|
+
"types": "./dist/sds-heading/sds-heading.d.ts"
|
|
53
|
+
},
|
|
54
|
+
"./sds-icon": {
|
|
55
|
+
"import": "./dist/sds-icon/sds-icon.js",
|
|
56
|
+
"require": "./dist/sds-icon/sds-icon.js",
|
|
57
|
+
"types": "./dist/sds-icon/sds-icon.d.ts"
|
|
58
|
+
},
|
|
59
|
+
"./sds-label": {
|
|
60
|
+
"import": "./dist/sds-label/sds-label.js",
|
|
61
|
+
"require": "./dist/sds-label/sds-label.js",
|
|
62
|
+
"types": "./dist/sds-label/sds-label.d.ts"
|
|
63
|
+
},
|
|
64
|
+
"./sds-link": {
|
|
65
|
+
"import": "./dist/sds-link/sds-link.js",
|
|
66
|
+
"require": "./dist/sds-link/sds-link.js",
|
|
67
|
+
"types": "./dist/sds-link/sds-link.d.ts"
|
|
68
|
+
},
|
|
69
|
+
"./sds-loader": {
|
|
70
|
+
"import": "./dist/sds-loader/sds-loader.js",
|
|
71
|
+
"require": "./dist/sds-loader/sds-loader.js",
|
|
72
|
+
"types": "./dist/sds-loader/sds-loader.d.ts"
|
|
73
|
+
},
|
|
74
|
+
"./sds-nav-card": {
|
|
75
|
+
"import": "./dist/sds-nav-card/sds-nav-card.js",
|
|
76
|
+
"require": "./dist/sds-nav-card/sds-nav-card.js",
|
|
77
|
+
"types": "./dist/sds-nav-card/sds-nav-card.d.ts"
|
|
78
|
+
},
|
|
79
|
+
"./sds-notification": {
|
|
80
|
+
"import": "./dist/sds-notification/sds-notification.js",
|
|
81
|
+
"require": "./dist/sds-notification/sds-notification.js",
|
|
82
|
+
"types": "./dist/sds-notification/sds-notification.d.ts"
|
|
83
|
+
},
|
|
84
|
+
"./sds-paragraph": {
|
|
85
|
+
"import": "./dist/sds-paragraph/sds-paragraph.js",
|
|
86
|
+
"require": "./dist/sds-paragraph/sds-paragraph.js",
|
|
87
|
+
"types": "./dist/sds-paragraph/sds-paragraph.d.ts"
|
|
88
|
+
},
|
|
89
|
+
"./sds-radio": {
|
|
90
|
+
"import": "./dist/sds-radio/sds-radio.js",
|
|
91
|
+
"require": "./dist/sds-radio/sds-radio.js",
|
|
92
|
+
"types": "./dist/sds-radio/sds-radio.d.ts"
|
|
93
|
+
},
|
|
94
|
+
"./sds-radio-group": {
|
|
95
|
+
"import": "./dist/sds-radio-group/sds-radio-group.js",
|
|
96
|
+
"require": "./dist/sds-radio-group/sds-radio-group.js",
|
|
97
|
+
"types": "./dist/sds-radio-group/sds-radio-group.d.ts"
|
|
98
|
+
},
|
|
99
|
+
"./sds-switch": {
|
|
100
|
+
"import": "./dist/sds-switch/sds-switch.js",
|
|
101
|
+
"require": "./dist/sds-switch/sds-switch.js",
|
|
102
|
+
"types": "./dist/sds-switch/sds-switch.d.ts"
|
|
103
|
+
},
|
|
104
|
+
"./sds-text": {
|
|
105
|
+
"import": "./dist/sds-text/sds-text.js",
|
|
106
|
+
"require": "./dist/sds-text/sds-text.js",
|
|
107
|
+
"types": "./dist/sds-text/sds-text.d.ts"
|
|
108
|
+
},
|
|
109
|
+
"./sds-textfield": {
|
|
110
|
+
"import": "./dist/sds-textfield/sds-textfield.js",
|
|
111
|
+
"require": "./dist/sds-textfield/sds-textfield.js",
|
|
112
|
+
"types": "./dist/sds-textfield/sds-textfield.d.ts"
|
|
23
113
|
}
|
|
24
114
|
},
|
|
25
115
|
"scripts": {
|