@politiet/sheriff-web-components 1.0.0-beta.5 → 1.0.0-beta.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/frameworks/react.d.ts +18 -33
- package/dist/sds-button/sds-button.d.ts +0 -73
- package/dist/sds-button/sds-button.d.ts.map +1 -1
- package/dist/sds-button/sds-button.js +0 -42
- package/dist/sds-button/sds-button.js.map +1 -1
- package/dist/sheriff-web-components.js +0 -13
- package/package.json +1 -1
|
@@ -20,39 +20,24 @@ import { SDSTextFieldProps } from '../sds-textfield/sds-textfield';
|
|
|
20
20
|
declare module 'react' {
|
|
21
21
|
namespace JSX {
|
|
22
22
|
interface IntrinsicElements {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
'sds-
|
|
39
|
-
'sds-
|
|
40
|
-
'sds-
|
|
41
|
-
'sds-chip': SDSChipProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
42
|
-
'sds-detail': SDSDetailProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
43
|
-
'sds-heading': SDSHeadingProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
44
|
-
'sds-icon': SDSIconProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
45
|
-
'sds-label': SDSLabelProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
46
|
-
'sds-link': SDSLinkProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
47
|
-
'sds-loader': SDSLoaderProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
48
|
-
'sds-nav-card': SDSNavCardProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
49
|
-
'sds-notification': SDSNotificationProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
50
|
-
'sds-paragraph': SDSParagraphProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
51
|
-
'sds-radio': SDSRadioProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
52
|
-
'sds-radio-group': SDSRadioGroupProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
53
|
-
'sds-switch': SDSSwitchProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
54
|
-
'sds-text': SDSTextProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
55
|
-
'sds-textfield': SDSTextFieldProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
|
|
23
|
+
'sds-button': SDSButtonProps & any;
|
|
24
|
+
'sds-checkbox': SDSCheckboxProps & any;
|
|
25
|
+
'sds-checkbox-group': SDSCheckboxGroupProps & any;
|
|
26
|
+
'sds-chip': SDSChipProps & any;
|
|
27
|
+
'sds-detail': SDSDetailProps & any;
|
|
28
|
+
'sds-heading': SDSHeadingProps & any;
|
|
29
|
+
'sds-icon': SDSIconProps & any;
|
|
30
|
+
'sds-label': SDSLabelProps & any;
|
|
31
|
+
'sds-link': SDSLinkProps & any;
|
|
32
|
+
'sds-loader': SDSLoaderProps & any;
|
|
33
|
+
'sds-nav-card': SDSNavCardProps & any;
|
|
34
|
+
'sds-notification': SDSNotificationProps & any;
|
|
35
|
+
'sds-paragraph': SDSParagraphProps & any;
|
|
36
|
+
'sds-radio': SDSRadioProps & any;
|
|
37
|
+
'sds-radio-group': SDSRadioGroupProps & any;
|
|
38
|
+
'sds-switch': SDSSwitchProps & any;
|
|
39
|
+
'sds-text': SDSTextProps & any;
|
|
40
|
+
'sds-textfield': SDSTextFieldProps & any;
|
|
56
41
|
}
|
|
57
42
|
}
|
|
58
43
|
}
|
|
@@ -1,33 +1,7 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
/**
|
|
3
|
-
* Specifies the valid types for the button.
|
|
4
|
-
* @typedef {'button' | 'submit' | 'reset'} ButtonType
|
|
5
|
-
*/
|
|
6
2
|
type ButtonType = 'button' | 'submit' | 'reset';
|
|
7
|
-
/**
|
|
8
|
-
* Visual style variants for the button.
|
|
9
|
-
* @typedef {'primary' | 'secondary' | 'tertiary' | 'critical'} ButtonVariant
|
|
10
|
-
*/
|
|
11
3
|
type ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'critical';
|
|
12
|
-
/**
|
|
13
|
-
* Available size options for the button.
|
|
14
|
-
* @typedef {'large' | 'medium' | 'small'} ButtonSize
|
|
15
|
-
*/
|
|
16
4
|
type ButtonSize = 'large' | 'medium' | 'small';
|
|
17
|
-
/**
|
|
18
|
-
* Properties for the `<sds-button>` web component.
|
|
19
|
-
*
|
|
20
|
-
* @prop {ButtonType} [type='button'] - Specifies the button behavior: normal, submit, or reset.
|
|
21
|
-
* @prop {ButtonVariant} [variant='primary'] - Sets the visual style of the button.
|
|
22
|
-
* @prop {ButtonSize} [size='large'] - Defines the button's size.
|
|
23
|
-
* @prop {boolean} [disabled=false] - Disables the button if true.
|
|
24
|
-
* @prop {string} [name] - The name attribute for form submission.
|
|
25
|
-
* @prop {string} [value] - The value attribute for form submission.
|
|
26
|
-
* @prop {string} [form] - Associates the button with a form by its ID.
|
|
27
|
-
* @prop {(event: CustomEvent) => void} [onClick] - Callback fired on click events.
|
|
28
|
-
* @prop {(event: CustomEvent) => void} [onSubmit] - Callback fired on submit events.
|
|
29
|
-
* @prop {(event: CustomEvent) => void} [onReset] - Callback fired on reset events.
|
|
30
|
-
*/
|
|
31
5
|
export interface SDSButtonProps {
|
|
32
6
|
type?: ButtonType;
|
|
33
7
|
variant?: ButtonVariant;
|
|
@@ -40,69 +14,22 @@ export interface SDSButtonProps {
|
|
|
40
14
|
onSubmit?: (event: CustomEvent) => void;
|
|
41
15
|
onReset?: (event: CustomEvent) => void;
|
|
42
16
|
}
|
|
43
|
-
/**
|
|
44
|
-
* Custom element `<sds-button>` for rendering a styled button.
|
|
45
|
-
*
|
|
46
|
-
* @element sds-button
|
|
47
|
-
*/
|
|
48
17
|
export declare class SDSButton extends LitElement {
|
|
49
18
|
static styles: import("lit").CSSResult[];
|
|
50
19
|
static formAssociated: boolean;
|
|
51
20
|
readonly internals: ElementInternals;
|
|
52
|
-
/**
|
|
53
|
-
* The button type attribute.
|
|
54
|
-
* @default "button"
|
|
55
|
-
*/
|
|
56
21
|
type: ButtonType;
|
|
57
|
-
/**
|
|
58
|
-
* Visual variant of the button.
|
|
59
|
-
* @default "primary"
|
|
60
|
-
*/
|
|
61
22
|
variant: ButtonVariant;
|
|
62
|
-
/**
|
|
63
|
-
* The size of the button.
|
|
64
|
-
* @default "large"
|
|
65
|
-
*/
|
|
66
23
|
size: ButtonSize;
|
|
67
|
-
/**
|
|
68
|
-
* Indicates if the button is disabled.
|
|
69
|
-
* @default false
|
|
70
|
-
*/
|
|
71
24
|
disabled: boolean;
|
|
72
|
-
/**
|
|
73
|
-
* Name attribute of the button.
|
|
74
|
-
*/
|
|
75
25
|
name?: string;
|
|
76
|
-
/**
|
|
77
|
-
* Value attribute of the button.
|
|
78
|
-
*/
|
|
79
26
|
value: string;
|
|
80
|
-
/**
|
|
81
|
-
* The ID of the form associated with the button.
|
|
82
|
-
*/
|
|
83
27
|
form?: string;
|
|
84
28
|
constructor();
|
|
85
|
-
/**
|
|
86
|
-
* Internal click handler managing submit, reset, or regular clicks.
|
|
87
|
-
* @param event - The mouse click event.
|
|
88
|
-
*/
|
|
89
29
|
private readonly _handleClick;
|
|
90
|
-
/**
|
|
91
|
-
* Focuses the underlying button element.
|
|
92
|
-
*/
|
|
93
30
|
focus(): void;
|
|
94
|
-
/**
|
|
95
|
-
* Blurs the underlying button element.
|
|
96
|
-
*/
|
|
97
31
|
blur(): void;
|
|
98
|
-
/**
|
|
99
|
-
* Triggers a click on the underlying button element.
|
|
100
|
-
*/
|
|
101
32
|
click(): void;
|
|
102
|
-
/**
|
|
103
|
-
* Renders the button template.
|
|
104
|
-
* @returns The template for the button.
|
|
105
|
-
*/
|
|
106
33
|
render(): import("lit-html").TemplateResult<1>;
|
|
107
34
|
}
|
|
108
35
|
declare global {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-button.d.ts","sourceRoot":"","sources":["../../src/sds-button/sds-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC
|
|
1
|
+
{"version":3,"file":"sds-button.d.ts","sourceRoot":"","sources":["../../src/sds-button/sds-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,UAAU,CAAC;AACvE,KAAK,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC9B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;CACvC;AAED,qBACa,SAAU,SAAQ,UAAU;IACxC,OAAgB,MAAM,4BAAY;IAElC,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;IAG5C,IAAI,EAAE,UAAU,CAAY;IAG5B,OAAO,EAAE,aAAa,CAAa;IAGnC,IAAI,EAAE,UAAU,CAAW;IAEiB,QAAQ,EAAE,OAAO,CAAS;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAM;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;;IAQzD,OAAO,CAAC,QAAQ,CAAC,YAAY,CAuD3B;IAEO,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;CA2Bf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}
|
|
@@ -9,42 +9,14 @@ import { customElement, property } 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-button.styles';
|
|
12
|
-
/**
|
|
13
|
-
* Custom element `<sds-button>` for rendering a styled button.
|
|
14
|
-
*
|
|
15
|
-
* @element sds-button
|
|
16
|
-
*/
|
|
17
12
|
let SDSButton = class SDSButton extends LitElement {
|
|
18
13
|
constructor() {
|
|
19
14
|
super();
|
|
20
|
-
/**
|
|
21
|
-
* The button type attribute.
|
|
22
|
-
* @default "button"
|
|
23
|
-
*/
|
|
24
15
|
this.type = 'button';
|
|
25
|
-
/**
|
|
26
|
-
* Visual variant of the button.
|
|
27
|
-
* @default "primary"
|
|
28
|
-
*/
|
|
29
16
|
this.variant = 'primary';
|
|
30
|
-
/**
|
|
31
|
-
* The size of the button.
|
|
32
|
-
* @default "large"
|
|
33
|
-
*/
|
|
34
17
|
this.size = 'large';
|
|
35
|
-
/**
|
|
36
|
-
* Indicates if the button is disabled.
|
|
37
|
-
* @default false
|
|
38
|
-
*/
|
|
39
18
|
this.disabled = false;
|
|
40
|
-
/**
|
|
41
|
-
* Value attribute of the button.
|
|
42
|
-
*/
|
|
43
19
|
this.value = '';
|
|
44
|
-
/**
|
|
45
|
-
* Internal click handler managing submit, reset, or regular clicks.
|
|
46
|
-
* @param event - The mouse click event.
|
|
47
|
-
*/
|
|
48
20
|
this._handleClick = (event) => {
|
|
49
21
|
event.preventDefault();
|
|
50
22
|
event.stopImmediatePropagation();
|
|
@@ -99,31 +71,18 @@ let SDSButton = class SDSButton extends LitElement {
|
|
|
99
71
|
this.internals = this.attachInternals();
|
|
100
72
|
this.attachShadow({ mode: 'open', delegatesFocus: true });
|
|
101
73
|
}
|
|
102
|
-
/**
|
|
103
|
-
* Focuses the underlying button element.
|
|
104
|
-
*/
|
|
105
74
|
focus() {
|
|
106
75
|
if (!this.disabled)
|
|
107
76
|
this.shadowRoot?.querySelector('button')?.focus();
|
|
108
77
|
}
|
|
109
|
-
/**
|
|
110
|
-
* Blurs the underlying button element.
|
|
111
|
-
*/
|
|
112
78
|
blur() {
|
|
113
79
|
if (!this.disabled)
|
|
114
80
|
this.shadowRoot?.querySelector('button')?.blur();
|
|
115
81
|
}
|
|
116
|
-
/**
|
|
117
|
-
* Triggers a click on the underlying button element.
|
|
118
|
-
*/
|
|
119
82
|
click() {
|
|
120
83
|
if (!this.disabled)
|
|
121
84
|
this.shadowRoot?.querySelector('button')?.click();
|
|
122
85
|
}
|
|
123
|
-
/**
|
|
124
|
-
* Renders the button template.
|
|
125
|
-
* @returns The template for the button.
|
|
126
|
-
*/
|
|
127
86
|
render() {
|
|
128
87
|
const buttonClasses = {
|
|
129
88
|
'sds-button': true,
|
|
@@ -152,7 +111,6 @@ let SDSButton = class SDSButton extends LitElement {
|
|
|
152
111
|
}
|
|
153
112
|
};
|
|
154
113
|
SDSButton.styles = [styles];
|
|
155
|
-
// Enables form association for this component.
|
|
156
114
|
SDSButton.formAssociated = true;
|
|
157
115
|
__decorate([
|
|
158
116
|
property({ type: String, reflect: true })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-button.js","sourceRoot":"","sources":["../../src/sds-button/sds-button.ts"],"names":[],"mappings":"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","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\n/**\n * Specifies the valid types for the button.\n * @typedef {'button' | 'submit' | 'reset'} ButtonType\n */\ntype ButtonType = 'button' | 'submit' | 'reset';\n\n/**\n * Visual style variants for the button.\n * @typedef {'primary' | 'secondary' | 'tertiary' | 'critical'} ButtonVariant\n */\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'critical';\n\n/**\n * Available size options for the button.\n * @typedef {'large' | 'medium' | 'small'} ButtonSize\n */\ntype ButtonSize = 'large' | 'medium' | 'small';\n\n/**\n * Properties for the `<sds-button>` web component.\n *\n * @prop {ButtonType} [type='button'] - Specifies the button behavior: normal, submit, or reset.\n * @prop {ButtonVariant} [variant='primary'] - Sets the visual style of the button.\n * @prop {ButtonSize} [size='large'] - Defines the button's size.\n * @prop {boolean} [disabled=false] - Disables the button if true.\n * @prop {string} [name] - The name attribute for form submission.\n * @prop {string} [value] - The value attribute for form submission.\n * @prop {string} [form] - Associates the button with a form by its ID.\n * @prop {(event: CustomEvent) => void} [onClick] - Callback fired on click events.\n * @prop {(event: CustomEvent) => void} [onSubmit] - Callback fired on submit events.\n * @prop {(event: CustomEvent) => void} [onReset] - Callback fired on reset events.\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/**\n * Custom element `<sds-button>` for rendering a styled button.\n *\n * @element sds-button\n */\n@customElement('sds-button')\nexport class SDSButton extends LitElement {\n\tstatic override styles = [styles];\n\n\t// Enables form association for this component.\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\t/**\n\t * The button type attribute.\n\t * @default \"button\"\n\t */\n\t@property({ type: String, reflect: true })\n\ttype: ButtonType = 'button';\n\n\t/**\n\t * Visual variant of the button.\n\t * @default \"primary\"\n\t */\n\t@property({ type: String, reflect: true })\n\tvariant: ButtonVariant = 'primary';\n\n\t/**\n\t * The size of the button.\n\t * @default \"large\"\n\t */\n\t@property({ type: String, reflect: true })\n\tsize: ButtonSize = 'large';\n\n\t/**\n\t * Indicates if the button is disabled.\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled: boolean = false;\n\n\t/**\n\t * Name attribute of the button.\n\t */\n\t@property({ type: String, reflect: true })\n\tname?: string;\n\n\t/**\n\t * Value attribute of the button.\n\t */\n\t@property({ type: String, reflect: true })\n\tvalue: string = '';\n\n\t/**\n\t * The ID of the form associated with the button.\n\t */\n\t@property({ type: String, reflect: true })\n\tform?: 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\t/**\n\t * Internal click handler managing submit, reset, or regular clicks.\n\t * @param event - The mouse click event.\n\t */\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?.submit();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.submit();\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\t/**\n\t * Focuses the underlying button element.\n\t */\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('button')?.focus();\n\t}\n\n\t/**\n\t * Blurs the underlying button element.\n\t */\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('button')?.blur();\n\t}\n\n\t/**\n\t * Triggers a click on the underlying button element.\n\t */\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('button')?.click();\n\t}\n\n\t/**\n\t * Renders the button template.\n\t * @returns The template for the button.\n\t */\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"]}
|
|
1
|
+
{"version":3,"file":"sds-button.js","sourceRoot":"","sources":["../../src/sds-button/sds-button.ts"],"names":[],"mappings":"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","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?.submit();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.submit();\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"]}
|
|
@@ -854,28 +854,15 @@ let SDSButton = class extends r$2 {
|
|
|
854
854
|
this.internals = this.attachInternals();
|
|
855
855
|
this.attachShadow({ mode: "open", delegatesFocus: true });
|
|
856
856
|
}
|
|
857
|
-
/**
|
|
858
|
-
* Focuses the underlying button element.
|
|
859
|
-
*/
|
|
860
857
|
focus() {
|
|
861
858
|
if (!this.disabled) this.shadowRoot?.querySelector("button")?.focus();
|
|
862
859
|
}
|
|
863
|
-
/**
|
|
864
|
-
* Blurs the underlying button element.
|
|
865
|
-
*/
|
|
866
860
|
blur() {
|
|
867
861
|
if (!this.disabled) this.shadowRoot?.querySelector("button")?.blur();
|
|
868
862
|
}
|
|
869
|
-
/**
|
|
870
|
-
* Triggers a click on the underlying button element.
|
|
871
|
-
*/
|
|
872
863
|
click() {
|
|
873
864
|
if (!this.disabled) this.shadowRoot?.querySelector("button")?.click();
|
|
874
865
|
}
|
|
875
|
-
/**
|
|
876
|
-
* Renders the button template.
|
|
877
|
-
* @returns The template for the button.
|
|
878
|
-
*/
|
|
879
866
|
render() {
|
|
880
867
|
const buttonClasses = {
|
|
881
868
|
"sds-button": true,
|