@politiet/sheriff-web-components 0.1.1 → 0.1.2
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/README.md +1 -1
- package/dist/sds-button/sds-button.d.ts +2 -2
- package/dist/sds-button/sds-button.d.ts.map +1 -1
- package/dist/sds-button/sds-button.js +10 -10
- package/dist/sds-button/sds-button.js.map +1 -1
- package/dist/sds-chip/sds-chip.d.ts +2 -2
- package/dist/sds-chip/sds-chip.d.ts.map +1 -1
- package/dist/sds-chip/sds-chip.js +12 -12
- package/dist/sds-chip/sds-chip.js.map +1 -1
- package/dist/sds-nav-card/sds-nav-card.d.ts +2 -2
- package/dist/sds-nav-card/sds-nav-card.d.ts.map +1 -1
- package/dist/sds-nav-card/sds-nav-card.js +12 -12
- package/dist/sds-nav-card/sds-nav-card.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@ import { LitElement } from 'lit';
|
|
|
2
2
|
type ButtonType = 'button' | 'submit' | 'reset';
|
|
3
3
|
type ButtonVariant = 'primary' | 'secondary' | 'tertiary';
|
|
4
4
|
type ButtonSize = 'large' | 'medium' | 'small';
|
|
5
|
-
export declare class
|
|
5
|
+
export declare class SDSButton extends LitElement {
|
|
6
6
|
static styles: import("lit").CSSResult[];
|
|
7
7
|
name: string;
|
|
8
8
|
type: ButtonType;
|
|
@@ -13,7 +13,7 @@ export declare class SButton extends LitElement {
|
|
|
13
13
|
}
|
|
14
14
|
declare global {
|
|
15
15
|
interface HTMLElementTagNameMap {
|
|
16
|
-
'sds-button':
|
|
16
|
+
'sds-button': SDSButton;
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
export {};
|
|
@@ -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;AAKvC,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAC1D,KAAK,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE/C,qBACa,
|
|
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;AAKvC,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAC1D,KAAK,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE/C,qBACa,SAAU,SAAQ,UAAU;IAExC,OAAgB,MAAM,4BAAY;IAIlC,IAAI,EAAG,MAAM,CAAC;IAGd,IAAI,EAAE,UAAU,CAAY;IAG5B,OAAO,EAAE,aAAa,CAAa;IAGnC,IAAI,EAAE,UAAU,CAAW;IAG3B,QAAQ,EAAE,OAAO,CAAS;IAEjB,MAAM;CAoBf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}
|
|
@@ -8,7 +8,7 @@ import { LitElement, html } from 'lit';
|
|
|
8
8
|
import { customElement, property } from 'lit/decorators.js';
|
|
9
9
|
import { classMap } from 'lit/directives/class-map.js';
|
|
10
10
|
import { styles } from './sds-button.styles';
|
|
11
|
-
let
|
|
11
|
+
let SDSButton = class SDSButton extends LitElement {
|
|
12
12
|
constructor() {
|
|
13
13
|
super(...arguments);
|
|
14
14
|
this.type = 'button';
|
|
@@ -37,24 +37,24 @@ let SButton = class SButton extends LitElement {
|
|
|
37
37
|
}
|
|
38
38
|
};
|
|
39
39
|
// Styling
|
|
40
|
-
|
|
40
|
+
SDSButton.styles = [styles];
|
|
41
41
|
__decorate([
|
|
42
42
|
property({ type: String })
|
|
43
|
-
],
|
|
43
|
+
], SDSButton.prototype, "name", void 0);
|
|
44
44
|
__decorate([
|
|
45
45
|
property({ type: String })
|
|
46
|
-
],
|
|
46
|
+
], SDSButton.prototype, "type", void 0);
|
|
47
47
|
__decorate([
|
|
48
48
|
property({ type: String })
|
|
49
|
-
],
|
|
49
|
+
], SDSButton.prototype, "variant", void 0);
|
|
50
50
|
__decorate([
|
|
51
51
|
property({ type: String })
|
|
52
|
-
],
|
|
52
|
+
], SDSButton.prototype, "size", void 0);
|
|
53
53
|
__decorate([
|
|
54
54
|
property({ type: Boolean })
|
|
55
|
-
],
|
|
56
|
-
|
|
55
|
+
], SDSButton.prototype, "disabled", void 0);
|
|
56
|
+
SDSButton = __decorate([
|
|
57
57
|
customElement('sds-button')
|
|
58
|
-
],
|
|
59
|
-
export {
|
|
58
|
+
], SDSButton);
|
|
59
|
+
export { SDSButton };
|
|
60
60
|
//# sourceMappingURL=sds-button.js.map
|
|
@@ -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,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAOtC,IAAM,
|
|
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,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAOtC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QASN,SAAI,GAAe,QAAQ,CAAC;QAG5B,YAAO,GAAkB,SAAS,CAAC;QAGnC,SAAI,GAAe,OAAO,CAAC;QAG3B,aAAQ,GAAY,KAAK,CAAC;IAsB3B,CAAC;IApBS,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,oBAAoB,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;YAC5C,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;SAC1C,CAAC;QAEF,OAAO,IAAI,CAAA;;aAEA,QAAQ,CAAC,aAAa,CAAC;YACxB,IAAI,CAAC,IAAI;YACT,IAAI,CAAC,IAAI;iBACJ,IAAI,CAAC,QAAQ;;;;GAI3B,CAAC;IACH,CAAC;;AAtCD,UAAU;AACM,gBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAIlC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCACb;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCACC;AAG5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CACQ;AAGnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCACA;AAG3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CACF;AAlBd,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CAwCrB","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-button.styles';\n\ntype ButtonType = 'button' | 'submit' | 'reset';\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary';\ntype ButtonSize = 'large' | 'medium' | 'small';\n\n@customElement('sds-button')\nexport class SDSButton extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String })\n\tname!: string;\n\n\t@property({ type: String })\n\ttype: ButtonType = 'button';\n\n\t@property({ type: String })\n\tvariant: ButtonVariant = 'primary';\n\n\t@property({ type: String })\n\tsize: ButtonSize = 'large';\n\n\t@property({ type: Boolean })\n\tdisabled: boolean = false;\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--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\tclass=\"${classMap(buttonClasses)}\"\n\t\t\t\ttype=\"${this.type}\"\n\t\t\t\tname=\"${this.name}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t>\n\t\t\t\t<slot></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,5 +1,5 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
export declare class
|
|
2
|
+
export declare class SDSChip extends LitElement {
|
|
3
3
|
static styles: import("lit").CSSResult[];
|
|
4
4
|
size: 'large' | 'medium' | 'small';
|
|
5
5
|
disabled: boolean;
|
|
@@ -15,7 +15,7 @@ export declare class SChip extends LitElement {
|
|
|
15
15
|
}
|
|
16
16
|
declare global {
|
|
17
17
|
interface HTMLElementTagNameMap {
|
|
18
|
-
'sds-chip':
|
|
18
|
+
'sds-chip': SDSChip;
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
//# sourceMappingURL=sds-chip.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-chip.d.ts","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,qBACa,
|
|
1
|
+
{"version":3,"file":"sds-chip.d.ts","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;IAIlC,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAW;IAG7C,QAAQ,UAAS;IAGjB,UAAU,UAAS;IAGnB,QAAQ,UAAS;IAGjB,SAAS,UAAS;IAGlB,QAAQ,aAAY;IAGpB,UAAU,aAAY;IAEb,MAAM;IA+Bf,SAAS;IAWT,OAAO;IAWP,OAAO;CASP;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}
|
|
@@ -9,7 +9,7 @@ import { LitElement, html } from 'lit';
|
|
|
9
9
|
import { customElement, property } from 'lit/decorators.js';
|
|
10
10
|
import { classMap } from 'lit/directives/class-map.js';
|
|
11
11
|
import { styles } from './sds-chip.styles';
|
|
12
|
-
let
|
|
12
|
+
let SDSChip = class SDSChip extends LitElement {
|
|
13
13
|
constructor() {
|
|
14
14
|
super(...arguments);
|
|
15
15
|
// Reactive Props
|
|
@@ -77,30 +77,30 @@ let SChip = class SChip extends LitElement {
|
|
|
77
77
|
}
|
|
78
78
|
};
|
|
79
79
|
// Styling
|
|
80
|
-
|
|
80
|
+
SDSChip.styles = [styles];
|
|
81
81
|
__decorate([
|
|
82
82
|
property({ type: String })
|
|
83
|
-
],
|
|
83
|
+
], SDSChip.prototype, "size", void 0);
|
|
84
84
|
__decorate([
|
|
85
85
|
property({ type: Boolean })
|
|
86
|
-
],
|
|
86
|
+
], SDSChip.prototype, "disabled", void 0);
|
|
87
87
|
__decorate([
|
|
88
88
|
property({ type: Boolean })
|
|
89
|
-
],
|
|
89
|
+
], SDSChip.prototype, "selectable", void 0);
|
|
90
90
|
__decorate([
|
|
91
91
|
property({ type: Boolean })
|
|
92
|
-
],
|
|
92
|
+
], SDSChip.prototype, "selected", void 0);
|
|
93
93
|
__decorate([
|
|
94
94
|
property({ type: Boolean })
|
|
95
|
-
],
|
|
95
|
+
], SDSChip.prototype, "removable", void 0);
|
|
96
96
|
__decorate([
|
|
97
97
|
property({ attribute: false })
|
|
98
|
-
],
|
|
98
|
+
], SDSChip.prototype, "onSelect", void 0);
|
|
99
99
|
__decorate([
|
|
100
100
|
property({ attribute: false })
|
|
101
|
-
],
|
|
102
|
-
|
|
101
|
+
], SDSChip.prototype, "onUnselect", void 0);
|
|
102
|
+
SDSChip = __decorate([
|
|
103
103
|
customElement('sds-chip')
|
|
104
|
-
],
|
|
105
|
-
export {
|
|
104
|
+
], SDSChip);
|
|
105
|
+
export { SDSChip };
|
|
106
106
|
//# sourceMappingURL=sds-chip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-chip.js","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":";;;;;;AAAA,sDAAsD;AACtD,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;AAGpC,IAAM,
|
|
1
|
+
{"version":3,"file":"sds-chip.js","sourceRoot":"","sources":["../../src/sds-chip/sds-chip.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/unbound-method */\nimport { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-chip.styles';\n\n@customElement('sds-chip')\nexport class SDSChip extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String })\n\tsize: 'large' | 'medium' | 'small' = 'large';\n\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t@property({ type: Boolean })\n\tselectable = false;\n\n\t@property({ type: Boolean })\n\tselected = false;\n\n\t@property({ type: Boolean })\n\tremovable = false;\n\n\t@property({ attribute: false })\n\tonSelect = () => {};\n\n\t@property({ attribute: false })\n\tonUnselect = () => {};\n\n\toverride render() {\n\t\tconst buttonClasses = {\n\t\t\t'sds-chip--medium': this.size === 'medium',\n\t\t\t'sds-chip--small': this.size === 'small',\n\t\t\t'sds-chip--selectable': this.selectable,\n\t\t\t'sds-chip--selected': this.selected,\n\t\t};\n\n\t\treturn html`\n\t\t\t<button\n\t\t\t\tclass=\"sds-chip${classMap(buttonClasses)}\"\n\t\t\t\tdata-size=${this.size}\n\t\t\t\t?disabled=${this.disabled}\n\t\t\t\t?data-removable=${this.removable}\n\t\t\t\t?data-selectable=${this.selectable}\n\t\t\t\t?data-selected=${this.selected}\n\t\t\t\t@click=${this._toggle}\n\t\t\t>\n\t\t\t\t<slot></slot>\n\t\t\t\t${this.removable\n\t\t\t\t\t? html`<button\n\t\t\t\t\t\t\tclass=\"sds-chip-remove-button\"\n\t\t\t\t\t\t\t@click=${this._unselect}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span>X</span>\n\t\t\t\t\t\t</button>`\n\t\t\t\t\t: ''}\n\t\t\t</button>\n\t\t`;\n\t}\n\n\t_unselect() {\n\t\tthis.onUnselect();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('chip-unselect', {\n\t\t\t\tdetail: { node: this },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t}\n\n\t_select() {\n\t\tthis.onSelect();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('chip-select', {\n\t\t\t\tdetail: { node: this },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t}\n\n\t_toggle() {\n\t\tif (!this.selectable) return;\n\n\t\tif (this.selected) {\n\t\t\tthis._unselect();\n\t\t\treturn;\n\t\t}\n\t\tthis._select();\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-chip': SDSChip;\n\t}\n}\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
export declare class
|
|
2
|
+
export declare class SDSNavCard extends LitElement {
|
|
3
3
|
/**
|
|
4
4
|
* This is the navigation card component
|
|
5
5
|
*
|
|
@@ -26,7 +26,7 @@ export declare class SNavCard extends LitElement {
|
|
|
26
26
|
}
|
|
27
27
|
declare global {
|
|
28
28
|
interface HTMLElementTagNameMap {
|
|
29
|
-
'sds-nav-card':
|
|
29
|
+
'sds-nav-card': SDSNavCard;
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
//# sourceMappingURL=sds-nav-card.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-nav-card.d.ts","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,qBACa,
|
|
1
|
+
{"version":3,"file":"sds-nav-card.d.ts","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,qBACa,UAAW,SAAQ,UAAU;IACzC;;;;;;;;OAQG;IAGH,OAAgB,MAAM,4BAAY;IAIlC,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAW;IAG7C,OAAO,EAAG,MAAM,CAAC;IAGjB,KAAK,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAG/C,IAAI,EAAG,MAAM,CAAC;IAGd,IAAI,EAAG,MAAM,CAAC;IAId,OAAO,CAAC,OAAO,CAAkB;IAGjC,OAAO,CAAC,QAAQ,CAAmB;IAE1B,YAAY;IAIrB,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,wBAAwB;IAWhC,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,cAAc;IAmBb,MAAM;CAqBf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,UAAU,CAAC;KAC3B;CACD"}
|
|
@@ -8,7 +8,7 @@ import { LitElement, html } from 'lit';
|
|
|
8
8
|
import { customElement, property, query, state } from 'lit/decorators.js';
|
|
9
9
|
import { classMap } from 'lit/directives/class-map.js';
|
|
10
10
|
import { styles } from './sds-nav-card.styles';
|
|
11
|
-
let
|
|
11
|
+
let SDSNavCard = class SDSNavCard extends LitElement {
|
|
12
12
|
constructor() {
|
|
13
13
|
/**
|
|
14
14
|
* This is the navigation card component
|
|
@@ -87,30 +87,30 @@ let SNavCard = class SNavCard extends LitElement {
|
|
|
87
87
|
}
|
|
88
88
|
};
|
|
89
89
|
// Styling
|
|
90
|
-
|
|
90
|
+
SDSNavCard.styles = [styles];
|
|
91
91
|
__decorate([
|
|
92
92
|
property({ type: String })
|
|
93
|
-
],
|
|
93
|
+
], SDSNavCard.prototype, "size", void 0);
|
|
94
94
|
__decorate([
|
|
95
95
|
property({ type: String })
|
|
96
|
-
],
|
|
96
|
+
], SDSNavCard.prototype, "heading", void 0);
|
|
97
97
|
__decorate([
|
|
98
98
|
property({ type: String })
|
|
99
|
-
],
|
|
99
|
+
], SDSNavCard.prototype, "level", void 0);
|
|
100
100
|
__decorate([
|
|
101
101
|
property({ type: String })
|
|
102
|
-
],
|
|
102
|
+
], SDSNavCard.prototype, "text", void 0);
|
|
103
103
|
__decorate([
|
|
104
104
|
property({ type: String })
|
|
105
|
-
],
|
|
105
|
+
], SDSNavCard.prototype, "link", void 0);
|
|
106
106
|
__decorate([
|
|
107
107
|
state()
|
|
108
|
-
],
|
|
108
|
+
], SDSNavCard.prototype, "hasIcon", void 0);
|
|
109
109
|
__decorate([
|
|
110
110
|
query('slot')
|
|
111
|
-
],
|
|
112
|
-
|
|
111
|
+
], SDSNavCard.prototype, "iconSlot", void 0);
|
|
112
|
+
SDSNavCard = __decorate([
|
|
113
113
|
customElement('sds-nav-card')
|
|
114
|
-
],
|
|
115
|
-
export {
|
|
114
|
+
], SDSNavCard);
|
|
115
|
+
export { SDSNavCard };
|
|
116
116
|
//# sourceMappingURL=sds-nav-card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-nav-card.js","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAGxC,IAAM,
|
|
1
|
+
{"version":3,"file":"sds-nav-card.js","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-nav-card.styles';\n\n@customElement('sds-nav-card')\nexport class SDSNavCard extends LitElement {\n\t/**\n\t * This is the navigation card component\n\t *\n\t * @remarks The way the icon is handled now, causes a double update/side effect when loading the webpage.\n\t * The svg that should be placed inside the slot, currently needs have its stroke attribute manually removed,\n\t * in order for the components CSS to insert its own stroke color.\n\t * This should be looked more into.\n\t *\n\t */\n\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String })\n\tsize: 'large' | 'medium' | 'small' = 'large';\n\n\t@property({ type: String })\n\theading!: string;\n\n\t@property({ type: String })\n\tlevel: 'h2' | 'h3' | 'h4' | 'h5' | 'h6' = 'h2';\n\n\t@property({ type: String })\n\ttext!: string;\n\n\t@property({ type: String })\n\tlink!: string;\n\n\t// Managing the icon slot\n\t@state()\n\tprivate hasIcon: boolean = false;\n\n\t@query('slot')\n\tprivate iconSlot!: HTMLSlotElement;\n\n\toverride firstUpdated() {\n\t\tthis._checkSlotContent();\n\t}\n\n\tprivate _handleSlotChange() {\n\t\tthis._checkSlotContent();\n\t}\n\n\t// Filters out text nodes that only contain whitespace\n\tprivate _filterToMeaningfulNodes(nodes: Node[]) {\n\t\treturn nodes.filter((node) => {\n\t\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\t\tconst textContent = (node as Text).textContent;\n\t\t\t\treturn textContent !== null && textContent.trim().length > 0;\n\t\t\t}\n\t\t\treturn true;\n\t\t});\n\t}\n\n\t// Checks if the icon slot has content and updates the state variable\n\tprivate _checkSlotContent() {\n\t\tconst assignedNodes = this.iconSlot.assignedNodes({ flatten: true });\n\t\tconst meaningfulNodes = this._filterToMeaningfulNodes(assignedNodes);\n\t\tthis.hasIcon = meaningfulNodes.length !== 0;\n\t}\n\n\tprivate _renderHeading() {\n\t\tconst headingClass = 'sds-nav-card__heading';\n\n\t\tswitch (this.level) {\n\t\t\tcase 'h2':\n\t\t\t\treturn html`<h2 class=\"${headingClass}\">${this.heading}</h2>`;\n\t\t\tcase 'h3':\n\t\t\t\treturn html`<h3 class=\"${headingClass}\">${this.heading}</h3>`;\n\t\t\tcase 'h4':\n\t\t\t\treturn html`<h4 class=\"${headingClass}\">${this.heading}</h4>`;\n\t\t\tcase 'h5':\n\t\t\t\treturn html`<h5 class=\"${headingClass}\">${this.heading}</h5>`;\n\t\t\tcase 'h6':\n\t\t\t\treturn html`<h6 class=\"${headingClass}\">${this.heading}</h6>`;\n\t\t\tdefault:\n\t\t\t\treturn html`<h2 class=\"${headingClass}\">${this.heading}</h2>`;\n\t\t}\n\t}\n\n\toverride render() {\n\t\tconst navCardClasses = {\n\t\t\t'sds-nav-card': true,\n\t\t\t'sds-nav-card--hasIcon': this.hasIcon,\n\t\t\t'sds-nav-card--small': this.size === 'small',\n\t\t\t'sds-nav-card--medium': this.size === 'medium',\n\t\t\t'sds-nav-card--large': this.size === 'large',\n\t\t};\n\n\t\treturn html`\n\t\t\t<a class=\"${classMap(navCardClasses)}\" href=\"${this.link}\">\n\t\t\t\t<slot @slotchange=${this._handleSlotChange}></slot>\n\t\t\t\t<div class=\"sds-nav-card__content\">\n\t\t\t\t\t${this._renderHeading()}\n\t\t\t\t\t${this.size === 'small'\n\t\t\t\t\t\t? ''\n\t\t\t\t\t\t: html`<p class=\"sds-nav-card__text\">${this.text}</p>`}\n\t\t\t\t</div>\n\t\t\t</a>\n\t\t`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-nav-card': SDSNavCard;\n\t}\n}\n"]}
|