@cupra/ui-kit 2.0.0-canary.23 → 2.0.0-canary.231

package/dist/cjs/components/ds-carousel-indicator/styles/common.styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");require("../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),t=e.css`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");var t=e.css`
     :host {
         display: flex;
         width: 100%;
@@ -9,4 +9,54 @@
     .container {
         display: flex;
     }
-`;exports.commonStyles=t;
+
+    .container {
+        padding: 8px;
+    }
+    .selector {
+        height: var(--ds-sizing-04);
+        transition:
+            width 0.3s cubic-bezier(0, 0, 0.2, 1),
+            margin 0.3s cubic-bezier(0, 0, 0.2, 1);
+        width: 40px;
+        margin: 0 2px;
+        border-radius: var(--ds-border-radius-full);
+        background: var(--ds-indicator-bg-color-default);
+    }
+    .selector.selected {
+        width: 64px;
+        background: var(--ds-indicator-bg-color-active-primary);
+    }
+    .selector.hidden {
+        width: 0px;
+        margin: 0px;
+    }
+    .infinite .selector.selected {
+        width: 40px;
+    }
+    .infinite .selector:not(.hidden):has(+ .hidden) {
+        width: 16px;
+    }
+    .infinite .selector.hidden:has(+ :not(.hidden)) + .selector {
+        width: 16px;
+    }
+    .infinite
+        .selector:first-child:not(.selected):not(.hidden):has(
+            + :not(.hidden):not(.selected) + :not(.hidden):not(.selected) + .selected:not(.hidden)
+        ) {
+        width: 16px;
+    }
+    .infinite
+        .selector.selected:not(.hidden)
+        + :not(.selected):not(.hidden)
+        + :not(.selected):not(.hidden)
+        + :not(.selected):not(.hidden):last-child {
+        width: 16px;
+    }
+    .infinite .selector:not(.hidden):has(+ :not(.hidden) + .hidden) {
+        width: 24px;
+    }
+    .infinite .selector.hidden:has(+ :not(.hidden) + :not(.hidden)) + .selector + .selector {
+        width: 24px;
+    }
+`;exports.commonStyles=t;

package/dist/cjs/components/ds-checkbox/ds-checkbox.cjs

@@ -1,13 +1,13 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../base/UiKitElement.cjs"),d=require("../../decorators/customUiKitElement.cjs"),u=require("../../mixins/FormAssociatedMixin.cjs"),c=require("../../utils/booleanConverter.cjs"),m=require("../../utils/htmlWithTokens.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const r=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),y=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),b=require("./styles/common.styles.cjs");var v=Object.defineProperty,x=Object.getOwnPropertyDescriptor,e=(h,o,s,n)=>{for(var i=n>1?void 0:n?x(o,s):o,l=h.length-1,p;l>=0;l--)(p=h[l])&&(i=(n?p(o,s,i):p(i))||i);return n&&i&&v(o,s,i),i};exports.DsCheckbox=class extends u.FormAssociatedMixin(a.UiKitElement){constructor(){super(...arguments),this.inputPlacement="left",this.checked=!1,this.required=!1,this.disabled=!1,this.mode="light",this.size="medium",this.helperText="",this.infoText="",this.forcedError="",this.invalidError="",this.indeterminate=!1}handleChange(o){const s=o.target;this.checked=s.checked,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{checked:this.checked,value:this.value}}))}get classes(){return{container:!0,[this.inputPlacement]:!!this.inputPlacement,[this.mode]:!!this.mode,[this.size]:!!this.size,disabled:this.disabled,checked:this.checked,error:!!this.forcedError}}get iconTemplate(){if(!this.checked)return r.nothing;const o=this.indeterminate?"minus":"check";return this.componentFactory.createIcon({class:"icon","icon-name":o})}get styleTokens(){return m.htmlWithTokens`
+const e=require("../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/controllers/context-consumer.cjs"),t=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");const n=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.cjs"),r=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.cjs");const i=require("../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.cjs"),a=require("../base/UiKitElement.cjs"),o=require("../../decorators/customUiKitElement.cjs");require("../ds-icon/ds-icon.cjs");const s=require("../../utils/booleanConverter.cjs"),c=require("../../utils/uiKitHtml.cjs"),l=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/class-map.cjs");const u=require("../ds-checkbox-group/ds-checkbox-group.cjs"),d=require("../../mixins/FormAssociatedMixin.cjs"),f=require("./styles/common.styles.cjs"),p=require("./styles/cupra-diagonal.styles.cjs"),m=require("./styles/cupra.styles.cjs"),h=require("./styles/seat-legacy.styles.cjs"),g=require("./styles/seat.styles.cjs");var _=class extends d.FormAssociatedMixin(a.UiKitElement){constructor(...e){super(...e),this.inputPlacement=`left`,this._checked=void 0,this._checkedState=!1,this.required=!1,this._disabled=!1,this.mode=`light`,this._size=`medium`,this.helperText=``,this.infoText=``,this._forcedError=``,this.invalidError=``,this.indeterminate=!1,this.dataAriaLabel=``}get checked(){return this._checked??this._checkedState}set checked(e){this._checked=e}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>{this.createContextConsumers([{context:u.checkboxGroupDisabledContext,callback:e=>{this.disabledGroup=e}},{context:u.checkboxGroupErrorContext,callback:e=>{this.errorGroup=e}},{context:u.checkboxGroupSizeContext,callback:e=>{this.sizeGroup=e}}])})}createContextConsumers(t){t.forEach(({context:t,callback:n})=>{new e.ContextConsumer(this,{context:t,callback:n,subscribe:!0})})}get disabled(){return this.disabledGroup??this._disabled}set disabled(e){this._disabled=e}get size(){return this.sizeGroup||this._size}set size(e){this._size=e}get forcedError(){return this._forcedError}set forcedError(e){this._forcedError=e}get error(){return this.errorGroup??!!this._forcedError}handleChange(e){let t=e.target.checked;this._checkedState=t,this._checked=void 0,this.dispatchEvent(new CustomEvent(`change`,{bubbles:!0,composed:!0,detail:{checked:t,value:this.value}}))}get classes(){return{container:!0,[this.inputPlacement]:!!this.inputPlacement,[this.mode]:!!this.mode,[this.size]:!!this.size,disabled:this.disabled,checked:this.checked,error:this.error}}get iconTemplate(){if(!this.checked)return t.nothing;let e=this.indeterminate?`minus`:`check`;return c.uiKitHtml`<ds-icon class="icon" icon-name=${e}></ds-icon>`}get styleTokens(){return t.html`
             <style>
                 :host{
                     color-scheme: ${this.mode};
-                    pointer-events: ${this.disabled?"none":"visible"};
+                    pointer-events: ${this.disabled?`none`:`visible`};
                 }
             </style>
-        `}render(){return r.html`
+        `}render(){return t.html`
             ${this.styleTokens}
-            <div class=${y.classMap(this.classes)}>
+            <div class=${l.classMap(this.classes)}>
                 <label>
                     <span class="checkmark-container">
                         <span class="checkmark">
@@ -17,6 +17,7 @@
                                 type="checkbox"
                                 name=${this.name}
                                 value=${this.value}
+                                aria-label=${this.dataAriaLabel||t.nothing}
                                 ?required=${this.required}
                                 ?checked=${this.checked}
                                 ?disabled=${this.disabled}
@@ -27,12 +28,12 @@
                     <div class="text-container">
                         <div class="text">
                             <slot></slot>
-                            ${this.infoText?r.html` <div class="info-text">${this.infoText}</div> `:r.nothing}
+                            ${this.infoText?t.html` <div class="info-text">${this.infoText}</div> `:t.nothing}
                         </div>
-                        ${this.helperText?r.html` <div class="helper-text">${this.helperText}</div> `:r.nothing}
-                        ${this.forcedError?r.html` <div class="error-text">${this.forcedError}</div> `:r.nothing}
-                        ${this.invalidError&&!this.forcedError?r.html`<div class="error-text invalid-error">${this.invalidError}</div>`:r.nothing}
+                        ${this.helperText?t.html` <div class="helper-text">${this.helperText}</div> `:t.nothing}
+                        ${this.forcedError?t.html` <div class="error-text">${this.forcedError}</div> `:t.nothing}
+                        ${this.invalidError&&!this.forcedError?t.html`<div class="error-text invalid-error">${this.invalidError}</div>`:t.nothing}
                     </div>
                 </label>
             </div>
-        `}};exports.DsCheckbox.styles=[b.commonStyles];e([t.property({type:String})],exports.DsCheckbox.prototype,"name",2);e([t.property({type:String})],exports.DsCheckbox.prototype,"value",2);e([t.property({type:String,attribute:"input-placement"})],exports.DsCheckbox.prototype,"inputPlacement",2);e([t.property({type:Boolean,converter:c.booleanConverter,reflect:!0})],exports.DsCheckbox.prototype,"checked",2);e([t.property({type:Boolean,converter:c.booleanConverter})],exports.DsCheckbox.prototype,"required",2);e([t.property({type:Boolean,converter:c.booleanConverter})],exports.DsCheckbox.prototype,"disabled",2);e([t.property({type:String,reflect:!0})],exports.DsCheckbox.prototype,"mode",2);e([t.property({type:String})],exports.DsCheckbox.prototype,"size",2);e([t.property({type:String,attribute:"helper-text"})],exports.DsCheckbox.prototype,"helperText",2);e([t.property({type:String,attribute:"info-text"})],exports.DsCheckbox.prototype,"infoText",2);e([t.property({type:String,attribute:"forced-error"})],exports.DsCheckbox.prototype,"forcedError",2);e([t.property({type:String,attribute:"invalid-error"})],exports.DsCheckbox.prototype,"invalidError",2);e([t.property({type:Boolean,converter:c.booleanConverter})],exports.DsCheckbox.prototype,"indeterminate",2);exports.DsCheckbox=e([d.customUiKitElement("ds-checkbox")],exports.DsCheckbox);
+        `}},v=(_.styles=[f.commonStyles,p.cupraDiagonalStyles,g.seatStyles,m.cupraStyles,h.seatLegacyStyles],_);i.default([n.property({type:String})],v.prototype,`name`,void 0),i.default([n.property({type:String})],v.prototype,`value`,void 0),i.default([n.property({type:String,attribute:`input-placement`})],v.prototype,`inputPlacement`,void 0),i.default([n.property({type:Boolean,attribute:`checked`,converter:s.booleanConverter,reflect:!0})],v.prototype,`_checked`,void 0),i.default([r.state()],v.prototype,`_checkedState`,void 0),i.default([n.property({type:Boolean,converter:s.booleanConverter})],v.prototype,`required`,void 0),i.default([n.property({type:Boolean,converter:s.booleanConverter,attribute:`disabled`})],v.prototype,`_disabled`,void 0),i.default([n.property({type:String,reflect:!0})],v.prototype,`mode`,void 0),i.default([n.property({type:String,attribute:`size`})],v.prototype,`_size`,void 0),i.default([n.property({type:String,attribute:`helper-text`})],v.prototype,`helperText`,void 0),i.default([n.property({type:String,attribute:`info-text`})],v.prototype,`infoText`,void 0),i.default([n.property({type:String,attribute:`forced-error`})],v.prototype,`_forcedError`,void 0),i.default([n.property({type:String,attribute:`invalid-error`})],v.prototype,`invalidError`,void 0),i.default([n.property({type:Boolean,converter:s.booleanConverter})],v.prototype,`indeterminate`,void 0),i.default([n.property({type:String,attribute:`data-aria-label`})],v.prototype,`dataAriaLabel`,void 0),i.default([r.state()],v.prototype,`disabledGroup`,void 0),i.default([r.state()],v.prototype,`errorGroup`,void 0),i.default([r.state()],v.prototype,`sizeGroup`,void 0),v=i.default([o.customUiKitElement(`ds-checkbox`)],v),Object.defineProperty(exports,"DsCheckbox",{enumerable:!0,get:function(){return v}});

package/dist/cjs/components/ds-checkbox/styles/common.styles.cjs

@@ -1,7 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");require("../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),i=e.css`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");var t=e.css`
     :host {
         display: block;
-        width: 100%;
     }
 
     label {
@@ -50,4 +49,4 @@
     .container.error .helper-text {
         display: none;
     }
-`;exports.commonStyles=i;
+`;exports.commonStyles=t;

package/dist/cjs/components/ds-checkbox/styles/cupra-diagonal.styles.cjs

@@ -0,0 +1,180 @@
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");var t=e.css`
+    :host([data-ui-kit-theme='cupra-diagonal']) .container {
+        padding: var(--ds-spacing-s-2) var(--ds-spacing-s-5);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .container:not(.disabled):active {
+        background-color: var(--ds-checkbox-bg-color-pressed);
+        border-radius: var(--ds-border-radius-xs);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .text-container {
+        display: flex;
+        flex-direction: column;
+        flex: 1 1 auto;
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-3);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .text-container {
+        margin: var(--ds-spacing-s-3) 0 0 0;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .text-container {
+        margin: var(--ds-spacing-s-2) 0 0 0;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .checkmark-container {
+        pointer-events: none;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        background-color: transparent;
+        border-radius: var(--ds-border-radius-s);
+        outline-style: solid;
+        outline-color: transparent;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .checkmark-container {
+        width: var(--ds-sizing-32);
+        height: var(--ds-sizing-32);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .checkmark-container {
+        width: var(--ds-sizing-24);
+        height: var(--ds-sizing-24);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) :hover .checkmark-container {
+        background-color: var(--ds-checkbox-bg-color-hover);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .checkmark-container:has(input:focus-visible) {
+        background-color: var(--ds-checkbox-bg-color-focus);
+        outline-offset: 0;
+        outline-color: var(--ds-color-border-focus-ring);
+        outline-width: 0.125rem;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) label:active .checkmark-container {
+        background-color: transparent;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .checkmark {
+        width: var(--ds-sizing-24);
+        height: var(--ds-sizing-24);
+        border-radius: var(--ds-border-radius-xs);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .checkmark {
+        width: var(--ds-sizing-16);
+        height: var(--ds-sizing-16);
+        border-radius: var(--ds-border-radius-xxs);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .checkmark {
+        border-width: 1px;
+        border-color: var(--ds-checkbox-border-color-default);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .checked .checkmark {
+        background-color: var(--ds-checkbox-bg-color-selected);
+        border-color: var(--ds-checkbox-border-color-selected);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .error.checked .checkmark {
+        background-color: var(--ds-checkbox-bg-color-error);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled.checked .checkmark {
+        background-color: var(--ds-checkbox-bg-color-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) :has(input:invalid) .checkmark {
+        border-color: var(--ds-checkbox-border-color-error);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .error .checkmark {
+        border-color: var(--ds-checkbox-border-color-error);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled .checkmark {
+        border-color: var(--ds-checkbox-border-color-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) label {
+        display: flex;
+        gap: var(--ds-spacing-s-5);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .right label {
+        flex-direction: row-reverse;
+        justify-content: space-between;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .icon {
+        --ui-kit-icon-color: var(--ds-checkbox-icon-color-active);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled .icon {
+        --ui-kit-icon-color: var(--ds-checkbox-icon-color-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .icon {
+        --ui-kit-icon-height: 1rem;
+        --ui-kit-icon-width: 1rem;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .icon {
+        --ui-kit-icon-height: 0.75rem;
+        --ui-kit-icon-width: 0.75rem;
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .text {
+        display: flex;
+        width: 100%;
+        align-items: center;
+        justify-content: space-between;
+        gap: 0.625rem;
+        color: var(--ds-checkbox-text-color-label-default);
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .text {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        font: 400 var(--ds-typography-size-body-l) / var(--ds-typography-height-body-l)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled .text {
+        color: var(--ds-checkbox-text-color-label-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .text {
+        font: 400 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .helper-text {
+        overflow: hidden;
+        color: var(--ds-checkbox-text-color-caption-default);
+        text-overflow: ellipsis;
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled .helper-text {
+        color: var(--ds-checkbox-text-color-caption-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .helper-text {
+        font: 350 var(--ds-typography-size-body-s) / var(--ds-typography-height-body-s)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .helper-text {
+        font: 350 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .info-text {
+        overflow: hidden;
+        color: var(--ds-checkbox-text-color-secondary-default);
+        text-overflow: ellipsis;
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled .info-text {
+        color: var(--ds-checkbox-text-color-secondary-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .info-text {
+        font: 400 var(--ds-typography-size-body-s) / var(--ds-typography-height-body-s)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .info-text {
+        font: 400 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .error-text {
+        overflow: hidden;
+        color: var(--ds-checkbox-text-color-caption-error);
+        text-overflow: ellipsis;
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .disabled .error-text {
+        color: var(--ds-checkbox-text-color-caption-disabled);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .medium .error-text {
+        font: 350 var(--ds-typography-size-body-s) / var(--ds-typography-height-body-s)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='cupra-diagonal']) .large .error-text {
+        font: 350 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+`;exports.cupraDiagonalStyles=t;

package/dist/cjs/components/ds-checkbox/styles/cupra.styles.cjs

@@ -0,0 +1,74 @@
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");var t=e.css`
+    :host([data-ui-kit-theme='cupra']) .disabled label {
+        opacity: 0.4;
+    }
+    :host([data-ui-kit-theme='cupra']) label {
+        gap: 0.75rem;
+    }
+    :host([data-ui-kit-theme='cupra']) .medium label {
+        font: var(--ds-font-cupra-light-30-paragraph);
+    }
+    :host([data-ui-kit-theme='cupra']) .small label {
+        font: var(--ds-font-cupra-light-20-paragraph);
+    }
+    :host([data-ui-kit-theme='cupra']) .light label {
+        color: var(--ds-color-grey);
+    }
+    :host([data-ui-kit-theme='cupra']) .dark label {
+        color: var(--ds-color-off-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .medium .checkmark-container {
+        margin: 0.125rem 0 0 0;
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark {
+        width: 1.25rem;
+        height: 1.25rem;
+        border-width: 1px;
+    }
+    :host([data-ui-kit-theme='cupra']) .checked.light .checkmark {
+        background-color: var(--ds-color-black);
+        color: var(--ds-color-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .checked.dark .checkmark {
+        background-color: var(--ds-color-white);
+        color: var(--ds-color-black);
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark.light {
+        border-color: var(--ds-color-dark-grey);
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark.dark {
+        border-color: var(--ds-color-medium-grey);
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark.checked.light {
+        border-color: var(--ds-color-black);
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark.checked.dark {
+        border-color: var(--ds-color-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark.error.light {
+        border-color: #b50303;
+    }
+    :host([data-ui-kit-theme='cupra']) .checkmark.error.dark {
+        border-color: #ec8b8b;
+    }
+    :host([data-ui-kit-theme='cupra']) .light .error-text {
+        color: #b50303;
+    }
+    :host([data-ui-kit-theme='cupra']) .dark .error-text {
+        color: #ec8b8b;
+    }
+    :host([data-ui-kit-theme='cupra']) .error-text {
+        margin-top: 0.25rem;
+        font: var(--ds-font-cupra-light-10);
+    }
+    :host([data-ui-kit-theme='cupra']) .checked.light .icon {
+        --ui-kit-icon-color: var(--ds-color-white);
+    }
+    :host([data-ui-kit-theme='cupra']) .checked.dark .icon {
+        --ui-kit-icon-color: var(--ds-color-black);
+    }
+    :host([data-ui-kit-theme='cupra']) .icon {
+        --ui-kit-icon-height: 1.25rem;
+        --ui-kit-icon-width: 1.25rem;
+    }
+`;exports.cupraStyles=t;

package/dist/cjs/components/ds-checkbox/styles/seat-legacy.styles.cjs

@@ -0,0 +1,83 @@
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");var t=e.css`
+    :host([data-ui-kit-theme='seat-legacy']) .disabled label {
+        opacity: 0.6;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) label {
+        gap: 0.75rem;
+        justify-content: flex-start;
+        align-items: center;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .medium label {
+        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);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .small label {
+        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);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .light label {
+        color: var(--dg-global-color-gray-85);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .dark label {
+        color: #ece9e1;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .medium .checkmark-container {
+        margin: 0.125rem 0 0 0;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark {
+        width: 1.25rem;
+        height: 1.25rem;
+        border-width: 1px;
+        border-radius: 2px;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checked.light .checkmark {
+        background-color: var(--dg-global-color-black-100);
+        color: var(--dg-global-color-black-100);
+    }
+
+    :host([data-ui-kit-theme='seat-legacy']) .checked.dark .checkmark {
+        background-color: #ece9e1;
+        color: #ece9e1;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark.light {
+        border-color: #ece9e1;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark.dark {
+        border-color: var(--dg-global-color-black-100);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark.checked.light {
+        border-color: var(--dg-global-color-black-100);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark.checked.dark {
+        border-color: #ece9e1;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark.error.light {
+        border-color: #b0042c;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checkmark.error.dark {
+        border-color: #e38f95;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .light .error-text {
+        color: #b0042c;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .dark .error-text {
+        color: #e38f95;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .error-text {
+        margin-top: 0.25rem;
+        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);
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checked.light .icon {
+        --ui-kit-icon-color: #ece9e1;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .checked.dark .icon {
+        --ui-kit-icon-color: var(--dg-global-color-black-100);
+        background-color: #ece9e1;
+    }
+    :host([data-ui-kit-theme='seat-legacy']) .icon {
+        --ui-kit-icon-height: 1.25rem;
+        --ui-kit-icon-width: 1.25rem;
+    }
+`;exports.seatLegacyStyles=t;

package/dist/cjs/components/ds-checkbox/styles/seat.styles.cjs

@@ -0,0 +1,180 @@
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");var t=e.css`
+    :host([data-ui-kit-theme='seat']) .container {
+        padding: var(--ds-spacing-s-2) var(--ds-spacing-s-5);
+    }
+    :host([data-ui-kit-theme='seat']) .container:not(.disabled):active {
+        background-color: var(--ds-checkbox-bg-color-pressed);
+        border-radius: var(--ds-border-radius-xs);
+    }
+    :host([data-ui-kit-theme='seat']) .text-container {
+        display: flex;
+        flex-direction: column;
+        flex: 1 1 auto;
+        align-items: flex-start;
+        gap: var(--ds-spacing-s-3);
+    }
+    :host([data-ui-kit-theme='seat']) .large .text-container {
+        margin: var(--ds-spacing-s-3) 0 0 0;
+    }
+    :host([data-ui-kit-theme='seat']) .medium .text-container {
+        margin: var(--ds-spacing-s-2) 0 0 0;
+    }
+    :host([data-ui-kit-theme='seat']) .checkmark-container {
+        pointer-events: none;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
+        background-color: transparent;
+        border-radius: var(--ds-border-radius-s);
+        outline-style: solid;
+        outline-color: transparent;
+    }
+    :host([data-ui-kit-theme='seat']) .large .checkmark-container {
+        width: var(--ds-sizing-32);
+        height: var(--ds-sizing-32);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .checkmark-container {
+        width: var(--ds-sizing-24);
+        height: var(--ds-sizing-24);
+    }
+    :host([data-ui-kit-theme='seat']) :hover .checkmark-container {
+        background-color: var(--ds-checkbox-bg-color-hover);
+    }
+    :host([data-ui-kit-theme='seat']) .checkmark-container:has(input:focus-visible) {
+        background-color: var(--ds-checkbox-bg-color-focus);
+        outline-offset: 0;
+        outline-color: var(--ds-color-border-focus-ring);
+        outline-width: 0.125rem;
+    }
+    :host([data-ui-kit-theme='seat']) label:active .checkmark-container {
+        background-color: transparent;
+    }
+    :host([data-ui-kit-theme='seat']) .large .checkmark {
+        width: var(--ds-sizing-24);
+        height: var(--ds-sizing-24);
+        border-radius: var(--ds-border-radius-xs);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .checkmark {
+        width: var(--ds-sizing-16);
+        height: var(--ds-sizing-16);
+        border-radius: var(--ds-border-radius-xxs);
+    }
+    :host([data-ui-kit-theme='seat']) .checkmark {
+        border-width: 1px;
+        border-color: var(--ds-checkbox-border-color-default);
+    }
+    :host([data-ui-kit-theme='seat']) .checked .checkmark {
+        background-color: var(--ds-checkbox-bg-color-selected);
+        border-color: var(--ds-checkbox-border-color-selected);
+    }
+    :host([data-ui-kit-theme='seat']) .error.checked .checkmark {
+        background-color: var(--ds-checkbox-bg-color-error);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled.checked .checkmark {
+        background-color: var(--ds-checkbox-bg-color-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) :has(input:invalid) .checkmark {
+        border-color: var(--ds-checkbox-border-color-error);
+    }
+    :host([data-ui-kit-theme='seat']) .error .checkmark {
+        border-color: var(--ds-checkbox-border-color-error);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled .checkmark {
+        border-color: var(--ds-checkbox-border-color-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) label {
+        display: flex;
+        gap: var(--ds-spacing-s-5);
+    }
+    :host([data-ui-kit-theme='seat']) .right label {
+        flex-direction: row-reverse;
+        justify-content: space-between;
+    }
+    :host([data-ui-kit-theme='seat']) .icon {
+        --ui-kit-icon-color: var(--ds-checkbox-icon-color-active);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled .icon {
+        --ui-kit-icon-color: var(--ds-checkbox-icon-color-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) .large .icon {
+        --ui-kit-icon-height: 1rem;
+        --ui-kit-icon-width: 1rem;
+    }
+    :host([data-ui-kit-theme='seat']) .medium .icon {
+        --ui-kit-icon-height: 0.75rem;
+        --ui-kit-icon-width: 0.75rem;
+    }
+    :host([data-ui-kit-theme='seat']) .text {
+        display: flex;
+        width: 100%;
+        align-items: center;
+        justify-content: space-between;
+        gap: 0.625rem;
+        color: var(--ds-checkbox-text-color-label-default);
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='seat']) .large .text {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        font: 400 var(--ds-typography-size-body-l) / var(--ds-typography-height-body-l)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled .text {
+        color: var(--ds-checkbox-text-color-label-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .text {
+        font: 400 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .helper-text {
+        overflow: hidden;
+        color: var(--ds-checkbox-text-color-caption-default);
+        text-overflow: ellipsis;
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled .helper-text {
+        color: var(--ds-checkbox-text-color-caption-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .helper-text {
+        font: 350 var(--ds-typography-size-body-s) / var(--ds-typography-height-body-s)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .large .helper-text {
+        font: 350 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .info-text {
+        overflow: hidden;
+        color: var(--ds-checkbox-text-color-secondary-default);
+        text-overflow: ellipsis;
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled .info-text {
+        color: var(--ds-checkbox-text-color-secondary-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .info-text {
+        font: 400 var(--ds-typography-size-body-s) / var(--ds-typography-height-body-s)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .large .info-text {
+        font: 400 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .error-text {
+        overflow: hidden;
+        color: var(--ds-checkbox-text-color-caption-error);
+        text-overflow: ellipsis;
+        letter-spacing: var(--ds-typography-letter-spacing-m);
+    }
+    :host([data-ui-kit-theme='seat']) .disabled .error-text {
+        color: var(--ds-checkbox-text-color-caption-disabled);
+    }
+    :host([data-ui-kit-theme='seat']) .medium .error-text {
+        font: 350 var(--ds-typography-size-body-s) / var(--ds-typography-height-body-s)
+            var(--ds-typography-family-primary);
+    }
+    :host([data-ui-kit-theme='seat']) .large .error-text {
+        font: 350 var(--ds-typography-size-body-m) / var(--ds-typography-height-body-m)
+            var(--ds-typography-family-primary);
+    }
+`;exports.seatStyles=t;