@cupra/ui-kit 2.0.0-canary.88 → 2.0.0-canary.89

package/dist-react/esm/components/ds-main-title/ds-main-title.js

@@ -1,42 +1,35 @@
-import { UiKitElement as a } from "../base/UiKitElement.js";
-import { customUiKitElement as p } from "../../decorators/customUiKitElement.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { html as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { property as f } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { classMap as u } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { commonStyles as g } from "./styles/common.styles.js";
-var v = Object.defineProperty, h = Object.getOwnPropertyDescriptor, m = (n, e, i, s) => {
-  for (var t = s > 1 ? void 0 : s ? h(e, i) : e, l = n.length - 1, o; l >= 0; l--)
-    (o = n[l]) && (t = (s ? o(e, i, t) : o(t)) || t);
-  return s && t && v(e, i, t), t;
-};
-let r = class extends a {
-  constructor() {
-    super(...arguments), this.alignment = "left";
-  }
-  get classes() {
-    return {
-      container: !0,
-      [`alignment-${this.alignment}`]: !!this.alignment
-    };
-  }
-  render() {
-    return c`
-            <div class=${u(this.classes)} part="container">
+import { x as e } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n as t } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as n } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { UiKitElement as r } from "../base/UiKitElement.js";
+import { customUiKitElement as i } from "../../decorators/customUiKitElement.js";
+import { e as a } 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 o } from "./styles/common.styles.js";
+//#region src/components/ds-main-title/ds-main-title.ts
+var s = class extends r {
+	constructor(...e) {
+		super(...e), this.alignment = "left";
+	}
+	static {
+		this.styles = [o];
+	}
+	get classes() {
+		return {
+			container: !0,
+			[`alignment-${this.alignment}`]: !!this.alignment
+		};
+	}
+	render() {
+		return e`
+            <div class=${a(this.classes)} part="container">
                 <slot name="title" class="title"></slot>
                 <slot name="subtitle" class="subtitle"></slot>
             </div>
         `;
-  }
-};
-r.styles = [g];
-m([
-  f({ type: String })
-], r.prototype, "alignment", 2);
-r = m([
-  p("ds-main-title")
-], r);
-export {
-  r as DsMainTitle
+	}
 };
+n([t({ type: String })], s.prototype, "alignment", void 0), s = n([i("ds-main-title")], s);
+//#endregion

package/dist-react/esm/components/ds-main-title/styles/common.styles.js

@@ -1,8 +1,7 @@
-import "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import "../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { css as o } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const e = o`
+import { i as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+//#region src/components/ds-main-title/styles/common.styles.ts
+var t = e`
     :host {
         display: block;
         box-sizing: border-box;
@@ -22,6 +21,5 @@ const e = o`
         margin: 0;
     }
 `;
-export {
-  e as commonStyles
-};
+//#endregion
+export { t as commonStyles };

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

@@ -1,66 +1,63 @@
-import { UiKitElement as u } from "../base/UiKitElement.js";
-import { customUiKitElement as m } from "../../decorators/customUiKitElement.js";
-import { booleanConverter as d } from "../../utils/booleanConverter.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { nothing as a, html as h } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { property as r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { classMap as y } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { mapPinStyles as b } from "./styles/common.styles.js";
-var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, e = (l, s, n, o) => {
-  for (var i = o > 1 ? void 0 : o ? v(s, n) : s, c = l.length - 1, p; c >= 0; c--)
-    (p = l[c]) && (i = (o ? p(s, n, i) : p(i)) || i);
-  return o && i && f(s, n, i), i;
-};
-let t = class extends u {
-  constructor() {
-    super(...arguments), this.width = 48, this.height = 48, this.checked = !1, this.iconSize = 24, this.iconTop = 8;
-  }
-  get iconTemplate() {
-    return this.iconName ? this.componentFactory.createIcon({
-      class: "icon",
-      "icon-name": this.iconName,
-      size: this.iconSize
-    }) : a;
-  }
-  get clusterNumberTemplate() {
-    return this.clusterCount ? h`
+import { E as e, x as t } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+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 { 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 "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
+import { mapPinStyles as c } from "./styles/common.styles.js";
+//#region src/components/ds-map-pin/ds-map-pin.ts
+var l = 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];
+	}
+	get iconTemplate() {
+		return this.iconName ? this.componentFactory.createIcon({
+			class: "icon",
+			"icon-name": this.iconName,
+			size: this.iconSize
+		}) : e;
+	}
+	get clusterNumberTemplate() {
+		return this.clusterCount ? t`
             <div class='cluster-count'>
                     ${this.clusterCount}
             </div>
-        ` : a;
-  }
-  handleClick() {
-    this.checked = !this.checked, this.dispatchEvent(
-      new CustomEvent("change", {
-        bubbles: !0,
-        composed: !0,
-        detail: {
-          checked: this.checked
-        }
-      })
-    );
-  }
-  get styleTokens() {
-    return h`
+        ` : e;
+	}
+	handleClick() {
+		this.checked = !this.checked, this.dispatchEvent(new CustomEvent("change", {
+			bubbles: !0,
+			composed: !0,
+			detail: { checked: this.checked }
+		}));
+	}
+	get styleTokens() {
+		return t`
             <style>
                 .icon {
                     top: ${this.iconTop}px;
                 }
             </style>
         `;
-  }
-  get classes() {
-    return {
-      container: !0,
-      checked: this.checked,
-      cluster: !!this.clusterCount
-    };
-  }
-  render() {
-    return h`
+	}
+	get classes() {
+		return {
+			container: !0,
+			checked: this.checked,
+			cluster: !!this.clusterCount
+		};
+	}
+	render() {
+		return t`
             ${this.styleTokens}
-            <span data-testid="ds-map-pin-container" class=${y(this.classes)} @click=${this.handleClick}>
+            <span data-testid="ds-map-pin-container" class=${s(this.classes)} @click=${this.handleClick}>
                 <svg
                     class="marker"
                     xmlns="http://www.w3.org/2000/svg"
@@ -79,33 +76,29 @@ let t = class extends u {
                 ${this.clusterNumberTemplate}
             </span>
         `;
-  }
-};
-t.styles = [b];
-e([
-  r({ type: Number, attribute: "width" })
-], t.prototype, "width", 2);
-e([
-  r({ type: Number, attribute: "height" })
-], t.prototype, "height", 2);
-e([
-  r({ type: Boolean, converter: d, reflect: !0 })
-], t.prototype, "checked", 2);
-e([
-  r({ type: String, attribute: "icon-name" })
-], t.prototype, "iconName", 2);
-e([
-  r({ type: Number, attribute: "icon-size" })
-], t.prototype, "iconSize", 2);
-e([
-  r({ type: Number, attribute: "icon-top" })
-], t.prototype, "iconTop", 2);
-e([
-  r({ type: Number, attribute: "cluster-count" })
-], t.prototype, "clusterCount", 2);
-t = e([
-  m("ds-map-pin")
-], t);
-export {
-  t as DsMapPin
+	}
 };
+r([n({
+	type: Number,
+	attribute: "width"
+})], l.prototype, "width", void 0), r([n({
+	type: Number,
+	attribute: "height"
+})], l.prototype, "height", void 0), r([n({
+	type: Boolean,
+	converter: o,
+	reflect: !0
+})], l.prototype, "checked", void 0), r([n({
+	type: String,
+	attribute: "icon-name"
+})], l.prototype, "iconName", void 0), r([n({
+	type: Number,
+	attribute: "icon-size"
+})], l.prototype, "iconSize", void 0), r([n({
+	type: Number,
+	attribute: "icon-top"
+})], l.prototype, "iconTop", void 0), r([n({
+	type: Number,
+	attribute: "cluster-count"
+})], l.prototype, "clusterCount", void 0), l = r([a("ds-map-pin")], l);
+//#endregion

package/dist-react/esm/components/ds-map-pin/styles/common.styles.js

@@ -1,8 +1,7 @@
-import "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import "../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { css as i } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const r = i`
+import { i as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+//#region src/components/ds-map-pin/styles/common.styles.ts
+var t = e`
     :host {
         display: inline-block;
         --ui-kit-icon-color: var(--ui-kit-map-pin-icon-color);
@@ -31,6 +30,5 @@ const r = i`
         height: 24px;
     }
 `;
-export {
-  r as mapPinStyles
-};
+//#endregion
+export { t as mapPinStyles };

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

@@ -1,85 +1,86 @@
-import { UiKitElement as u } from "../base/UiKitElement.js";
-import { customUiKitElement as d } from "../../decorators/customUiKitElement.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { html as p } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { property as l } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { classMap as g } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { commonStyles as f } from "./styles/common.styles.js";
-var y = Object.defineProperty, v = Object.getOwnPropertyDescriptor, c = (e, s, r, o) => {
-  for (var t = o > 1 ? void 0 : o ? v(s, r) : s, a = e.length - 1, n; a >= 0; a--)
-    (n = e[a]) && (t = (o ? n(s, r, t) : n(t)) || t);
-  return o && t && y(s, r, t), t;
-};
-let i = class extends u {
-  constructor() {
-    super(...arguments), this.state = "pause", this.size = "medium", this.progress = 0, this.handleToggle = (e) => {
-      e.stopPropagation();
-      const s = this.state === "play" ? "pause" : "play";
-      this.state = s;
-      const r = s === "play" ? "ds-media-control:play" : "ds-media-control:pause";
-      this.dispatchEvent(new CustomEvent(r, { bubbles: !0, composed: !0 }));
-    }, this.onKeyDown = (e) => {
-      (e.key === "Enter" || e.key === " ") && (e.preventDefault(), this.handleToggle(e));
-    };
-  }
-  get normalizedProgress() {
-    const e = Number(this.progress ?? 0);
-    return Number.isNaN(e) ? 0 : Math.min(100, Math.max(0, e));
-  }
-  get classes() {
-    return {
-      container: !0,
-      [this.size]: !!this.size,
-      [this.state]: !!this.state
-    };
-  }
-  get iconSize() {
-    switch (this.size) {
-      case "large":
-        return 24;
-      case "small":
-        return 16;
-      default:
-        return 20;
-    }
-  }
-  get iconName() {
-    return this.state === "play" ? "pause" : "play";
-  }
-  get iconTemplate() {
-    return this.componentFactory.createIcon({
-      class: "icon",
-      "icon-name": this.iconName,
-      size: this.iconSize
-    });
-  }
-  get progressTemplate() {
-    const e = this.size === "large" ? 46 : this.size === "small" ? 30 : 38, r = e / 2 - 2 / 2, o = r - 1, t = 2 * Math.PI * r, a = this.normalizedProgress / 100, n = t.toFixed(3), m = (t * (1 - a)).toFixed(3), h = `${-e / 2} ${-e / 2} ${e} ${e}`;
-    return p`
-            <svg part="progress" class="progress" viewBox="${h}" aria-hidden="true" focusable="false">
+import { x as e } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n as t } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as n } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { UiKitElement as r } from "../base/UiKitElement.js";
+import { customUiKitElement as i } from "../../decorators/customUiKitElement.js";
+import { e as a } 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 o } from "./styles/common.styles.js";
+//#region src/components/ds-media-control/ds-media-control.ts
+var s = class extends r {
+	constructor(...e) {
+		super(...e), this.state = "pause", this.size = "medium", this.progress = 0, this.handleToggle = (e) => {
+			e.stopPropagation();
+			let t = this.state === "play" ? "pause" : "play";
+			this.state = t;
+			let n = t === "play" ? "ds-media-control:play" : "ds-media-control:pause";
+			this.dispatchEvent(new CustomEvent(n, {
+				bubbles: !0,
+				composed: !0
+			}));
+		}, this.onKeyDown = (e) => {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), this.handleToggle(e));
+		};
+	}
+	static {
+		this.styles = [o];
+	}
+	get normalizedProgress() {
+		let e = Number(this.progress ?? 0);
+		return Number.isNaN(e) ? 0 : Math.min(100, Math.max(0, e));
+	}
+	get classes() {
+		return {
+			container: !0,
+			[this.size]: !!this.size,
+			[this.state]: !!this.state
+		};
+	}
+	get iconSize() {
+		switch (this.size) {
+			case "large": return 24;
+			case "small": return 16;
+			default: return 20;
+		}
+	}
+	get iconName() {
+		return this.state === "play" ? "pause" : "play";
+	}
+	get iconTemplate() {
+		return this.componentFactory.createIcon({
+			class: "icon",
+			"icon-name": this.iconName,
+			size: this.iconSize
+		});
+	}
+	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);
+		return e`
+            <svg part="progress" class="progress" viewBox="${`${-t / 2} ${-t / 2} ${t} ${t}`}" aria-hidden="true" focusable="false">
                 <circle
                     class="indicator"
                     cx="0"
                     cy="0"
-                    r="${o}"
+                    r="${r}"
                     fill="none"
-                    stroke-dasharray="${n}"
-                    stroke-dashoffset="${m}"
+                    stroke-dasharray="${o}"
+                    stroke-dashoffset="${s}"
                     vector-effect="non-scaling-stroke"
                 ></circle>
             </svg>
         `;
-  }
-  render() {
-    const e = this.state === "play" ? "pause" : "play";
-    return p`
+	}
+	render() {
+		let t = this.state === "play" ? "pause" : "play";
+		return e`
             <div
                 part="container"
-                class=${g(this.classes)}
+                class=${a(this.classes)}
                 role="button"
                 tabindex="0"
-                aria-label=${`${e} media ${this.size}`}
+                aria-label=${`${t} media ${this.size}`}
                 @click=${this.handleToggle}
                 @keydown=${this.onKeyDown}
             >
@@ -87,21 +88,16 @@ let i = class extends u {
                 ${this.iconTemplate}
             </div>
         `;
-  }
-};
-i.styles = [f];
-c([
-  l({ type: String, reflect: !0 })
-], i.prototype, "state", 2);
-c([
-  l({ type: String, reflect: !0 })
-], i.prototype, "size", 2);
-c([
-  l({ type: Number, reflect: !0 })
-], i.prototype, "progress", 2);
-i = c([
-  d("ds-media-control")
-], i);
-export {
-  i as DsMediaControl
+	}
 };
+n([t({
+	type: String,
+	reflect: !0
+})], s.prototype, "state", void 0), n([t({
+	type: String,
+	reflect: !0
+})], s.prototype, "size", void 0), n([t({
+	type: Number,
+	reflect: !0
+})], s.prototype, "progress", void 0), s = n([i("ds-media-control")], s);
+//#endregion

package/dist-react/esm/components/ds-media-control/styles/common.styles.js

@@ -1,8 +1,7 @@
-import "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import "../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { css as t } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const s = t`
+import { i as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+//#region src/components/ds-media-control/styles/common.styles.ts
+var t = e`
     :host {
         display: contents;
     }
@@ -49,6 +48,5 @@ const s = t`
         box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.6);
     }
 `;
-export {
-  s as commonStyles
-};
+//#endregion
+export { t as commonStyles };