@cupra/ui-kit 2.0.0-canary.19 → 2.0.0-canary.191

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

@@ -1,5 +1,126 @@
-"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"),s=e.css`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
     :host {
         display: contents;
     }
-`;exports.commonStyles=s;
+
+    .container {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: var(--ds-border-radius-full);
+        background: var(--ds-icon-button-bg-color-rounded-default);
+        user-select: none;
+        cursor: pointer;
+        overflow: hidden;
+        transition: all 0.3s cubic-bezier(0, 0, 0.2, 1);
+        flex: 0 0 auto;
+    }
+
+    .container:not(.disabled):hover {
+        background: var(--ds-icon-button-bg-color-rounded-hover);
+    }
+
+    .container:not(.disabled):active {
+        background: var(--ds-icon-button-bg-color-rounded-pressed);
+    }
+
+    .container:focus-visible {
+        outline: var(--ds-border-width-l) solid var(--ds-color-border-focus-ring);
+        outline-offset: 2px;
+        background: var(--ds-icon-button-bg-color-rounded-focus);
+    }
+
+    .container.disabled {
+        background: var(--ds-icon-button-bg-color-rounded-disabled);
+    }
+
+    .container.large {
+        width: var(--ds-sizing-48);
+        height: var(--ds-sizing-48);
+    }
+
+    .container.medium {
+        width: var(--ds-sizing-40);
+        height: var(--ds-sizing-40);
+    }
+
+    .container.small {
+        width: var(--ds-sizing-36);
+        height: var(--ds-sizing-36);
+    }
+
+    .container .icon {
+        --ui-kit-icon-color: var(--ds-icon-button-icon-color-quaternary-default);
+    }
+
+    .container.large .icon {
+        --ui-kit-icon-width: var(--ds-sizing-24);
+        --ui-kit-icon-height: var(--ds-sizing-24);
+    }
+    .container.medium .icon {
+        --ui-kit-icon-width: var(--ds-sizing-20);
+        --ui-kit-icon-height: var(--ds-sizing-20);
+    }
+    .container.small .icon {
+        --ui-kit-icon-width: var(--ds-sizing-16);
+        --ui-kit-icon-height: var(--ds-sizing-16);
+    }
+
+    .container.disabled .icon {
+        --ui-kit-icon-color: var(--ds-icon-button-icon-color-quaternary-disabled);
+    }
+
+    .container .initials {
+        overflow: hidden;
+        color: var(--ds-color-text-default-static);
+        text-align: center;
+        text-overflow: ellipsis;
+        font-family: var(--ds-typography-family-primary);
+        font-style: normal;
+        font-weight: var(--ds-typography-weight-body-secondary);
+        letter-spacing: var(--ds-typography-letter-spacing-base);
+    }
+
+    .container.large .initials {
+        font-size: var(--ds-typography-size-body-l);
+        line-height: var(--ds-typography-height-body-l);
+    }
+    .container.medium .initials {
+        font-size: var(--ds-typography-size-body-m);
+        line-height: var(--ds-typography-height-body-m);
+    }
+    .container.small .initials {
+        font-size: var(--ds-typography-size-body-s);
+        line-height: var(--ds-typography-height-body-s);
+    }
+
+    .container.disabled .initials {
+        color: var(--ds-color-text-disabled);
+    }
+
+    ::slotted(img[slot='media']) {
+        width: 100%;
+        object-fit: cover;
+        display: block;
+    }
+
+    .mode-media.container {
+        filter: brightness(1);
+    }
+
+    .mode-media.container:not(.disabled):hover {
+        filter: brightness(0.6);
+    }
+
+    .mode-media.container:not(.disabled):active {
+        filter: brightness(1.3) saturate(0.7);
+    }
+
+    .mode-media.container:focus-visible {
+        filter: brightness(0.6);
+    }
+
+    .mode-media.container.disabled {
+        filter: grayscale(1);
+    }
+`;exports.commonStyles=t;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../base/UiKitElement.cjs"),l=require("../../decorators/customUiKitElement.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const o=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 m=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),c=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),g=require("./styles/common.styles.cjs"),h=require("./styles/cupra-diagonal.styles.cjs");var b=Object.defineProperty,y=Object.getOwnPropertyDescriptor,s=(i,t,n,r)=>{for(var e=r>1?void 0:r?y(t,n):t,a=i.length-1,u;a>=0;a--)(u=i[a])&&(e=(r?u(t,n,e):u(e))||e);return r&&e&&b(t,n,e),e};exports.DsBadge=class extends p.UiKitElement{constructor(){super(...arguments),this.variant="base",this.size="medium"}get hasNumber(){return typeof this.number=="number"&&!Number.isNaN(this.number)}get classes(){return{container:!0,dot:!this.hasNumber,number:this.hasNumber,[`variant-${this.variant}`]:!0,[`size-${this.size}`]:!0}}get contentTemplate(){return this.hasNumber?o.html`${this.number}`:o.nothing}render(){return o.html` <div class=${c.classMap(this.classes)}>${this.contentTemplate}</div> `}};exports.DsBadge.styles=[g.commonStyles,h.cupraDiagonalStyles];s([m.property({type:Number})],exports.DsBadge.prototype,"number",2);s([m.property({type:String})],exports.DsBadge.prototype,"variant",2);s([m.property({type:String})],exports.DsBadge.prototype,"size",2);exports.DsBadge=s([l.customUiKitElement("ds-badge")],exports.DsBadge);
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.cjs");const n=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),r=require("../base/UiKitElement.cjs"),i=require("../../decorators/customUiKitElement.cjs"),a=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.cjs");const o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/if-defined.cjs");const s=require("./styles/common.styles.cjs");var c,l=(c=class extends r.UiKitElement{constructor(...e){super(...e),this.variant=`base`,this.size=`large`}get hasNumber(){return typeof this.number==`number`&&!Number.isNaN(this.number)}get classes(){return{container:!0,dot:!this.hasNumber,number:this.hasNumber,[`variant-${this.variant}`]:!0,[`size-${this.size}`]:!0}}get badgeAriaLabel(){return this.hasNumber?`${this.number} notifications`:void 0}get contentTemplate(){return this.hasNumber?e.x`${this.number}`:e.E}render(){return e.x` <div class=${a.e(this.classes)} aria-label=${o.o(this.badgeAriaLabel)}>${this.contentTemplate}</div> `}},c.styles=[s.commonStyles],c);n.__decorate([t.n({type:Number})],l.prototype,`number`,void 0),n.__decorate([t.n({type:String})],l.prototype,`variant`,void 0),n.__decorate([t.n({type:String})],l.prototype,`size`,void 0),l=n.__decorate([i.customUiKitElement(`ds-badge`)],l);

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

@@ -1,5 +1,47 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../utils/cssWithTokens.cjs"),s=e.cssWithTokens`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
     :host {
         display: inline-flex;
     }
-`;exports.commonStyles=s;
+
+    .container {
+        border-radius: var(--ds-border-radius-full);
+    }
+
+    .number {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-family: var(--ds-typography-family-primary);
+        font-weight: 400;
+    }
+
+    .number.size-large {
+        width: var(--ds-sizing-24);
+        height: var(--ds-sizing-24);
+        font-size: var(--ds-typography-size-body-s);
+        line-height: var(--ds-typography-height-body-s);
+    }
+
+    .number.size-medium {
+        width: var(--ds-sizing-16);
+        height: var(--ds-sizing-16);
+        font-size: var(--ds-typography-size-body-xs);
+        line-height: var(--ds-typography-height-body-xs);
+    }
+
+    .variant-base {
+        color: var(--ds-color-text-default);
+        background-color: var(--ds-color-bg-default);
+    }
+
+    .variant-inverted {
+        background-color: var(--ds-color-bg-default-inverted);
+        color: var(--ds-color-text-default-inverted);
+    }
+
+    .dot {
+        width: var(--ds-sizing-08);
+        height: var(--ds-sizing-08);
+        background-color: var(--ds-color-surface-feedback-error);
+    }
+`;exports.commonStyles=t;

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

@@ -0,0 +1,19 @@
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),n=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.cjs");const r=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),i=require("../base/UiKitElement.cjs"),a=require("../../decorators/customUiKitElement.cjs"),o=require("../../utils/booleanConverter.cjs"),s=require("../../utils/uiKitHtml.cjs"),c=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.cjs"),require("../ds-icon-button/ds-icon-button.cjs");const l=require("./styles/common.styles.cjs");var u,d=(u=class extends i.UiKitElement{constructor(...e){super(...e),this.orientation=`horizontal`,this.showClose=!0,this._show=void 0,this._showState=!0}get show(){return this._show??this._showState}set show(e){this._show=e}handleClose(){let e=new CustomEvent(`banner:close`,{bubbles:!0,composed:!0});this.dispatchEvent(e),this._showState=!1}get containerClasses(){return{container:!0,[this.orientation??`horizontal`]:!0}}get closeButtonTemplate(){return this.showClose?s.uiKitHtml`<ds-icon-button
+            class="close-button"
+            data-aria-label="close"
+            @click=${this.handleClose}
+            icon-name="cross"
+            variant="tertiary"
+            size="medium"
+        ></ds-icon-button>`:e.E}render(){return this.show?e.x`
+            <div class=${c.e(this.containerClasses)}>
+                <div class="banner" part="banner">
+                    <slot name="image"></slot>
+                    <div class="content-actions">
+                        <slot></slot>
+                        <slot name="actions"></slot>
+                    </div>
+                </div>
+                ${this.closeButtonTemplate}
+            </div>
+        `:e.E}},u.styles=[l.bannerStyles],u);r.__decorate([t.n({type:String})],d.prototype,`orientation`,void 0),r.__decorate([t.n({attribute:`show-close`,type:Boolean,converter:o.booleanConverter,reflect:!0})],d.prototype,`showClose`,void 0),r.__decorate([t.n({type:Boolean,attribute:`show`,converter:o.booleanConverter})],d.prototype,`_show`,void 0),r.__decorate([n.r()],d.prototype,`_showState`,void 0),d=r.__decorate([a.customUiKitElement(`ds-banner`)],d);

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

@@ -0,0 +1,77 @@
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
+    :host {
+        display: content;
+    }
+
+    .container {
+        display: flex;
+        align-items: flex-start;
+        position: var(--ui-kit-banner-position, static);
+    }
+
+    .container.horizontal {
+        width: var(--ui-kit-banner-width, 100%);
+        flex-direction: row;
+    }
+
+    .container.vertical {
+        width: var(--ui-kit-banner-width, fit-content);
+        flex-direction: column;
+    }
+
+    .banner {
+        display: flex;
+        box-sizing: border-box;
+        flex: 1 1 auto;
+        min-width: 0;
+    }
+
+    .container.horizontal .banner {
+        flex-direction: row;
+    }
+
+    .container.vertical .banner {
+        flex-direction: column;
+    }
+
+    .content-actions {
+        display: flex;
+        flex: 1 1 auto;
+        min-width: 0;
+        flex-direction: column;
+    }
+
+    slot[name='image']::slotted(*) {
+        display: block;
+    }
+
+    slot:not([name]) {
+        display: block;
+        flex: 0 0 auto;
+        min-width: 0;
+    }
+
+    slot[name='actions'] {
+        display: flex;
+        flex-wrap: wrap;
+        flex-shrink: 0;
+    }
+
+    .container.horizontal slot[name='actions'] {
+        flex-direction: row;
+        justify-content: flex-end;
+    }
+
+    .container.vertical slot[name='actions'] {
+        flex-direction: column-reverse;
+    }
+
+    .close-button {
+        flex-shrink: 0;
+    }
+
+    .container.vertical .close-button {
+        order: -1;
+        align-self: flex-end;
+    }
+`;exports.bannerStyles=t;

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

@@ -1,11 +1,11 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../base/UiKitElement.cjs"),u=require("../../decorators/customUiKitElement.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const n=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 d=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),p=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),m=require("./styles/common.styles.cjs");var v=Object.defineProperty,h=Object.getOwnPropertyDescriptor,l=(s,e,i,r)=>{for(var t=r>1?void 0:r?h(e,i):e,a=s.length-1,c;a>=0;a--)(c=s[a])&&(t=(r?c(e,i,t):c(t))||t);return r&&t&&v(e,i,t),t};exports.DsBasicCard=class extends o.UiKitElement{constructor(){super(...arguments),this.variant="default"}get classes(){return{container:!0,subgrid:!0,[this.variant]:!!this.variant}}handleClick(){this.dispatchEvent(new Event("ds-basic-card:click",{bubbles:!0,composed:!0}))}render(){return n.html`
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.cjs");const n=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),r=require("../base/UiKitElement.cjs"),i=require("../../decorators/customUiKitElement.cjs"),a=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.cjs");const o=require("./styles/common.styles.cjs");var s,c=(s=class extends r.UiKitElement{constructor(...e){super(...e),this.variant=`default`}get classes(){return{container:!0,subgrid:!0,[this.variant]:!!this.variant}}handleClick(){this.dispatchEvent(new Event(`ds-basic-card:click`,{bubbles:!0,composed:!0}))}render(){return e.x`
             <article
                 part="container"
-                class="${p.classMap(this.classes)}"
+                class="${a.e(this.classes)}"
                 @click=${this.handleClick}
                 data-testid="ds-basic-card-container"
             >
-                <div>${this.variant==="featured"?n.html`<slot name="featured-text"></slot>`:n.nothing}</div>
+                ${this.variant===`featured`?e.x`<div><slot name="featured-text"></slot></div>`:e.E}
                 <slot></slot>
             </article>
-        `}};exports.DsBasicCard.styles=[m.commonStyles];l([d.property({type:String})],exports.DsBasicCard.prototype,"variant",2);exports.DsBasicCard=l([u.customUiKitElement("ds-basic-card")],exports.DsBasicCard);
+        `}},s.styles=[o.commonStyles],s);n.__decorate([t.n({type:String})],c.prototype,`variant`,void 0),c=n.__decorate([i.customUiKitElement(`ds-basic-card`)],c);

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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../utils/cssQueries.cjs");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 r=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),s=r.css`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
     :host {
         row-gap: 0;
         display: grid;
@@ -19,12 +19,5 @@
 
     ::slotted([slot='featured-text']) {
         pointer-events: none;
-        padding: var(--dg-spacing-s-5, 8px) var(--dg-spacing-m-2, 16px);
     }
-
-    ${e.cssQueries.m} {
-        ::slotted([slot='featured-text']) {
-            padding: var(--dg-spacing-s-5, 8px) var(--dg-spacing-m-4, 24px);
-        }
-    }
-`;exports.commonStyles=s;
+`;exports.commonStyles=t;

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

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../base/UiKitElement.cjs"),l=require("../../decorators/customUiKitElement.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const n=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 o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),p=require("./styles/common.styles.cjs");var m=Object.getOwnPropertyDescriptor,u=(r,a,d,s)=>{for(var e=s>1?void 0:s?m(a,d):a,t=r.length-1,i;t>=0;t--)(i=r[t])&&(e=i(e)||e);return e};exports.DsBasicCardHeader=class extends c.UiKitElement{get dividerTemplate(){return this.componentFactory.createDivider({class:"divider",variant:"secondary"})}get classes(){return{"header-wrapper":!0}}render(){return n.html`
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),n=require("../base/UiKitElement.cjs"),r=require("../../decorators/customUiKitElement.cjs"),i=require("../../utils/uiKitHtml.cjs"),a=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.cjs"),require("../ds-divider/ds-divider.cjs");const o=require("./styles/common.styles.cjs");var s,c=(s=class extends n.UiKitElement{get dividerTemplate(){return i.uiKitHtml`<ds-divider class="divider" variant="secondary"></ds-divider>`}get classes(){return{"header-wrapper":!0}}render(){return e.x`
             <header
                 part="header-wrapper"
-                class="${o.classMap(this.classes)}"
+                class="${a.e(this.classes)}"
                 data-testid="ds-basic-card-header-container"
             >
                 <div class="header-content">
@@ -14,4 +14,4 @@
                 <slot name="sub-header" part="sub-header"></slot>
                 ${this.dividerTemplate}
             </header>
-        `}};exports.DsBasicCardHeader.styles=[p.commonStyles];exports.DsBasicCardHeader=u([l.customUiKitElement("ds-basic-card-header")],exports.DsBasicCardHeader);
+        `}},s.styles=[o.commonStyles],s);c=t.__decorate([r.customUiKitElement(`ds-basic-card-header`)],c);

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

@@ -1,20 +1,14 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../utils/cssQueries.cjs");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 i=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),s=i.css`
-    :host {
-        padding: var(--dg-spacing-m-2, 16px) var(--dg-spacing-m-2, 16px) 0px var(--dg-spacing-m-2, 16px);
-    }
-
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
     .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;
     }
@@ -22,7 +16,6 @@
     .title-wrapper {
         display: flex;
         flex-direction: column;
-        gap: var(--dg-spacing-s-5, 8px);
         width: 100%;
     }
 
@@ -32,7 +25,6 @@
 
     ::slotted([slot='sub-header']) {
         display: flex;
-        gap: var(--dg-spacing-m-1, 12px);
         flex-direction: column;
     }
 
@@ -40,10 +32,4 @@
         margin-top: auto;
         width: 100%;
     }
-
-    ${e.cssQueries.m} {
-        :host {
-            padding: var(--dg-spacing-m-2, 16px) var(--dg-spacing-m-4, 24px) 0px var(--dg-spacing-m-4, 24px);
-        }
-    }
-`;exports.commonStyles=s;
+`;exports.commonStyles=t;

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

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../base/UiKitElement.cjs"),m=require("../../decorators/customUiKitElement.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const n=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 o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),u=require("./styles/common.styles.cjs");var d=Object.getOwnPropertyDescriptor,g=(s,t,c,a)=>{for(var e=a>1?void 0:a?d(t,c):t,r=s.length-1,i;r>=0;r--)(i=s[r])&&(e=i(e)||e);return e};exports.DsBasicCardImage=class extends l.UiKitElement{get classes(){return{"image-wrapper":!0}}render(){return n.html`
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),n=require("../base/UiKitElement.cjs"),r=require("../../decorators/customUiKitElement.cjs"),i=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.cjs");const a=require("./styles/common.styles.cjs");var o,s=(o=class extends n.UiKitElement{get classes(){return{"image-wrapper":!0}}render(){return e.x`
             <div
                 part="image-wrapper"
-                class="${o.classMap(this.classes)}"
+                class="${i.e(this.classes)}"
                 data-testid="ds-basic-card-image-container"
             >
                <slot></slot>
             </div>
-        `}};exports.DsBasicCardImage.styles=[u.commonStyles];exports.DsBasicCardImage=g([m.customUiKitElement("ds-basic-card-image")],exports.DsBasicCardImage);
+        `}},o.styles=[a.commonStyles],o);s=t.__decorate([r.customUiKitElement(`ds-basic-card-image`)],s);

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

@@ -1,6 +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"),t=e.css`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
     :host {
         height: 100%;
         width: 100%;
     }
-`;exports.commonStyles=t;
+`;exports.commonStyles=t;

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

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../base/UiKitElement.cjs"),u=require("../../decorators/customUiKitElement.cjs"),d=require("../../utils/booleanConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const a=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 l=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),v=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),m=require("./styles/common.styles.cjs");var y=Object.defineProperty,h=Object.getOwnPropertyDescriptor,c=(i,t,s,r)=>{for(var e=r>1?void 0:r?h(t,s):t,o=i.length-1,n;o>=0;o--)(n=i[o])&&(e=(r?n(t,s,e):n(e))||e);return r&&e&&y(t,s,e),e};exports.DsBasicCardSection=class extends p.UiKitElement{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 a.html`
-            <div part="container" class=${v.classMap(this.classes)} data-testid="ds-basic-card-section-container">
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.cjs");const n=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),r=require("../base/UiKitElement.cjs"),i=require("../../decorators/customUiKitElement.cjs"),a=require("../../utils/booleanConverter.cjs"),o=require("../../utils/uiKitHtml.cjs"),s=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.cjs"),require("../ds-divider/ds-divider.cjs");const c=require("./styles/common.styles.cjs");var l,u=(l=class extends r.UiKitElement{constructor(...e){super(...e),this.withDivider=!0,this.centered=!0}get dividerTemplate(){return o.uiKitHtml`<ds-divider class="divider" variant="secondary"></ds-divider>`}get classes(){return{container:!0,centered:this.centered}}render(){return e.x`
+            <div part="container" class=${s.e(this.classes)} data-testid="ds-basic-card-section-container">
                 <slot></slot>
             </div>
-            ${this.withDivider?this.dividerTemplate:a.nothing}
-        `}};exports.DsBasicCardSection.styles=[m.commonStyles];c([l.property({type:Boolean,converter:d.booleanConverter})],exports.DsBasicCardSection.prototype,"withDivider",2);c([l.property({type:Boolean,converter:d.booleanConverter})],exports.DsBasicCardSection.prototype,"centered",2);exports.DsBasicCardSection=c([u.customUiKitElement("ds-basic-card-section")],exports.DsBasicCardSection);
+            ${this.withDivider?this.dividerTemplate:e.E}
+        `}},l.styles=[c.commonStyles],l);n.__decorate([t.n({type:Boolean,converter:a.booleanConverter})],u.prototype,`withDivider`,void 0),n.__decorate([t.n({type:Boolean,converter:a.booleanConverter})],u.prototype,`centered`,void 0),u=n.__decorate([i.customUiKitElement(`ds-basic-card-section`)],u);

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

@@ -1,25 +1,16 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../utils/cssQueries.cjs");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 s=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),i=s.css`
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
     :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;
     }
-
-    ${e.cssQueries.m} {
-        :host {
-            padding: var(--dg-spacing-s-1, 0px) var(--dg-spacing-m-4, 24px);
-        }
-    }
-`;exports.commonStyles=i;
+`;exports.commonStyles=t;

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

@@ -0,0 +1,37 @@
+const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");const t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.cjs");const n=require("../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.cjs"),r=require("../base/UiKitElement.cjs"),i=require("../../decorators/customUiKitElement.cjs");require("../ds-icon/ds-icon.cjs");const a=require("../../utils/uiKitHtml.cjs"),o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/if-defined.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/if-defined.cjs"),require("../ds-tooltip/ds-tooltip.cjs");const s=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/static.cjs");require("../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/static-html.cjs"),require("../ds-breadcrumbs-item/ds-breadcrumbs-item.cjs");const c=require("./styles/common.styles.cjs");var l,u=[{below:768,maxItems:3},{below:1024,maxItems:4}],d=5,f=(l=class extends r.UiKitElement{constructor(...e){super(...e),this.items=[],this.maxItems=d,this.itemTag=`ds-breadcrumbs-item`,this.onResize=()=>{let e=u.find(({below:e})=>window.innerWidth<e);this.maxItems=(e==null?void 0:e.maxItems)??d}}async firstUpdated(e){super.firstUpdated(e),this.onResize()}connectedCallback(){super.connectedCallback(),window.addEventListener(`resize`,this.onResize)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener(`resize`,this.onResize)}handleSlotChange(e){let t=e.target.assignedElements({flatten:!0}).filter(e=>e.tagName.toLowerCase().startsWith(`ds-breadcrumbs-item`));t.length>0&&(this.itemTag=t[0].tagName.toLowerCase()),this.items=t.map(e=>{var t,n;return{label:e.getAttribute(`label`)||((t=e.textContent)==null?void 0:t.trim())||``,href:e.getAttribute(`href`)||((n=e.querySelector(`[slot="item"]`))==null?void 0:n.getAttribute(`href`))||void 0,disabled:e.hasAttribute(`disabled`),loading:e.hasAttribute(`loading`),selected:e.hasAttribute(`selected`)}})}get separatorIcon(){return a.uiKitHtml`<ds-icon class="separator-icon" icon-name="arrow-right" size="24"></ds-icon>`}itemTemplate(t,n){let r=t.selected,i=s.s(this.itemTag),a=r||t.disabled||!t.href?s.u`<span slot="item">${t.label}</span>`:s.u`<a href=${t.href} slot="item">${t.label}</a>`;return s.u`<li class="breadcrumb-list-item">
+            <${i}
+                ?selected=${r}
+                ?disabled=${t.disabled}
+                ?loading=${t.loading}
+            >
+                ${a}
+            </${i}>
+            ${n?e.E:this.separatorIcon}
+        </li>`}get slotTemplate(){return s.u`<slot @slotchange=${this.handleSlotChange} style="display: none;"></slot>`}get overflowMenuTemplate(){return s.u`<ul class="overflow-menu" role="menu">
+            ${this.items.slice(1,this.items.length-(this.maxItems-2)).map(e=>s.u`
+                    <li class="overflow-menu-item" role="none">
+                        <a href=${o.o(e.href)} class="overflow-menu-link" role="menuitem">${e.label}</a>
+                    </li>
+                `)}
+        </ul>`}get overflowTriggerTemplate(){return s.u`<button class="overflow-trigger">
+            <span class="overflow-label">...</span>
+        </button>`}get tooltipTemplate(){return a.uiKitHtml`<ds-tooltip class="breadcrumbs-tooltip">
+            ${this.overflowTriggerTemplate}
+            <div slot="content">${this.overflowMenuTemplate}</div>
+        </ds-tooltip>`}get listTemplate(){let{items:e,maxItems:t}=this;if(e.length<=t)return e.map((t,n)=>this.itemTemplate(t,n===e.length-1));let n=e.slice(e.length-(t-2));return s.u`
+            ${this.itemTemplate(e[0],!1)}
+            <li class="breadcrumb-list-item">
+                <div class="overflow-item-wrapper">
+                    ${this.tooltipTemplate}
+                    ${this.separatorIcon}
+                </div>
+            </li>
+            ${n.map((e,t)=>this.itemTemplate(e,t===n.length-1))}
+        `}render(){return s.u`
+            ${this.slotTemplate}
+            <nav class="container" aria-label="Breadcrumb">
+                <ol class="breadcrumb-list">
+                    ${this.listTemplate}
+                </ol>
+            </nav>
+        `}},l.styles=[c.commonStyles],l);n.__decorate([t.r()],f.prototype,`items`,void 0),n.__decorate([t.r()],f.prototype,`maxItems`,void 0),n.__decorate([t.r()],f.prototype,`itemTag`,void 0),f=n.__decorate([i.customUiKitElement(`ds-breadcrumbs`)],f);

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

@@ -0,0 +1,107 @@
+const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs");require("../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.cjs");var t=e.i`
+    .breadcrumb-list {
+        display: flex;
+        align-items: center;
+        list-style: none;
+        padding: 0;
+        margin: 0;
+        flex-wrap: nowrap;
+        gap: var(--ds-spacing-s-3);
+        width: 100%;
+    }
+
+    .breadcrumb-list-item {
+        display: flex;
+        align-items: center;
+        gap: var(--ds-spacing-s-3);
+    }
+
+    .separator-icon {
+        --ui-kit-icon-color: var(--ds-color-text-default-subtlest);
+    }
+
+    .breadcrumbs-tooltip::part(container) {
+        max-height: none;
+        max-width: none;
+        overflow: visible;
+        padding: 0;
+    }
+
+    .overflow-item-wrapper {
+        display: inline-flex;
+        align-items: center;
+        gap: var(--ds-spacing-s-3);
+    }
+
+    .overflow-trigger {
+        background: none;
+        border: none;
+        padding: 0;
+        cursor: pointer;
+
+        &:focus-visible {
+            outline-offset: var(--ds-border-radius-xxs);
+            border-radius: var(--ds-border-radius-xxs);
+            outline: var(--ds-border-width-l) solid var(--ds-color-border-focus-ring);
+        }
+
+        &:disabled {
+            cursor: default;
+
+            .overflow-label {
+                color: var(--ds-color-text-disabled);
+            }
+        }
+    }
+
+    .overflow-label {
+        color: var(--ds-color-text-default-subtlest);
+        font-family: var(--ds-typography-family-primary);
+        font-size: var(--ds-typography-size-body-l);
+        line-height: var(--ds-typography-height-body-l);
+        font-weight: var(--ds-typography-weight-body-secondary);
+        letter-spacing: var(--ds-typography-letter-spacing-base);
+    }
+
+    .overflow-menu {
+        display: flex;
+        flex-direction: column;
+        padding: 0;
+        margin: 0;
+    }
+
+    .overflow-menu-item {
+        display: flex;
+        min-height: 40px;
+        padding: var(--ds-spacing-s-5) var(--ds-spacing-m-1);
+        align-items: center;
+        gap: var(--ds-spacing-s-5);
+        align-self: stretch;
+        border-radius: var(--ds-border-radius-none);
+        border-bottom: 1px solid var(--ds-color-border-default-subtle);
+        text-decoration: none;
+
+        &:hover {
+            cursor: pointer;
+            background: var(--ds-color-control-bg-hover);
+        }
+
+        &:focus,
+        &:focus-visible {
+            background: var(--ds-color-control-bg-hover);
+            outline: var(--ds-border-width-l) solid var(--ds-color-border-focus-ring);
+        }
+    }
+
+    .overflow-menu-link {
+        overflow: hidden;
+        color: var(--ds-color-text-default);
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        font: var(--ds-typography-weight-body-secondary) var(--ds-typography-size-body-m) /
+            var(--ds-typography-height-body-m) var(--ds-typography-family-primary);
+        letter-spacing: var(--ds-typography-letter-spacing-base);
+        margin: 0;
+        text-decoration: none;
+    }
+`;exports.commonStyles=t;