@politiet/sheriff-web-components 1.0.0-rc.0 → 1.0.0-rc.1
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.d.ts +1 -1
- package/dist/sds-checkbox/sds-checkbox.d.ts +1 -1
- package/dist/sds-checkbox-group/sds-checkbox-group.d.ts +1 -1
- package/dist/sds-chip/sds-chip.d.ts +1 -1
- package/dist/sds-detail/sds-detail.d.ts +1 -1
- package/dist/sds-heading/sds-heading.d.ts +1 -1
- package/dist/sds-icon/sds-icon-loader.d.ts +7 -16
- package/dist/sds-icon/sds-icon-loader.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon-loader.js +12 -22
- package/dist/sds-icon/sds-icon-loader.js.map +1 -1
- package/dist/sds-icon/sds-icon.d.ts +4 -4
- package/dist/sds-icon/sds-icon.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon.js +32 -6
- package/dist/sds-icon/sds-icon.js.map +1 -1
- package/dist/sds-label/sds-label.d.ts +1 -1
- package/dist/sds-link/sds-link.d.ts +1 -1
- package/dist/sds-loader/sds-loader.d.ts +1 -1
- package/dist/sds-nav-card/sds-nav-card.d.ts +1 -1
- package/dist/sds-notification/sds-notification.d.ts +1 -1
- package/dist/sds-paragraph/sds-paragraph.d.ts +1 -1
- package/dist/sds-radio/sds-radio.d.ts +1 -1
- package/dist/sds-radio-group/sds-radio-group.d.ts +1 -1
- package/dist/sds-switch/sds-switch.d.ts +1 -1
- package/dist/sds-text/sds-text.d.ts +1 -1
- package/dist/sds-textfield/sds-textfield.d.ts +1 -1
- package/dist/sheriff-web-components.js +19 -23
- package/package.json +1 -1
|
@@ -30,7 +30,7 @@ export declare class SDSButton extends LitElement {
|
|
|
30
30
|
focus(): void;
|
|
31
31
|
blur(): void;
|
|
32
32
|
click(): void;
|
|
33
|
-
render(): import("lit").TemplateResult<1>;
|
|
33
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
34
34
|
}
|
|
35
35
|
declare global {
|
|
36
36
|
interface HTMLElementTagNameMap {
|
|
@@ -34,7 +34,7 @@ export declare class SDSCheckbox extends LitElement {
|
|
|
34
34
|
focus(): void;
|
|
35
35
|
blur(): void;
|
|
36
36
|
click(): void;
|
|
37
|
-
render(): import("lit").TemplateResult<1>;
|
|
37
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
38
38
|
}
|
|
39
39
|
declare global {
|
|
40
40
|
interface HTMLElementTagNameMap {
|
|
@@ -16,7 +16,7 @@ export declare class SDSCheckboxGroup extends LitElement {
|
|
|
16
16
|
errorMessage?: string;
|
|
17
17
|
private selectedValues;
|
|
18
18
|
private readonly _handleCheckboxChange;
|
|
19
|
-
render(): import("lit").TemplateResult<1>;
|
|
19
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
20
20
|
}
|
|
21
21
|
declare global {
|
|
22
22
|
interface HTMLElementTagNameMap {
|
|
@@ -26,7 +26,7 @@ export declare class SDSChip extends LitElement {
|
|
|
26
26
|
focus(): void;
|
|
27
27
|
blur(): void;
|
|
28
28
|
click(): void;
|
|
29
|
-
render(): import("lit").TemplateResult<1>;
|
|
29
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
30
30
|
private readonly _toggle;
|
|
31
31
|
private readonly _remove;
|
|
32
32
|
}
|
|
@@ -6,7 +6,7 @@ interface SDSDetailProps {
|
|
|
6
6
|
export declare class SDSDetail extends LitElement {
|
|
7
7
|
static styles: import("lit").CSSResult[];
|
|
8
8
|
variation: Variation;
|
|
9
|
-
render(): import("lit").TemplateResult<1>;
|
|
9
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
10
10
|
}
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
@@ -9,7 +9,7 @@ export declare class SDSHeading extends LitElement {
|
|
|
9
9
|
static styles: import("lit").CSSResult[];
|
|
10
10
|
level: Level;
|
|
11
11
|
as?: DisplaySize;
|
|
12
|
-
render(): import("lit").TemplateResult<1>;
|
|
12
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
13
13
|
}
|
|
14
14
|
declare global {
|
|
15
15
|
interface HTMLElementTagNameMap {
|
|
@@ -1,20 +1,11 @@
|
|
|
1
1
|
export type IconPromise = (iconName: string) => Promise<string>;
|
|
2
|
-
export declare const
|
|
3
|
-
export declare const
|
|
4
|
-
export declare const CdnIconProvider: IconPromise;
|
|
2
|
+
export declare const loadCdnIcons: IconPromise;
|
|
3
|
+
export declare const loadLocalIcons: IconPromise;
|
|
5
4
|
export declare class SDSIconLoader {
|
|
6
|
-
private
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
*/
|
|
12
|
-
static registerResolver(resolver: IconPromise): void;
|
|
13
|
-
/**
|
|
14
|
-
* Resolves an icon by its name using the registered resolver.
|
|
15
|
-
* @param name - The name of the icon to resolve.
|
|
16
|
-
* @returns A promise that resolves to the SVG content.
|
|
17
|
-
*/
|
|
18
|
-
static resolve(name: string): Promise<string>;
|
|
5
|
+
private readonly cache;
|
|
6
|
+
static defaultResolver: IconPromise;
|
|
7
|
+
resolver: IconPromise;
|
|
8
|
+
constructor();
|
|
9
|
+
resolve(name: string, onResolved: (svg: string) => void): void;
|
|
19
10
|
}
|
|
20
11
|
//# 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;
|
|
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,WAC2D,CAAC;AAEzF,qBAAa,aAAa;IACzB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA6B;IAGnD,MAAM,CAAC,eAAe,EAAE,WAAW,CAAgB;IAGnD,QAAQ,EAAE,WAAW,CAAC;;IAMtB,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,GAAG,IAAI;CAoB9D"}
|
|
@@ -1,33 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
export const loadCdnIcon = async (name) => await fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {
|
|
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}'`);
|
|
5
4
|
}
|
|
6
5
|
return response.text();
|
|
7
6
|
});
|
|
8
|
-
|
|
9
|
-
export const LocalIconProvider = async (name) => await import(`@politiet/sheriff-icons/dist/${name}.js`).then(({ default: svg }) => svg);
|
|
10
|
-
// CDN resolver
|
|
11
|
-
export const CdnIconProvider = loadCdnIcon;
|
|
7
|
+
export const loadLocalIcons = async (name) => await import(`@politiet/sheriff-icons/dist/${name}.js`).then(({ default: svg }) => svg);
|
|
12
8
|
export class SDSIconLoader {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
*/
|
|
17
|
-
static registerResolver(resolver) {
|
|
18
|
-
this.resolver = resolver;
|
|
9
|
+
constructor() {
|
|
10
|
+
this.cache = new Map();
|
|
11
|
+
this.resolver = SDSIconLoader.defaultResolver;
|
|
19
12
|
}
|
|
20
|
-
|
|
21
|
-
* Resolves an icon by its name using the registered resolver.
|
|
22
|
-
* @param name - The name of the icon to resolve.
|
|
23
|
-
* @returns A promise that resolves to the SVG content.
|
|
24
|
-
*/
|
|
25
|
-
static resolve(name) {
|
|
13
|
+
resolve(name, onResolved) {
|
|
26
14
|
const cached = this.cache.get(name);
|
|
27
15
|
if (cached != null) {
|
|
28
|
-
|
|
16
|
+
onResolved(cached);
|
|
17
|
+
return;
|
|
29
18
|
}
|
|
30
|
-
|
|
19
|
+
const fetchIcon = this.resolver(name)
|
|
31
20
|
.catch((error) => {
|
|
32
21
|
console.error(`Failed to fetch icon '${name}':`, error);
|
|
33
22
|
return '';
|
|
@@ -36,8 +25,9 @@ export class SDSIconLoader {
|
|
|
36
25
|
this.cache.set(name, svg);
|
|
37
26
|
return svg;
|
|
38
27
|
});
|
|
28
|
+
void fetchIcon.then(onResolved);
|
|
39
29
|
}
|
|
40
30
|
}
|
|
41
|
-
|
|
42
|
-
SDSIconLoader.
|
|
31
|
+
// Static default resolver
|
|
32
|
+
SDSIconLoader.defaultResolver = loadCdnIcons;
|
|
43
33
|
//# 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":"AAEA,
|
|
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,CACjE,MAAM,MAAM,CAAC,gCAAgC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC;AAEzF,MAAM,OAAO,aAAa;IASzB;QARiB,UAAK,GAAG,IAAI,GAAG,EAAkB,CAAC;QASlD,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;QAEpC,IAAI,MAAM,IAAI,IAAI,EAAE,CAAC;YACpB,UAAU,CAAC,MAAM,CAAC,CAAC;YACnB,OAAO;QACR,CAAC;QAED,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;aACnC,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,OAAO,GAAG,CAAC;QACZ,CAAC,CAAC,CAAC;QAEJ,KAAK,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACjC,CAAC;;AA7BD,0BAA0B;AACnB,6BAAe,GAAgB,YAAY,AAA5B,CAA6B","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\tawait import(`@politiet/sheriff-icons/dist/${name}.js`).then(({ default: svg }) => svg);\n\nexport class SDSIconLoader {\n\tprivate readonly cache = new Map<string, string>();\n\n\t// Static default resolver\n\tstatic defaultResolver: IconPromise = loadCdnIcons;\n\n\t// Instance resolver (falls back to the static default)\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\n\t\tif (cached != null) {\n\t\t\tonResolved(cached);\n\t\t\treturn;\n\t\t}\n\n\t\tconst fetchIcon = this.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\treturn svg;\n\t\t\t});\n\n\t\tvoid fetchIcon.then(onResolved);\n\t}\n}\n\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
+
import { type IconPromise } from './sds-icon-loader';
|
|
2
3
|
import { type IconType } from './sds-icon.icon-types';
|
|
3
4
|
import { type ColorType } from './sds-icon.color-types';
|
|
4
5
|
type IconSize = 's' | 'm';
|
|
@@ -12,17 +13,16 @@ interface SDSIconProps {
|
|
|
12
13
|
}
|
|
13
14
|
export declare class SDSIcon extends LitElement {
|
|
14
15
|
static styles: import("lit").CSSResult[];
|
|
16
|
+
private static readonly iconLoader;
|
|
17
|
+
static registerResolver(resolver: IconPromise): void;
|
|
15
18
|
name: IconTypes;
|
|
16
19
|
size: IconSize;
|
|
17
20
|
color: IconColors;
|
|
18
21
|
label: string;
|
|
19
22
|
private svg;
|
|
20
|
-
/**
|
|
21
|
-
* Fetches the icon SVG content and updates the component state.
|
|
22
|
-
*/
|
|
23
23
|
private fetchIcon;
|
|
24
24
|
updated(changedProperties: Map<string | number | symbol, unknown>): void;
|
|
25
|
-
render(): import("lit").TemplateResult<1>;
|
|
25
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
26
26
|
}
|
|
27
27
|
declare global {
|
|
28
28
|
interface HTMLElementTagNameMap {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-icon.d.ts","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-icon.d.ts","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAIvC,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIpE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACxD,KAAK,QAAQ,GAAG,GAAG,GAAG,GAAG,CAAC;AAC1B,KAAK,SAAS,GAAG,QAAQ,GAAG,EAAE,CAAC;AAC/B,KAAK,UAAU,GAAG,SAAS,GAAG,EAAE,CAAC;AAEjC,UAAU,YAAY;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAED,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;IAElC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAuB;IAEzD,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,GAAG,IAAI;IAIT,IAAI,EAAE,SAAS,CAAM;IACrB,IAAI,EAAE,QAAQ,CAAO;IACrB,KAAK,EAAE,UAAU,CAAM;IACvB,KAAK,EAAE,MAAM,CAAM;IAErD,OAAO,CAAC,GAAG,CAAc;YAEpB,SAAS;IAiBd,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAQxE,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"}
|
|
@@ -4,13 +4,14 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
4
4
|
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
|
+
var SDSIcon_1;
|
|
7
8
|
import { LitElement, html } from 'lit';
|
|
8
9
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
9
10
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
10
11
|
import { unsafeHTML } from 'lit/directives/unsafe-html.js';
|
|
11
12
|
import { SDSIconLoader } from './sds-icon-loader';
|
|
12
13
|
import { styles } from './sds-icon.styles';
|
|
13
|
-
let SDSIcon = class SDSIcon extends LitElement {
|
|
14
|
+
let SDSIcon = SDSIcon_1 = class SDSIcon extends LitElement {
|
|
14
15
|
constructor() {
|
|
15
16
|
super(...arguments);
|
|
16
17
|
this.name = '';
|
|
@@ -19,16 +20,19 @@ let SDSIcon = class SDSIcon extends LitElement {
|
|
|
19
20
|
this.label = '';
|
|
20
21
|
this.svg = '';
|
|
21
22
|
}
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
static registerResolver(resolver) {
|
|
24
|
+
this.iconLoader.resolver = resolver;
|
|
25
|
+
}
|
|
25
26
|
async fetchIcon() {
|
|
26
27
|
if (!this.name) {
|
|
27
28
|
this.svg = '';
|
|
28
29
|
return;
|
|
29
30
|
}
|
|
30
31
|
try {
|
|
31
|
-
|
|
32
|
+
const svg = await new Promise((resolve) => {
|
|
33
|
+
SDSIcon_1.iconLoader.resolve(this.name, resolve);
|
|
34
|
+
});
|
|
35
|
+
this.svg = svg;
|
|
32
36
|
}
|
|
33
37
|
catch (error) {
|
|
34
38
|
console.error(`Failed to fetch SVG for icon '${this.name}':`, error);
|
|
@@ -56,6 +60,7 @@ let SDSIcon = class SDSIcon extends LitElement {
|
|
|
56
60
|
};
|
|
57
61
|
// Styling
|
|
58
62
|
SDSIcon.styles = [styles];
|
|
63
|
+
SDSIcon.iconLoader = new SDSIconLoader();
|
|
59
64
|
__decorate([
|
|
60
65
|
property({ type: String, reflect: true })
|
|
61
66
|
], SDSIcon.prototype, "name", void 0);
|
|
@@ -71,8 +76,29 @@ __decorate([
|
|
|
71
76
|
__decorate([
|
|
72
77
|
state()
|
|
73
78
|
], SDSIcon.prototype, "svg", void 0);
|
|
74
|
-
SDSIcon = __decorate([
|
|
79
|
+
SDSIcon = SDSIcon_1 = __decorate([
|
|
75
80
|
customElement('sds-icon')
|
|
76
81
|
], SDSIcon);
|
|
77
82
|
export { SDSIcon };
|
|
83
|
+
/*
|
|
84
|
+
// Angular
|
|
85
|
+
declare module '@angular/core' {
|
|
86
|
+
interface IntrinsicElements {
|
|
87
|
+
'sds-icon': SDSIconProps;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
// Vue
|
|
92
|
+
declare module 'vue' {
|
|
93
|
+
export interface GlobalComponents {
|
|
94
|
+
'sds-icon': SDSIconProps;
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
// Svelte
|
|
99
|
+
declare namespace svelteHTML {
|
|
100
|
+
interface HTMLAttributes<T> {
|
|
101
|
+
'sds-icon'?: SDSIconProps;
|
|
102
|
+
}
|
|
103
|
+
} */
|
|
78
104
|
//# sourceMappingURL=sds-icon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-icon.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":"
|
|
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 { unsafeHTML } from 'lit/directives/unsafe-html.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\ninterface 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\">${unsafeHTML(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\t// HTML\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-icon': SDSIcon;\n\t}\n\n\t// React\n\tnamespace JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t'sds-icon': SDSIconProps & 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-icon': SDSIconProps;\n\t}\n}\n\n// Vue\ndeclare module 'vue' {\n\texport interface GlobalComponents {\n\t\t'sds-icon': SDSIconProps;\n\t}\n}\n\n// Svelte\ndeclare namespace svelteHTML {\n\tinterface HTMLAttributes<T> {\n\t\t'sds-icon'?: SDSIconProps;\n\t}\n} */\n"]}
|
|
@@ -8,7 +8,7 @@ export declare class SDSLabel extends LitElement {
|
|
|
8
8
|
static styles: import("lit").CSSResult[];
|
|
9
9
|
size: Size;
|
|
10
10
|
for?: string;
|
|
11
|
-
render(): import("lit").TemplateResult<1>;
|
|
11
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
12
12
|
}
|
|
13
13
|
declare global {
|
|
14
14
|
interface HTMLElementTagNameMap {
|
|
@@ -11,7 +11,7 @@ export declare class SDSLink extends LitElement {
|
|
|
11
11
|
href?: string;
|
|
12
12
|
size: Size;
|
|
13
13
|
target?: Target;
|
|
14
|
-
render(): import("lit").TemplateResult<1>;
|
|
14
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
15
15
|
}
|
|
16
16
|
declare global {
|
|
17
17
|
interface HTMLElementTagNameMap {
|
|
@@ -9,7 +9,7 @@ export declare class SDSLoader extends LitElement {
|
|
|
9
9
|
static styles: import("lit").CSSResult[];
|
|
10
10
|
size: LoaderSize;
|
|
11
11
|
color: ColorType;
|
|
12
|
-
render(): import("lit").TemplateResult<1>;
|
|
12
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
13
13
|
}
|
|
14
14
|
declare global {
|
|
15
15
|
interface HTMLElementTagNameMap {
|
|
@@ -20,7 +20,7 @@ export declare class SDSNavCard extends LitElement {
|
|
|
20
20
|
private _filterToMeaningfulNodes;
|
|
21
21
|
private _checkSlotContent;
|
|
22
22
|
private _renderHeading;
|
|
23
|
-
render(): import("lit").TemplateResult<1>;
|
|
23
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
24
24
|
}
|
|
25
25
|
declare global {
|
|
26
26
|
interface HTMLElementTagNameMap {
|
|
@@ -11,7 +11,7 @@ export declare class SDSNotification extends LitElement {
|
|
|
11
11
|
variant: NotificationVariant;
|
|
12
12
|
removableLabel?: string;
|
|
13
13
|
private readonly _remove;
|
|
14
|
-
render(): import("lit").TemplateResult<1>;
|
|
14
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
15
15
|
}
|
|
16
16
|
declare global {
|
|
17
17
|
interface HTMLElementTagNameMap {
|
|
@@ -6,7 +6,7 @@ interface SDSParagraphProps {
|
|
|
6
6
|
export declare class SDSParagraph extends LitElement {
|
|
7
7
|
static styles: import("lit").CSSResult[];
|
|
8
8
|
size: Size;
|
|
9
|
-
render(): import("lit").TemplateResult<1>;
|
|
9
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
10
10
|
}
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
@@ -52,7 +52,7 @@ export declare class SDSRadio extends LitElement {
|
|
|
52
52
|
focus(): void;
|
|
53
53
|
blur(): void;
|
|
54
54
|
click(): void;
|
|
55
|
-
render(): import("lit").TemplateResult<1>;
|
|
55
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
56
56
|
}
|
|
57
57
|
declare global {
|
|
58
58
|
interface HTMLElementTagNameMap {
|
|
@@ -20,7 +20,7 @@ export declare class SDSRadioGroup extends LitElement {
|
|
|
20
20
|
errorMessage?: string;
|
|
21
21
|
private selectedValue;
|
|
22
22
|
private readonly _handleRadioChange;
|
|
23
|
-
render(): import("lit").TemplateResult<1>;
|
|
23
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
24
24
|
}
|
|
25
25
|
declare global {
|
|
26
26
|
interface HTMLElementTagNameMap {
|
|
@@ -44,7 +44,7 @@ export declare class SDSSwitch extends LitElement {
|
|
|
44
44
|
private readonly _handleChange;
|
|
45
45
|
private readonly _handleFocus;
|
|
46
46
|
private readonly _handleBlur;
|
|
47
|
-
render(): import("lit").TemplateResult<1>;
|
|
47
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
48
48
|
}
|
|
49
49
|
declare global {
|
|
50
50
|
interface HTMLElementTagNameMap {
|
|
@@ -6,7 +6,7 @@ interface SDSTextProps {
|
|
|
6
6
|
export declare class SDSText extends LitElement {
|
|
7
7
|
static styles: import("lit").CSSResult[];
|
|
8
8
|
size: Size;
|
|
9
|
-
render(): import("lit").TemplateResult<1>;
|
|
9
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
10
10
|
}
|
|
11
11
|
declare global {
|
|
12
12
|
interface HTMLElementTagNameMap {
|
|
@@ -51,7 +51,7 @@ export declare class SDSTextField extends LitElement {
|
|
|
51
51
|
focus(): void;
|
|
52
52
|
blur(): void;
|
|
53
53
|
click(): void;
|
|
54
|
-
render(): import("lit").TemplateResult<1>;
|
|
54
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
55
55
|
}
|
|
56
56
|
declare global {
|
|
57
57
|
interface HTMLElementTagNameMap {
|
|
@@ -1209,42 +1209,34 @@ class e extends i {
|
|
|
1209
1209
|
}
|
|
1210
1210
|
e.directiveName = "unsafeHTML", e.resultType = 1;
|
|
1211
1211
|
const o = e$2(e);
|
|
1212
|
-
const
|
|
1212
|
+
const loadCdnIcons = async (name) => await fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/${name}.svg`).then((response) => {
|
|
1213
1213
|
if (!response.ok) {
|
|
1214
1214
|
throw new TypeError(`Sheriff: unknown icon: '${name}'`);
|
|
1215
1215
|
}
|
|
1216
1216
|
return response.text();
|
|
1217
1217
|
});
|
|
1218
|
-
const CdnIconProvider = loadCdnIcon;
|
|
1219
1218
|
const _SDSIconLoader = class _SDSIconLoader {
|
|
1220
|
-
|
|
1221
|
-
|
|
1222
|
-
|
|
1223
|
-
|
|
1224
|
-
|
|
1225
|
-
this.resolver = resolver;
|
|
1226
|
-
}
|
|
1227
|
-
/**
|
|
1228
|
-
* Resolves an icon by its name using the registered resolver.
|
|
1229
|
-
* @param name - The name of the icon to resolve.
|
|
1230
|
-
* @returns A promise that resolves to the SVG content.
|
|
1231
|
-
*/
|
|
1232
|
-
static resolve(name) {
|
|
1219
|
+
constructor() {
|
|
1220
|
+
this.cache = /* @__PURE__ */ new Map();
|
|
1221
|
+
this.resolver = _SDSIconLoader.defaultResolver;
|
|
1222
|
+
}
|
|
1223
|
+
resolve(name, onResolved) {
|
|
1233
1224
|
const cached = this.cache.get(name);
|
|
1234
1225
|
if (cached != null) {
|
|
1235
|
-
|
|
1226
|
+
onResolved(cached);
|
|
1227
|
+
return;
|
|
1236
1228
|
}
|
|
1237
|
-
|
|
1229
|
+
const fetchIcon = this.resolver(name).catch((error) => {
|
|
1238
1230
|
console.error(`Failed to fetch icon '${name}':`, error);
|
|
1239
1231
|
return "";
|
|
1240
1232
|
}).then((svg) => {
|
|
1241
1233
|
this.cache.set(name, svg);
|
|
1242
1234
|
return svg;
|
|
1243
1235
|
});
|
|
1236
|
+
void fetchIcon.then(onResolved);
|
|
1244
1237
|
}
|
|
1245
1238
|
};
|
|
1246
|
-
_SDSIconLoader.
|
|
1247
|
-
_SDSIconLoader.resolver = CdnIconProvider;
|
|
1239
|
+
_SDSIconLoader.defaultResolver = loadCdnIcons;
|
|
1248
1240
|
let SDSIconLoader = _SDSIconLoader;
|
|
1249
1241
|
const styles$e = i$4`
|
|
1250
1242
|
:host {
|
|
@@ -1278,16 +1270,19 @@ let SDSIcon = class extends r$2 {
|
|
|
1278
1270
|
this.label = "";
|
|
1279
1271
|
this.svg = "";
|
|
1280
1272
|
}
|
|
1281
|
-
|
|
1282
|
-
|
|
1283
|
-
|
|
1273
|
+
static registerResolver(resolver) {
|
|
1274
|
+
this.iconLoader.resolver = resolver;
|
|
1275
|
+
}
|
|
1284
1276
|
async fetchIcon() {
|
|
1285
1277
|
if (!this.name) {
|
|
1286
1278
|
this.svg = "";
|
|
1287
1279
|
return;
|
|
1288
1280
|
}
|
|
1289
1281
|
try {
|
|
1290
|
-
|
|
1282
|
+
const svg = await new Promise((resolve) => {
|
|
1283
|
+
SDSIcon.iconLoader.resolve(this.name, resolve);
|
|
1284
|
+
});
|
|
1285
|
+
this.svg = svg;
|
|
1291
1286
|
} catch (error) {
|
|
1292
1287
|
console.error(`Failed to fetch SVG for icon '${this.name}':`, error);
|
|
1293
1288
|
this.svg = "";
|
|
@@ -1311,6 +1306,7 @@ let SDSIcon = class extends r$2 {
|
|
|
1311
1306
|
}
|
|
1312
1307
|
};
|
|
1313
1308
|
SDSIcon.styles = [styles$e];
|
|
1309
|
+
SDSIcon.iconLoader = new SDSIconLoader();
|
|
1314
1310
|
__decorateClass$f([
|
|
1315
1311
|
n2({ type: String, reflect: true })
|
|
1316
1312
|
], SDSIcon.prototype, "name", 2);
|