@politiet/sheriff-web-components 1.3.6 → 1.3.7

package/dist/sds-heading/sds-heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"sds-heading.js","sourceRoot":"","sources":["../../src/sds-heading/sds-heading.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAWvC,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAIN,iBAAiB;QACW,UAAK,GAAU,IAAI,CAAC;IAgCjD,CAAC;IA7BS,MAAM;QACd,MAAM,cAAc,GAAG;YACtB,aAAa,EAAE,IAAI;YACnB,iBAAiB,EAAE,IAAI,CAAC,EAAE,KAAK,IAAI;YACnC,gBAAgB,EAAE,IAAI,CAAC,EAAE,KAAK,GAAG;YACjC,gBAAgB,EAAE,IAAI,CAAC,EAAE,KAAK,GAAG;YACjC,gBAAgB,EAAE,IAAI,CAAC,EAAE,KAAK,GAAG;YACjC,iBAAiB,EAAE,IAAI,CAAC,EAAE,KAAK,IAAI;SACnC,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAC;QAEzC,QAAQ,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,EAAE,CAAC;YAClC,KAAK,IAAI;gBACR,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;YACtD,KAAK,IAAI;gBACR,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;YACtD,KAAK,IAAI;gBACR,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;YACtD,KAAK,IAAI;gBACR,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;YACtD,KAAK,IAAI;gBACR,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;YACtD,KAAK,IAAI;gBACR,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;YACtD;gBACC,OAAO,IAAI,CAAA,aAAa,OAAO,qBAAqB,CAAC;QACvD,CAAC;IACF,CAAC;;AAnCD,UAAU;AACM,iBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAqB;AACpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sCAAkB;AANjC,UAAU;IADtB,oBAAoB,CAAC,aAAa,CAAC;GACvB,UAAU,CAqCtB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-heading.styles';\n\ntype Level = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\ntype DisplaySize = 'xl' | 'l' | 'm' | 's' | 'xs';\n\nexport interface SDSHeadingProps {\n\tlevel?: Level;\n\tas?: DisplaySize;\n}\n\n@guardedCustomElement('sds-heading')\nexport class SDSHeading extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) level: Level = 'h1';\n\t@property({ type: String }) as?: DisplaySize;\n\n\toverride render() {\n\t\tconst headingClasses = {\n\t\t\t'sds-heading': true,\n\t\t\t'sds-heading--xl': this.as === 'xl',\n\t\t\t'sds-heading--l': this.as === 'l',\n\t\t\t'sds-heading--m': this.as === 'm',\n\t\t\t'sds-heading--s': this.as === 's',\n\t\t\t'sds-heading--xs': this.as === 'xs',\n\t\t};\n\n\t\tconst classes = classMap(headingClasses);\n\n\t\tswitch (this.level.toLowerCase()) {\n\t\t\tcase 'h1':\n\t\t\t\treturn html`<h1 class=${classes}><slot></slot></h1>`;\n\t\t\tcase 'h2':\n\t\t\t\treturn html`<h2 class=${classes}><slot></slot></h2>`;\n\t\t\tcase 'h3':\n\t\t\t\treturn html`<h3 class=${classes}><slot></slot></h3>`;\n\t\t\tcase 'h4':\n\t\t\t\treturn html`<h4 class=${classes}><slot></slot></h4>`;\n\t\t\tcase 'h5':\n\t\t\t\treturn html`<h5 class=${classes}><slot></slot></h5>`;\n\t\t\tcase 'h6':\n\t\t\t\treturn html`<h6 class=${classes}><slot></slot></h6>`;\n\t\t\tdefault:\n\t\t\t\treturn html`<h1 class=${classes}><slot></slot></h1>`;\n\t\t}\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-heading': SDSHeading;\n\t}\n}\n"]}
+{"version":3,"file":"sds-heading.js","sourceRoot":"","sources":["../../src/sds-heading/sds-heading.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAGvD,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,mBAAmB;CAAG,CAAA;AAAzC,UAAU;IADtB,oBAAoB,CAAC,aAAa,CAAC;GACvB,UAAU,CAA+B","sourcesContent":["import { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { SDSHeadingComponent } from './sds-heading.component';\n\n@guardedCustomElement('sds-heading')\nexport class SDSHeading extends SDSHeadingComponent {}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-heading': SDSHeading;\n\t}\n}\n"]}

package/dist/sds-icon/sds-icon.component.d.ts

@@ -0,0 +1,22 @@
+import { LitElement } from 'lit';
+import { type IconPromise } from './sds-icon-loader';
+export declare class SDSIconComponent extends LitElement {
+    static styles: import("lit").CSSResult[];
+    private static readonly iconLoader;
+    static setLoadLocal(loadLocal: boolean): void;
+    static registerResolver(resolver: IconPromise): void;
+    name: string;
+    size: 's' | 'm';
+    color: string;
+    label: string;
+    private svg;
+    render(): import("lit-html").TemplateResult<1>;
+    /**
+     * Wraps the icon loader's callback in a promise. Even if the loader
+     * calls the callback synchronously, awaiting the promise defers the
+     * property update to the next microtask.
+     */
+    private fetchIcon;
+    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+}
+//# sourceMappingURL=sds-icon.component.d.ts.map

package/dist/sds-icon/sds-icon.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-icon.component.d.ts","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAIvC,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGpE,qBAAa,gBAAiB,SAAQ,UAAU;IAC/C,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"}

package/dist/sds-icon/sds-icon.component.js

@@ -0,0 +1,81 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html } from 'lit';
+import { property, state } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
+import { SDSIconLoader } from './sds-icon-loader';
+import { styles } from './sds-icon.styles';
+export class SDSIconComponent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.name = '';
+        this.size = 'm';
+        this.color = '';
+        this.label = '';
+        this.svg = '';
+    }
+    static setLoadLocal(loadLocal) {
+        this.iconLoader.loadLocal = loadLocal;
+    }
+    static registerResolver(resolver) {
+        this.iconLoader.resolver = resolver;
+    }
+    render() {
+        return html `
+			<div
+				class="sds-icon"
+				role="${ifDefined(this.label ? 'img' : undefined)}"
+				style="${ifDefined(this.color ? `color:${this.color}` : undefined)}"
+				aria-label="${ifDefined(this.label)}"
+			>
+				${this.name
+            ? html `<slot aria-hidden="true">${unsafeSVG(this.svg)}</slot>`
+            : html `<slot aria-hidden="true"></slot>`}
+			</div>
+		`;
+    }
+    /**
+     * Wraps the icon loader's callback in a promise. Even if the loader
+     * calls the callback synchronously, awaiting the promise defers the
+     * property update to the next microtask.
+     */
+    async fetchIcon() {
+        if (!this.name) {
+            this.svg = '';
+            return;
+        }
+        const svg = await new Promise((resolve) => {
+            SDSIconComponent.iconLoader.resolve(this.name, resolve);
+        });
+        this.svg = svg;
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('name') && this.name) {
+            void this.fetchIcon();
+        }
+    }
+}
+SDSIconComponent.styles = [styles];
+SDSIconComponent.iconLoader = new SDSIconLoader();
+__decorate([
+    property({ type: String, reflect: true })
+], SDSIconComponent.prototype, "name", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], SDSIconComponent.prototype, "size", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], SDSIconComponent.prototype, "color", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], SDSIconComponent.prototype, "label", void 0);
+__decorate([
+    state()
+], SDSIconComponent.prototype, "svg", void 0);
+//# sourceMappingURL=sds-icon.component.js.map

package/dist/sds-icon/sds-icon.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-icon.component.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,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;AAE3C,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAAhD;;QAa4C,SAAI,GAAW,EAAE,CAAC;QAClB,SAAI,GAAc,GAAG,CAAC;QACtB,UAAK,GAAW,EAAE,CAAC;QACnB,UAAK,GAAW,EAAE,CAAC;QAE7C,QAAG,GAAW,EAAE,CAAC;IAuCnC,CAAC;IApDA,MAAM,CAAC,YAAY,CAAC,SAAkB;QACrC,IAAI,CAAC,UAAU,CAAC,SAAS,GAAG,SAAS,CAAC;IACvC,CAAC;IAED,MAAM,CAAC,gBAAgB,CAAC,QAAqB;QAC5C,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACrC,CAAC;IASQ,MAAM;QACd,OAAO,IAAI,CAAA;;;YAGD,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;aACxC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;kBACpD,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;;MAEjC,IAAI,CAAC,IAAI;YACV,CAAC,CAAC,IAAI,CAAA,4BAA4B,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS;YAC9D,CAAC,CAAC,IAAI,CAAA,kCAAkC;;GAE1C,CAAC;IACH,CAAC;IAED;;;;OAIG;IACK,KAAK,CAAC,SAAS;QACtB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAChB,IAAI,CAAC,GAAG,GAAG,EAAE,CAAC;YACd,OAAO;QACR,CAAC;QACD,MAAM,GAAG,GAAG,MAAM,IAAI,OAAO,CAAS,CAAC,OAAO,EAAE,EAAE;YACjD,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACzD,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;IAChB,CAAC;IAEQ,OAAO,CAAC,iBAAyD;QACzE,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YAChD,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;QACvB,CAAC;IACF,CAAC;;AAvDe,uBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAEV,2BAAU,GAAG,IAAI,aAAa,EAAE,AAAtB,CAAuB;AAUd;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAmB;AAClB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAuB;AACtB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAoB;AACnB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAoB;AAE7C;IAAhB,KAAK,EAAE;6CAA0B","sourcesContent":["import { LitElement, html } from 'lit';\nimport { 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\nexport class SDSIconComponent 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\tSDSIconComponent.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"]}

package/dist/sds-icon/sds-icon.d.ts

@@ -1,23 +1,5 @@
-import { LitElement } from 'lit';
-import { type IconPromise } from './sds-icon-loader';
-export declare class SDSIcon extends LitElement {
-    static styles: import("lit").CSSResult[];
-    private static readonly iconLoader;
-    static setLoadLocal(loadLocal: boolean): void;
-    static registerResolver(resolver: IconPromise): void;
-    name: string;
-    size: 's' | 'm';
-    color: string;
-    label: string;
-    private svg;
-    render(): import("lit-html").TemplateResult<1>;
-    /**
-     * Wraps the icon loader's callback in a promise. Even if the loader
-     * calls the callback synchronously, awaiting the promise defers the
-     * property update to the next microtask.
-     */
-    private fetchIcon;
-    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+import { SDSIconComponent } from './sds-icon.component';
+export declare class SDSIcon extends SDSIconComponent {
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/sds-icon/sds-icon.d.ts.map

@@ -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;AAIpE,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"}
+{"version":3,"file":"sds-icon.d.ts","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD,qBACa,OAAQ,SAAQ,gBAAgB;CAAG;AAEhD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}

package/dist/sds-icon/sds-icon.js

@@ -4,83 +4,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var SDSIcon_1;
-import { LitElement, html } from 'lit';
-import { property, state } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
-import { SDSIconLoader } from './sds-icon-loader';
 import { guardedCustomElement } from '../utils/guarded-custom-element';
-import { styles } from './sds-icon.styles';
-let SDSIcon = SDSIcon_1 = class SDSIcon extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.name = '';
-        this.size = 'm';
-        this.color = '';
-        this.label = '';
-        this.svg = '';
-    }
-    static setLoadLocal(loadLocal) {
-        this.iconLoader.loadLocal = loadLocal;
-    }
-    static registerResolver(resolver) {
-        this.iconLoader.resolver = resolver;
-    }
-    render() {
-        return html `
-			<div
-				class="sds-icon"
-				role="${ifDefined(this.label ? 'img' : undefined)}"
-				style="${ifDefined(this.color ? `color:${this.color}` : undefined)}"
-				aria-label="${ifDefined(this.label)}"
-			>
-				${this.name
-            ? html `<slot aria-hidden="true">${unsafeSVG(this.svg)}</slot>`
-            : html `<slot aria-hidden="true"></slot>`}
-			</div>
-		`;
-    }
-    /**
-     * Wraps the icon loader's callback in a promise. Even if the loader
-     * calls the callback synchronously, awaiting the promise defers the
-     * property update to the next microtask.
-     */
-    async fetchIcon() {
-        if (!this.name) {
-            this.svg = '';
-            return;
-        }
-        const svg = await new Promise((resolve) => {
-            SDSIcon_1.iconLoader.resolve(this.name, resolve);
-        });
-        this.svg = svg;
-    }
-    updated(changedProperties) {
-        super.updated(changedProperties);
-        if (changedProperties.has('name') && this.name) {
-            void this.fetchIcon();
-        }
-    }
+import { SDSIconComponent } from './sds-icon.component';
+let SDSIcon = class SDSIcon extends SDSIconComponent {
 };
-SDSIcon.styles = [styles];
-SDSIcon.iconLoader = new SDSIconLoader();
-__decorate([
-    property({ type: String, reflect: true })
-], SDSIcon.prototype, "name", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], SDSIcon.prototype, "size", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], SDSIcon.prototype, "color", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], SDSIcon.prototype, "label", void 0);
-__decorate([
-    state()
-], SDSIcon.prototype, "svg", void 0);
-SDSIcon = SDSIcon_1 = __decorate([
+SDSIcon = __decorate([
     guardedCustomElement('sds-icon')
 ], SDSIcon);
 export { SDSIcon };

package/dist/sds-icon/sds-icon.js.map

@@ -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,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,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,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAGpC,IAAM,OAAO,eAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QAaqC,SAAI,GAAW,EAAE,CAAC;QAClB,SAAI,GAAc,GAAG,CAAC;QACtB,UAAK,GAAW,EAAE,CAAC;QACnB,UAAK,GAAW,EAAE,CAAC;QAE7C,QAAG,GAAW,EAAE,CAAC;IAuCnC,CAAC;IApDA,MAAM,CAAC,YAAY,CAAC,SAAkB;QACrC,IAAI,CAAC,UAAU,CAAC,SAAS,GAAG,SAAS,CAAC;IACvC,CAAC;IAED,MAAM,CAAC,gBAAgB,CAAC,QAAqB;QAC5C,IAAI,CAAC,UAAU,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACrC,CAAC;IASQ,MAAM;QACd,OAAO,IAAI,CAAA;;;YAGD,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;aACxC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;kBACpD,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;;MAEjC,IAAI,CAAC,IAAI;YACV,CAAC,CAAC,IAAI,CAAA,4BAA4B,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS;YAC9D,CAAC,CAAC,IAAI,CAAA,kCAAkC;;GAE1C,CAAC;IACH,CAAC;IAED;;;;OAIG;IACK,KAAK,CAAC,SAAS;QACtB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAChB,IAAI,CAAC,GAAG,GAAG,EAAE,CAAC;YACd,OAAO;QACR,CAAC;QACD,MAAM,GAAG,GAAG,MAAM,IAAI,OAAO,CAAS,CAAC,OAAO,EAAE,EAAE;YACjD,SAAO,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAChD,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;IAChB,CAAC;IAEQ,OAAO,CAAC,iBAAyD;QACzE,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YAChD,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;QACvB,CAAC;IACF,CAAC;;AAvDe,cAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAEV,kBAAU,GAAG,IAAI,aAAa,EAAE,AAAtB,CAAuB;AAUd;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAAmB;AAClB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAAuB;AACtB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCAAoB;AACnB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCAAoB;AAE7C;IAAhB,KAAK,EAAE;oCAA0B;AAlBtB,OAAO;IADnB,oBAAoB,CAAC,UAAU,CAAC;GACpB,OAAO,CAyDnB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { 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 { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-icon.styles';\n\n@guardedCustomElement('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"]}
+{"version":3,"file":"sds-icon.js","sourceRoot":"","sources":["../../src/sds-icon/sds-icon.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAGjD,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,gBAAgB;CAAG,CAAA;AAAnC,OAAO;IADnB,oBAAoB,CAAC,UAAU,CAAC;GACpB,OAAO,CAA4B","sourcesContent":["import { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { SDSIconComponent } from './sds-icon.component';\n\n@guardedCustomElement('sds-icon')\nexport class SDSIcon extends SDSIconComponent {}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-icon': SDSIcon;\n\t}\n}\n"]}

package/dist/sds-notification/sds-notification.component.d.ts

@@ -0,0 +1,18 @@
+import { LitElement } from 'lit';
+type NotificationVariant = 'info' | 'success' | 'attention' | 'warning' | 'critical';
+export interface SDSNotificationProps {
+    variant?: NotificationVariant;
+    'removable-label'?: string;
+    onSdsRemove?: (event: CustomEvent) => void;
+}
+export declare class SDSNotificationComponent extends LitElement {
+    static styles: import("lit").CSSResult[];
+    iconTag: import("lit-html/static").StaticValue;
+    variant: NotificationVariant;
+    removableLabel?: string;
+    private readonly _remove;
+    private readonly _renderIcon;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};
+//# sourceMappingURL=sds-notification.component.d.ts.map

package/dist/sds-notification/sds-notification.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-notification.component.d.ts","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD,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,qBAAa,wBAAyB,SAAQ,UAAU;IAEvD,OAAgB,MAAM,4BAAY;IAClC,OAAO,wCAAqB;IAGe,OAAO,EAAE,mBAAmB,CAAU;IACR,cAAc,CAAC,EAAE,MAAM,CAAC;IAEjG,OAAO,CAAC,QAAQ,CAAC,OAAO,CAOtB;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAE1B;IAEO,MAAM;CA4Bf"}

package/dist/sds-notification/sds-notification.component.js

@@ -0,0 +1,71 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, nothing } from 'lit';
+import { property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { html as staticHtml, literal } from 'lit/static-html.js';
+import { styles } from './sds-notification.styles';
+const notificationIcons = {
+    info: 'info-material-filled',
+    success: 'check_circle-material-filled',
+    attention: 'error-material-filled',
+    warning: 'warning-material-filled',
+    critical: 'dangerous-material-filled',
+};
+export class SDSNotificationComponent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.iconTag = literal `sds-icon`;
+        // Reactive Props
+        this.variant = 'info';
+        this._remove = () => {
+            this.dispatchEvent(new CustomEvent('sds-remove', {
+                bubbles: true,
+                composed: true,
+            }));
+        };
+        this._renderIcon = (iconName, size, cls) => {
+            return staticHtml `<${this.iconTag} ${cls ? `class=${cls}` : ''} name="${iconName}" size=${size}></${this.iconTag}>`;
+        };
+    }
+    render() {
+        const notificationClasses = {
+            'sds-notification': true,
+            [`sds-notification--${this.variant}`]: true,
+        };
+        return html `<div class="${classMap(notificationClasses)}">
+			<div class="sds-notification__type">
+				<!-- ${staticHtml `<${this.iconTag}>Wow</${this.iconTag}>`} -->
+				${this._renderIcon(notificationIcons[this.variant], 'm', 'sds-notification__icon')}
+			</div>
+			<div class="sds-notification__content">
+				<div class="sds-notification__content-text">
+					<slot name="title"></slot>
+					<slot name="message"></slot>
+				</div>
+				${this.removableLabel
+            ? html `<button
+							class="sds-notification__remove-btn"
+							@click=${this._remove}
+							aria-label="${this.removableLabel}"
+						>
+							${this._renderIcon('close-material-outlined', 's')}
+						</button>`
+            : nothing}
+			</div>
+		</div>`;
+    }
+}
+// Styling
+SDSNotificationComponent.styles = [styles];
+__decorate([
+    property({ type: String, reflect: true })
+], SDSNotificationComponent.prototype, "variant", void 0);
+__decorate([
+    property({ type: String, attribute: 'removable-label', reflect: true })
+], SDSNotificationComponent.prototype, "removableLabel", void 0);
+//# sourceMappingURL=sds-notification.component.js.map

package/dist/sds-notification/sds-notification.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-notification.component.js","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAInD,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;AAQF,MAAM,OAAO,wBAAyB,SAAQ,UAAU;IAAxD;;QAGC,YAAO,GAAG,OAAO,CAAA,UAAU,CAAC;QAE5B,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;QAEe,gBAAW,GAAG,CAAC,QAAgB,EAAE,IAAY,EAAE,GAAY,EAAE,EAAE;YAC/E,OAAO,UAAU,CAAA,IAAI,IAAI,CAAC,OAAO,IAAI,GAAG,CAAC,CAAC,CAAC,SAAS,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,QAAQ,UAAU,IAAI,MAAM,IAAI,CAAC,OAAO,GAAG,CAAC;QACrH,CAAC,CAAC;IA8BH,CAAC;IA5BS,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;;WAE9C,UAAU,CAAA,IAAI,IAAI,CAAC,OAAO,SAAS,IAAI,CAAC,OAAO,GAAG;MACvD,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,GAAG,EAAE,wBAAwB,CAAC;;;;;;;MAOhF,IAAI,CAAC,cAAc;YACpB,CAAC,CAAC,IAAI,CAAA;;gBAEK,IAAI,CAAC,OAAO;qBACP,IAAI,CAAC,cAAc;;SAE/B,IAAI,CAAC,WAAW,CAAC,yBAAyB,EAAE,GAAG,CAAC;gBACzC;YACX,CAAC,CAAC,OAAO;;SAEL,CAAC;IACT,CAAC;;AAhDD,UAAU;AACM,+BAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAIS;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yDAAuC;AACR;IAAxE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gEAAyB","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html as staticHtml, literal } from 'lit/static-html.js';\nimport { styles } from './sds-notification.styles';\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\nexport class SDSNotificationComponent extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\ticonTag = literal`sds-icon`;\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\tprivate readonly _renderIcon = (iconName: string, size: string, cls?: string) => {\n\t\treturn staticHtml`<${this.iconTag} ${cls ? `class=${cls}` : ''} name=\"${iconName}\" size=${size}></${this.iconTag}>`;\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<!-- ${staticHtml`<${this.iconTag}>Wow</${this.iconTag}>`} -->\n\t\t\t\t${this._renderIcon(notificationIcons[this.variant], 'm', 'sds-notification__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${this._renderIcon('close-material-outlined', 's')}\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"]}

package/dist/sds-notification/sds-notification.d.ts

@@ -1,22 +1,10 @@
-import { LitElement } from 'lit';
 import '../sds-icon/sds-icon';
-type NotificationVariant = 'info' | 'success' | 'attention' | 'warning' | 'critical';
-export interface SDSNotificationProps {
-    variant?: NotificationVariant;
-    'removable-label'?: string;
-    onSdsRemove?: (event: CustomEvent) => void;
-}
-export declare class SDSNotification extends LitElement {
-    static styles: import("lit").CSSResult[];
-    variant: NotificationVariant;
-    removableLabel?: string;
-    private readonly _remove;
-    render(): import("lit-html").TemplateResult<1>;
+import { SDSNotificationComponent } from './sds-notification.component';
+export declare class SDSNotification extends SDSNotificationComponent {
 }
 declare global {
     interface HTMLElementTagNameMap {
         'sds-notification': SDSNotification;
     }
 }
-export {};
 //# sourceMappingURL=sds-notification.d.ts.map

package/dist/sds-notification/sds-notification.d.ts.map

@@ -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;AAMhD,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"}
+{"version":3,"file":"sds-notification.d.ts","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.ts"],"names":[],"mappings":"AACA,OAAO,sBAAsB,CAAC;AAC9B,OAAO,EAAE,wBAAwB,EAAE,MAAM,8BAA8B,CAAC;AAExE,qBACa,eAAgB,SAAQ,wBAAwB;CAAG;AAEhE,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,kBAAkB,EAAE,eAAe,CAAC;KACpC;CACD"}

package/dist/sds-notification/sds-notification.js

@@ -4,66 +4,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { LitElement, html, nothing } from 'lit';
-import { property } from 'lit/decorators.js';
-import { classMap } from 'lit/directives/class-map.js';
 import { guardedCustomElement } from '../utils/guarded-custom-element';
-import { styles } from './sds-notification.styles';
 import '../sds-icon/sds-icon';
-const notificationIcons = {
-    info: 'info-material-filled',
-    success: 'check_circle-material-filled',
-    attention: 'error-material-filled',
-    warning: 'warning-material-filled',
-    critical: 'dangerous-material-filled',
+import { SDSNotificationComponent } from './sds-notification.component';
+let SDSNotification = class SDSNotification extends SDSNotificationComponent {
 };
-let SDSNotification = class SDSNotification extends LitElement {
-    constructor() {
-        super(...arguments);
-        // Reactive Props
-        this.variant = 'info';
-        this._remove = () => {
-            this.dispatchEvent(new CustomEvent('sds-remove', {
-                bubbles: true,
-                composed: true,
-            }));
-        };
-    }
-    render() {
-        const notificationClasses = {
-            'sds-notification': true,
-            [`sds-notification--${this.variant}`]: true,
-        };
-        return html `<div class="${classMap(notificationClasses)}">
-			<div class="sds-notification__type">
-				<sds-icon class="sds-notification__icon" name="${notificationIcons[this.variant]}" size="m"></sds-icon>
-			</div>
-			<div class="sds-notification__content">
-				<div class="sds-notification__content-text">
-					<slot name="title"></slot>
-					<slot name="message"></slot>
-				</div>
-				${this.removableLabel
-            ? html `<button
-							class="sds-notification__remove-btn"
-							@click=${this._remove}
-							aria-label="${this.removableLabel}"
-						>
-							<sds-icon name="close-material-outlined" size="s"></sds-icon>
-						</button>`
-            : nothing}
-			</div>
-		</div>`;
-    }
-};
-// Styling
-SDSNotification.styles = [styles];
-__decorate([
-    property({ type: String, reflect: true })
-], SDSNotification.prototype, "variant", void 0);
-__decorate([
-    property({ type: String, attribute: 'removable-label', reflect: true })
-], SDSNotification.prototype, "removableLabel", void 0);
 SDSNotification = __decorate([
     guardedCustomElement('sds-notification')
 ], SDSNotification);

package/dist/sds-notification/sds-notification.js.map

@@ -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,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,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,oBAAoB,CAAC,kBAAkB,CAAC;GAC5B,eAAe,CA4C3B","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\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@guardedCustomElement('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"]}
+{"version":3,"file":"sds-notification.js","sourceRoot":"","sources":["../../src/sds-notification/sds-notification.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,sBAAsB,CAAC;AAC9B,OAAO,EAAE,wBAAwB,EAAE,MAAM,8BAA8B,CAAC;AAGjE,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,wBAAwB;CAAG,CAAA;AAAnD,eAAe;IAD3B,oBAAoB,CAAC,kBAAkB,CAAC;GAC5B,eAAe,CAAoC","sourcesContent":["import { guardedCustomElement } from '../utils/guarded-custom-element';\nimport '../sds-icon/sds-icon';\nimport { SDSNotificationComponent } from './sds-notification.component';\n\n@guardedCustomElement('sds-notification')\nexport class SDSNotification extends SDSNotificationComponent {}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-notification': SDSNotification;\n\t}\n}\n"]}

package/dist/sds-paragraph/sds-paragraph.component.d.ts

@@ -0,0 +1,12 @@
+import { LitElement } from 'lit';
+type Size = 'xl' | 'l' | 'm';
+export interface SDSParagraphProps {
+    size?: Size;
+}
+export declare class SDSParagraphComponent extends LitElement {
+    static styles: import("lit").CSSResult[];
+    size: Size;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};
+//# sourceMappingURL=sds-paragraph.component.d.ts.map

package/dist/sds-paragraph/sds-paragraph.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-paragraph.component.d.ts","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,KAAK,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,CAAC;AAE7B,MAAM,WAAW,iBAAiB;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC;CACZ;AAED,qBAAa,qBAAsB,SAAQ,UAAU;IAEpD,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,IAAI,CAAQ;IAErC,MAAM;CAYf"}

package/dist/sds-paragraph/sds-paragraph.component.js

@@ -0,0 +1,33 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    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;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { styles } from './sds-paragraph.styles';
+export class SDSParagraphComponent extends LitElement {
+    constructor() {
+        super(...arguments);
+        // Reactive Props
+        this.size = 'xl';
+    }
+    render() {
+        const styleClasses = {
+            'sds-paragraph': true,
+            'sds-paragraph--xl': this.size === 'xl',
+            'sds-paragraph--l': this.size === 'l',
+            'sds-paragraph--m': this.size === 'm',
+        };
+        const classes = classMap(styleClasses);
+        return html `<p class=${classes}><slot></slot></p>`;
+    }
+}
+// Styling
+SDSParagraphComponent.styles = [styles];
+__decorate([
+    property({ type: String })
+], SDSParagraphComponent.prototype, "size", void 0);
+//# sourceMappingURL=sds-paragraph.component.js.map

package/dist/sds-paragraph/sds-paragraph.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-paragraph.component.js","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAQhD,MAAM,OAAO,qBAAsB,SAAQ,UAAU;IAArD;;QAIC,iBAAiB;QACW,SAAI,GAAS,IAAI,CAAC;IAc/C,CAAC;IAZS,MAAM;QACd,MAAM,YAAY,GAAG;YACpB,eAAe,EAAE,IAAI;YACrB,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YACvC,kBAAkB,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YACrC,kBAAkB,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;SACrC,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;QAEvC,OAAO,IAAI,CAAA,YAAY,OAAO,oBAAoB,CAAC;IACpD,CAAC;;AAjBD,UAAU;AACM,4BAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAmB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-paragraph.styles';\n\ntype Size = 'xl' | 'l' | 'm';\n\nexport interface SDSParagraphProps {\n\tsize?: Size;\n}\n\nexport class SDSParagraphComponent extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) size: Size = 'xl';\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-paragraph': true,\n\t\t\t'sds-paragraph--xl': this.size === 'xl',\n\t\t\t'sds-paragraph--l': this.size === 'l',\n\t\t\t'sds-paragraph--m': this.size === 'm',\n\t\t};\n\n\t\tconst classes = classMap(styleClasses);\n\n\t\treturn html`<p class=${classes}><slot></slot></p>`;\n\t}\n}\n"]}

package/dist/sds-paragraph/sds-paragraph.d.ts

@@ -1,12 +1,9 @@
-import { LitElement } from 'lit';
+import { SDSParagraphComponent } from './sds-paragraph.component';
 type Size = 'xl' | 'l' | 'm';
 export interface SDSParagraphProps {
     size?: Size;
 }
-export declare class SDSParagraph extends LitElement {
-    static styles: import("lit").CSSResult[];
-    size: Size;
-    render(): import("lit-html").TemplateResult<1>;
+export declare class SDSParagraph extends SDSParagraphComponent {
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/sds-paragraph/sds-paragraph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sds-paragraph.d.ts","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,KAAK,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,CAAC;AAE7B,MAAM,WAAW,iBAAiB;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC;CACZ;AAED,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,IAAI,CAAQ;IAErC,MAAM;CAYf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;CACD"}
+{"version":3,"file":"sds-paragraph.d.ts","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAElE,KAAK,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,CAAC;AAE7B,MAAM,WAAW,iBAAiB;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC;CACZ;AAED,qBACa,YAAa,SAAQ,qBAAqB;CAAG;AAE1D,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;CACD"}

package/dist/sds-paragraph/sds-paragraph.js

@@ -4,33 +4,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { LitElement, html } from 'lit';
-import { property } from 'lit/decorators.js';
-import { classMap } from 'lit/directives/class-map.js';
 import { guardedCustomElement } from '../utils/guarded-custom-element';
-import { styles } from './sds-paragraph.styles';
-let SDSParagraph = class SDSParagraph extends LitElement {
-    constructor() {
-        super(...arguments);
-        // Reactive Props
-        this.size = 'xl';
-    }
-    render() {
-        const styleClasses = {
-            'sds-paragraph': true,
-            'sds-paragraph--xl': this.size === 'xl',
-            'sds-paragraph--l': this.size === 'l',
-            'sds-paragraph--m': this.size === 'm',
-        };
-        const classes = classMap(styleClasses);
-        return html `<p class=${classes}><slot></slot></p>`;
-    }
+import { SDSParagraphComponent } from './sds-paragraph.component';
+let SDSParagraph = class SDSParagraph extends SDSParagraphComponent {
 };
-// Styling
-SDSParagraph.styles = [styles];
-__decorate([
-    property({ type: String })
-], SDSParagraph.prototype, "size", void 0);
 SDSParagraph = __decorate([
     guardedCustomElement('sds-paragraph')
 ], SDSParagraph);

package/dist/sds-paragraph/sds-paragraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"sds-paragraph.js","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AASzC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAIN,iBAAiB;QACW,SAAI,GAAS,IAAI,CAAC;IAc/C,CAAC;IAZS,MAAM;QACd,MAAM,YAAY,GAAG;YACpB,eAAe,EAAE,IAAI;YACrB,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YACvC,kBAAkB,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YACrC,kBAAkB,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;SACrC,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;QAEvC,OAAO,IAAI,CAAA,YAAY,OAAO,oBAAoB,CAAC;IACpD,CAAC;;AAjBD,UAAU;AACM,mBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAmB;AALlC,YAAY;IADxB,oBAAoB,CAAC,eAAe,CAAC;GACzB,YAAY,CAmBxB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-paragraph.styles';\n\ntype Size = 'xl' | 'l' | 'm';\n\nexport interface SDSParagraphProps {\n\tsize?: Size;\n}\n\n@guardedCustomElement('sds-paragraph')\nexport class SDSParagraph extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) size: Size = 'xl';\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-paragraph': true,\n\t\t\t'sds-paragraph--xl': this.size === 'xl',\n\t\t\t'sds-paragraph--l': this.size === 'l',\n\t\t\t'sds-paragraph--m': this.size === 'm',\n\t\t};\n\n\t\tconst classes = classMap(styleClasses);\n\n\t\treturn html`<p class=${classes}><slot></slot></p>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-paragraph': SDSParagraph;\n\t}\n}\n"]}
+{"version":3,"file":"sds-paragraph.js","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAS3D,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,qBAAqB;CAAG,CAAA;AAA7C,YAAY;IADxB,oBAAoB,CAAC,eAAe,CAAC;GACzB,YAAY,CAAiC","sourcesContent":["import { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { SDSParagraphComponent } from './sds-paragraph.component';\n\ntype Size = 'xl' | 'l' | 'm';\n\nexport interface SDSParagraphProps {\n\tsize?: Size;\n}\n\n@guardedCustomElement('sds-paragraph')\nexport class SDSParagraph extends SDSParagraphComponent {}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-paragraph': SDSParagraph;\n\t}\n}\n"]}