@cupra/ui-kit 2.0.0-canary.237 → 2.0.0-canary.239

package/dist-react/cjs/components/ds-toggle-switch/styles/cupra-diagonal.styles.cjs

@@ -110,14 +110,14 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
         transform: translateY(-50%);
         border-radius: var(--ds-border-radius-full, 100000px);
         transition:
-            left 150ms ease,
+            inset-inline-start 150ms ease,
             width 150ms ease,
             height 150ms ease;
-        left: var(--ui-kit-private-dot-gap);
+        inset-inline-start: var(--ui-kit-private-dot-gap);
     }
 
     :host([data-ui-kit-theme='cupra-diagonal']) .container.checked .dot {
-        left: calc(100% - var(--ui-kit-private-dot-gap) - var(--ui-kit-private-dot-size));
+        inset-inline-start: calc(100% - var(--ui-kit-private-dot-gap) - var(--ui-kit-private-dot-size));
     }
 
     :host([data-ui-kit-theme='cupra-diagonal']) .medium .dot {

package/dist-react/cjs/components/ds-toggle-switch/styles/seat.styles.cjs

@@ -110,14 +110,14 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
         transform: translateY(-50%);
         border-radius: var(--ds-border-radius-full, 100000px);
         transition:
-            left 150ms ease,
+            inset-inline-start 150ms ease,
             width 150ms ease,
             height 150ms ease;
-        left: var(--ui-kit-private-dot-gap);
+        inset-inline-start: var(--ui-kit-private-dot-gap);
     }
 
     :host([data-ui-kit-theme='seat']) .container.checked .dot {
-        left: calc(100% - var(--ui-kit-private-dot-gap) - var(--ui-kit-private-dot-size));
+        inset-inline-start: calc(100% - var(--ui-kit-private-dot-gap) - var(--ui-kit-private-dot-size));
     }
 
     :host([data-ui-kit-theme='seat']) .medium .dot {

package/dist-react/cjs/components/ds-tooltip/ds-tooltip.cjs

@@ -43,7 +43,7 @@ const e=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/l
                 aria-controls=${this.disablePressListener?e.nothing:this.tooltipId}
                 aria-expanded=${this.disablePressListener?e.nothing:String(this.show)}
                 aria-describedby=${this.show?this.tooltipId:e.nothing}
-                aria-label=${this.disablePressListener?e.nothing:`open tooltip`}
+                aria-label=${this.disablePressListener?e.nothing:this.dataAriaLabel||`open tooltip`}
                 @mouseover="${this.handleAnchorMouseOver}"
                 @mouseout="${this.handleAnchorMouseOut}"
                 @pointerdown="${this.handleAnchorPointerDown}"
@@ -53,4 +53,4 @@ const e=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/l
                 <slot></slot>
             </div>
             ${this.tooltipTemplate}
-        `}},v=(_.styles=[f.commonStyles,p.cupraDiagonalStyles,g.seatStyles,m.cupraStyles,h.seatLegacyStyles],_);a.default([t.property({type:String,reflect:!0})],v.prototype,`mode`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter})],v.prototype,`show`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter,attribute:`disable-hover-listener`})],v.prototype,`disableHoverListener`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter,attribute:`disable-focus-listener`})],v.prototype,`disableFocusListener`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter,attribute:`disable-press-listener`})],v.prototype,`disablePressListener`,void 0),a.default([n.state()],v.prototype,`tooltopPlacement`,void 0),a.default([n.state()],v.prototype,`tooltipId`,void 0),a.default([r.query(`.container`)],v.prototype,`container`,void 0),a.default([r.query(`#button`)],v.prototype,`anchorContainer`,void 0),a.default([r.query(`#arrow`)],v.prototype,`arrow`,void 0),a.default([i.queryAssignedElements({slot:``})],v.prototype,`anchorElements`,void 0),a.default([i.queryAssignedElements({slot:`header`})],v.prototype,`headerElements`,void 0),a.default([i.queryAssignedElements({slot:`close-button`})],v.prototype,`closeButtonElements`,void 0),a.default([i.queryAssignedElements({slot:`content`})],v.prototype,`contentElements`,void 0),v=a.default([s.customUiKitElement(`ds-tooltip`)],v),Object.defineProperty(exports,"DsTooltip",{enumerable:!0,get:function(){return v}});
+        `}},v=(_.styles=[f.commonStyles,p.cupraDiagonalStyles,g.seatStyles,m.cupraStyles,h.seatLegacyStyles],_);a.default([t.property({type:String,attribute:`data-aria-label`})],v.prototype,`dataAriaLabel`,void 0),a.default([t.property({type:String,reflect:!0})],v.prototype,`mode`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter})],v.prototype,`show`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter,attribute:`disable-hover-listener`})],v.prototype,`disableHoverListener`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter,attribute:`disable-focus-listener`})],v.prototype,`disableFocusListener`,void 0),a.default([t.property({type:Boolean,reflect:!0,converter:c.booleanConverter,attribute:`disable-press-listener`})],v.prototype,`disablePressListener`,void 0),a.default([n.state()],v.prototype,`tooltopPlacement`,void 0),a.default([n.state()],v.prototype,`tooltipId`,void 0),a.default([r.query(`.container`)],v.prototype,`container`,void 0),a.default([r.query(`#button`)],v.prototype,`anchorContainer`,void 0),a.default([r.query(`#arrow`)],v.prototype,`arrow`,void 0),a.default([i.queryAssignedElements({slot:``})],v.prototype,`anchorElements`,void 0),a.default([i.queryAssignedElements({slot:`header`})],v.prototype,`headerElements`,void 0),a.default([i.queryAssignedElements({slot:`close-button`})],v.prototype,`closeButtonElements`,void 0),a.default([i.queryAssignedElements({slot:`content`})],v.prototype,`contentElements`,void 0),v=a.default([s.customUiKitElement(`ds-tooltip`)],v),Object.defineProperty(exports,"DsTooltip",{enumerable:!0,get:function(){return v}});

package/dist-react/cjs/components/ds-tooltip/styles/common.styles.cjs

@@ -6,11 +6,11 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
     }
 
     .title {
-        text-align: left;
+        text-align: start;
     }
 
     .body {
-        text-align: left;
+        text-align: start;
     }
 
     .buttons-container {
@@ -20,7 +20,7 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
     }
 
     ::slotted([slot='content']) {
-        text-align: left;
+        text-align: start;
     }
 
     .container {
@@ -74,7 +74,7 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
 
     ::slotted([slot='close-button']) {
         flex: 0 0 auto;
-        margin-left: auto;
+        margin-inline-start: auto;
     }
 
     .arrow {

package/dist-react/cjs/components/ds-value-unit/ds-value-unit.cjs

@@ -1,10 +1,10 @@
 const e=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 t=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.cjs");const n=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),r=require("../base/UiKitElement.cjs"),i=require("../../decorators/customUiKitElement.cjs"),a=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 o=require("./styles/common.styles.cjs"),s=require("./styles/cupra-diagonal.styles.cjs"),c=require("./styles/cupra.styles.cjs"),l=require("./styles/seat.styles.cjs");var u=class extends r.UiKitElement{constructor(...e){super(...e),this.size=`medium`,this.valueWeight=`regular`,this.unitWeight=`light`}render(){let t={value:!0,[`size-${this.size}`]:!0,[`value-weight-${this.valueWeight}`]:!0},n={unit:!0,[`size-${this.size}`]:!0,[`unit-weight-${this.unitWeight}`]:!0};return e.html`
             <div class="container" part="container">
                 <span class=${a.classMap(t)} part="value">
-                    <slot name="value"></slot>
+                    <bdi><slot name="value"></slot></bdi>
                 </span>
                 <span class=${a.classMap(n)} part="unit">
-                    <slot name="unit"></slot>
+                    <bdi><slot name="unit"></slot></bdi>
                 </span>
             </div>
         `}},d=(u.styles=[o.commonStyles,s.cupraDiagonalStyles,l.seatStyles,c.cupraStyles],u);n.default([t.property({type:String})],d.prototype,`size`,void 0),n.default([t.property({type:String,attribute:`value-weight`})],d.prototype,`valueWeight`,void 0),n.default([t.property({type:String,attribute:`unit-weight`})],d.prototype,`unitWeight`,void 0),d=n.default([i.customUiKitElement(`ds-value-unit`)],d),Object.defineProperty(exports,"DsValueUnit",{enumerable:!0,get:function(){return d}});

package/dist-react/cjs/decorators/customUiKitElement.cjs

@@ -1 +1 @@
-const e=require("../utils/version.cjs");function t(t){return function(n){var r,i,a;if(!(n!=null&&n.prototype))throw TypeError(`@customUiKitElement requires a class that extends HTMLElement.`);let o=`${t}${e.VERSION_TAG_SUFFIX}`;(r=globalThis)!=null&&(r=r.customElements)!=null&&r.get(o)||(i=globalThis)==null||(i=i.customElements)==null||(a=i.define)==null||a.call(i,o,class extends n{connectedCallback(){var e;(e=n.prototype.connectedCallback)==null||e.call(this),this.setAttribute(`data-ui-kit-version`,`2.0.0-canary.237`),this.setAttribute(`data-ui-kit-component-name`,t)}})}}exports.customUiKitElement=t;
+const e=require("../utils/version.cjs");function t(t){return function(n){var r,i,a;if(!(n!=null&&n.prototype))throw TypeError(`@customUiKitElement requires a class that extends HTMLElement.`);let o=`${t}${e.VERSION_TAG_SUFFIX}`;(r=globalThis)!=null&&(r=r.customElements)!=null&&r.get(o)||(i=globalThis)==null||(i=i.customElements)==null||(a=i.define)==null||a.call(i,o,class extends n{connectedCallback(){var e;(e=n.prototype.connectedCallback)==null||e.call(this),this.setAttribute(`data-ui-kit-version`,`2.0.0-canary.239`),this.setAttribute(`data-ui-kit-component-name`,t)}})}}exports.customUiKitElement=t;

package/dist-react/cjs/utils/IconsManager.cjs

@@ -1 +1 @@
-const e=require("../core/theme.constants.cjs"),t=require("./PubSub.cjs");var n=class{constructor(){this.icons={},this.handleChangeTheme=e=>{if(this.theme===e)return;this.theme=e;let t=Object.keys(this.icons);this.icons={},t.forEach(e=>this.fetchIcon(e))},this.fetchIcon=async(t,n={})=>{var r;let i=typeof sessionStorage<`u`?(r=sessionStorage)==null?void 0:r.getItem(e.THEME_STORAGE_KEY):null;!this.theme&&i&&(this.theme=i);let a=this.icons[t];if(a)return await a;let o=this.loadIcon(t,n).catch(e=>{throw delete this.icons[t],e});return this.icons[t]=o,o},this.loadIcon=(e,{cache:t=`force-cache`,...n})=>!this.theme||typeof fetch>`u`?Promise.resolve(`<svg class="ds-icon"></svg>`):fetch(`https://ds-assets.cupra.com/icons/${this.theme}/${e}.svg`,{cache:t,...n}).then(e=>e.text()).catch(t=>{if((t==null?void 0:t.name)===`AbortError`)throw t;return console.error(`Failed to fetch icon "${e}":`,t),``}),t.pubSub.subscribe(`theme`,this.handleChangeTheme)}},r=Symbol.for(`@cupra/ui-kit/icons-manager/2.0.0-canary.237`),i=globalThis,a=i[r];a||(a=new n,Object.defineProperty(i,r,{value:a,writable:!1,configurable:!1,enumerable:!1}));var o=a;exports.iconsManager=o;
+const e=require("../core/theme.constants.cjs"),t=require("./PubSub.cjs");var n=class{constructor(){this.icons={},this.handleChangeTheme=e=>{if(this.theme===e)return;this.theme=e;let t=Object.keys(this.icons);this.icons={},t.forEach(e=>this.fetchIcon(e))},this.fetchIcon=async(t,n={})=>{var r;let i=typeof sessionStorage<`u`?(r=sessionStorage)==null?void 0:r.getItem(e.THEME_STORAGE_KEY):null;!this.theme&&i&&(this.theme=i);let a=this.icons[t];if(a)return await a;let o=this.loadIcon(t,n).catch(e=>{throw delete this.icons[t],e});return this.icons[t]=o,o},this.loadIcon=(e,{cache:t=`force-cache`,...n})=>!this.theme||typeof fetch>`u`?Promise.resolve(`<svg class="ds-icon"></svg>`):fetch(`https://ds-assets.cupra.com/icons/${this.theme}/${e}.svg`,{cache:t,...n}).then(e=>e.text()).catch(t=>{if((t==null?void 0:t.name)===`AbortError`)throw t;return console.error(`Failed to fetch icon "${e}":`,t),``}),t.pubSub.subscribe(`theme`,this.handleChangeTheme)}},r=Symbol.for(`@cupra/ui-kit/icons-manager/2.0.0-canary.239`),i=globalThis,a=i[r];a||(a=new n,Object.defineProperty(i,r,{value:a,writable:!1,configurable:!1,enumerable:!1}));var o=a;exports.iconsManager=o;

package/dist-react/cjs/utils/PubSub.cjs

@@ -1 +1 @@
-var e=class{constructor(){this.subscribers={},this.lastPublishedData={}}subscribe(e,t){return this.subscribers[e]||(this.subscribers[e]=[]),this.subscribers[e].push(t),this.lastPublishedData[e]}unsubscribe(e,t){this.subscribers[e]&&(this.subscribers[e]=this.subscribers[e].filter(e=>e!==t))}publish(e,t){this.lastPublishedData[e]=t,this.subscribers[e]&&this.subscribers[e].forEach(n=>{try{n(t)}catch(t){console.error(`Error in subscriber for event "${e}":`,t)}})}},t=Symbol.for(`@cupra/ui-kit/pubsub/2.0.0-canary.237`),n=globalThis,r=n[t];r||(r=new e,Object.defineProperty(n,t,{value:r,writable:!1,configurable:!1,enumerable:!1}));var i=r;exports.PubSub=e,exports.pubSub=i;
+var e=class{constructor(){this.subscribers={},this.lastPublishedData={}}subscribe(e,t){return this.subscribers[e]||(this.subscribers[e]=[]),this.subscribers[e].push(t),this.lastPublishedData[e]}unsubscribe(e,t){this.subscribers[e]&&(this.subscribers[e]=this.subscribers[e].filter(e=>e!==t))}publish(e,t){this.lastPublishedData[e]=t,this.subscribers[e]&&this.subscribers[e].forEach(n=>{try{n(t)}catch(t){console.error(`Error in subscriber for event "${e}":`,t)}})}},t=Symbol.for(`@cupra/ui-kit/pubsub/2.0.0-canary.239`),n=globalThis,r=n[t];r||(r=new e,Object.defineProperty(n,t,{value:r,writable:!1,configurable:!1,enumerable:!1}));var i=r;exports.PubSub=e,exports.pubSub=i;

package/dist-react/cjs/utils/closestAttribute/closestAttribute.cjs

@@ -0,0 +1 @@
+function e(e,t){let n=e;for(;n;){let e=n.getAttribute(t);if(e)return e;n=n.parentElement??n.getRootNode().host??null}return null}exports.closestAttribute=e;

package/dist-react/cjs/utils/formatNumber/formatNumber.cjs

@@ -1 +1 @@
-function e(e){if(typeof e!=`string`)return e;try{return JSON.parse(e)}catch{return}}function t(t,n,r){var i;if(!t||!n)return;let a=(i=e(t))==null?void 0:i[n];if(typeof a==`string`)return a;if(a&&r)return a[r]}function n({value:e,locale:n,style:r,unit:i,currency:a,localeMatcher:o=`lookup`,minimumIntegerDigits:s=1,minimumFractionDigits:c=0,maximumFractionDigits:l=20,thousandSeparator:u,fractionSeparator:d,useGrouping:f=`auto`,currencyDisplay:p=`symbol`,symbolOverrides:m}){let h=``,g=``,_,v,y=t(m,a??i,n),b=new Intl.NumberFormat(n,{...r&&{style:r},...i&&{unit:i},...a&&{currency:a},currencyDisplay:p,localeMatcher:o,minimumIntegerDigits:s,minimumFractionDigits:c,maximumFractionDigits:l,useGrouping:f}).formatToParts(e??0);return b.forEach((e,t)=>{switch(e.type){case`unit`:case`currency`:case`percentSign`:{let n=y??e.value;_=n,v=t===0||(b[0].type===`minusSign`||b[0].type===`plusSign`)&&t===1?`left`:`right`,g+=n;break}case`group`:{let t=u??e.value;h+=t,g+=t;break}case`decimal`:{let t=d??e.value;h+=t,g+=t;break}case`integer`:case`fraction`:case`plusSign`:case`minusSign`:h+=e.value,g+=e.value;break;case`literal`:g+=e.value}}),{formattedNumber:h,formattedValue:g,..._&&{unitSymbol:_},...v&&{unitSymbolPosition:v}}}exports.formatNumber=n;
+var e=/^[\s\u200E\u200F\u061C]*$/;function t(t){return t.type===`literal`&&e.test(t.value)}function n(e){if(typeof e!=`string`)return e;try{return JSON.parse(e)}catch{return}}function r(e,t,r){var i;if(!e||!t)return;let a=(i=n(e))==null?void 0:i[t];if(typeof a==`string`)return a;if(a&&r)return a[r]}function i({value:e,locale:n,style:i,unit:a,currency:o,localeMatcher:s=`lookup`,minimumIntegerDigits:c=1,minimumFractionDigits:l=0,maximumFractionDigits:u=20,thousandSeparator:d,fractionSeparator:f,useGrouping:p=`auto`,currencyDisplay:m=`symbol`,symbolOverrides:h}){let g=``,_=``,v,y,b=r(h,o??a,n),x=new Intl.NumberFormat(n,{...i&&{style:i},...a&&{unit:a},...o&&{currency:o},currencyDisplay:m,localeMatcher:s,minimumIntegerDigits:c,minimumFractionDigits:l,maximumFractionDigits:u,useGrouping:p}).formatToParts(e??0),S=x.filter(e=>!t(e));return x.forEach(e=>{switch(e.type){case`unit`:case`currency`:case`percentSign`:{let t=b??e.value;v=t;let n=S.indexOf(e);y=n===0||(S[0].type===`minusSign`||S[0].type===`plusSign`)&&n===1?`left`:`right`,_+=t;break}case`group`:{let t=d??e.value;g+=t,_+=t;break}case`decimal`:{let t=f??e.value;g+=t,_+=t;break}case`integer`:case`fraction`:case`plusSign`:case`minusSign`:g+=e.value,_+=e.value;break;case`literal`:_+=e.value}}),{formattedNumber:g,formattedValue:_,...v&&{unitSymbol:v},...y&&{unitSymbolPosition:y}}}exports.formatNumber=i;

package/dist-react/cjs/utils/getDirection/getDirection.cjs

@@ -0,0 +1 @@
+const e=require("../closestAttribute/closestAttribute.cjs");function t(e){return e===`ltr`||e===`rtl`}function n(n){let r=e.closestAttribute(n,`dir`);if(t(r))return r;if(n.isConnected){let e=getComputedStyle(n).direction;if(t(e))return e}return`ltr`}function r(e){return n(e)===`rtl`?-1:1}exports.getDirection=n,exports.getDirectionSign=r;

package/dist-react/cjs/utils/normalizeDigits/normalizeDigits.cjs

@@ -0,0 +1 @@
+var e=1632,t=1776;function n(n){let r=n.codePointAt(0);return r>=e&&r<=1641?String(r-e):r>=t&&r<=1785?String(r-t):n}function r(e){return e.replace(/[٠-٩۰-۹]/g,n)}exports.normalizeDigits=r;

package/dist-react/cjs/utils/observeScroll/observeScroll.cjs

@@ -1 +1 @@
-const e=require("../debounce.cjs");function t(t,n){let r=()=>({top:t.scrollTop>0,bottom:Math.ceil(t.scrollTop)<t.scrollHeight-t.clientHeight,left:t.scrollLeft>0,right:Math.ceil(t.scrollLeft)<t.scrollWidth-t.clientWidth}),i=e.debounce({func:()=>n(r()),milliseconds:16}),a=new ResizeObserver(i);return a.observe(t),t.addEventListener(`scroll`,i,{passive:!0}),n(r()),()=>{a.disconnect(),t.removeEventListener(`scroll`,i)}}exports.observeScroll=t;
+const e=require("../debounce.cjs");function t(t,n){let r=()=>{let e=Math.abs(t.scrollLeft)>0,n=Math.ceil(Math.abs(t.scrollLeft))<t.scrollWidth-t.clientWidth;return{top:t.scrollTop>0,bottom:Math.ceil(t.scrollTop)<t.scrollHeight-t.clientHeight,start:e,end:n,left:e,right:n}},i=e.debounce({func:()=>n(r()),milliseconds:16}),a=new ResizeObserver(i);return a.observe(t),t.addEventListener(`scroll`,i,{passive:!0}),n(r()),()=>{a.disconnect(),t.removeEventListener(`scroll`,i)}}exports.observeScroll=t;

package/dist-react/cjs/utils/resolveLang/resolveLang.cjs

@@ -0,0 +1 @@
+const e=require("../closestAttribute/closestAttribute.cjs");var t=`en-US`;function n(n,r=t){var i;return e.closestAttribute(n,`lang`)||((i=document)==null||(i=i.documentElement)==null?void 0:i.lang)||r}exports.resolveLang=n;

package/dist-react/cjs/utils/version.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=`2.0.0-canary.237`,t=`--v${e.replaceAll(`.`,`-`)}`;exports.VERSION=e,exports.VERSION_TAG_SUFFIX=t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=`2.0.0-canary.239`,t=`--v${e.replaceAll(`.`,`-`)}`;exports.VERSION=e,exports.VERSION_TAG_SUFFIX=t;

package/dist-react/esm/components/base/ds-base-input/styles/common.styles.js

@@ -16,7 +16,7 @@ var t = e`
     .label {
         position: absolute;
         top: 0;
-        left: 0;
+        inset-inline-start: 0;
         transform-origin: top left;
         pointer-events: none;
         transition:
@@ -24,6 +24,10 @@ var t = e`
             font-size 0.2s;
         white-space: nowrap;
     }
+
+    :host(:dir(rtl)) .label {
+        transform-origin: top right;
+    }
 `, n = e`
     .container {
         position: relative;

package/dist-react/esm/components/base/ds-base-progress-bar/styles/common.styles.js

@@ -11,7 +11,7 @@ var t = e`
     .fill {
         position: absolute;
         top: 0;
-        left: 0;
+        inset-inline-start: 0;
         height: 100%;
         display: block;
     }

package/dist-react/esm/components/ds-accordion/ds-accordion.js

@@ -8,12 +8,12 @@ import { UiKitElement as a } from "../base/UiKitElement.js";
 import { commonStyles as o } from "./styles/common.styles.js";
 import { themeConfig as s } from "./theme-config.js";
 import { customUiKitElement as c } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as l } from "../../utils/booleanConverter.js";
 import "../ds-icon/ds-icon.js";
-import { cupraDiagonalStyles as l } from "./styles/cupra-diagonal.styles.js";
-import { cupraStyles as u } from "./styles/cupra.styles.js";
-import { seatLegacyStyles as d } from "./styles/seat-legacy.styles.js";
-import { seatStyles as f } from "./styles/seat.styles.js";
-import { booleanConverter as p } from "../../utils/booleanConverter.js";
+import { cupraDiagonalStyles as u } from "./styles/cupra-diagonal.styles.js";
+import { cupraStyles as d } from "./styles/cupra.styles.js";
+import { seatLegacyStyles as f } from "./styles/seat-legacy.styles.js";
+import { seatStyles as p } from "./styles/seat.styles.js";
 import { uiKitHtml as m } from "../../utils/uiKitHtml.js";
 import { classMap as h } 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";
@@ -93,28 +93,28 @@ var _ = class extends a {
 	}
 }, v = (_.styles = [
 	o,
-	l,
-	f,
 	u,
-	d
+	p,
+	d,
+	f
 ], _);
 i([n({
 	type: Number,
 	attribute: "max-height"
 })], v.prototype, "maxHeight", void 0), i([n({
 	type: Boolean,
-	converter: p,
+	converter: l,
 	reflect: !0
 })], v.prototype, "open", void 0), i([n({
 	type: String,
 	reflect: !0
 })], v.prototype, "mode", void 0), i([n({ type: String })], v.prototype, "size", void 0), i([n({
 	type: Boolean,
-	converter: p
+	converter: l
 })], v.prototype, "disabled", void 0), i([n({
 	type: Boolean,
 	attribute: "show-divider",
-	converter: p
+	converter: l
 })], v.prototype, "showDivider", void 0), i([n({
 	type: String,
 	attribute: "collapse-icon-name"

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

@@ -57,6 +57,14 @@ var t = e`
             block-size: auto;
         }
     }
+
+    :host(:dir(rtl)[data-ui-kit-theme]) .divider {
+        background-image: linear-gradient(
+            to right,
+            var(--ds-color-border-default-faint) 0%,
+            var(--ds-color-border-default-subtle) 30%
+        );
+    }
 `;
 //#endregion
 export { t as commonStyles };

package/dist-react/esm/components/ds-avatar/ds-avatar.js

@@ -6,8 +6,8 @@ import { queryAssignedElements as i } from "../../node_modules/.pnpm/@lit_reacti
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
 import a from "../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.js";
 import { customUiKitElement as o } from "../../decorators/customUiKitElement.js";
-import "../ds-icon/ds-icon.js";
 import { booleanConverter as s } from "../../utils/booleanConverter.js";
+import "../ds-icon/ds-icon.js";
 import { uiKitHtml as c } from "../../utils/uiKitHtml.js";
 import { classMap as l } 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";
@@ -27,7 +27,7 @@ var f = class extends n {
 		return e`<span class="initials" aria-hidden="true">${t}</span>`;
 	}
 	getInitialsFromName(e) {
-		return e ? e.trim().split(/\s+/).filter(Boolean).slice(0, 2).map((e) => e[0]).join("").toUpperCase() : "";
+		return e ? e.trim().split(/\s+/).filter(Boolean).slice(0, 2).map((e) => Array.from(e)[0]).join("").toUpperCase() : "";
 	}
 	get classes() {
 		return {
@@ -45,7 +45,7 @@ var f = class extends n {
 		return this.hasImage ? "media" : (e = this.name) != null && e.trim() ? "text" : "icon";
 	}
 	get accessibleName() {
-		let e = `Open ${this.name ? this.name + "'s " : ""}profile menu`;
+		let e = this.dataAriaLabel || `Open ${this.name ? this.name + "'s " : ""}profile menu`;
 		return this.mode === "text" ? `${this.getInitialsFromName(this.name)}, ${e}` : e;
 	}
 	handleSlotChange() {
@@ -82,7 +82,10 @@ var f = class extends n {
         `;
 	}
 }, p = (f.styles = [d], f);
-a([r({ type: String })], p.prototype, "size", void 0), a([r({ type: String })], p.prototype, "name", void 0), a([r({
+a([r({
+	type: String,
+	attribute: "data-aria-label"
+})], p.prototype, "dataAriaLabel", void 0), a([r({ type: String })], p.prototype, "size", void 0), a([r({ type: String })], p.prototype, "name", void 0), a([r({
 	type: Boolean,
 	converter: s,
 	reflect: !0

package/dist-react/esm/components/ds-badge/ds-badge.js

@@ -28,7 +28,7 @@ var l = class extends n {
 		};
 	}
 	get badgeAriaLabel() {
-		return this.hasNumber ? `${this.number} notifications` : void 0;
+		return this.hasNumber ? this.dataAriaLabel || `${this.number} notifications` : void 0;
 	}
 	get contentTemplate() {
 		return this.hasNumber ? e`${this.number}` : t;
@@ -37,6 +37,9 @@ var l = class extends n {
 		return e` <div class=${o(this.classes)} aria-label=${s(this.badgeAriaLabel)}>${this.contentTemplate}</div> `;
 	}
 }, u = (l.styles = [c], l);
-i([r({ type: Number })], u.prototype, "number", void 0), i([r({ type: String })], u.prototype, "variant", void 0), i([r({ type: String })], u.prototype, "size", void 0), u = i([a("ds-badge")], u);
+i([r({
+	type: String,
+	attribute: "data-aria-label"
+})], u.prototype, "dataAriaLabel", void 0), i([r({ type: Number })], u.prototype, "number", void 0), i([r({ type: String })], u.prototype, "variant", void 0), i([r({ type: String })], u.prototype, "size", void 0), u = i([a("ds-badge")], u);
 //#endregion
 export { u as DsBadge };

package/dist-react/esm/components/ds-banner/ds-banner.js

@@ -39,7 +39,7 @@ var d = class extends n {
 	get closeButtonTemplate() {
 		return this.showClose ? c`<ds-icon-button
             class="close-button"
-            data-aria-label="close"
+            data-aria-label=${this.dataAriaLabelCloseButton || "close"}
             @click=${this.handleClose}
             icon-name="cross"
             variant="tertiary"
@@ -61,7 +61,10 @@ var d = class extends n {
         ` : t;
 	}
 }, f = (d.styles = [u], d);
-a([r({ type: String })], f.prototype, "orientation", void 0), a([r({
+a([r({
+	type: String,
+	attribute: "data-aria-label-close-button"
+})], f.prototype, "dataAriaLabelCloseButton", void 0), a([r({ type: String })], f.prototype, "orientation", void 0), a([r({
 	attribute: "show-close",
 	type: Boolean,
 	converter: s,

package/dist-react/esm/components/ds-breadcrumbs/ds-breadcrumbs.js

@@ -1,31 +1,32 @@
 import { nothing 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 { state as n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.js";
+import { property as n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
+import { state as r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
-import r from "../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.js";
-import { customUiKitElement as i } from "../../decorators/customUiKitElement.js";
+import i from "../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.js";
+import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
 import "../ds-icon/ds-icon.js";
-import { uiKitHtml as a } from "../../utils/uiKitHtml.js";
-import { ifDefined as o } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.js";
+import { uiKitHtml as o } from "../../utils/uiKitHtml.js";
+import { ifDefined as s } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/if-defined.js";
 import "../ds-tooltip/ds-tooltip.js";
-import { html as s, unsafeStatic as c } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/static.js";
+import { html as c, unsafeStatic as l } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/static.js";
 import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/static-html.js";
 import "../ds-breadcrumbs-item/ds-breadcrumbs-item.js";
-import { commonStyles as l } from "./styles/common.styles.js";
+import { commonStyles as u } from "./styles/common.styles.js";
 //#region src/components/ds-breadcrumbs/ds-breadcrumbs.ts
-var u, d = [{
+var d, f = [{
 	below: 768,
 	maxItems: 3
 }, {
 	below: 1024,
 	maxItems: 4
-}], f = 5, p = (u = class extends t {
+}], p = 5, m = (d = class extends t {
 	constructor(...e) {
-		super(...e), this.items = [], this.maxItems = f, this.itemTag = "ds-breadcrumbs-item", this.onResize = () => {
-			let e = d.find(({ below: e }) => window.innerWidth < e);
-			this.maxItems = (e == null ? void 0 : e.maxItems) ?? f;
+		super(...e), this.items = [], this.maxItems = p, this.itemTag = "ds-breadcrumbs-item", this.onResize = () => {
+			let e = f.find(({ below: e }) => window.innerWidth < e);
+			this.maxItems = (e == null ? void 0 : e.maxItems) ?? p;
 		};
 	}
 	async firstUpdated(e) {
@@ -51,11 +52,11 @@ var u, d = [{
 		});
 	}
 	get separatorIcon() {
-		return a`<ds-icon class="separator-icon" icon-name="arrow-right" size="24"></ds-icon>`;
+		return o`<ds-icon class="separator-icon" icon-name="arrow-right" size="24" mirror></ds-icon>`;
 	}
 	itemTemplate(t, n) {
-		let r = t.selected, i = c(this.itemTag), a = r || t.disabled || !t.href ? s`<span slot="item">${t.label}</span>` : s`<a href=${t.href} slot="item">${t.label}</a>`;
-		return s`<li class="breadcrumb-list-item">
+		let r = t.selected, i = l(this.itemTag), a = r || t.disabled || !t.href ? c`<span slot="item">${t.label}</span>` : c`<a href=${t.href} slot="item">${t.label}</a>`;
+		return c`<li class="breadcrumb-list-item">
             <${i}
                 ?selected=${r}
                 ?disabled=${t.disabled}
@@ -67,25 +68,29 @@ var u, d = [{
         </li>`;
 	}
 	get slotTemplate() {
-		return s`<slot @slotchange=${this.handleSlotChange} style="display: none;"></slot>`;
+		return c`<slot @slotchange=${this.handleSlotChange} style="display: none;"></slot>`;
 	}
 	get overflowMenuTemplate() {
 		let e = this.items.slice(1, this.items.length - (this.maxItems - 2));
-		return s`<ul class="overflow-menu" role="menu">
-            ${e.map((e) => s`
+		return c`<ul class="overflow-menu" role="menu">
+            ${e.map((e) => c`
                     <li class="overflow-menu-item" role="none">
-                        <a href=${o(e.href)} class="overflow-menu-link" role="menuitem">${e.label}</a>
+                        <a href=${s(e.href)} class="overflow-menu-link" role="menuitem">${e.label}</a>
                     </li>
                 `)}
         </ul>`;
 	}
 	get overflowTriggerTemplate() {
-		return s`<button class="overflow-trigger">
+		return c`<button
+            class="overflow-trigger"
+            aria-label=${this.dataAriaLabelShowMoreButton || "Show more"}
+            aria-haspopup="menu"
+        >
             <span class="overflow-label">...</span>
         </button>`;
 	}
 	get tooltipTemplate() {
-		return a`<ds-tooltip class="breadcrumbs-tooltip">
+		return o`<ds-tooltip class="breadcrumbs-tooltip">
             ${this.overflowTriggerTemplate}
             <div slot="content">${this.overflowMenuTemplate}</div>
         </ds-tooltip>`;
@@ -94,7 +99,7 @@ var u, d = [{
 		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`
+		return c`
             ${this.itemTemplate(e[0], !1)}
             <li class="breadcrumb-list-item">
                 <div class="overflow-item-wrapper">
@@ -106,16 +111,22 @@ var u, d = [{
         `;
 	}
 	render() {
-		return s`
+		return c`
             ${this.slotTemplate}
-            <nav class="container" aria-label="Breadcrumb">
+            <nav class="container" aria-label=${this.dataAriaLabel || "Breadcrumb"}>
                 <ol class="breadcrumb-list">
                     ${this.listTemplate}
                 </ol>
             </nav>
         `;
 	}
-}, u.styles = [l], u);
-r([n()], p.prototype, "items", void 0), r([n()], p.prototype, "maxItems", void 0), r([n()], p.prototype, "itemTag", void 0), p = r([i("ds-breadcrumbs")], p);
+}, d.styles = [u], d);
+i([n({
+	type: String,
+	attribute: "data-aria-label"
+})], m.prototype, "dataAriaLabel", void 0), i([n({
+	type: String,
+	attribute: "data-aria-label-show-more-button"
+})], m.prototype, "dataAriaLabelShowMoreButton", void 0), i([r()], m.prototype, "items", void 0), i([r()], m.prototype, "maxItems", void 0), i([r()], m.prototype, "itemTag", void 0), m = i([a("ds-breadcrumbs")], m);
 //#endregion
-export { p as DsBreadcrumbs };
+export { m as DsBreadcrumbs };