@cupra/ui-kit 1.1.0-canary.3 → 1.1.0-canary.4

package/dist/components/ds-basic-card/ds-basic-card.d.ts

@@ -0,0 +1,9 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+import { DsBasicCardAttrs } from './ds-basic-card.types.ts';
+export declare class DsBasicCard extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    variant: DsBasicCardAttrs['variant'];
+    private get classes();
+    protected handleClick(): void;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/ds-basic-card/ds-basic-card.js

@@ -0,0 +1,58 @@
+import { UiKitElement as p } 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 { nothing as m, html as n } 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 u } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { classMap as v } 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 h = Object.defineProperty, b = Object.getOwnPropertyDescriptor, l = (c, r, a, e) => {
+  for (var t = e > 1 ? void 0 : e ? b(r, a) : r, i = c.length - 1, o; i >= 0; i--)
+    (o = c[i]) && (t = (e ? o(r, a, t) : o(t)) || t);
+  return e && t && h(r, a, t), t;
+};
+let s = class extends p {
+  constructor() {
+    super(...arguments), this.variant = "default";
+  }
+  get classes() {
+    return {
+      "card-wrapper": !0,
+      subgrid: !0,
+      [this.variant]: !!this.variant
+    };
+  }
+  handleClick() {
+    this.dispatchEvent(
+      new Event("ds-basic-card:click", {
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  render() {
+    return n`
+            <article
+                part="card-wrapper"
+                class="${v(this.classes)}"
+                @click=${this.handleClick}
+                data-testid="ds-basic-card-container"
+            >
+                <div>${this.variant === "featured" ? n`<slot name="featured-text"></slot>` : m}</div>
+                <div class="container subgrid">
+                    <slot></slot>
+                </div>
+            </article>
+        `;
+  }
+};
+s.styles = [f];
+l([
+  u({ type: String })
+], s.prototype, "variant", 2);
+s = l([
+  d("ds-basic-card")
+], s);
+export {
+  s as DsBasicCard
+};

package/dist/components/ds-basic-card/ds-basic-card.types.d.ts

@@ -0,0 +1,4 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardAttrs = {
+    variant?: 'default' | 'featured';
+} & CommonAttrs;

package/dist/components/ds-basic-card/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist/components/ds-basic-card/styles/common.styles.js

@@ -0,0 +1,38 @@
+import { cssQueries as r } from "../../../utils/cssQueries.js";
+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 s } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+const e = s`
+    :host {
+        row-gap: 0;
+        display: grid;
+        grid-template-rows: subgrid;
+        grid-row: span 7;
+    }
+
+    .subgrid {
+        display: grid;
+        grid-template-rows: subgrid;
+        grid-row: span 7;
+    }
+
+    .container {
+        cursor: pointer;
+        overflow: hidden;
+    }
+
+    ::slotted([slot='featured-text']) {
+        pointer-events: none;
+        padding: var(--dg-spacing-s-5, 8px) var(--dg-spacing-m-2, 16px);
+    }
+
+    ${r.m} {
+        ::slotted([slot='featured-text']) {
+            padding: var(--dg-spacing-s-5, 8px) var(--dg-spacing-m-4, 24px);
+        }
+    }
+`;
+export {
+  e as commonStyles
+};

package/dist/components/ds-basic-card-header/ds-basic-card-header.d.ts

@@ -0,0 +1,7 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+export declare class DsBasicCardHeader extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    protected get dividerTemplate(): any;
+    private get classes();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/ds-basic-card-header/ds-basic-card-header.js

@@ -0,0 +1,51 @@
+import { UiKitElement as l } 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 m } 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 { classMap as n } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { commonStyles as c } from "./styles/common.styles.js";
+var h = Object.getOwnPropertyDescriptor, v = (a, s, d, i) => {
+  for (var e = i > 1 ? void 0 : i ? h(s, d) : s, t = a.length - 1, o; t >= 0; t--)
+    (o = a[t]) && (e = o(e) || e);
+  return e;
+};
+let r = class extends l {
+  get dividerTemplate() {
+    return this.componentFactory.createDivider({
+      class: "divider",
+      variant: "secondary"
+    });
+  }
+  get classes() {
+    return {
+      "header-wrapper": !0
+    };
+  }
+  render() {
+    return m`
+            <header
+                part="header-wrapper"
+                class="${n(this.classes)}"
+                data-testid="ds-basic-card-header-container"
+            >
+                <div class="header-content">
+                    <div class="title-wrapper" part="title-container">
+                        <slot name="title" part="title"></slot>
+                        <slot name="description" part="description"></slot>
+                    </div>
+                    <slot name="meta" part="meta"></slot>
+                </div>
+                <slot name="sub-header" part="sub-header"></slot>
+                ${this.dividerTemplate}
+            </header>
+        `;
+  }
+};
+r.styles = [c];
+r = v([
+  p("ds-basic-card-header")
+], r);
+export {
+  r as DsBasicCardHeader
+};

package/dist/components/ds-basic-card-header/ds-basic-card-header.types.d.ts

@@ -0,0 +1,2 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardHeaderAttrs = {} & CommonAttrs;

package/dist/components/ds-basic-card-header/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist/components/ds-basic-card-header/styles/common.styles.js

@@ -0,0 +1,57 @@
+import { cssQueries as p } from "../../../utils/cssQueries.js";
+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 d = i`
+    :host {
+        padding: var(--dg-spacing-m-2, 16px) var(--dg-spacing-m-2, 16px) 0px var(--dg-spacing-m-2, 16px);
+    }
+
+    .header-wrapper {
+        align-items: flex-start;
+        align-self: stretch;
+        display: flex;
+        flex-direction: column;
+        gap: var(--dg-spacing-m-1, 12px);
+        height: 100%;
+    }
+
+    .header-content {
+        display: flex;
+        gap: var(--dg-spacing-m-1, 8px);
+        width: 100%;
+        justify-content: space-between;
+    }
+
+    .title-wrapper {
+        display: flex;
+        flex-direction: column;
+        gap: var(--dg-spacing-s-5, 8px);
+        width: 100%;
+    }
+
+    ::slotted([slot='title']) {
+        width: 100%;
+    }
+
+    ::slotted([slot='sub-header']) {
+        display: flex;
+        gap: var(--dg-spacing-m-1, 12px);
+        flex-direction: column;
+    }
+
+    .divider {
+        margin-top: auto;
+        width: 100%;
+    }
+
+    ${p.m} {
+        :host {
+            padding: var(--dg-spacing-m-2, 16px) var(--dg-spacing-m-4, 24px) 0px var(--dg-spacing-m-4, 24px);
+        }
+    }
+`;
+export {
+  d as commonStyles
+};

package/dist/components/ds-basic-card-image/ds-basic-card-image.d.ts

@@ -0,0 +1,6 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+export declare class DsBasicCardImage extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    private get classes();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/ds-basic-card-image/ds-basic-card-image.js

@@ -0,0 +1,37 @@
+import { UiKitElement as p } from "../base/UiKitElement.js";
+import { customUiKitElement as l } 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 { classMap as n } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { commonStyles as d } from "./styles/common.styles.js";
+var g = Object.getOwnPropertyDescriptor, f = (s, a, o, i) => {
+  for (var r = i > 1 ? void 0 : i ? g(a, o) : a, e = s.length - 1, m; e >= 0; e--)
+    (m = s[e]) && (r = m(r) || r);
+  return r;
+};
+let t = class extends p {
+  get classes() {
+    return {
+      "image-wrapper": !0
+    };
+  }
+  render() {
+    return c`
+            <div
+                part="image-wrapper"
+                class="${n(this.classes)}"
+                data-testid="ds-basic-card-image-container"
+            >
+               <slot></slot>
+            </div>
+        `;
+  }
+};
+t.styles = [d];
+t = f([
+  l("ds-basic-card-image")
+], t);
+export {
+  t as DsBasicCardImage
+};

package/dist/components/ds-basic-card-image/ds-basic-card-image.types.d.ts

@@ -0,0 +1,2 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardImageAttrs = {} & CommonAttrs;

package/dist/components/ds-basic-card-image/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist/components/ds-basic-card-image/styles/common.styles.js

@@ -0,0 +1,13 @@
+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 s = o`
+    :host {
+        height: 100%;
+        width: 100%;
+    }
+`;
+export {
+  s as commonStyles
+};

package/dist/components/ds-basic-card-section/ds-basic-card-section.d.ts

@@ -0,0 +1,10 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+import { DsBasicCardSectionAttrs } from './ds-basic-card-section.types.ts';
+export declare class DsBasicCardSection extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    withDivider: DsBasicCardSectionAttrs['divider'];
+    centered: DsBasicCardSectionAttrs['centered'];
+    protected get dividerTemplate(): any;
+    private get classes();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/ds-basic-card-section/ds-basic-card-section.js

@@ -0,0 +1,52 @@
+import { UiKitElement as d } from "../base/UiKitElement.js";
+import { customUiKitElement as l } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as p } 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 v, 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 m } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { classMap as f } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { commonStyles as u } from "./styles/common.styles.js";
+var y = Object.defineProperty, D = Object.getOwnPropertyDescriptor, a = (c, r, o, i) => {
+  for (var e = i > 1 ? void 0 : i ? D(r, o) : r, s = c.length - 1, n; s >= 0; s--)
+    (n = c[s]) && (e = (i ? n(r, o, e) : n(e)) || e);
+  return i && e && y(r, o, e), e;
+};
+let t = class extends d {
+  constructor() {
+    super(...arguments), this.withDivider = !0, this.centered = !0;
+  }
+  get dividerTemplate() {
+    return this.componentFactory.createDivider({
+      class: "divider",
+      variant: "secondary"
+    });
+  }
+  get classes() {
+    return {
+      container: !0,
+      centered: this.centered
+    };
+  }
+  render() {
+    return h`
+            <div part="container" class=${f(this.classes)} data-testid="ds-basic-card-section-container">
+                <slot></slot>
+            </div>
+            ${this.withDivider ? this.dividerTemplate : v}
+        `;
+  }
+};
+t.styles = [u];
+a([
+  m({ type: Boolean, converter: p })
+], t.prototype, "withDivider", 2);
+a([
+  m({ type: Boolean, converter: p })
+], t.prototype, "centered", 2);
+t = a([
+  l("ds-basic-card-section")
+], t);
+export {
+  t as DsBasicCardSection
+};

package/dist/components/ds-basic-card-section/ds-basic-card-section.types.d.ts

@@ -0,0 +1,5 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardSectionAttrs = {
+    centered?: boolean;
+    withDivider?: boolean;
+} & CommonAttrs;

package/dist/components/ds-basic-card-section/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist/components/ds-basic-card-section/styles/common.styles.js

@@ -0,0 +1,33 @@
+import { cssQueries as i } from "../../../utils/cssQueries.js";
+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 p } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+const g = p`
+    :host {
+        display: flex;
+        flex-direction: column;
+        padding: var(--dg-spacing-s-1, 0px) var(--dg-spacing-m-2, 16px);
+    }
+
+    .container {
+        display: flex;
+        flex-direction: column;
+        gap: var(--dg-spacing-m-1, 12px);
+        height: 100%;
+        padding: var(--dg-spacing-m-4, 24px) var(--dg-spacing-s-1, 0px);
+    }
+
+    .centered {
+        justify-content: center;
+    }
+
+    ${i.m} {
+        :host {
+            padding: var(--dg-spacing-s-1, 0px) var(--dg-spacing-m-4, 24px);
+        }
+    }
+`;
+export {
+  g as commonStyles
+};

package/dist/components/ds-theme-provider/ds-theme-provider.js

@@ -54,7 +54,7 @@ let m = class extends v {
   }
   loadThemeStyles() {
     return this.loadStyles ? new Promise((t, o) => {
-      const s = "/1.1.0-canary.3", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
+      const s = "/1.1.0-canary.4", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
       if (document.head.querySelector(`link[href="${r}"]`)) t();
       else {
         const e = `ui-kit-theme-${s}`, a = document.getElementById(e), n = document.createElement("link");

package/dist/components/index.d.ts

@@ -1,6 +1,10 @@
 import './ds-accordion/ds-accordion.ts';
 import './ds-avatar/ds-avatar.ts';
 import './ds-badge/ds-badge.ts';
+import './ds-basic-card/ds-basic-card.ts';
+import './ds-basic-card-image/ds-basic-card-image.ts';
+import './ds-basic-card-header/ds-basic-card-header.ts';
+import './ds-basic-card-section/ds-basic-card-section.ts';
 import './ds-bullets/ds-bullets.ts';
 import './ds-button/ds-button.ts';
 import './ds-carousel-indicator/ds-carousel-indicator.ts';

package/dist/index.js

@@ -1,6 +1,10 @@
 import "./components/ds-accordion/ds-accordion.js";
 import "./components/ds-avatar/ds-avatar.js";
 import "./components/ds-badge/ds-badge.js";
+import "./components/ds-basic-card/ds-basic-card.js";
+import "./components/ds-basic-card-image/ds-basic-card-image.js";
+import "./components/ds-basic-card-header/ds-basic-card-header.js";
+import "./components/ds-basic-card-section/ds-basic-card-section.js";
 import "./components/ds-bullets/ds-bullets.js";
 import "./components/ds-button/ds-button.js";
 import "./components/ds-carousel-indicator/ds-carousel-indicator.js";
@@ -59,7 +63,7 @@ import "./components/ds-toast-message/ds-toast-message.js";
 import "./components/ds-toggle-button/ds-toggle-button.js";
 import "./components/ds-toggle-switch/ds-toggle-switch.js";
 import "./components/ds-tooltip/ds-tooltip.js";
-import { iconNames as fo } from "./components/ds-icon/iconNames.js";
+import { iconNames as No } from "./components/ds-icon/iconNames.js";
 export {
-  fo as iconNames
+  No as iconNames
 };

package/dist/utils/IconsManager.js

@@ -25,7 +25,7 @@ class f {
     }) : Promise.resolve('<svg class="ds-icon"></svg>'), l.subscribe("theme", this.handleChangeTheme);
   }
 }
-const c = Symbol.for("@cupra/ui-kit/icons-manager/1.1.0-canary.3"), h = globalThis;
+const c = Symbol.for("@cupra/ui-kit/icons-manager/1.1.0-canary.4"), h = globalThis;
 let n = h[c];
 n || (n = new f(), Object.defineProperty(h, c, {
   value: n,

package/dist/utils/PubSub.js

@@ -18,7 +18,7 @@ class e {
     });
   }
 }
-const u = Symbol.for("@cupra/ui-kit/pubsub/1.1.0-canary.3"), t = globalThis;
+const u = Symbol.for("@cupra/ui-kit/pubsub/1.1.0-canary.4"), t = globalThis;
 let b = t[u];
 b || (b = new e(), Object.defineProperty(t, u, {
   value: b,

package/dist/utils/StylesRegistry/StylesRegistry.js

@@ -5,7 +5,7 @@ class s {
       theme: t
     }) => {
       if (!t || !e) return;
-      const c = `https://ds-assets.cupra.com/1.1.0-canary.3/styles/${t}/components/${e}.css`, r = this.getCachedStyleSheetPromise({ url: c });
+      const c = `https://ds-assets.cupra.com/1.1.0-canary.4/styles/${t}/components/${e}.css`, r = this.getCachedStyleSheetPromise({ url: c });
       if (r) return r;
       const i = this.fetchStyle({ url: c }).then((n) => (n || this.stylePromises.delete(c), n));
       return this.stylePromises.set(c, i), this.stylePromises.get(c);

package/dist/utils/componentFactory.d.ts

@@ -1,4 +1,5 @@
 import type { DsButtonAttrs } from '../components/ds-button/ds-button.types.ts';
+import { DsDividerAttrs } from '../components/ds-divider/ds-divider.types';
 import type { DsIconButtonAttrs } from '../components/ds-icon-button/ds-icon-button.types.ts';
 import type { DsIconAttrs } from '../components/ds-icon/ds-icon.types.ts';
 import type { DsLoaderSpinnerAttrs } from '../components/ds-loader-spinner/ds-loader-spinner.types.ts';
@@ -7,6 +8,7 @@ type GetAttributes<T> = (props?: T) => any;
 export type ComponentFactory = {
     createIcon: GetAttributes<DsIconAttrs>;
     createButton: GetAttributes<DsButtonAttrs>;
+    createDivider: GetAttributes<DsDividerAttrs>;
     createIconButton: GetAttributes<DsIconButtonAttrs>;
     createLoaderSpinner: GetAttributes<DsLoaderSpinnerAttrs>;
     createToastMessage: GetAttributes<DsToastMessageAttrs>;

package/dist/utils/componentFactory.js

@@ -43,6 +43,15 @@ const m = {
                 ${t.children}
             </ds-button>
         `),
+  createDivider: (t = {}) => (i("ds-divider", () => import("../components/ds-divider/ds-divider.js")), a`
+            <ds-divider
+                class=${t == null ? void 0 : t.class}
+                variant=${(t == null ? void 0 : t.variant) ?? "primary"}
+                orientation=${(t == null ? void 0 : t.orientation) ?? "horizontal"}
+                data-testid=${t == null ? void 0 : t["data-testid"]}
+            >
+            </ds-divider>
+        `),
   createIconButton: (t = {}) => (i("ds-icon-button", () => import("../components/ds-icon-button/ds-icon-button.js")), a`
             <ds-icon-button
                 class=${t == null ? void 0 : t.class}
@@ -119,6 +128,15 @@ const m = {
                 ${t.children}
             </ds-button-react>
         `),
+  createDivider: (t = {}) => (i("ds-divider-react", () => import("../components/ds-divider/ds-divider.js")), a`
+            <ds-divider-react
+                class=${t == null ? void 0 : t.class}
+                variant=${(t == null ? void 0 : t.variant) ?? "primary"}
+                orientation=${(t == null ? void 0 : t.orientation) ?? "horizontal"}
+                data-testid=${t == null ? void 0 : t["data-testid"]}
+            >
+            </ds-divider-react>
+        `),
   createIconButton: (t = {}) => (i("ds-icon-button-react", () => import("../components/ds-icon-button/ds-icon-button.js")), a`
             <ds-icon-button-react
                 class=${t == null ? void 0 : t.class}
@@ -155,9 +173,9 @@ const m = {
             ></ds-toast-message-react>
         `)
 };
-function i(t, n) {
+function i(t, d) {
   try {
-    typeof window < "u" && typeof customElements < "u" && !customElements.get(t) && n();
+    typeof window < "u" && typeof customElements < "u" && !customElements.get(t) && d();
   } catch {
   }
 }

package/dist/utils/cssWithTokens.js

@@ -3,7 +3,7 @@ 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 { unsafeCSS as n, css as o } from "../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
 function x(t, ...r) {
-  const e = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-3"), i = n(e);
+  const e = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-4"), i = n(e);
   return o`${i}`;
 }
 export {

package/dist/utils/htmlWithTokens.js

@@ -3,7 +3,7 @@ import { html as n } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit
 import "../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
 import { unsafeHTML as i } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/unsafe-html.js";
 function x(t, ...r) {
-  const o = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-3"), e = i(o);
+  const o = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-4"), e = i(o);
   return n`${e}`;
 }
 export {

package/dist-react/components/ds-basic-card/ds-basic-card.d.ts

@@ -0,0 +1,9 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+import { DsBasicCardAttrs } from './ds-basic-card.types.ts';
+export declare class DsBasicCard extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    variant: DsBasicCardAttrs['variant'];
+    private get classes();
+    protected handleClick(): void;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist-react/components/ds-basic-card/ds-basic-card.js

@@ -0,0 +1,58 @@
+import { UiKitElement as p } 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 { nothing as m, html as n } 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 u } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { classMap as v } 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 h = Object.defineProperty, b = Object.getOwnPropertyDescriptor, l = (c, r, a, e) => {
+  for (var t = e > 1 ? void 0 : e ? b(r, a) : r, i = c.length - 1, o; i >= 0; i--)
+    (o = c[i]) && (t = (e ? o(r, a, t) : o(t)) || t);
+  return e && t && h(r, a, t), t;
+};
+let s = class extends p {
+  constructor() {
+    super(...arguments), this.variant = "default";
+  }
+  get classes() {
+    return {
+      "card-wrapper": !0,
+      subgrid: !0,
+      [this.variant]: !!this.variant
+    };
+  }
+  handleClick() {
+    this.dispatchEvent(
+      new Event("ds-basic-card:click", {
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  render() {
+    return n`
+            <article
+                part="card-wrapper"
+                class="${v(this.classes)}"
+                @click=${this.handleClick}
+                data-testid="ds-basic-card-container"
+            >
+                <div>${this.variant === "featured" ? n`<slot name="featured-text"></slot>` : m}</div>
+                <div class="container subgrid">
+                    <slot></slot>
+                </div>
+            </article>
+        `;
+  }
+};
+s.styles = [f];
+l([
+  u({ type: String })
+], s.prototype, "variant", 2);
+s = l([
+  d("ds-basic-card")
+], s);
+export {
+  s as DsBasicCard
+};

package/dist-react/components/ds-basic-card/ds-basic-card.types.d.ts

@@ -0,0 +1,4 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardAttrs = {
+    variant?: 'default' | 'featured';
+} & CommonAttrs;

package/dist-react/components/ds-basic-card/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist-react/components/ds-basic-card/styles/common.styles.js

@@ -0,0 +1,38 @@
+import { cssQueries as r } from "../../../utils/cssQueries.js";
+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 s } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+const e = s`
+    :host {
+        row-gap: 0;
+        display: grid;
+        grid-template-rows: subgrid;
+        grid-row: span 7;
+    }
+
+    .subgrid {
+        display: grid;
+        grid-template-rows: subgrid;
+        grid-row: span 7;
+    }
+
+    .container {
+        cursor: pointer;
+        overflow: hidden;
+    }
+
+    ::slotted([slot='featured-text']) {
+        pointer-events: none;
+        padding: var(--dg-spacing-s-5, 8px) var(--dg-spacing-m-2, 16px);
+    }
+
+    ${r.m} {
+        ::slotted([slot='featured-text']) {
+            padding: var(--dg-spacing-s-5, 8px) var(--dg-spacing-m-4, 24px);
+        }
+    }
+`;
+export {
+  e as commonStyles
+};

package/dist-react/components/ds-basic-card-header/ds-basic-card-header.d.ts

@@ -0,0 +1,7 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+export declare class DsBasicCardHeader extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    protected get dividerTemplate(): any;
+    private get classes();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist-react/components/ds-basic-card-header/ds-basic-card-header.js

@@ -0,0 +1,51 @@
+import { UiKitElement as l } 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 m } 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 { classMap as n } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { commonStyles as c } from "./styles/common.styles.js";
+var h = Object.getOwnPropertyDescriptor, v = (a, s, d, i) => {
+  for (var e = i > 1 ? void 0 : i ? h(s, d) : s, t = a.length - 1, o; t >= 0; t--)
+    (o = a[t]) && (e = o(e) || e);
+  return e;
+};
+let r = class extends l {
+  get dividerTemplate() {
+    return this.componentFactory.createDivider({
+      class: "divider",
+      variant: "secondary"
+    });
+  }
+  get classes() {
+    return {
+      "header-wrapper": !0
+    };
+  }
+  render() {
+    return m`
+            <header
+                part="header-wrapper"
+                class="${n(this.classes)}"
+                data-testid="ds-basic-card-header-container"
+            >
+                <div class="header-content">
+                    <div class="title-wrapper" part="title-container">
+                        <slot name="title" part="title"></slot>
+                        <slot name="description" part="description"></slot>
+                    </div>
+                    <slot name="meta" part="meta"></slot>
+                </div>
+                <slot name="sub-header" part="sub-header"></slot>
+                ${this.dividerTemplate}
+            </header>
+        `;
+  }
+};
+r.styles = [c];
+r = v([
+  p("ds-basic-card-header")
+], r);
+export {
+  r as DsBasicCardHeader
+};

package/dist-react/components/ds-basic-card-header/ds-basic-card-header.types.d.ts

@@ -0,0 +1,2 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardHeaderAttrs = {} & CommonAttrs;

package/dist-react/components/ds-basic-card-header/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist-react/components/ds-basic-card-header/styles/common.styles.js

@@ -0,0 +1,57 @@
+import { cssQueries as p } from "../../../utils/cssQueries.js";
+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 d = i`
+    :host {
+        padding: var(--dg-spacing-m-2, 16px) var(--dg-spacing-m-2, 16px) 0px var(--dg-spacing-m-2, 16px);
+    }
+
+    .header-wrapper {
+        align-items: flex-start;
+        align-self: stretch;
+        display: flex;
+        flex-direction: column;
+        gap: var(--dg-spacing-m-1, 12px);
+        height: 100%;
+    }
+
+    .header-content {
+        display: flex;
+        gap: var(--dg-spacing-m-1, 8px);
+        width: 100%;
+        justify-content: space-between;
+    }
+
+    .title-wrapper {
+        display: flex;
+        flex-direction: column;
+        gap: var(--dg-spacing-s-5, 8px);
+        width: 100%;
+    }
+
+    ::slotted([slot='title']) {
+        width: 100%;
+    }
+
+    ::slotted([slot='sub-header']) {
+        display: flex;
+        gap: var(--dg-spacing-m-1, 12px);
+        flex-direction: column;
+    }
+
+    .divider {
+        margin-top: auto;
+        width: 100%;
+    }
+
+    ${p.m} {
+        :host {
+            padding: var(--dg-spacing-m-2, 16px) var(--dg-spacing-m-4, 24px) 0px var(--dg-spacing-m-4, 24px);
+        }
+    }
+`;
+export {
+  d as commonStyles
+};

package/dist-react/components/ds-basic-card-image/ds-basic-card-image.d.ts

@@ -0,0 +1,6 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+export declare class DsBasicCardImage extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    private get classes();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist-react/components/ds-basic-card-image/ds-basic-card-image.js

@@ -0,0 +1,37 @@
+import { UiKitElement as p } from "../base/UiKitElement.js";
+import { customUiKitElement as l } 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 { classMap as n } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { commonStyles as d } from "./styles/common.styles.js";
+var g = Object.getOwnPropertyDescriptor, f = (s, a, o, i) => {
+  for (var r = i > 1 ? void 0 : i ? g(a, o) : a, e = s.length - 1, m; e >= 0; e--)
+    (m = s[e]) && (r = m(r) || r);
+  return r;
+};
+let t = class extends p {
+  get classes() {
+    return {
+      "image-wrapper": !0
+    };
+  }
+  render() {
+    return c`
+            <div
+                part="image-wrapper"
+                class="${n(this.classes)}"
+                data-testid="ds-basic-card-image-container"
+            >
+               <slot></slot>
+            </div>
+        `;
+  }
+};
+t.styles = [d];
+t = f([
+  l("ds-basic-card-image")
+], t);
+export {
+  t as DsBasicCardImage
+};

package/dist-react/components/ds-basic-card-image/ds-basic-card-image.types.d.ts

@@ -0,0 +1,2 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardImageAttrs = {} & CommonAttrs;

package/dist-react/components/ds-basic-card-image/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist-react/components/ds-basic-card-image/styles/common.styles.js

@@ -0,0 +1,13 @@
+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 s = o`
+    :host {
+        height: 100%;
+        width: 100%;
+    }
+`;
+export {
+  s as commonStyles
+};

package/dist-react/components/ds-basic-card-section/ds-basic-card-section.d.ts

@@ -0,0 +1,10 @@
+import { UiKitElement } from '../base/UiKitElement.ts';
+import { DsBasicCardSectionAttrs } from './ds-basic-card-section.types.ts';
+export declare class DsBasicCardSection extends UiKitElement {
+    static styles: import("lit").CSSResult[];
+    withDivider: DsBasicCardSectionAttrs['divider'];
+    centered: DsBasicCardSectionAttrs['centered'];
+    protected get dividerTemplate(): any;
+    private get classes();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist-react/components/ds-basic-card-section/ds-basic-card-section.js

@@ -0,0 +1,52 @@
+import { UiKitElement as d } from "../base/UiKitElement.js";
+import { customUiKitElement as l } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as p } 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 v, 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 m } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { classMap as f } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import { commonStyles as u } from "./styles/common.styles.js";
+var y = Object.defineProperty, D = Object.getOwnPropertyDescriptor, a = (c, r, o, i) => {
+  for (var e = i > 1 ? void 0 : i ? D(r, o) : r, s = c.length - 1, n; s >= 0; s--)
+    (n = c[s]) && (e = (i ? n(r, o, e) : n(e)) || e);
+  return i && e && y(r, o, e), e;
+};
+let t = class extends d {
+  constructor() {
+    super(...arguments), this.withDivider = !0, this.centered = !0;
+  }
+  get dividerTemplate() {
+    return this.componentFactory.createDivider({
+      class: "divider",
+      variant: "secondary"
+    });
+  }
+  get classes() {
+    return {
+      container: !0,
+      centered: this.centered
+    };
+  }
+  render() {
+    return h`
+            <div part="container" class=${f(this.classes)} data-testid="ds-basic-card-section-container">
+                <slot></slot>
+            </div>
+            ${this.withDivider ? this.dividerTemplate : v}
+        `;
+  }
+};
+t.styles = [u];
+a([
+  m({ type: Boolean, converter: p })
+], t.prototype, "withDivider", 2);
+a([
+  m({ type: Boolean, converter: p })
+], t.prototype, "centered", 2);
+t = a([
+  l("ds-basic-card-section")
+], t);
+export {
+  t as DsBasicCardSection
+};

package/dist-react/components/ds-basic-card-section/ds-basic-card-section.types.d.ts

@@ -0,0 +1,5 @@
+import { CommonAttrs } from '../../types/types';
+export type DsBasicCardSectionAttrs = {
+    centered?: boolean;
+    withDivider?: boolean;
+} & CommonAttrs;

package/dist-react/components/ds-basic-card-section/styles/common.styles.d.ts

@@ -0,0 +1 @@
+export declare const commonStyles: import("lit").CSSResult;

package/dist-react/components/ds-basic-card-section/styles/common.styles.js

@@ -0,0 +1,33 @@
+import { cssQueries as i } from "../../../utils/cssQueries.js";
+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 p } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+const g = p`
+    :host {
+        display: flex;
+        flex-direction: column;
+        padding: var(--dg-spacing-s-1, 0px) var(--dg-spacing-m-2, 16px);
+    }
+
+    .container {
+        display: flex;
+        flex-direction: column;
+        gap: var(--dg-spacing-m-1, 12px);
+        height: 100%;
+        padding: var(--dg-spacing-m-4, 24px) var(--dg-spacing-s-1, 0px);
+    }
+
+    .centered {
+        justify-content: center;
+    }
+
+    ${i.m} {
+        :host {
+            padding: var(--dg-spacing-s-1, 0px) var(--dg-spacing-m-4, 24px);
+        }
+    }
+`;
+export {
+  g as commonStyles
+};

package/dist-react/components/ds-theme-provider/ds-theme-provider.js

@@ -54,7 +54,7 @@ let m = class extends v {
   }
   loadThemeStyles() {
     return this.loadStyles ? new Promise((t, o) => {
-      const s = "/1.1.0-canary.3", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
+      const s = "/1.1.0-canary.4", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
       if (document.head.querySelector(`link[href="${r}"]`)) t();
       else {
         const e = `ui-kit-theme-${s}`, a = document.getElementById(e), n = document.createElement("link");

package/dist-react/components/index.d.ts

@@ -1,6 +1,10 @@
 import './ds-accordion/ds-accordion.ts';
 import './ds-avatar/ds-avatar.ts';
 import './ds-badge/ds-badge.ts';
+import './ds-basic-card/ds-basic-card.ts';
+import './ds-basic-card-image/ds-basic-card-image.ts';
+import './ds-basic-card-header/ds-basic-card-header.ts';
+import './ds-basic-card-section/ds-basic-card-section.ts';
 import './ds-bullets/ds-bullets.ts';
 import './ds-button/ds-button.ts';
 import './ds-carousel-indicator/ds-carousel-indicator.ts';

package/dist-react/index.js

@@ -1,6 +1,10 @@
 import "./components/ds-accordion/ds-accordion.js";
 import "./components/ds-avatar/ds-avatar.js";
 import "./components/ds-badge/ds-badge.js";
+import "./components/ds-basic-card/ds-basic-card.js";
+import "./components/ds-basic-card-image/ds-basic-card-image.js";
+import "./components/ds-basic-card-header/ds-basic-card-header.js";
+import "./components/ds-basic-card-section/ds-basic-card-section.js";
 import "./components/ds-bullets/ds-bullets.js";
 import "./components/ds-button/ds-button.js";
 import "./components/ds-carousel-indicator/ds-carousel-indicator.js";
@@ -59,7 +63,7 @@ import "./components/ds-toast-message/ds-toast-message.js";
 import "./components/ds-toggle-button/ds-toggle-button.js";
 import "./components/ds-toggle-switch/ds-toggle-switch.js";
 import "./components/ds-tooltip/ds-tooltip.js";
-import { iconNames as fo } from "./components/ds-icon/iconNames.js";
+import { iconNames as No } from "./components/ds-icon/iconNames.js";
 export {
-  fo as iconNames
+  No as iconNames
 };

package/dist-react/utils/IconsManager.js

@@ -25,7 +25,7 @@ class f {
     }) : Promise.resolve('<svg class="ds-icon"></svg>'), l.subscribe("theme", this.handleChangeTheme);
   }
 }
-const c = Symbol.for("@cupra/ui-kit/icons-manager/1.1.0-canary.3"), h = globalThis;
+const c = Symbol.for("@cupra/ui-kit/icons-manager/1.1.0-canary.4"), h = globalThis;
 let n = h[c];
 n || (n = new f(), Object.defineProperty(h, c, {
   value: n,

package/dist-react/utils/PubSub.js

@@ -18,7 +18,7 @@ class e {
     });
   }
 }
-const u = Symbol.for("@cupra/ui-kit/pubsub/1.1.0-canary.3"), t = globalThis;
+const u = Symbol.for("@cupra/ui-kit/pubsub/1.1.0-canary.4"), t = globalThis;
 let b = t[u];
 b || (b = new e(), Object.defineProperty(t, u, {
   value: b,

package/dist-react/utils/StylesRegistry/StylesRegistry.js

@@ -5,7 +5,7 @@ class s {
       theme: t
     }) => {
       if (!t || !e) return;
-      const c = `https://ds-assets.cupra.com/1.1.0-canary.3/styles/${t}/components/${e}.css`, r = this.getCachedStyleSheetPromise({ url: c });
+      const c = `https://ds-assets.cupra.com/1.1.0-canary.4/styles/${t}/components/${e}.css`, r = this.getCachedStyleSheetPromise({ url: c });
       if (r) return r;
       const i = this.fetchStyle({ url: c }).then((n) => (n || this.stylePromises.delete(c), n));
       return this.stylePromises.set(c, i), this.stylePromises.get(c);

package/dist-react/utils/componentFactory.d.ts

@@ -1,4 +1,5 @@
 import type { DsButtonAttrs } from '../components/ds-button/ds-button.types.ts';
+import { DsDividerAttrs } from '../components/ds-divider/ds-divider.types';
 import type { DsIconButtonAttrs } from '../components/ds-icon-button/ds-icon-button.types.ts';
 import type { DsIconAttrs } from '../components/ds-icon/ds-icon.types.ts';
 import type { DsLoaderSpinnerAttrs } from '../components/ds-loader-spinner/ds-loader-spinner.types.ts';
@@ -7,6 +8,7 @@ type GetAttributes<T> = (props?: T) => any;
 export type ComponentFactory = {
     createIcon: GetAttributes<DsIconAttrs>;
     createButton: GetAttributes<DsButtonAttrs>;
+    createDivider: GetAttributes<DsDividerAttrs>;
     createIconButton: GetAttributes<DsIconButtonAttrs>;
     createLoaderSpinner: GetAttributes<DsLoaderSpinnerAttrs>;
     createToastMessage: GetAttributes<DsToastMessageAttrs>;

package/dist-react/utils/componentFactory.js

@@ -43,6 +43,15 @@ const m = {
                 ${t.children}
             </ds-button-react>
         `),
+  createDivider: (t = {}) => (i("ds-divider-react", () => import("../components/ds-divider/ds-divider.js")), a`
+            <ds-divider-react
+                class=${t == null ? void 0 : t.class}
+                variant=${(t == null ? void 0 : t.variant) ?? "primary"}
+                orientation=${(t == null ? void 0 : t.orientation) ?? "horizontal"}
+                data-testid=${t == null ? void 0 : t["data-testid"]}
+            >
+            </ds-divider-react>
+        `),
   createIconButton: (t = {}) => (i("ds-icon-button-react", () => import("../components/ds-icon-button/ds-icon-button.js")), a`
             <ds-icon-button-react
                 class=${t == null ? void 0 : t.class}
@@ -79,9 +88,9 @@ const m = {
             ></ds-toast-message-react>
         `)
 };
-function i(t, n) {
+function i(t, d) {
   try {
-    typeof window < "u" && typeof customElements < "u" && !customElements.get(t) && n();
+    typeof window < "u" && typeof customElements < "u" && !customElements.get(t) && d();
   } catch {
   }
 }

package/dist-react/utils/cssWithTokens.js

@@ -3,7 +3,7 @@ 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 { unsafeCSS as n, css as o } from "../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
 function x(t, ...r) {
-  const e = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-3"), i = n(e);
+  const e = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-4"), i = n(e);
   return o`${i}`;
 }
 export {

package/dist-react/utils/htmlWithTokens.js

@@ -3,7 +3,7 @@ import { html as n } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit
 import "../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
 import { unsafeHTML as i } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/unsafe-html.js";
 function x(t, ...r) {
-  const o = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-3"), e = i(o);
+  const o = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v1-1-0-canary-4"), e = i(o);
   return n`${e}`;
 }
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cupra/ui-kit",
-  "version": "1.1.0-canary.3",
+  "version": "1.1.0-canary.4",
   "description": "Web components library",
   "author": "SEAT S.A.",
   "license": "SEAT S.A. Library EULA 1.0",