@cupra/ui-kit 2.0.0-canary.131 → 2.0.0-canary.133

package/dist/esm/components/ds-input/ds-input.js

@@ -5,10 +5,12 @@ import { r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_mod
 import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as i } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
-import { r as o } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/choose.js";
-import { DsBaseInput as s } from "../base/ds-base-input/ds-base-input.js";
+import "../ds-icon/ds-icon.js";
+import { uiKitHtml as o } from "../../utils/uiKitHtml.js";
+import { r as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/choose.js";
+import { DsBaseInput as c } from "../base/ds-base-input/ds-base-input.js";
 //#region src/components/ds-input/ds-input.ts
-var c = class extends s {
+var l = class extends c {
 	constructor(...e) {
 		super(...e), this.name = "", this.placeholder = "", this.type = "text", this.min = 0, this.max = 100, this.step = 1, this._hasPicker = !1, this.handleClickIcon = () => {
 			this.inputField?.showPicker?.();
@@ -36,11 +38,7 @@ var c = class extends s {
                     cursor: ${this._hasPicker ? "pointer" : "auto"};
                 }
             </style>
-            ${this.componentFactory.createIcon({
-			class: "icon",
-			"icon-name": n,
-			"@click": this.handleClickIcon
-		})}
+            ${o`<ds-icon class="icon" icon-name=${n} @click=${this.handleClickIcon}></ds-icon>`}
         `;
 	}
 	get labelTemplate() {
@@ -56,7 +54,7 @@ var c = class extends s {
 	}
 	get inputTemplate() {
 		return t`
-            ${o(this.type === "number", [[!0, () => t`
+            ${s(this.type === "number", [[!0, () => t`
                         <input
                             aria-labelledby="label"
                             class="input-field number"
@@ -91,8 +89,8 @@ var c = class extends s {
 		return e;
 	}
 };
-i([n({ type: String })], c.prototype, "name", void 0), i([n({ type: String })], c.prototype, "placeholder", void 0), i([n({
+i([n({ type: String })], l.prototype, "name", void 0), i([n({ type: String })], l.prototype, "placeholder", void 0), i([n({
 	type: String,
 	attribute: "max-length"
-})], c.prototype, "maxLength", void 0), i([n({ type: String })], c.prototype, "type", void 0), i([n({ type: Number })], c.prototype, "min", void 0), i([n({ type: Number })], c.prototype, "max", void 0), i([n({ type: Number })], c.prototype, "step", void 0), i([r()], c.prototype, "_hasPicker", void 0), c = i([a("ds-input", { skipTagAsComponentName: !0 })], c);
+})], l.prototype, "maxLength", void 0), i([n({ type: String })], l.prototype, "type", void 0), i([n({ type: Number })], l.prototype, "min", void 0), i([n({ type: Number })], l.prototype, "max", void 0), i([n({ type: Number })], l.prototype, "step", void 0), i([r()], l.prototype, "_hasPicker", void 0), l = i([a("ds-input", { skipTagAsComponentName: !0 })], l);
 //#endregion

package/dist/esm/components/ds-interactive-card/ds-interactive-card.js

@@ -5,12 +5,15 @@ import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { UiKitElement as i } from "../base/UiKitElement.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import "../ds-icon/ds-icon.js";
 import { booleanConverter as o } from "../../utils/booleanConverter.js";
-import { e as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { uiKitHtml as s } from "../../utils/uiKitHtml.js";
+import { e as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
 import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
-import { commonStyles as c } from "./styles/common.styles.js";
+import "../ds-icon-button/ds-icon-button.js";
+import { commonStyles as l } from "./styles/common.styles.js";
 //#region src/components/ds-interactive-card/ds-interactive-card.ts
-var l = class extends i {
+var u = class extends i {
 	constructor(...e) {
 		super(...e), this.size = "medium", this.selected = !1, this.error = !1, this.showClose = !1, this.handleClick = (e) => {
 			e.stopPropagation();
@@ -24,7 +27,7 @@ var l = class extends i {
 		};
 	}
 	static {
-		this.styles = [c];
+		this.styles = [l];
 	}
 	get classes() {
 		return {
@@ -42,25 +45,21 @@ var l = class extends i {
 		};
 	}
 	get iconTemplate() {
-		return this.componentFactory.createIcon({
-			class: "icon",
-			"icon-name": "cross-circle",
-			size: 24
-		});
+		return s`<ds-icon class="icon" icon-name="cross-circle" size="24"></ds-icon>`;
 	}
 	get closeButtonTemplate() {
-		return this.showClose ? this.componentFactory.createIconButton({
-			class: "close-button",
-			"data-aria-label": "Close",
-			"@click": this.handleCloseButtonClick,
-			"icon-name": "cross",
-			variant: "naked",
-			size: "medium"
-		}) : e;
+		return this.showClose ? s`<ds-icon-button
+            class="close-button"
+            data-aria-label="Close"
+            @click=${this.handleCloseButtonClick}
+            icon-name="cross"
+            variant="naked"
+            size="medium"
+        ></ds-icon-button>` : e;
 	}
 	get contentTemplate() {
 		return this.error ? e : t`
-            <div part="container" class=${s(this.classes)} data-testid="ds-interactive-card-container" tabindex="0">
+            <div part="container" class=${c(this.classes)} data-testid="ds-interactive-card-container" tabindex="0">
                 ${this.closeButtonTemplate}
                 <header class="header" part="header">
                     <div class="header-main">
@@ -76,7 +75,7 @@ var l = class extends i {
 	}
 	get errorTemplate() {
 		return this.error ? t`
-            <div part="error" class=${s(this.errorClasses)}>
+            <div part="error" class=${c(this.errorClasses)}>
                 ${this.iconTemplate}
                 <div class="error-content" part="error-text">
                     <slot class="error-title" name="error-title"></slot>
@@ -92,15 +91,15 @@ var l = class extends i {
         `;
 	}
 };
-r([n({ type: String })], l.prototype, "size", void 0), r([n({
+r([n({ type: String })], u.prototype, "size", void 0), r([n({
 	type: Boolean,
 	converter: o
-})], l.prototype, "selected", void 0), r([n({
+})], u.prototype, "selected", void 0), r([n({
 	type: Boolean,
 	converter: o
-})], l.prototype, "error", void 0), r([n({
+})], u.prototype, "error", void 0), r([n({
 	type: Boolean,
 	converter: o,
 	attribute: "show-close"
-})], l.prototype, "showClose", void 0), l = r([a("ds-interactive-card")], l);
+})], u.prototype, "showClose", void 0), u = r([a("ds-interactive-card")], u);
 //#endregion

package/dist/esm/components/ds-link-button/ds-link-button.js

@@ -6,24 +6,25 @@ import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { UiKitElement as i } from "../base/UiKitElement.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import "../ds-icon/ds-icon.js";
 import { booleanConverter as o } from "../../utils/booleanConverter.js";
-import { e as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { uiKitHtml as s } from "../../utils/uiKitHtml.js";
+import { e as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
 import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
-import { r as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/choose.js";
-import { commonStyles as l } from "./styles/common.styles.js";
+import { o as l } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/if-defined.js";
+import { r as u } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/choose.js";
+import { commonStyles as d } from "./styles/common.styles.js";
 //#region src/components/ds-link-button/ds-link-button.ts
-var u = class extends i {
+var f = class extends i {
 	constructor(...e) {
 		super(...e), this.mode = "light", this.size = "large", this.underline = !1, this.disabled = !1, this.iconName = "arrow-right", this.iconPosition = "right";
 	}
 	static {
-		this.styles = [l];
+		this.styles = [d];
 	}
 	get iconTemplate() {
-		return this.iconName === "none" ? e : this.componentFactory.createIcon({
-			class: "icon",
-			"icon-name": this.iconName
-		});
+		return this.iconName === "none" ? e : s`<ds-icon class="icon" icon-name=${l(this.iconName)}></ds-icon>`;
 	}
 	get classes() {
 		return {
@@ -50,15 +51,15 @@ var u = class extends i {
 	render() {
 		return t`
             ${this.styleTokens}
-            ${c(this.htmlTagName || "button", [["button", () => t`
-                        <button class=${s(this.classes)} ?disabled=${this.disabled}>
+            ${u(this.htmlTagName || "button", [["button", () => t`
+                        <button class=${c(this.classes)} ?disabled=${this.disabled}>
                             ${this.iconPosition === "left" ? this.iconTemplate : e}
                             <span class="label"><slot></slot></span>
                             ${this.iconPosition === "right" ? this.iconTemplate : e}
                         </button>
                     `], ["a", () => t`
                         <a
-                            class=${s(this.classes)}
+                            class=${c(this.classes)}
                             href=${this.href}
                             rel=${this.rel}
                             target=${this.target}
@@ -76,29 +77,29 @@ var u = class extends i {
 r([n({
 	type: String,
 	reflect: !0
-})], u.prototype, "mode", void 0), r([n({ type: String })], u.prototype, "size", void 0), r([n({
+})], f.prototype, "mode", void 0), r([n({ type: String })], f.prototype, "size", void 0), r([n({
 	type: Boolean,
 	converter: o
-})], u.prototype, "underline", void 0), r([n({
+})], f.prototype, "underline", void 0), r([n({
 	type: Boolean,
 	converter: o
-})], u.prototype, "disabled", void 0), r([n({
+})], f.prototype, "disabled", void 0), r([n({
 	type: String,
 	attribute: "html-tag-name"
-})], u.prototype, "htmlTagName", void 0), r([n({
+})], f.prototype, "htmlTagName", void 0), r([n({
 	type: String,
 	reflect: !0
-})], u.prototype, "href", void 0), r([n({
+})], f.prototype, "href", void 0), r([n({
 	type: String,
 	reflect: !0
-})], u.prototype, "rel", void 0), r([n({
+})], f.prototype, "rel", void 0), r([n({
 	type: String,
 	reflect: !0
-})], u.prototype, "target", void 0), r([n({
+})], f.prototype, "target", void 0), r([n({
 	type: String,
 	attribute: "icon-name"
-})], u.prototype, "iconName", void 0), r([n({
+})], f.prototype, "iconName", void 0), r([n({
 	type: String,
 	attribute: "icon-position"
-})], u.prototype, "iconPosition", void 0), u = r([a("ds-link-button")], u);
+})], f.prototype, "iconPosition", void 0), f = r([a("ds-link-button")], f);
 //#endregion

package/dist/esm/components/ds-loader-logo/ds-loader-logo.js

@@ -5,15 +5,19 @@ import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { UiKitElement as i } from "../base/UiKitElement.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import "../ds-icon/ds-icon.js";
 import { booleanConverter as o } from "../../utils/booleanConverter.js";
-import { commonStyles as s } from "./ds-loader-logo.styles.js";
+import { uiKitHtml as s } from "../../utils/uiKitHtml.js";
+import { o as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/if-defined.js";
+import { commonStyles as l } from "./ds-loader-logo.styles.js";
 //#region src/components/ds-loader-logo/ds-loader-logo.ts
-var c = class extends i {
+var u = class extends i {
 	constructor(...e) {
 		super(...e), this.show = !1, this.zIndex = 2e3, this.iconName = "logo";
 	}
 	static {
-		this.styles = [s];
+		this.styles = [l];
 	}
 	get styleTokens() {
 		return t`
@@ -25,10 +29,7 @@ var c = class extends i {
         `;
 	}
 	get iconTemplate() {
-		return this.iconName ? this.componentFactory.createIcon({
-			class: "icon",
-			"icon-name": this.iconName
-		}) : e;
+		return this.iconName ? s`<ds-icon class="icon" icon-name=${c(this.iconName)}></ds-icon>` : e;
 	}
 	render() {
 		return this.show ? t`
@@ -47,11 +48,11 @@ var c = class extends i {
 r([n({
 	type: Boolean,
 	converter: o
-})], c.prototype, "show", void 0), r([n({
+})], u.prototype, "show", void 0), r([n({
 	type: Number,
 	attribute: "z-index"
-})], c.prototype, "zIndex", void 0), r([n({
+})], u.prototype, "zIndex", void 0), r([n({
 	type: String,
 	attribute: "icon-name"
-})], c.prototype, "iconName", void 0), r([n({ type: String })], c.prototype, "color", void 0), c = r([a("ds-loader-logo")], c);
+})], u.prototype, "iconName", void 0), r([n({ type: String })], u.prototype, "color", void 0), u = r([a("ds-loader-logo")], u);
 //#endregion

package/dist/esm/components/ds-loader-spinner/ds-loader-spinner.js

@@ -55,4 +55,3 @@ r([n({
 	reflect: !0
 })], u.prototype, "size", void 0), u = r([a("ds-loader-spinner")], u);
 //#endregion
-export { u as DsLoaderSpinner };

package/dist/esm/components/ds-logo/ds-logo.js

@@ -5,29 +5,25 @@ import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { UiKitElement as i } from "../base/UiKitElement.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
-import { e as o } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import "../ds-icon/ds-icon.js";
+import { uiKitHtml as o } from "../../utils/uiKitHtml.js";
+import { e as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
 import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
-import { commonStyles as s, containerStyles as c } from "./styles/common.styles.js";
-import { themeConfig as l } from "./theme-config.js";
+import { commonStyles as c, containerStyles as l } from "./styles/common.styles.js";
+import { themeConfig as u } from "./theme-config.js";
 //#region src/components/ds-logo/ds-logo.ts
-var u = class extends i {
+var d = class extends i {
 	constructor(...e) {
 		super(...e), this.size = "xxsmall", this.mode = "light";
 	}
 	static {
-		this.styles = [s, c];
+		this.styles = [c, l];
 	}
 	get logoTemplate() {
-		return this.componentFactory.createIcon({
-			class: "icon-logo",
-			"icon-name": "logo"
-		});
+		return o`<ds-icon class="icon-logo" icon-name="logo"></ds-icon>`;
 	}
 	get logoWordmarkTemplate() {
-		return !this.theme || !l[this.theme]?.["show-wordmark"] ? e : this.componentFactory.createIcon({
-			class: "icon-wordmark",
-			"icon-name": "logo-wordmark"
-		});
+		return !this.theme || !u[this.theme]?.["show-wordmark"] ? e : o`<ds-icon class="icon-wordmark" icon-name="logo-wordmark"></ds-icon>`;
 	}
 	get classes() {
 		return {
@@ -48,15 +44,15 @@ var u = class extends i {
 	render() {
 		return t`
             ${this.styleTokens}
-            <div data-testid="ds-logo-container" class=${o(this.classes)}>
+            <div data-testid="ds-logo-container" class=${s(this.classes)}>
                 ${this.logoTemplate}
                 ${this.logoWordmarkTemplate}
             </div>
         `;
 	}
 };
-r([n({ type: String })], u.prototype, "size", void 0), r([n({
+r([n({ type: String })], d.prototype, "size", void 0), r([n({
 	type: String,
 	reflect: !0
-})], u.prototype, "mode", void 0), u = r([a("ds-logo")], u);
+})], d.prototype, "mode", void 0), d = r([a("ds-logo")], d);
 //#endregion

package/dist/esm/components/ds-map-pin/ds-map-pin.js

@@ -5,24 +5,24 @@ import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { UiKitElement as i } from "../base/UiKitElement.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import "../ds-icon/ds-icon.js";
 import { booleanConverter as o } from "../../utils/booleanConverter.js";
-import { e as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { uiKitHtml as s } from "../../utils/uiKitHtml.js";
+import { e as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
 import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
-import { mapPinStyles as c } from "./styles/common.styles.js";
+import { o as l } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/if-defined.js";
+import { mapPinStyles as u } from "./styles/common.styles.js";
 //#region src/components/ds-map-pin/ds-map-pin.ts
-var l = class extends i {
+var d = class extends i {
 	constructor(...e) {
 		super(...e), this.width = 48, this.height = 48, this.checked = !1, this.iconSize = 24, this.iconTop = 8;
 	}
 	static {
-		this.styles = [c];
+		this.styles = [u];
 	}
 	get iconTemplate() {
-		return this.iconName ? this.componentFactory.createIcon({
-			class: "icon",
-			"icon-name": this.iconName,
-			size: this.iconSize
-		}) : e;
+		return this.iconName ? s`<ds-icon class="icon" icon-name=${l(this.iconName)} size=${l(this.iconSize)}></ds-icon>` : e;
 	}
 	get clusterNumberTemplate() {
 		return this.clusterCount ? t`
@@ -57,7 +57,7 @@ var l = class extends i {
 	render() {
 		return t`
             ${this.styleTokens}
-            <span data-testid="ds-map-pin-container" class=${s(this.classes)} @click=${this.handleClick}>
+            <span data-testid="ds-map-pin-container" class=${c(this.classes)} @click=${this.handleClick}>
                 <svg
                     class="marker"
                     xmlns="http://www.w3.org/2000/svg"
@@ -81,24 +81,24 @@ var l = class extends i {
 r([n({
 	type: Number,
 	attribute: "width"
-})], l.prototype, "width", void 0), r([n({
+})], d.prototype, "width", void 0), r([n({
 	type: Number,
 	attribute: "height"
-})], l.prototype, "height", void 0), r([n({
+})], d.prototype, "height", void 0), r([n({
 	type: Boolean,
 	converter: o,
 	reflect: !0
-})], l.prototype, "checked", void 0), r([n({
+})], d.prototype, "checked", void 0), r([n({
 	type: String,
 	attribute: "icon-name"
-})], l.prototype, "iconName", void 0), r([n({
+})], d.prototype, "iconName", void 0), r([n({
 	type: Number,
 	attribute: "icon-size"
-})], l.prototype, "iconSize", void 0), r([n({
+})], d.prototype, "iconSize", void 0), r([n({
 	type: Number,
 	attribute: "icon-top"
-})], l.prototype, "iconTop", void 0), r([n({
+})], d.prototype, "iconTop", void 0), r([n({
 	type: Number,
 	attribute: "cluster-count"
-})], l.prototype, "clusterCount", void 0), l = r([a("ds-map-pin")], l);
+})], d.prototype, "clusterCount", void 0), d = r([a("ds-map-pin")], d);
 //#endregion

package/dist/esm/components/ds-media-control/ds-media-control.js

@@ -6,11 +6,15 @@ import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
 import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { UiKitElement as i } from "../base/UiKitElement.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
-import { e as o } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import "../ds-icon/ds-icon.js";
+import { uiKitHtml as o } from "../../utils/uiKitHtml.js";
+import { e as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
 import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
-import { commonStyles as s } from "./styles/common.styles.js";
+import { o as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/if-defined.js";
+import { commonStyles as l } from "./styles/common.styles.js";
 //#region src/components/ds-media-control/ds-media-control.ts
-var c = class extends i {
+var u = class extends i {
 	constructor(...e) {
 		super(...e), this._state = void 0, this._stateValue = "pause", this.size = "medium", this.progress = 0, this.handleToggle = (e) => {
 			e.stopPropagation();
@@ -26,7 +30,7 @@ var c = class extends i {
 		};
 	}
 	static {
-		this.styles = [s];
+		this.styles = [l];
 	}
 	get state() {
 		return this._state ?? this._stateValue;
@@ -56,11 +60,7 @@ var c = class extends i {
 		return this.state === "play" ? "pause" : "play";
 	}
 	get iconTemplate() {
-		return this.componentFactory.createIcon({
-			class: "icon",
-			"icon-name": this.iconName,
-			size: this.iconSize
-		});
+		return o`<ds-icon class="icon" icon-name=${this.iconName} size=${c(this.iconSize)}></ds-icon>`;
 	}
 	get progressTemplate() {
 		let t = this.size === "large" ? 46 : this.size === "small" ? 30 : 38, n = t / 2 - 2 / 2, r = n - 1, i = 2 * Math.PI * n, a = this.normalizedProgress / 100, o = i.toFixed(3), s = (i * (1 - a)).toFixed(3);
@@ -84,7 +84,7 @@ var c = class extends i {
 		return e`
             <div
                 part="container"
-                class=${o(this.classes)}
+                class=${s(this.classes)}
                 role="button"
                 tabindex="0"
                 aria-label=${`${t} media ${this.size}`}
@@ -101,11 +101,11 @@ r([t({
 	type: String,
 	attribute: "state",
 	reflect: !0
-})], c.prototype, "_state", void 0), r([n()], c.prototype, "_stateValue", void 0), r([t({
+})], u.prototype, "_state", void 0), r([n()], u.prototype, "_stateValue", void 0), r([t({
 	type: String,
 	reflect: !0
-})], c.prototype, "size", void 0), r([t({
+})], u.prototype, "size", void 0), r([t({
 	type: Number,
 	reflect: !0
-})], c.prototype, "progress", void 0), c = r([a("ds-media-control")], c);
+})], u.prototype, "progress", void 0), u = r([a("ds-media-control")], u);
 //#endregion