@politiet/sheriff-web-components 1.0.0-rc.7 → 1.0.0-rc.8
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-icon/sds-icon-loader.d.ts +5 -6
- package/dist/sds-icon/sds-icon-loader.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon-loader.js +31 -26
- package/dist/sds-icon/sds-icon-loader.js.map +1 -1
- package/dist/sds-icon/sds-icon.d.ts +10 -16
- package/dist/sds-icon/sds-icon.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon.js +26 -23
- package/dist/sds-icon/sds-icon.js.map +1 -1
- package/dist/sds-loader/sds-loader.d.ts +2 -3
- package/dist/sds-loader/sds-loader.d.ts.map +1 -1
- package/dist/sds-loader/sds-loader.js.map +1 -1
- package/dist/sds-notification/sds-notification.d.ts.map +1 -1
- package/dist/sds-notification/sds-notification.js.map +1 -1
- package/dist/sheriff-web-components.js +54 -36
- package/package.json +5 -7
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
export type IconPromise = (iconName: string) => Promise<string>;
|
|
2
|
-
export declare const loadCdnIcons: IconPromise;
|
|
3
|
-
export declare const loadLocalIcons: IconPromise;
|
|
4
2
|
export declare class SDSIconLoader {
|
|
5
|
-
private
|
|
6
|
-
|
|
3
|
+
private cache;
|
|
4
|
+
private _loadLocal;
|
|
5
|
+
get loadLocal(): boolean;
|
|
6
|
+
set loadLocal(value: boolean);
|
|
7
7
|
resolver: IconPromise;
|
|
8
|
-
constructor();
|
|
9
8
|
resolve(name: string, onResolved: (svg: string) => void): void;
|
|
10
|
-
|
|
9
|
+
clear(): void;
|
|
11
10
|
get currentLoader(): IconPromise;
|
|
12
11
|
}
|
|
13
12
|
//# 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;AAmBhE,qBAAa,aAAa;IACzB,OAAO,CAAC,KAAK,CAA+C;IAC5D,OAAO,CAAC,UAAU,CAAkB;IAEpC,IAAI,SAAS,IAAI,OAAO,CAEvB;IAED,IAAI,SAAS,CAAC,KAAK,EAAE,OAAO,EAG3B;IAED,QAAQ,EAAE,WAAW,CAAmD;IAExE,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,GAAG,IAAI;IAsB9D,KAAK,IAAI,IAAI;IAIb,IAAI,aAAa,IAAI,WAAW,CAE/B;CACD"}
|
|
@@ -1,46 +1,51 @@
|
|
|
1
|
-
|
|
1
|
+
const loadLocalIcons = (name) => import(`@politiet/sheriff-icons/dist/assets/${name}.js`)
|
|
2
|
+
.then(({ default: svg }) => {
|
|
3
|
+
return svg;
|
|
4
|
+
})
|
|
5
|
+
.catch((error) => {
|
|
6
|
+
console.log(error);
|
|
7
|
+
});
|
|
8
|
+
const loadCdnIcons = (name) => fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/assets/${name}.svg`).then((response) => {
|
|
2
9
|
if (!response.ok) {
|
|
3
10
|
throw new TypeError(`Sheriff: unknown icon: '${name}'`);
|
|
4
11
|
}
|
|
5
12
|
return response.text();
|
|
6
13
|
});
|
|
7
|
-
export const loadLocalIcons = async (name) => {
|
|
8
|
-
try {
|
|
9
|
-
const { default: svg } = await import(`@politiet/sheriff-icons/dist/${name}.js`);
|
|
10
|
-
return svg;
|
|
11
|
-
}
|
|
12
|
-
catch (error) {
|
|
13
|
-
console.warn(`Local icon '${name}' could not be loaded. Falling back to CDN.`);
|
|
14
|
-
return loadCdnIcons(name);
|
|
15
|
-
}
|
|
16
|
-
};
|
|
17
14
|
export class SDSIconLoader {
|
|
18
15
|
constructor() {
|
|
19
16
|
this.cache = new Map();
|
|
20
|
-
this.
|
|
17
|
+
this._loadLocal = false;
|
|
18
|
+
this.resolver = this._loadLocal ? loadLocalIcons : loadCdnIcons;
|
|
19
|
+
}
|
|
20
|
+
get loadLocal() {
|
|
21
|
+
return this._loadLocal;
|
|
22
|
+
}
|
|
23
|
+
set loadLocal(value) {
|
|
24
|
+
this._loadLocal = value;
|
|
25
|
+
this.resolver = value ? loadLocalIcons : loadCdnIcons;
|
|
21
26
|
}
|
|
22
27
|
resolve(name, onResolved) {
|
|
23
|
-
|
|
24
|
-
if (cached
|
|
28
|
+
let cached = this.cache.get(name);
|
|
29
|
+
if (typeof cached === 'string') {
|
|
25
30
|
onResolved(cached);
|
|
26
31
|
return;
|
|
27
32
|
}
|
|
28
|
-
|
|
29
|
-
.
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
}
|
|
33
|
+
if (!cached) {
|
|
34
|
+
cached = this.resolver(name)
|
|
35
|
+
.catch(() => 'Loading icon failed')
|
|
36
|
+
.then((svg) => {
|
|
37
|
+
this.cache.set(name, svg);
|
|
38
|
+
return svg;
|
|
39
|
+
});
|
|
40
|
+
this.cache.set(name, cached);
|
|
41
|
+
}
|
|
42
|
+
cached.then(onResolved);
|
|
37
43
|
}
|
|
38
|
-
|
|
39
|
-
|
|
44
|
+
clear() {
|
|
45
|
+
this.cache.clear();
|
|
40
46
|
}
|
|
41
47
|
get currentLoader() {
|
|
42
48
|
return this.resolver;
|
|
43
49
|
}
|
|
44
50
|
}
|
|
45
|
-
SDSIconLoader.defaultResolver = loadLocalIcons;
|
|
46
51
|
//# 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,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"sds-icon-loader.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon-loader.ts"],"names":[],"mappings":"AAEA,MAAM,cAAc,GAAgB,CAAC,IAAY,EAAE,EAAE,CACpD,MAAM,CAAC,uCAAuC,IAAI,KAAK,CAAC;KACtD,IAAI,CAAC,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE;IAC1B,OAAO,GAAG,CAAC;AACZ,CAAC,CAAC;KACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;IAChB,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AACpB,CAAC,CAAC,CAAC;AAEL,MAAM,YAAY,GAAgB,CAAC,IAAY,EAAE,EAAE,CAClD,KAAK,CAAC,yDAAyD,IAAI,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;IAC5F,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,OAAO,aAAa;IAA1B;QACS,UAAK,GAAG,IAAI,GAAG,EAAoC,CAAC;QACpD,eAAU,GAAY,KAAK,CAAC;QAWpC,aAAQ,GAAgB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC;IA+BzE,CAAC;IAxCA,IAAI,SAAS;QACZ,OAAO,IAAI,CAAC,UAAU,CAAC;IACxB,CAAC;IAED,IAAI,SAAS,CAAC,KAAc;QAC3B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC;IACvD,CAAC;IAID,OAAO,CAAC,IAAY,EAAE,UAAiC;QACtD,IAAI,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QAElC,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE,CAAC;YAChC,UAAU,CAAC,MAAM,CAAC,CAAC;YACnB,OAAO;QACR,CAAC;QAED,IAAI,CAAC,MAAM,EAAE,CAAC;YACb,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;iBAC1B,KAAK,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC;iBAClC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;gBACb,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;gBAC1B,OAAO,GAAG,CAAC;YACZ,CAAC,CAAC,CAAC;YAEJ,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QAC9B,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACzB,CAAC;IAED,KAAK;QACJ,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACpB,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACtB,CAAC;CACD","sourcesContent":["export type IconPromise = (iconName: string) => Promise<string>;\n\nconst loadLocalIcons: IconPromise = (name: string) =>\n\timport(`@politiet/sheriff-icons/dist/assets/${name}.js`)\n\t\t.then(({ default: svg }) => {\n\t\t\treturn svg;\n\t\t})\n\t\t.catch((error) => {\n\t\t\tconsole.log(error);\n\t\t});\n\nconst loadCdnIcons: IconPromise = (name: string) =>\n\tfetch(`https://unpkg.com/@politiet/sheriff-icons/dist/assets/${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 class SDSIconLoader {\n\tprivate cache = new Map<string, string | Promise<string>>();\n\tprivate _loadLocal: boolean = false;\n\n\tget loadLocal(): boolean {\n\t\treturn this._loadLocal;\n\t}\n\n\tset loadLocal(value: boolean) {\n\t\tthis._loadLocal = value;\n\t\tthis.resolver = value ? loadLocalIcons : loadCdnIcons;\n\t}\n\n\tresolver: IconPromise = this._loadLocal ? loadLocalIcons : loadCdnIcons;\n\n\tresolve(name: string, onResolved: (svg: string) => void): void {\n\t\tlet cached = this.cache.get(name);\n\n\t\tif (typeof cached === 'string') {\n\t\t\tonResolved(cached);\n\t\t\treturn;\n\t\t}\n\n\t\tif (!cached) {\n\t\t\tcached = this.resolver(name)\n\t\t\t\t.catch(() => 'Loading icon failed')\n\t\t\t\t.then((svg) => {\n\t\t\t\t\tthis.cache.set(name, svg);\n\t\t\t\t\treturn svg;\n\t\t\t\t});\n\n\t\t\tthis.cache.set(name, cached);\n\t\t}\n\n\t\tcached.then(onResolved);\n\t}\n\n\tclear(): void {\n\t\tthis.cache.clear();\n\t}\n\n\tget currentLoader(): IconPromise {\n\t\treturn this.resolver;\n\t}\n}\n"]}
|
|
@@ -1,33 +1,27 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
import { type IconPromise } from './sds-icon-loader';
|
|
3
|
-
import { type IconType } from './sds-icon.icon-types';
|
|
4
|
-
import { type ColorType } from './sds-icon.color-types';
|
|
5
|
-
type IconSize = 's' | 'm';
|
|
6
|
-
type IconTypes = IconType | '';
|
|
7
|
-
type IconColors = ColorType | '';
|
|
8
|
-
export interface SDSIconProps {
|
|
9
|
-
name?: IconTypes;
|
|
10
|
-
size?: IconSize;
|
|
11
|
-
color?: IconColors;
|
|
12
|
-
label?: string;
|
|
13
|
-
}
|
|
14
3
|
export declare class SDSIcon extends LitElement {
|
|
15
4
|
static styles: import("lit").CSSResult[];
|
|
16
5
|
private static readonly iconLoader;
|
|
6
|
+
static setLoadLocal(loadLocal: boolean): void;
|
|
17
7
|
static registerResolver(resolver: IconPromise): void;
|
|
18
|
-
name:
|
|
19
|
-
size:
|
|
20
|
-
color:
|
|
8
|
+
name: string;
|
|
9
|
+
size: 's' | 'm';
|
|
10
|
+
color: string;
|
|
21
11
|
label: string;
|
|
22
12
|
private svg;
|
|
13
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
14
|
+
/**
|
|
15
|
+
* Wraps the icon loader's callback in a promise. Even if the loader
|
|
16
|
+
* calls the callback synchronously, awaiting the promise defers the
|
|
17
|
+
* property update to the next microtask.
|
|
18
|
+
*/
|
|
23
19
|
private fetchIcon;
|
|
24
20
|
updated(changedProperties: Map<string | number | symbol, unknown>): void;
|
|
25
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
26
21
|
}
|
|
27
22
|
declare global {
|
|
28
23
|
interface HTMLElementTagNameMap {
|
|
29
24
|
'sds-icon': SDSIcon;
|
|
30
25
|
}
|
|
31
26
|
}
|
|
32
|
-
export {};
|
|
33
27
|
//# sourceMappingURL=sds-icon.d.ts.map
|
|
@@ -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;AAIvC,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,mBAAmB,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;AAGpE,qBACa,OAAQ,SAAQ,UAAU;IACtC,OAAgB,MAAM,4BAAY;IAElC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAuB;IAEzD,MAAM,CAAC,YAAY,CAAC,SAAS,EAAE,OAAO,GAAG,IAAI;IAI7C,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,GAAG,IAAI;IAIT,IAAI,EAAE,MAAM,CAAM;IAClB,IAAI,EAAE,GAAG,GAAG,GAAG,CAAO;IACtB,KAAK,EAAE,MAAM,CAAM;IACnB,KAAK,EAAE,MAAM,CAAM;IAErD,OAAO,CAAC,GAAG,CAAc;IAEzB,MAAM;IAef;;;;OAIG;YACW,SAAS;IAWd,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;CAMjF;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}
|
|
@@ -20,24 +20,40 @@ let SDSIcon = SDSIcon_1 = class SDSIcon extends LitElement {
|
|
|
20
20
|
this.label = '';
|
|
21
21
|
this.svg = '';
|
|
22
22
|
}
|
|
23
|
+
static setLoadLocal(loadLocal) {
|
|
24
|
+
this.iconLoader.loadLocal = loadLocal;
|
|
25
|
+
}
|
|
23
26
|
static registerResolver(resolver) {
|
|
24
27
|
this.iconLoader.resolver = resolver;
|
|
25
28
|
}
|
|
29
|
+
render() {
|
|
30
|
+
return html `
|
|
31
|
+
<div
|
|
32
|
+
class="sds-icon"
|
|
33
|
+
role="${ifDefined(this.label ? 'img' : undefined)}"
|
|
34
|
+
style="${ifDefined(this.color ? `color:${this.color}` : undefined)}"
|
|
35
|
+
aria-label="${ifDefined(this.label)}"
|
|
36
|
+
>
|
|
37
|
+
${this.name
|
|
38
|
+
? html `<slot aria-hidden="true">${unsafeSVG(this.svg)}</slot>`
|
|
39
|
+
: html `<slot aria-hidden="true"></slot>`}
|
|
40
|
+
</div>
|
|
41
|
+
`;
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* Wraps the icon loader's callback in a promise. Even if the loader
|
|
45
|
+
* calls the callback synchronously, awaiting the promise defers the
|
|
46
|
+
* property update to the next microtask.
|
|
47
|
+
*/
|
|
26
48
|
async fetchIcon() {
|
|
27
49
|
if (!this.name) {
|
|
28
50
|
this.svg = '';
|
|
29
51
|
return;
|
|
30
52
|
}
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
this.svg = svg;
|
|
36
|
-
}
|
|
37
|
-
catch (error) {
|
|
38
|
-
console.error(`Failed to fetch SVG for icon '${this.name}':`, error);
|
|
39
|
-
this.svg = '';
|
|
40
|
-
}
|
|
53
|
+
const svg = await new Promise((resolve) => {
|
|
54
|
+
SDSIcon_1.iconLoader.resolve(this.name, resolve);
|
|
55
|
+
});
|
|
56
|
+
this.svg = svg;
|
|
41
57
|
}
|
|
42
58
|
updated(changedProperties) {
|
|
43
59
|
super.updated(changedProperties);
|
|
@@ -45,20 +61,7 @@ let SDSIcon = SDSIcon_1 = class SDSIcon extends LitElement {
|
|
|
45
61
|
void this.fetchIcon();
|
|
46
62
|
}
|
|
47
63
|
}
|
|
48
|
-
render() {
|
|
49
|
-
return html `<div
|
|
50
|
-
class="sds-icon"
|
|
51
|
-
role="${ifDefined(this.label ? 'img' : undefined)}"
|
|
52
|
-
style="${ifDefined(this.color ? `color:${this.color}` : undefined)}"
|
|
53
|
-
aria-label="${ifDefined(this.label)}"
|
|
54
|
-
>
|
|
55
|
-
${this.name
|
|
56
|
-
? html `<slot aria-hidden="true">${unsafeSVG(this.svg)}</slot>`
|
|
57
|
-
: html `<slot aria-hidden="true"></slot>`}
|
|
58
|
-
</div>`;
|
|
59
|
-
}
|
|
60
64
|
};
|
|
61
|
-
// Styling
|
|
62
65
|
SDSIcon.styles = [styles];
|
|
63
66
|
SDSIcon.iconLoader = new SDSIconLoader();
|
|
64
67
|
__decorate([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-icon.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,aAAa,EAAoB,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-icon.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { SDSIconLoader, type IconPromise } from './sds-icon-loader';\nimport { styles } from './sds-icon.styles';\n\n@customElement('sds-icon')\nexport class SDSIcon extends LitElement {\n\tstatic override styles = [styles];\n\n\tprivate static readonly iconLoader = new SDSIconLoader();\n\n\tstatic setLoadLocal(loadLocal: boolean): void {\n\t\tthis.iconLoader.loadLocal = loadLocal;\n\t}\n\n\tstatic registerResolver(resolver: IconPromise): void {\n\t\tthis.iconLoader.resolver = resolver;\n\t}\n\n\t@property({ type: String, reflect: true }) name: string = '';\n\t@property({ type: String, reflect: true }) size: 's' | 'm' = 'm';\n\t@property({ type: String, reflect: true }) color: string = '';\n\t@property({ type: String, reflect: true }) label: string = '';\n\n\t@state() private svg: string = '';\n\n\toverride render() {\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"sds-icon\"\n\t\t\t\trole=\"${ifDefined(this.label ? 'img' : undefined)}\"\n\t\t\t\tstyle=\"${ifDefined(this.color ? `color:${this.color}` : undefined)}\"\n\t\t\t\taria-label=\"${ifDefined(this.label)}\"\n\t\t\t>\n\t\t\t\t${this.name\n\t\t\t\t\t? html`<slot aria-hidden=\"true\">${unsafeSVG(this.svg)}</slot>`\n\t\t\t\t\t: html`<slot aria-hidden=\"true\"></slot>`}\n\t\t\t</div>\n\t\t`;\n\t}\n\n\t/**\n\t * Wraps the icon loader's callback in a promise. Even if the loader\n\t * calls the callback synchronously, awaiting the promise defers the\n\t * property update to the next microtask.\n\t */\n\tprivate async fetchIcon() {\n\t\tif (!this.name) {\n\t\t\tthis.svg = '';\n\t\t\treturn;\n\t\t}\n\t\tconst svg = await new Promise<string>((resolve) => {\n\t\t\tSDSIcon.iconLoader.resolve(this.name, resolve);\n\t\t});\n\t\tthis.svg = svg;\n\t}\n\n\toverride updated(changedProperties: Map<string | number | symbol, unknown>): void {\n\t\tsuper.updated(changedProperties);\n\t\tif (changedProperties.has('name') && this.name) {\n\t\t\tvoid this.fetchIcon();\n\t\t}\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-icon': SDSIcon;\n\t}\n}\n"]}
|
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
|
-
import { type ColorType } from '../sds-icon/sds-icon.color-types';
|
|
3
2
|
type LoaderSize = 'large' | 'medium' | 'small';
|
|
4
3
|
export interface SDSLoaderProps {
|
|
5
4
|
size?: LoaderSize;
|
|
6
|
-
color?:
|
|
5
|
+
color?: string;
|
|
7
6
|
}
|
|
8
7
|
export declare class SDSLoader extends LitElement {
|
|
9
8
|
static styles: import("lit").CSSResult[];
|
|
10
9
|
size: LoaderSize;
|
|
11
|
-
color:
|
|
10
|
+
color: string;
|
|
12
11
|
render(): import("lit-html").TemplateResult<1>;
|
|
13
12
|
}
|
|
14
13
|
declare global {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-loader.d.ts","sourceRoot":"","sources":["../../src/sds-loader/sds-loader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-loader.d.ts","sourceRoot":"","sources":["../../src/sds-loader/sds-loader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,KAAK,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC9B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAED,qBACa,SAAU,SAAQ,UAAU;IAExC,OAAgB,MAAM,4BAAY;IAGS,IAAI,EAAE,UAAU,CAAW;IAC3B,KAAK,EAAE,MAAM,CAAkB;IAEjE,MAAM;CASf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-loader.js","sourceRoot":"","sources":["../../src/sds-loader/sds-loader.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;
|
|
1
|
+
{"version":3,"file":"sds-loader.js","sourceRoot":"","sources":["../../src/sds-loader/sds-loader.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;AAUtC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QAIN,iBAAiB;QAC0B,SAAI,GAAe,OAAO,CAAC;QAC3B,UAAK,GAAW,cAAc,CAAC;IAW3E,CAAC;IATS,MAAM;QACd,MAAM,aAAa,GAAG;YACrB,YAAY,EAAE,IAAI;YAClB,oBAAoB,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;YAC5C,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;SAC1C,CAAC;QAEF,OAAO,IAAI,CAAA,gBAAgB,QAAQ,CAAC,aAAa,CAAC,YAAY,SAAS,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC;IAChG,CAAC;;AAfD,UAAU;AACM,gBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGS;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAA4B;AAC3B;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAAgC;AAN9D,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CAiBrB","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-loader.styles';\n\ntype LoaderSize = 'large' | 'medium' | 'small';\n\nexport interface SDSLoaderProps {\n\tsize?: LoaderSize;\n\tcolor?: string;\n}\n\n@customElement('sds-loader')\nexport class SDSLoader extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String, reflect: true }) size: LoaderSize = 'large';\n\t@property({ type: String, reflect: true }) color: string = 'currentColor';\n\n\toverride render() {\n\t\tconst loaderClasses = {\n\t\t\t'sds-loader': true,\n\t\t\t'sds-loader--medium': this.size === 'medium',\n\t\t\t'sds-loader--small': this.size === 'small',\n\t\t};\n\n\t\treturn html`<span class=\"${classMap(loaderClasses)}\" style=\"${`color:${this.color}`}\"></span>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-loader': SDSLoader;\n\t}\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-notification.d.ts","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-notification.d.ts","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAKhD,OAAO,sBAAsB,CAAC;AAE9B,KAAK,mBAAmB,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,UAAU,CAAC;AAUrF,MAAM,WAAW,oBAAoB;IACpC,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;CAC3C;AAED,qBACa,eAAgB,SAAQ,UAAU;IAE9C,OAAgB,MAAM,4BAAY;IAGS,OAAO,EAAE,mBAAmB,CAAU;IACR,cAAc,CAAC,EAAE,MAAM,CAAC;IAEjG,OAAO,CAAC,QAAQ,CAAC,OAAO,CAOtB;IAEO,MAAM;CA2Bf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,kBAAkB,EAAE,eAAe,CAAC;KACpC;CACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-notification.js","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-notification.js","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,sBAAsB,CAAC;AAI9B,MAAM,iBAAiB,GAAwC;IAC9D,IAAI,EAAE,sBAAsB;IAC5B,OAAO,EAAE,8BAA8B;IACvC,SAAS,EAAE,uBAAuB;IAClC,OAAO,EAAE,yBAAyB;IAClC,QAAQ,EAAE,2BAA2B;CACrC,CAAC;AASK,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAIN,iBAAiB;QAC0B,YAAO,GAAwB,MAAM,CAAC;QAGhE,YAAO,GAAG,GAAG,EAAE;YAC/B,IAAI,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,YAAY,EAAE;gBAC7B,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACd,CAAC,CACF,CAAC;QACH,CAAC,CAAC;IA6BH,CAAC;IA3BS,MAAM;QACd,MAAM,mBAAmB,GAAG;YAC3B,kBAAkB,EAAE,IAAI;YACxB,CAAC,qBAAqB,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;SAC3C,CAAC;QAEF,OAAO,IAAI,CAAA,eAAe,QAAQ,CAAC,mBAAmB,CAAC;;qDAEJ,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC;;;;;;;MAO9E,IAAI,CAAC,cAAc;YACpB,CAAC,CAAC,IAAI,CAAA;;gBAEK,IAAI,CAAC,OAAO;qBACP,IAAI,CAAC,cAAc;;;gBAGxB;YACX,CAAC,CAAC,OAAO;;SAEL,CAAC;IACT,CAAC;;AA1CD,UAAU;AACM,sBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGS;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAAuC;AACR;IAAxE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDAAyB;AANrF,eAAe;IAD3B,aAAa,CAAC,kBAAkB,CAAC;GACrB,eAAe,CA4C3B","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-notification.styles';\n\nimport '../sds-icon/sds-icon';\n\ntype NotificationVariant = 'info' | 'success' | 'attention' | 'warning' | 'critical';\n\nconst notificationIcons: Record<NotificationVariant, string> = {\n\tinfo: 'info-material-filled',\n\tsuccess: 'check_circle-material-filled',\n\tattention: 'error-material-filled',\n\twarning: 'warning-material-filled',\n\tcritical: 'dangerous-material-filled',\n};\n\nexport interface SDSNotificationProps {\n\tvariant?: NotificationVariant;\n\t'removable-label'?: string;\n\tonSdsRemove?: (event: CustomEvent) => void;\n}\n\n@customElement('sds-notification')\nexport class SDSNotification extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String, reflect: true }) variant: NotificationVariant = 'info';\n\t@property({ type: String, attribute: 'removable-label', reflect: true }) removableLabel?: string;\n\n\tprivate readonly _remove = () => {\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('sds-remove', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\toverride render() {\n\t\tconst notificationClasses = {\n\t\t\t'sds-notification': true,\n\t\t\t[`sds-notification--${this.variant}`]: true,\n\t\t};\n\n\t\treturn html`<div class=\"${classMap(notificationClasses)}\">\n\t\t\t<div class=\"sds-notification__type\">\n\t\t\t\t<sds-icon class=\"sds-notification__icon\" name=\"${notificationIcons[this.variant]}\" size=\"m\"></sds-icon>\n\t\t\t</div>\n\t\t\t<div class=\"sds-notification__content\">\n\t\t\t\t<div class=\"sds-notification__content-text\">\n\t\t\t\t\t<slot name=\"title\"></slot>\n\t\t\t\t\t<slot name=\"message\"></slot>\n\t\t\t\t</div>\n\t\t\t\t${this.removableLabel\n\t\t\t\t\t? html`<button\n\t\t\t\t\t\t\tclass=\"sds-notification__remove-btn\"\n\t\t\t\t\t\t\t@click=${this._remove}\n\t\t\t\t\t\t\taria-label=\"${this.removableLabel}\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<sds-icon name=\"close-material-outlined\" size=\"s\"></sds-icon>\n\t\t\t\t\t\t</button>`\n\t\t\t\t\t: nothing}\n\t\t\t</div>\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-notification': SDSNotification;\n\t}\n}\n"]}
|
|
@@ -650,6 +650,7 @@ const styles$h = i$4`
|
|
|
650
650
|
gap: var(--sds-spacing-3, 8px);
|
|
651
651
|
justify-content: center;
|
|
652
652
|
padding: var(--sds-spacing-3) var(--sds-spacing-4);
|
|
653
|
+
inline-size: 100%;
|
|
653
654
|
|
|
654
655
|
background-color: var(--sds-color-semantic-surface-action-default);
|
|
655
656
|
border: 2px solid var(--sds-color-semantic-border-action);
|
|
@@ -1237,40 +1238,52 @@ class t extends e {
|
|
|
1237
1238
|
}
|
|
1238
1239
|
t.directiveName = "unsafeSVG", t.resultType = 2;
|
|
1239
1240
|
const o = e$2(t);
|
|
1240
|
-
const
|
|
1241
|
+
const loadLocalIcons = (name) => import(`@politiet/sheriff-icons/dist/assets/${name}.js`).then(({ default: svg }) => {
|
|
1242
|
+
return svg;
|
|
1243
|
+
}).catch((error) => {
|
|
1244
|
+
console.log(error);
|
|
1245
|
+
});
|
|
1246
|
+
const loadCdnIcons = (name) => fetch(`https://unpkg.com/@politiet/sheriff-icons/dist/assets/${name}.svg`).then((response) => {
|
|
1241
1247
|
if (!response.ok) {
|
|
1242
1248
|
throw new TypeError(`Sheriff: unknown icon: '${name}'`);
|
|
1243
1249
|
}
|
|
1244
1250
|
return response.text();
|
|
1245
1251
|
});
|
|
1246
|
-
|
|
1252
|
+
class SDSIconLoader {
|
|
1247
1253
|
constructor() {
|
|
1248
1254
|
this.cache = /* @__PURE__ */ new Map();
|
|
1249
|
-
this.
|
|
1255
|
+
this._loadLocal = false;
|
|
1256
|
+
this.resolver = this._loadLocal ? loadLocalIcons : loadCdnIcons;
|
|
1257
|
+
}
|
|
1258
|
+
get loadLocal() {
|
|
1259
|
+
return this._loadLocal;
|
|
1260
|
+
}
|
|
1261
|
+
set loadLocal(value) {
|
|
1262
|
+
this._loadLocal = value;
|
|
1263
|
+
this.resolver = value ? loadLocalIcons : loadCdnIcons;
|
|
1250
1264
|
}
|
|
1251
1265
|
resolve(name, onResolved) {
|
|
1252
|
-
|
|
1253
|
-
if (cached
|
|
1266
|
+
let cached = this.cache.get(name);
|
|
1267
|
+
if (typeof cached === "string") {
|
|
1254
1268
|
onResolved(cached);
|
|
1255
1269
|
return;
|
|
1256
1270
|
}
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
}
|
|
1271
|
+
if (!cached) {
|
|
1272
|
+
cached = this.resolver(name).catch(() => "Loading icon failed").then((svg) => {
|
|
1273
|
+
this.cache.set(name, svg);
|
|
1274
|
+
return svg;
|
|
1275
|
+
});
|
|
1276
|
+
this.cache.set(name, cached);
|
|
1277
|
+
}
|
|
1278
|
+
cached.then(onResolved);
|
|
1264
1279
|
}
|
|
1265
|
-
|
|
1266
|
-
|
|
1280
|
+
clear() {
|
|
1281
|
+
this.cache.clear();
|
|
1267
1282
|
}
|
|
1268
1283
|
get currentLoader() {
|
|
1269
1284
|
return this.resolver;
|
|
1270
1285
|
}
|
|
1271
|
-
}
|
|
1272
|
-
_SDSIconLoader.defaultResolver = loadCdnIcons;
|
|
1273
|
-
let SDSIconLoader = _SDSIconLoader;
|
|
1286
|
+
}
|
|
1274
1287
|
const styles$e = i$4`
|
|
1275
1288
|
:host {
|
|
1276
1289
|
--icon-size: var(--sds-icon-size-m);
|
|
@@ -1303,23 +1316,38 @@ let SDSIcon = class extends r$2 {
|
|
|
1303
1316
|
this.label = "";
|
|
1304
1317
|
this.svg = "";
|
|
1305
1318
|
}
|
|
1319
|
+
static setLoadLocal(loadLocal) {
|
|
1320
|
+
this.iconLoader.loadLocal = loadLocal;
|
|
1321
|
+
}
|
|
1306
1322
|
static registerResolver(resolver) {
|
|
1307
1323
|
this.iconLoader.resolver = resolver;
|
|
1308
1324
|
}
|
|
1325
|
+
render() {
|
|
1326
|
+
return x`
|
|
1327
|
+
<div
|
|
1328
|
+
class="sds-icon"
|
|
1329
|
+
role="${o$1(this.label ? "img" : void 0)}"
|
|
1330
|
+
style="${o$1(this.color ? `color:${this.color}` : void 0)}"
|
|
1331
|
+
aria-label="${o$1(this.label)}"
|
|
1332
|
+
>
|
|
1333
|
+
${this.name ? x`<slot aria-hidden="true">${o(this.svg)}</slot>` : x`<slot aria-hidden="true"></slot>`}
|
|
1334
|
+
</div>
|
|
1335
|
+
`;
|
|
1336
|
+
}
|
|
1337
|
+
/**
|
|
1338
|
+
* Wraps the icon loader's callback in a promise. Even if the loader
|
|
1339
|
+
* calls the callback synchronously, awaiting the promise defers the
|
|
1340
|
+
* property update to the next microtask.
|
|
1341
|
+
*/
|
|
1309
1342
|
async fetchIcon() {
|
|
1310
1343
|
if (!this.name) {
|
|
1311
1344
|
this.svg = "";
|
|
1312
1345
|
return;
|
|
1313
1346
|
}
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
this.svg = svg;
|
|
1319
|
-
} catch (error) {
|
|
1320
|
-
console.error(`Failed to fetch SVG for icon '${this.name}':`, error);
|
|
1321
|
-
this.svg = "";
|
|
1322
|
-
}
|
|
1347
|
+
const svg = await new Promise((resolve) => {
|
|
1348
|
+
SDSIcon.iconLoader.resolve(this.name, resolve);
|
|
1349
|
+
});
|
|
1350
|
+
this.svg = svg;
|
|
1323
1351
|
}
|
|
1324
1352
|
updated(changedProperties) {
|
|
1325
1353
|
super.updated(changedProperties);
|
|
@@ -1327,16 +1355,6 @@ let SDSIcon = class extends r$2 {
|
|
|
1327
1355
|
void this.fetchIcon();
|
|
1328
1356
|
}
|
|
1329
1357
|
}
|
|
1330
|
-
render() {
|
|
1331
|
-
return x`<div
|
|
1332
|
-
class="sds-icon"
|
|
1333
|
-
role="${o$1(this.label ? "img" : void 0)}"
|
|
1334
|
-
style="${o$1(this.color ? `color:${this.color}` : void 0)}"
|
|
1335
|
-
aria-label="${o$1(this.label)}"
|
|
1336
|
-
>
|
|
1337
|
-
${this.name ? x`<slot aria-hidden="true">${o(this.svg)}</slot>` : x`<slot aria-hidden="true"></slot>`}
|
|
1338
|
-
</div>`;
|
|
1339
|
-
}
|
|
1340
1358
|
};
|
|
1341
1359
|
SDSIcon.styles = [styles$e];
|
|
1342
1360
|
SDSIcon.iconLoader = new SDSIconLoader();
|
package/package.json
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@politiet/sheriff-web-components",
|
|
3
|
-
"version": "1.0.0-rc.
|
|
3
|
+
"version": "1.0.0-rc.8",
|
|
4
4
|
"description": "Sheriff Design System Web Components Library",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"types": "dist/index.d.ts",
|
|
9
9
|
"files": [
|
|
10
|
-
"./dist/"
|
|
11
|
-
"./README.md"
|
|
10
|
+
"./dist/"
|
|
12
11
|
],
|
|
13
12
|
"exports": {
|
|
14
13
|
".": {
|
|
@@ -134,18 +133,17 @@
|
|
|
134
133
|
},
|
|
135
134
|
"scripts": {
|
|
136
135
|
"tidy-frameworks": "node ../../../scripts/delete-filetypes-from-folder.js --folder ./dist/frameworks --filetypes js,js.map",
|
|
137
|
-
"build-components": "tsc && npm run tidy-frameworks"
|
|
138
|
-
"version-bump": "node ../../../scripts/bump-version.js"
|
|
136
|
+
"build-components": "tsc && npm run tidy-frameworks"
|
|
139
137
|
},
|
|
140
138
|
"dependencies": {
|
|
141
139
|
"lit": "^3.2.0"
|
|
142
140
|
},
|
|
143
141
|
"optionalDependencies": {
|
|
144
142
|
"@lit/react": "^1.0.7",
|
|
145
|
-
"@politiet/sheriff-icons": "^1.0.0-rc.
|
|
143
|
+
"@politiet/sheriff-icons": "^1.0.0-rc.5"
|
|
146
144
|
},
|
|
147
145
|
"peerDependencies": {
|
|
148
|
-
"@politiet/sheriff-css-framework": "^1.0.0-rc.
|
|
146
|
+
"@politiet/sheriff-css-framework": "^1.0.0-rc.3"
|
|
149
147
|
},
|
|
150
148
|
"author": "Politiets IT-enhet",
|
|
151
149
|
"license": "ISC"
|