@cupra/ui-kit 2.0.0-canary.230 → 2.0.0-canary.232

package/dist/esm/components/ds-inline-alert/styles/cupra-diagonal.styles.js

@@ -0,0 +1,80 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-inline-alert/styles/cupra-diagonal.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='cupra-diagonal']) .container {
+        display: flex;
+        min-width: 15.625rem;
+        padding: var(--ds-spacing-s-5, 8px);
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-5, 8px);
+        border-radius: var(--ds-border-radius-s, 8px);
+        background: var(--ds-color-surface-container-default, rgba(250, 250, 250, 0.05));
+        box-shadow: 0 0.25rem 0.25rem 0 var(--ds-opacity-black-20, rgba(9, 9, 11, 0.2));
+        width: 100%;
+        box-sizing: border-box;
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .icon {
+        --ui-kit-icon-color: var(--ds-color-border-selected);
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .container.warning .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-warning);
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .container.info .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-info);
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .container.error .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-error);
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .container.success .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-success);
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .content {
+        display: flex;
+        flex: 1 1 auto;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 0.5rem;
+        align-self: stretch;
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .header {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-3, 4px);
+        align-self: stretch;
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .title {
+        overflow: hidden;
+        color: var(--ds-color-text-default, #fafafa);
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary, 'cupra-screen');
+        font-size: var(--ds-typography-size-headline-xxs, 16px);
+        font-style: normal;
+        font-weight: 400;
+        line-height: var(--ds-typography-height-headline-xxs, 24px);
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+    }
+
+    :host([data-ui-kit-theme='cupra-diagonal']) .message {
+        overflow: hidden;
+        color: var(--ds-color-text-default-subtlest, #d3d6d9);
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary, 'cupra-screen');
+        font-size: var(--ds-typography-size-body-m, 14px);
+        font-style: normal;
+        font-weight: 350;
+        line-height: var(--ds-typography-height-body-m, 20px);
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+    }
+`;
+//#endregion
+export { t as cupraDiagonalStyles };

package/dist/esm/components/ds-inline-alert/styles/seat-legacy.styles.js

@@ -0,0 +1,80 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-inline-alert/styles/seat-legacy.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='seat-legacy']) .container {
+        display: flex;
+        min-width: 15.625rem;
+        padding: var(--ds-spacing-s-5, 8px);
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-5, 8px);
+        border-radius: var(--ds-border-radius-s, 8px);
+        background: var(--ds-color-surface-container-default, rgba(250, 250, 250, 0.05));
+        box-shadow: 0 0.25rem 0.25rem 0 var(--ds-opacity-black-20, rgba(9, 9, 11, 0.2));
+        width: 100%;
+        box-sizing: border-box;
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .icon {
+        --ui-kit-icon-color: var(--ds-color-border-selected);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .container.warning .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-warning);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .container.info .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-info);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .container.error .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-error);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .container.success .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-success);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .content {
+        display: flex;
+        flex: 1 1 auto;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 0.5rem;
+        align-self: stretch;
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .header {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-3, 4px);
+        align-self: stretch;
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .title {
+        overflow: hidden;
+        color: var(--ds-color-text-default, #fafafa);
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary, 'cupra-screen');
+        font-size: var(--ds-typography-size-headline-xxs, 16px);
+        font-style: normal;
+        font-weight: 400;
+        line-height: var(--ds-typography-height-headline-xxs, 24px);
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .message {
+        overflow: hidden;
+        color: var(--ds-color-text-default-subtlest, #d3d6d9);
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary, 'cupra-screen');
+        font-size: var(--ds-typography-size-body-m, 14px);
+        font-style: normal;
+        font-weight: 350;
+        line-height: var(--ds-typography-height-body-m, 20px);
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+    }
+`;
+//#endregion
+export { t as seatLegacyStyles };

package/dist/esm/components/ds-inline-alert/styles/seat.styles.js

@@ -0,0 +1,80 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-inline-alert/styles/seat.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='seat']) .container {
+        display: flex;
+        min-width: 15.625rem;
+        padding: var(--ds-spacing-s-5, 8px);
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-5, 8px);
+        border-radius: var(--ds-border-radius-s, 8px);
+        background: var(--ds-color-surface-container-default, rgba(250, 250, 250, 0.05));
+        box-shadow: 0 0.25rem 0.25rem 0 var(--ds-opacity-black-20, rgba(9, 9, 11, 0.2));
+        width: 100%;
+        box-sizing: border-box;
+    }
+
+    :host([data-ui-kit-theme='seat']) .icon {
+        --ui-kit-icon-color: var(--ds-color-border-selected);
+    }
+
+    :host([data-ui-kit-theme='seat']) .container.warning .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-warning);
+    }
+
+    :host([data-ui-kit-theme='seat']) .container.info .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-info);
+    }
+
+    :host([data-ui-kit-theme='seat']) .container.error .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-error);
+    }
+
+    :host([data-ui-kit-theme='seat']) .container.success .icon {
+        --ui-kit-icon-color: var(--ds-color-border-feedback-success);
+    }
+
+    :host([data-ui-kit-theme='seat']) .content {
+        display: flex;
+        flex: 1 1 auto;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 0.5rem;
+        align-self: stretch;
+    }
+
+    :host([data-ui-kit-theme='seat']) .header {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-3, 4px);
+        align-self: stretch;
+    }
+
+    :host([data-ui-kit-theme='seat']) .title {
+        overflow: hidden;
+        color: var(--ds-color-text-default, #fafafa);
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary, 'cupra-screen');
+        font-size: var(--ds-typography-size-headline-xxs, 16px);
+        font-style: normal;
+        font-weight: 400;
+        line-height: var(--ds-typography-height-headline-xxs, 24px);
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+    }
+
+    :host([data-ui-kit-theme='seat']) .message {
+        overflow: hidden;
+        color: var(--ds-color-text-default-subtlest, #d3d6d9);
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary, 'cupra-screen');
+        font-size: var(--ds-typography-size-body-m, 14px);
+        font-style: normal;
+        font-weight: 350;
+        line-height: var(--ds-typography-height-body-m, 20px);
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+    }
+`;
+//#endregion
+export { t as seatStyles };

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

@@ -93,6 +93,6 @@ var l = class extends c {
 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"
-})], 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);
+})], 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")], l);
 //#endregion
 export { l as DsInput };

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

@@ -1,9 +1,9 @@
 import { html as e, nothing as t } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.js";
+import { LitElement as n } from "../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
-import { property as n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
+import { property as r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
-import r from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
-import { UiKitElement as i } from "../base/UiKitElement.js";
+import i from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
 import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
 import "../ds-icon/ds-icon.js";
 import { booleanConverter as o } from "../../utils/booleanConverter.js";
@@ -13,7 +13,7 @@ import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/class-map
 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 u = class extends i {
+var u = class extends n {
 	constructor(...e) {
 		super(...e), this.size = "medium", this.selected = !1, this.error = !1, this.showClose = !1, this.handleCtaSlotChange = () => {
 			this.requestUpdate();
@@ -101,16 +101,16 @@ var u = class extends i {
         `;
 	}
 }, d = (u.styles = [l], u);
-r([n({ type: String })], d.prototype, "size", void 0), r([n({
+i([r({ type: String })], d.prototype, "size", void 0), i([r({
 	type: Boolean,
 	converter: o
-})], d.prototype, "selected", void 0), r([n({
+})], d.prototype, "selected", void 0), i([r({
 	type: Boolean,
 	converter: o
-})], d.prototype, "error", void 0), r([n({
+})], d.prototype, "error", void 0), i([r({
 	type: Boolean,
 	converter: o,
 	attribute: "show-close"
-})], d.prototype, "showClose", void 0), d = r([a("ds-interactive-card")], d);
+})], d.prototype, "showClose", void 0), d = i([a("ds-interactive-card")], d);
 //#endregion
 export { d as DsInteractiveCard };

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

@@ -16,8 +16,12 @@ import { ViewportMixin as u } from "../../mixins/ViewportMixin.js";
 import { objectConverter as d } from "../../utils/objectConverter.js";
 import { choose as f } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/choose.js";
 import { commonStyles as p } from "./styles/common.styles.js";
+import { cupraDiagonalStyles as m } from "./styles/cupra-diagonal.styles.js";
+import { cupraStyles as h } from "./styles/cupra.styles.js";
+import { seatLegacyStyles as g } from "./styles/seat-legacy.styles.js";
+import { seatStyles as _ } from "./styles/seat.styles.js";
 //#region src/components/ds-link-button/ds-link-button.ts
-var m = class extends u(i) {
+var v = class extends u(i) {
 	constructor(...e) {
 		super(...e), this.mode = "light", this.size = "large", this.underline = !1, this.disabled = !1, this.iconName = "arrow-right", this.iconPosition = "right";
 	}
@@ -71,37 +75,43 @@ var m = class extends u(i) {
                     `]])}
         `;
 	}
-}, h = (m.styles = [p], m);
+}, y = (v.styles = [
+	p,
+	m,
+	_,
+	h,
+	g
+], v);
 r([n({
 	type: String,
 	reflect: !0
-})], h.prototype, "mode", void 0), r([n({
+})], y.prototype, "mode", void 0), r([n({
 	type: String,
 	converter: d
-})], h.prototype, "size", void 0), r([n({
+})], y.prototype, "size", void 0), r([n({
 	type: Boolean,
 	converter: o
-})], h.prototype, "underline", void 0), r([n({
+})], y.prototype, "underline", void 0), r([n({
 	type: Boolean,
 	converter: o
-})], h.prototype, "disabled", void 0), r([n({
+})], y.prototype, "disabled", void 0), r([n({
 	type: String,
 	attribute: "html-tag-name"
-})], h.prototype, "htmlTagName", void 0), r([n({
+})], y.prototype, "htmlTagName", void 0), r([n({
 	type: String,
 	reflect: !0
-})], h.prototype, "href", void 0), r([n({
+})], y.prototype, "href", void 0), r([n({
 	type: String,
 	reflect: !0
-})], h.prototype, "rel", void 0), r([n({
+})], y.prototype, "rel", void 0), r([n({
 	type: String,
 	reflect: !0
-})], h.prototype, "target", void 0), r([n({
+})], y.prototype, "target", void 0), r([n({
 	type: String,
 	attribute: "icon-name"
-})], h.prototype, "iconName", void 0), r([n({
+})], y.prototype, "iconName", void 0), r([n({
 	type: String,
 	attribute: "icon-position"
-})], h.prototype, "iconPosition", void 0), h = r([a("ds-link-button")], h);
+})], y.prototype, "iconPosition", void 0), y = r([a("ds-link-button")], y);
 //#endregion
-export { h as DsLinkButton };
+export { y as DsLinkButton };

package/dist/esm/components/ds-link-button/styles/cupra-diagonal.styles.js

@@ -0,0 +1,81 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-link-button/styles/cupra-diagonal.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button {
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+        text-align: left;
+        text-decoration: none;
+        border-radius: var(--ds-border-radius-xs, 6px);
+        color: var(--ui-kit-link-button-color, var(--ui-kit-private-link-button-color));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color, var(--ui-kit-private-link-button-color));
+        --ui-kit-private-link-button-color: var(--ds-button-text-color-link-default, #fafafa);
+        --ui-kit-private-link-button-color-hover: var(--ds-button-text-color-link-hover, #e4e4e7);
+        --ui-kit-private-link-button-color-focus: var(--ds-button-text-color-link-focus, #e4e4e7);
+        --ui-kit-private-link-button-color-active: var(--ds-button-text-color-link-pressed, #d3d6d9);
+        --ui-kit-private-link-button-color-disabled: var(--ds-button-text-color-link-disabled, #5a5c67);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button.large {
+        font: var(--ds-typography-weight-body-primary) var(--ds-typography-size-body-l) /
+            var(--ds-typography-height-body-l) var(--ds-typography-family-primary);
+        gap: var(--ds-spacing-s-5, 8px);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button.medium {
+        font: var(--ds-typography-weight-body-primary) var(--ds-typography-size-body-m) /
+            var(--ds-typography-height-body-m) var(--ds-typography-family-primary);
+        gap: var(--ds-spacing-s-4, 6px);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button.small {
+        font: var(--ds-typography-weight-body-primary) var(--ds-typography-size-body-s) /
+            var(--ds-typography-height-body-s) var(--ds-typography-family-primary);
+        gap: var(--ds-spacing-s-3, 4px);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button.underline .label {
+        position: relative;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button.underline .label::after {
+        content: '';
+        position: absolute;
+        bottom: 0.1em;
+        left: 0;
+        right: 0;
+        height: 0.09em;
+        background-color: currentColor;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button:focus-visible {
+        outline-width: var(--ds-button-border-width-base, 2px);
+        outline-style: solid;
+        outline-color: var(--ds-button-outline-color-focus, #6b8494);
+        outline-offset: 0.125rem;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button:hover {
+        color: var(--ui-kit-link-button-color-hover, var(--ui-kit-private-link-button-color-hover));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-hover, var(--ui-kit-private-link-button-color-hover));
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button:focus-visible {
+        color: var(--ui-kit-link-button-color-focus, var(--ui-kit-private-link-button-color-focus));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-focus, var(--ui-kit-private-link-button-color-focus));
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button:active {
+        color: var(--ui-kit-link-button-color-active, var(--ui-kit-private-link-button-color-active));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-active, var(--ui-kit-private-link-button-color-active));
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .link-button.disabled {
+        color: var(--ui-kit-link-button-color-disabled, var(--ui-kit-private-link-button-color-disabled));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-disabled, var(--ui-kit-private-link-button-color-disabled));
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .icon {
+        --ui-kit-icon-width: var(--ds-sizing-24, 24px);
+        --ui-kit-icon-height: var(--ds-sizing-24, 24px);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .icon {
+        --ui-kit-icon-width: var(--ds-sizing-20, 20px);
+        --ui-kit-icon-height: var(--ds-sizing-20, 20px);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .small .icon {
+        --ui-kit-icon-width: var(--ds-sizing-16, 16px);
+        --ui-kit-icon-height: var(--ds-sizing-16, 16px);
+    }
+`;
+//#endregion
+export { t as cupraDiagonalStyles };

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

@@ -0,0 +1,46 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-link-button/styles/cupra.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='cupra']) .link-button.large {
+        font: var(--ds-font-cupra-regular-30-title);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button.medium {
+        font: var(--ds-font-cupra-regular-20-title);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button:focus-visible {
+        outline: 0.125rem solid var(--ds-color-green-80);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button {
+        text-decoration: none;
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button.light {
+        color: var(--ds-color-black);
+        --ui-kit-icon-color: var(--ds-color-black);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button.dark {
+        color: var(--ds-color-white);
+        --ui-kit-icon-color: var(--ds-color-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button:hover.light {
+        color: var(--ds-color-grey);
+        --ui-kit-icon-color: var(--ds-color-grey);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button:hover.dark {
+        color: var(--ds-color-off-white);
+        --ui-kit-icon-color: var(--ds-color-off-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button.disabled.light {
+        color: var(--ds-color-off-white);
+        --ui-kit-icon-color: var(--ds-color-off-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .link-button.disabled.dark {
+        color: var(--ds-color-grey);
+        --ui-kit-icon-color: var(--ds-color-grey);
+    }
+    :host([data-ui-kit-theme='cupra']) .icon {
+        margin-left: 0.25rem;
+    }
+`;
+//#endregion
+export { t as cupraStyles };

package/dist/esm/components/ds-link-button/styles/seat-legacy.styles.js

@@ -0,0 +1,57 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-link-button/styles/seat-legacy.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='seat-legacy']) .link-button {
+        letter-spacing: var(--dg-font-letter-spacing-m);
+        text-decoration: none;
+        border-radius: var(--dg-border-radius-xs);
+        color: var(--dg-button-text-color-link-default);
+        --ui-kit-icon-color: var(--dg-button-text-color-link-default);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button.large {
+        font: var(--dg-font-body-l-regular-weight) var(--dg-font-body-l-regular-size) /
+            var(--dg-font-body-l-regular-line-height) var(--dg-font-body-l-regular-family);
+        gap: 0.5rem;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button.medium {
+        font: var(--dg-font-body-m-regular-weight) var(--dg-font-body-m-regular-size) /
+            var(--dg-font-body-m-regular-line-height) var(--dg-font-body-m-regular-family);
+        gap: 0.375rem;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button.small {
+        font: var(--dg-font-body-s-regular-weight) var(--dg-font-body-s-regular-size) /
+            var(--dg-font-body-s-regular-line-height) var(--dg-font-body-s-regular-family);
+        gap: 0.25rem;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button.underline {
+        text-decoration: underline;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button:focus-visible {
+        outline-width: 0.125rem;
+        outline-style: solid;
+        outline-offset: 0.125rem;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button:hover {
+        color: var(--dg-button-text-color-link-hover);
+        --ui-kit-icon-color: var(--dg-button-text-color-link-hover);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .link-button.disabled {
+        color: var(--dg-button-text-color-link-disabled);
+        --ui-kit-icon-color: var(--dg-button-text-color-link-disabled);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .large .icon {
+        --ui-kit-icon-width: 1.5rem;
+        --ui-kit-icon-height: 1.5rem;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .medium .icon {
+        --ui-kit-icon-width: 1.25rem;
+        --ui-kit-icon-height: 1.25rem;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .small .icon {
+        --ui-kit-icon-width: 1rem;
+        --ui-kit-icon-height: 1rem;
+    }
+`;
+//#endregion
+export { t as seatLegacyStyles };

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

@@ -0,0 +1,81 @@
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-link-button/styles/seat.styles.ts
+var t = e`
+    :host([data-ui-kit-theme='seat']) .link-button {
+        letter-spacing: var(--ds-typography-letter-spacing-m, 0.5px);
+        text-align: left;
+        text-decoration: none;
+        border-radius: var(--ds-border-radius-xs, 6px);
+        color: var(--ui-kit-link-button-color, var(--ui-kit-private-link-button-color));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color, var(--ui-kit-private-link-button-color));
+        --ui-kit-private-link-button-color: var(--ds-button-text-color-link-default, #fafafa);
+        --ui-kit-private-link-button-color-hover: var(--ds-button-text-color-link-hover, #e4e4e7);
+        --ui-kit-private-link-button-color-focus: var(--ds-button-text-color-link-focus, #e4e4e7);
+        --ui-kit-private-link-button-color-active: var(--ds-button-text-color-link-pressed, #d3d6d9);
+        --ui-kit-private-link-button-color-disabled: var(--ds-button-text-color-link-disabled, #5a5c67);
+    }
+    :host([data-ui-kit-theme='seat']) .link-button.large {
+        font: var(--ds-typography-weight-body-primary) var(--ds-typography-size-body-l) /
+            var(--ds-typography-height-body-l) var(--ds-typography-family-primary);
+        gap: var(--ds-spacing-s-5, 8px);
+    }
+    :host([data-ui-kit-theme='seat']) .link-button.medium {
+        font: var(--ds-typography-weight-body-primary) var(--ds-typography-size-body-m) /
+            var(--ds-typography-height-body-m) var(--ds-typography-family-primary);
+        gap: var(--ds-spacing-s-4, 6px);
+    }
+    :host([data-ui-kit-theme='seat']) .link-button.small {
+        font: var(--ds-typography-weight-body-primary) var(--ds-typography-size-body-s) /
+            var(--ds-typography-height-body-s) var(--ds-typography-family-primary);
+        gap: var(--ds-spacing-s-3, 4px);
+    }
+    :host([data-ui-kit-theme='seat']) .link-button.underline .label {
+        position: relative;
+    }
+    :host([data-ui-kit-theme='seat']) .link-button.underline .label::after {
+        content: '';
+        position: absolute;
+        bottom: 0.1em;
+        left: 0;
+        right: 0;
+        height: 0.09em;
+        background-color: currentColor;
+    }
+    :host([data-ui-kit-theme='seat']) .link-button:focus-visible {
+        outline-width: var(--ds-button-border-width-base, 2px);
+        outline-style: solid;
+        outline-color: var(--ds-button-outline-color-focus, #6b8494);
+        outline-offset: 0.125rem;
+    }
+    :host([data-ui-kit-theme='seat']) .link-button:hover {
+        color: var(--ui-kit-link-button-color-hover, var(--ui-kit-private-link-button-color-hover));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-hover, var(--ui-kit-private-link-button-color-hover));
+    }
+    :host([data-ui-kit-theme='seat']) .link-button:focus-visible {
+        color: var(--ui-kit-link-button-color-focus, var(--ui-kit-private-link-button-color-focus));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-focus, var(--ui-kit-private-link-button-color-focus));
+    }
+    :host([data-ui-kit-theme='seat']) .link-button:active {
+        color: var(--ui-kit-link-button-color-active, var(--ui-kit-private-link-button-color-active));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-active, var(--ui-kit-private-link-button-color-active));
+    }
+    :host([data-ui-kit-theme='seat']) .link-button.disabled {
+        color: var(--ui-kit-link-button-color-disabled, var(--ui-kit-private-link-button-color-disabled));
+        --ui-kit-icon-color: var(--ui-kit-link-button-color-disabled, var(--ui-kit-private-link-button-color-disabled));
+    }
+    :host([data-ui-kit-theme='seat']) .large .icon {
+        --ui-kit-icon-width: var(--ds-sizing-24, 24px);
+        --ui-kit-icon-height: var(--ds-sizing-24, 24px);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .icon {
+        --ui-kit-icon-width: var(--ds-sizing-20, 20px);
+        --ui-kit-icon-height: var(--ds-sizing-20, 20px);
+    }
+    :host([data-ui-kit-theme='seat']) .small .icon {
+        --ui-kit-icon-width: var(--ds-sizing-16, 16px);
+        --ui-kit-icon-height: var(--ds-sizing-16, 16px);
+    }
+`;
+//#endregion
+export { t as seatStyles };

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

@@ -1,15 +1,15 @@
 import { html as e } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.js";
+import { LitElement as t } from "../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
-import { property as t } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
+import { property as n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
-import n from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
-import { UiKitElement as r } from "../base/UiKitElement.js";
+import r from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
 import { customUiKitElement as i } from "../../decorators/customUiKitElement.js";
 import { classMap as a } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/class-map.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/class-map.js";
 import { commonStyles as o } from "./styles/common.styles.js";
 //#region src/components/ds-list/ds-list.ts
-var s = class extends r {
+var s = class extends t {
 	constructor(...e) {
 		super(...e), this.size = "large";
 	}
@@ -31,9 +31,9 @@ var s = class extends r {
         `;
 	}
 }, c = (s.styles = [o], s);
-n([t({
+r([n({
 	type: String,
 	reflect: !0
-})], c.prototype, "size", void 0), c = n([i("ds-list")], c);
+})], c.prototype, "size", void 0), c = r([i("ds-list")], c);
 //#endregion
 export { c as DsList };