@cupra/ui-kit 2.0.0-canary.245 → 2.0.0-canary.247

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/README.md +44 -3
  2. package/dist/cjs/components/ds-accordion/ds-accordion.cjs +2 -1
  3. package/dist/cjs/components/ds-accordion/styles/common.styles.cjs +1 -0
  4. package/dist/cjs/components/ds-accordion/theme-config.cjs +1 -1
  5. package/dist/cjs/components/ds-theme-provider/ds-theme-provider.cjs +1 -4
  6. package/dist/cjs/components/ds-theme-provider/themeFonts.cjs +1 -0
  7. package/dist/cjs/decorators/customUiKitElement.cjs +1 -1
  8. package/dist/cjs/utils/IconsManager.cjs +1 -1
  9. package/dist/cjs/utils/PubSub.cjs +1 -1
  10. package/dist/cjs/utils/version.cjs +1 -1
  11. package/dist/esm/components/ds-accordion/ds-accordion.js +3 -0
  12. package/dist/esm/components/ds-accordion/styles/common.styles.js +1 -0
  13. package/dist/esm/components/ds-accordion/theme-config.js +4 -2
  14. package/dist/esm/components/ds-theme-provider/ds-theme-provider.js +6 -31
  15. package/dist/esm/components/ds-theme-provider/themeFonts.js +29 -0
  16. package/dist/esm/decorators/customUiKitElement.js +1 -1
  17. package/dist/esm/utils/IconsManager.js +1 -1
  18. package/dist/esm/utils/PubSub.js +1 -1
  19. package/dist/esm/utils/version.js +1 -1
  20. package/dist/types/components/ds-accordion/theme-config.d.ts +1 -0
  21. package/dist/types/components/ds-theme-provider/ds-theme-provider.d.ts +0 -3
  22. package/dist/types/components/ds-theme-provider/themeFonts.d.ts +1 -0
  23. package/dist-react/cjs/components/ds-accordion/ds-accordion.cjs +2 -1
  24. package/dist-react/cjs/components/ds-accordion/styles/common.styles.cjs +1 -0
  25. package/dist-react/cjs/components/ds-accordion/theme-config.cjs +1 -1
  26. package/dist-react/cjs/components/ds-theme-provider/ds-theme-provider.cjs +1 -4
  27. package/dist-react/cjs/components/ds-theme-provider/themeFonts.cjs +1 -0
  28. package/dist-react/cjs/decorators/customUiKitElement.cjs +1 -1
  29. package/dist-react/cjs/utils/IconsManager.cjs +1 -1
  30. package/dist-react/cjs/utils/PubSub.cjs +1 -1
  31. package/dist-react/cjs/utils/version.cjs +1 -1
  32. package/dist-react/esm/components/ds-accordion/ds-accordion.js +3 -0
  33. package/dist-react/esm/components/ds-accordion/styles/common.styles.js +1 -0
  34. package/dist-react/esm/components/ds-accordion/theme-config.js +4 -2
  35. package/dist-react/esm/components/ds-theme-provider/ds-theme-provider.js +6 -31
  36. package/dist-react/esm/components/ds-theme-provider/themeFonts.js +29 -0
  37. package/dist-react/esm/decorators/customUiKitElement.js +1 -1
  38. package/dist-react/esm/utils/IconsManager.js +1 -1
  39. package/dist-react/esm/utils/PubSub.js +1 -1
  40. package/dist-react/esm/utils/version.js +1 -1
  41. package/dist-react/types/components/ds-accordion/theme-config.d.ts +1 -0
  42. package/dist-react/types/components/ds-theme-provider/ds-theme-provider.d.ts +0 -3
  43. package/dist-react/types/components/ds-theme-provider/themeFonts.d.ts +1 -0
  44. package/package.json +2 -2
  45. package/dist/cjs/styles/source/shared/fonts-config.cjs +0 -1
  46. package/dist/esm/styles/source/shared/fonts-config.js +0 -93
  47. package/dist/types/styles/source/shared/fonts-config.d.ts +0 -15
  48. package/dist-react/cjs/styles/source/shared/fonts-config.cjs +0 -1
  49. package/dist-react/esm/styles/source/shared/fonts-config.js +0 -93
  50. package/dist-react/types/styles/source/shared/fonts-config.d.ts +0 -15
package/README.md CHANGED
@@ -164,7 +164,7 @@ How to consume the package, either through the CDN or your application build.
164
164
  | Attribute | Type | Required | Description |
165
165
  |----------------------|---------|----------|-------------------------------------------------------------------------------------------------------------------|
166
166
  | `theme` | string | Yes | Visual theme identifier (e.g. `cupra-diagonal`) |
167
- | `load-fonts` | boolean | Yes | Auto-load DS-UI font files |
167
+ | `load-fonts` | boolean | Yes | Auto-load `fonts.css`, the stylesheet that declares the theme's `@font-face` rules |
168
168
  | `load-styles` | boolean | Yes | Auto-load `theme.css`, the stylesheet the `ui-kit` components require |
169
169
  | `load-unused-styles` | boolean | No, defaults to `true` | Auto-load `unused-styles.css`, the theme's `--ds-` tokens that `ui-kit` doesn't consume internally, only needed if your own CSS reads raw tokens |
170
170
 
@@ -191,16 +191,22 @@ controlling their priority: `theme.css` as a normal, high-priority stylesheet li
191
191
  turns into a stylesheet once loaded — or omitted entirely if you don't read raw tokens. If your own CSS
192
192
  does read raw tokens, load `unused-styles.css` with the same priority as `theme.css`.
193
193
 
194
+ The same applies to fonts: disable `load-fonts` and add `fonts.css` to your `<head>` yourself. This is also
195
+ the setup for server-side rendering, since no JavaScript is needed to load the fonts. See [Fonts](#fonts).
196
+
194
197
  ```html
195
- <!-- Preload fonts (one line per required font file) -->
198
+ <!-- Preload fonts (one line per critical font file) -->
196
199
  <link
197
200
  rel="preload"
198
201
  as="font"
199
202
  type="font/woff2"
200
- href="https://ds-assets.cupra.com/fonts/[theme]/[font-file]"
203
+ href="https://ds-assets.cupra.com/fonts/[theme]/[font-file].woff2"
201
204
  crossorigin
202
205
  />
203
206
 
207
+ <!-- Declare the theme fonts -->
208
+ <link rel="stylesheet" href="https://ds-assets.cupra.com/[version]/styles/[theme]/fonts.css" />
209
+
204
210
  <!-- Load the theme stylesheet normally, always required -->
205
211
  <link rel="stylesheet" href="https://ds-assets.cupra.com/[version]/styles/[theme]/theme.css" />
206
212
 
@@ -247,6 +253,41 @@ Replace `[theme]` with your theme name (e.g. `cupra-diagonal`).
247
253
 
248
254
  ---
249
255
 
256
+ ## Fonts
257
+
258
+ Each theme publishes `fonts.css` next to `theme.css`. It only declares the theme's `@font-face` rules
259
+ (woff2, `font-display: fallback`), so the browser downloads just the weights a page renders and only
260
+ swaps the typeface within the first ~3 seconds: later, text doesn't shift. `<ds-theme-provider>` adds it while
261
+ `load-fonts` is `true`; with `load-fonts="false"` link it yourself, as in the example above.
262
+
263
+ **Preload the critical weights.** With `fallback` the browser waits about 100 ms for a font, then shows the
264
+ fallback typeface and swaps to the real one if it arrives within ~3 seconds. After that it keeps the
265
+ fallback for that page view and uses the real one on the next, cached, navigation. While `load-fonts` is `true`, the provider preloads the Regular and Medium weights of the theme
266
+ next to `fonts.css`, while its content waits for `theme.css`. With `load-fonts="false"` or server-side
267
+ rendering, add the preloads to your `<head>` yourself. Adding them there also helps with the provider:
268
+ the download starts before the JavaScript loads, and the provider skips any preload already present.
269
+
270
+ ```html
271
+ <link
272
+ rel="preload"
273
+ as="font"
274
+ type="font/woff2"
275
+ href="https://ds-assets.cupra.com/fonts/[theme]/[font-file].woff2"
276
+ crossorigin
277
+ />
278
+ ```
279
+
280
+ - Preload only the weights rendered above the fold, usually Regular and Medium. Every preload competes
281
+ with other critical requests.
282
+ - Keep `crossorigin`, even on the same origin. Fonts are fetched in CORS mode, and a preload without it
283
+ is not reused: the font downloads twice.
284
+ - The `href` must match the URL in `fonts.css` exactly.
285
+
286
+ | Theme | `font-family` | Font files (`[font-file]`) |
287
+ |---------|--------|-----------------------------------------------|
288
+ | `seat` | `seat` | `SeatBcn-Book` (350), `SeatBcn-Regular` (400), `SeatBcn-Medium` (500), `SeatBcn-Bold` (700), `SeatBcn-Black` (900) |
289
+ | `cupra-diagonal` | `cupra-screen` | `CupraScreen-Light` (300), `CupraScreen-Book` (350), `CupraScreen-Regular` (400), `CupraScreen-Medium` (500) |
290
+
250
291
  ## Icons
251
292
 
252
293
  Icons must always be consumed through the `<ds-icon>` Web Component — never by loading SVG files directly from the CDN.
@@ -1,8 +1,9 @@
1
- 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"),n=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 r=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),i=require("../base/UiKitElement.cjs"),a=require("./styles/common.styles.cjs"),o=require("./theme-config.cjs"),s=require("../../decorators/customUiKitElement.cjs"),c=require("../../utils/booleanConverter.cjs");require("../ds-icon/ds-icon.cjs");const l=require("./styles/cupra-diagonal.styles.cjs"),u=require("./styles/cupra.styles.cjs"),d=require("./styles/seat-legacy.styles.cjs"),f=require("./styles/seat.styles.cjs"),p=require("../../utils/uiKitHtml.cjs"),m=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 h=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/if-defined.cjs");var g=class extends i.UiKitElement{constructor(...e){super(...e),this.maxHeight=300,this.open=!1,this.mode=`light`,this.size=`large`,this.disabled=!1,this.showDivider=!0,this._open=!1}willUpdate(e){super.willUpdate(e),e.has(`open`)&&(this._open=this.open)}get containerClasses(){return{container:!0,disabled:this.disabled,open:this._open,[this.size]:!0,[this.mode]:!!this.mode}}get dividerClasses(){return{divider:!0,[this.mode]:!!this.mode}}get openIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.expandedIconName||(n==null?void 0:n.open)||`minus`;return p.uiKitHtml`<ds-icon class="icon open-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get closeIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.collapseIconName||(n==null?void 0:n.close)||`plus`;return p.uiKitHtml`<ds-icon class="icon close-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get styleTokens(){return e.html`
1
+ 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"),n=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 r=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),i=require("../base/UiKitElement.cjs"),a=require("./styles/common.styles.cjs"),o=require("./theme-config.cjs"),s=require("../../decorators/customUiKitElement.cjs"),c=require("../../utils/booleanConverter.cjs");require("../ds-icon/ds-icon.cjs");const l=require("./styles/cupra-diagonal.styles.cjs"),u=require("./styles/cupra.styles.cjs"),d=require("./styles/seat-legacy.styles.cjs"),f=require("./styles/seat.styles.cjs"),p=require("../../utils/uiKitHtml.cjs"),m=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 h=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/if-defined.cjs");var g=class extends i.UiKitElement{constructor(...e){super(...e),this.maxHeight=300,this.open=!1,this.mode=`light`,this.size=`large`,this.disabled=!1,this.showDivider=!0,this._open=!1}willUpdate(e){super.willUpdate(e),e.has(`open`)&&(this._open=this.open)}get containerClasses(){return{container:!0,disabled:this.disabled,open:this._open,[this.size]:!0,[this.mode]:!!this.mode}}get dividerClasses(){return{divider:!0,[this.mode]:!!this.mode}}get openIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.expandedIconName||(n==null?void 0:n.open)||`minus`;return p.uiKitHtml`<ds-icon class="icon open-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get closeIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.collapseIconName||(n==null?void 0:n.close)||`plus`;return p.uiKitHtml`<ds-icon class="icon close-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get styleTokens(){var t;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`title-text-transform`];return e.html`
2
2
  <style>
3
3
  :host{
4
4
  color-scheme: ${this.mode};
5
5
  pointer-events: ${this.disabled?`none`:`auto`};
6
+ ${n?`--ui-kit-private-accordion-title-text-transform: ${n};`:``}
6
7
  }
7
8
  </style>
8
9
  `}handleKeyDown(e){this.disabled&&(e.preventDefault(),e.stopPropagation())}handleToggle(e){this._open=e.newState===`open`}render(){return e.html`
@@ -22,6 +22,7 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
22
22
  justify-content: space-between;
23
23
  cursor: pointer;
24
24
  user-select: none;
25
+ text-transform: var(--ui-kit-private-accordion-title-text-transform, none);
25
26
  }
26
27
 
27
28
  .open .close-icon,
@@ -1 +1 @@
1
- var e={cupra:{"icon-names":{open:`minus`,close:`plus`},"icon-button-variant":`secondary`},"cupra-diagonal":{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`},seat:{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`}};exports.themeConfig=e;
1
+ var e={cupra:{"icon-names":{open:`minus`,close:`plus`},"icon-button-variant":`secondary`},"cupra-diagonal":{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`,"title-text-transform":`uppercase`},seat:{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`,"title-text-transform":`none`}};exports.themeConfig=e;
@@ -1,4 +1 @@
1
- const e=require("../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.cjs"),t=require("./themeContext.cjs");require("../../core/theme.constants.cjs");const n=require("../../utils/PubSub.cjs"),r=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.cjs"),i=require("../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.cjs"),o=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 s=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),c=require("../../decorators/customUiKitElement.cjs"),l=require("../../utils/booleanConverter.cjs"),u=require("../../styles/source/shared/fonts-config.cjs");var d=class extends i.LitElement{constructor(...e){super(...e),this.loadFonts=!0,this.loadStyles=!0,this.loadUnusedStyles=!0,this.cssLoaded=!1,this.loadedFonts=new Set}connectedCallback(){super.connectedCallback(),this.publishDocumentAttributes(),this.observeDocumentAttributes()}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.documentAttributesObserver)==null||e.disconnect(),this.documentAttributesObserver=void 0}observeDocumentAttributes(){typeof MutationObserver<`u`&&typeof document<`u`&&(this.documentAttributesObserver=new MutationObserver(()=>this.publishDocumentAttributes()),this.documentAttributesObserver.observe(document.documentElement,{attributes:!0,attributeFilter:[`dir`,`lang`]}))}publishDocumentAttributes(){if(typeof document>`u`)return;let{documentElement:e}=document;n.pubSub.publish(`direction`,e.getAttribute(`dir`)===`rtl`?`rtl`:`ltr`),n.pubSub.publish(`lang`,e.getAttribute(`lang`))}updated(e){if(super.updated(e),e.has(`theme`)){var t,r;n.pubSub.publish(`theme`,this.theme),(t=sessionStorage)==null||t.setItem(`@cupra/ui-kit/theme`,this.theme),typeof FontFace<`u`&&(r=document)!=null&&r.fonts&&this.loadThemeFonts(),this.loadThemeStyles().then(()=>{this.cssLoaded=!0,this.dispatchEvent(new CustomEvent(`ui-kit:ready`,{bubbles:!0,composed:!0}))})}}loadThemeFonts(){var e;(e=u.fontsConfig[this.theme])==null||e.fonts.forEach(e=>{this.loadThemeFont(e)})}async loadThemeFont({weight:e,name:t,file:n,unicodeRange:r,display:i}){if(!this.loadFonts)return Promise.resolve();let a=r?`${t}-${e}-${r}`:`${t}-${e}`;if(this.loadedFonts.has(a))return;let o=new FontFace(t,`url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff2') format('woff2'),
2
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff') format('woff'),
3
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.ttf') format('truetype'),
4
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.otf') format('opentype')`,{style:`normal`,weight:e,display:i??(r?`swap`:`optional`),...r&&{unicodeRange:r}});try{r||await o.load(),document.fonts.add(o),this.loadedFonts.add(a)}catch(n){console.error(`Error loading "${t}" font with "${e}" weight:`,n)}}loadThemeStyles(){let e=`/2.0.0-canary.245`;return this.loadUnusedStyles&&this.applyUnusedStyles(e),this.loadStyles?new Promise((t,n)=>{let r=`https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;if(document.head.querySelector(`link[href="${r}"]`))t();else{let i=`ui-kit-theme-${e}`,a=document.getElementById(i),o=document.createElement(`link`);o.id=i,o.rel=`stylesheet`,o.href=r,o.onload=()=>t(),o.onerror=()=>n(Error(`Failed to load theme CSS: ${r}`)),document.head.appendChild(o),a==null||a.remove()}}):Promise.resolve()}applyUnusedStyles(e){let t=`https://ds-assets.cupra.com${e}/styles/${this.theme}/unused-styles.css`;if(document.head.querySelector(`link[href="${t}"]`))return;let n=`ui-kit-unused-styles-${e}`,r=document.getElementById(n),i=document.createElement(`link`);i.id=n,i.rel=`preload`,i.as=`style`,i.href=t,i.onload=()=>{i.rel=`stylesheet`},document.head.appendChild(i),r==null||r.remove()}render(){return this.cssLoaded?r.html`<slot></slot>`:r.nothing}};s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-fonts`})],d.prototype,`loadFonts`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-styles`})],d.prototype,`loadStyles`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-unused-styles`})],d.prototype,`loadUnusedStyles`,void 0),s.default([e.provide({context:t.themeContext}),a.property({type:String})],d.prototype,`theme`,void 0),s.default([o.state()],d.prototype,`cssLoaded`,void 0),s.default([o.state()],d.prototype,`loadedFonts`,void 0),d=s.default([c.customUiKitElement(`ds-theme-provider`)],d),Object.defineProperty(exports,"DsThemeProvider",{enumerable:!0,get:function(){return d}});
1
+ const e=require("../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.cjs"),t=require("./themeContext.cjs");require("../../core/theme.constants.cjs");const n=require("../../utils/PubSub.cjs"),r=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.cjs"),i=require("../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.cjs"),o=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 s=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),c=require("../../decorators/customUiKitElement.cjs"),l=require("../../utils/booleanConverter.cjs"),u=require("./themeFonts.cjs");var d=class extends i.LitElement{constructor(...e){super(...e),this.loadFonts=!0,this.loadStyles=!0,this.loadUnusedStyles=!0,this.cssLoaded=!1}connectedCallback(){super.connectedCallback(),this.publishDocumentAttributes(),this.observeDocumentAttributes()}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.documentAttributesObserver)==null||e.disconnect(),this.documentAttributesObserver=void 0}observeDocumentAttributes(){typeof MutationObserver<`u`&&typeof document<`u`&&(this.documentAttributesObserver=new MutationObserver(()=>this.publishDocumentAttributes()),this.documentAttributesObserver.observe(document.documentElement,{attributes:!0,attributeFilter:[`dir`,`lang`]}))}publishDocumentAttributes(){if(typeof document>`u`)return;let{documentElement:e}=document;n.pubSub.publish(`direction`,e.getAttribute(`dir`)===`rtl`?`rtl`:`ltr`),n.pubSub.publish(`lang`,e.getAttribute(`lang`))}updated(e){if(super.updated(e),e.has(`theme`)){var t;n.pubSub.publish(`theme`,this.theme),(t=sessionStorage)==null||t.setItem(`@cupra/ui-kit/theme`,this.theme),this.loadFonts&&u.addThemeFonts(this.theme),this.loadThemeStyles().then(()=>{this.cssLoaded=!0,this.dispatchEvent(new CustomEvent(`ui-kit:ready`,{bubbles:!0,composed:!0}))})}}loadThemeStyles(){let e=`/2.0.0-canary.247`;return this.loadUnusedStyles&&this.applyUnusedStyles(e),this.loadStyles?new Promise((t,n)=>{let r=`https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;if(document.head.querySelector(`link[href="${r}"]`))t();else{let i=`ui-kit-theme-${e}`,a=document.getElementById(i),o=document.createElement(`link`);o.id=i,o.rel=`stylesheet`,o.href=r,o.onload=()=>t(),o.onerror=()=>n(Error(`Failed to load theme CSS: ${r}`)),document.head.appendChild(o),a==null||a.remove()}}):Promise.resolve()}applyUnusedStyles(e){let t=`https://ds-assets.cupra.com${e}/styles/${this.theme}/unused-styles.css`;if(document.head.querySelector(`link[href="${t}"]`))return;let n=`ui-kit-unused-styles-${e}`,r=document.getElementById(n),i=document.createElement(`link`);i.id=n,i.rel=`preload`,i.as=`style`,i.href=t,i.onload=()=>{i.rel=`stylesheet`},document.head.appendChild(i),r==null||r.remove()}render(){return this.cssLoaded?r.html`<slot></slot>`:r.nothing}};s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-fonts`})],d.prototype,`loadFonts`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-styles`})],d.prototype,`loadStyles`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-unused-styles`})],d.prototype,`loadUnusedStyles`,void 0),s.default([e.provide({context:t.themeContext}),a.property({type:String})],d.prototype,`theme`,void 0),s.default([o.state()],d.prototype,`cssLoaded`,void 0),d=s.default([c.customUiKitElement(`ds-theme-provider`)],d),Object.defineProperty(exports,"DsThemeProvider",{enumerable:!0,get:function(){return d}});
@@ -0,0 +1 @@
1
+ var e={seat:[`SeatBcn-Regular`,`SeatBcn-Medium`],"seat-legacy":[`SeatBcn-Regular`,`SeatBcn-Medium`],"cupra-diagonal":[`CupraScreen-Regular`,`CupraScreen-Medium`],cupra:[`CupraScreen-Regular`,`CupraScreen-Medium`]};function t(t){var n;(n=e[t])==null||n.forEach(e=>r(t,e)),i(t)}function n(e,t){let n=`https://ds-assets.cupra.com/fonts/${e}/${t}.woff2`;return new URL(n,document.baseURI).href}function r(e,t){let r=n(e,t);if(Array.from(document.head.querySelectorAll(`link[rel="preload"]`)).some(e=>e.href===r))return;let i=document.createElement(`link`);i.rel=`preload`,i.as=`font`,i.type=`font/woff2`,i.href=r,i.crossOrigin=`anonymous`,document.head.appendChild(i)}function i(e){let t=`/2.0.0-canary.247`,n=`https://ds-assets.cupra.com${t}/styles/${e}/fonts.css`;if(document.head.querySelector(`link[href="${n}"]`))return;let r=`ui-kit-fonts-${t}`,i=document.getElementById(r),a=document.createElement(`link`);a.id=r,a.rel=`stylesheet`,a.href=n,document.head.appendChild(a),i==null||i.remove()}exports.addThemeFonts=t;
@@ -1 +1 @@
1
- require("../utils/version.cjs");function e(e){return function(t){var n,r,i;if(!(t!=null&&t.prototype))throw TypeError(`@customUiKitElement requires a class that extends HTMLElement.`);let a=e;(n=globalThis)!=null&&(n=n.customElements)!=null&&n.get(a)||(r=globalThis)==null||(r=r.customElements)==null||(i=r.define)==null||i.call(r,a,class extends t{connectedCallback(){var n;(n=t.prototype.connectedCallback)==null||n.call(this),this.setAttribute(`data-ui-kit-version`,`2.0.0-canary.245`),this.setAttribute(`data-ui-kit-component-name`,e)}})}}exports.customUiKitElement=e;
1
+ require("../utils/version.cjs");function e(e){return function(t){var n,r,i;if(!(t!=null&&t.prototype))throw TypeError(`@customUiKitElement requires a class that extends HTMLElement.`);let a=e;(n=globalThis)!=null&&(n=n.customElements)!=null&&n.get(a)||(r=globalThis)==null||(r=r.customElements)==null||(i=r.define)==null||i.call(r,a,class extends t{connectedCallback(){var n;(n=t.prototype.connectedCallback)==null||n.call(this),this.setAttribute(`data-ui-kit-version`,`2.0.0-canary.247`),this.setAttribute(`data-ui-kit-component-name`,e)}})}}exports.customUiKitElement=e;
@@ -1 +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.245`),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;
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.247`),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;
@@ -1 +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.245`),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;
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.247`),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;
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=`2.0.0-canary.245`,t=`--v${e.replaceAll(`.`,`-`)}`;exports.VERSION=e,exports.VERSION_TAG_SUFFIX=t;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=`2.0.0-canary.247`,t=`--v${e.replaceAll(`.`,`-`)}`;exports.VERSION=e,exports.VERSION_TAG_SUFFIX=t;
@@ -55,11 +55,14 @@ var _ = class extends a {
55
55
  return m`<ds-icon class="icon close-icon" role="presentation" icon-name=${g(r)}></ds-icon>`;
56
56
  }
57
57
  get styleTokens() {
58
+ var t;
59
+ let n = (t = s[this.theme]) == null ? void 0 : t["title-text-transform"];
58
60
  return e`
59
61
  <style>
60
62
  :host{
61
63
  color-scheme: ${this.mode};
62
64
  pointer-events: ${this.disabled ? "none" : "auto"};
65
+ ${n ? `--ui-kit-private-accordion-title-text-transform: ${n};` : ""}
63
66
  }
64
67
  </style>
65
68
  `;
@@ -25,6 +25,7 @@ var t = e`
25
25
  justify-content: space-between;
26
26
  cursor: pointer;
27
27
  user-select: none;
28
+ text-transform: var(--ui-kit-private-accordion-title-text-transform, none);
28
29
  }
29
30
 
30
31
  .open .close-icon,
@@ -12,14 +12,16 @@ var e = {
12
12
  open: "arrow-up",
13
13
  close: "arrow-down"
14
14
  },
15
- "icon-button-variant": "primary"
15
+ "icon-button-variant": "primary",
16
+ "title-text-transform": "uppercase"
16
17
  },
17
18
  seat: {
18
19
  "icon-names": {
19
20
  open: "arrow-up",
20
21
  close: "arrow-down"
21
22
  },
22
- "icon-button-variant": "primary"
23
+ "icon-button-variant": "primary",
24
+ "title-text-transform": "none"
23
25
  }
24
26
  };
25
27
  //#endregion
@@ -11,11 +11,11 @@ import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
11
11
  import c from "../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.js";
12
12
  import { customUiKitElement as l } from "../../decorators/customUiKitElement.js";
13
13
  import { booleanConverter as u } from "../../utils/booleanConverter.js";
14
- import { fontsConfig as d } from "../../styles/source/shared/fonts-config.js";
14
+ import { addThemeFonts as d } from "./themeFonts.js";
15
15
  //#region src/components/ds-theme-provider/ds-theme-provider.ts
16
16
  var f = class extends a {
17
17
  constructor(...e) {
18
- super(...e), this.loadFonts = !0, this.loadStyles = !0, this.loadUnusedStyles = !0, this.cssLoaded = !1, this.loadedFonts = /* @__PURE__ */ new Set();
18
+ super(...e), this.loadFonts = !0, this.loadStyles = !0, this.loadUnusedStyles = !0, this.cssLoaded = !1;
19
19
  }
20
20
  connectedCallback() {
21
21
  super.connectedCallback(), this.publishDocumentAttributes(), this.observeDocumentAttributes();
@@ -37,8 +37,8 @@ var f = class extends a {
37
37
  }
38
38
  updated(e) {
39
39
  if (super.updated(e), e.has("theme")) {
40
- var t, r;
41
- n.publish("theme", this.theme), (t = sessionStorage) == null || t.setItem("@cupra/ui-kit/theme", this.theme), typeof FontFace < "u" && (r = document) != null && r.fonts && this.loadThemeFonts(), this.loadThemeStyles().then(() => {
40
+ var t;
41
+ n.publish("theme", this.theme), (t = sessionStorage) == null || t.setItem("@cupra/ui-kit/theme", this.theme), this.loadFonts && d(this.theme), this.loadThemeStyles().then(() => {
42
42
  this.cssLoaded = !0, this.dispatchEvent(new CustomEvent("ui-kit:ready", {
43
43
  bubbles: !0,
44
44
  composed: !0
@@ -46,33 +46,8 @@ var f = class extends a {
46
46
  });
47
47
  }
48
48
  }
49
- loadThemeFonts() {
50
- var e;
51
- (e = d[this.theme]) == null || e.fonts.forEach((e) => {
52
- this.loadThemeFont(e);
53
- });
54
- }
55
- async loadThemeFont({ weight: e, name: t, file: n, unicodeRange: r, display: i }) {
56
- if (!this.loadFonts) return Promise.resolve();
57
- let a = r ? `${t}-${e}-${r}` : `${t}-${e}`;
58
- if (this.loadedFonts.has(a)) return;
59
- let o = new FontFace(t, `url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff2') format('woff2'),
60
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff') format('woff'),
61
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.ttf') format('truetype'),
62
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.otf') format('opentype')`, {
63
- style: "normal",
64
- weight: e,
65
- display: i ?? (r ? "swap" : "optional"),
66
- ...r && { unicodeRange: r }
67
- });
68
- try {
69
- r || await o.load(), document.fonts.add(o), this.loadedFonts.add(a);
70
- } catch (n) {
71
- console.error(`Error loading "${t}" font with "${e}" weight:`, n);
72
- }
73
- }
74
49
  loadThemeStyles() {
75
- let e = "/2.0.0-canary.245";
50
+ let e = "/2.0.0-canary.247";
76
51
  return this.loadUnusedStyles && this.applyUnusedStyles(e), this.loadStyles ? new Promise((t, n) => {
77
52
  let r = `https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;
78
53
  if (document.head.querySelector(`link[href="${r}"]`)) t();
@@ -106,6 +81,6 @@ c([o({
106
81
  type: Boolean,
107
82
  converter: u,
108
83
  attribute: "load-unused-styles"
109
- })], f.prototype, "loadUnusedStyles", void 0), c([e({ context: t }), o({ type: String })], f.prototype, "theme", void 0), c([s()], f.prototype, "cssLoaded", void 0), c([s()], f.prototype, "loadedFonts", void 0), f = c([l("ds-theme-provider")], f);
84
+ })], f.prototype, "loadUnusedStyles", void 0), c([e({ context: t }), o({ type: String })], f.prototype, "theme", void 0), c([s()], f.prototype, "cssLoaded", void 0), f = c([l("ds-theme-provider")], f);
110
85
  //#endregion
111
86
  export { f as DsThemeProvider };
@@ -0,0 +1,29 @@
1
+ //#region src/components/ds-theme-provider/themeFonts.ts
2
+ var e = {
3
+ seat: ["SeatBcn-Regular", "SeatBcn-Medium"],
4
+ "seat-legacy": ["SeatBcn-Regular", "SeatBcn-Medium"],
5
+ "cupra-diagonal": ["CupraScreen-Regular", "CupraScreen-Medium"],
6
+ cupra: ["CupraScreen-Regular", "CupraScreen-Medium"]
7
+ };
8
+ function t(t) {
9
+ var n;
10
+ (n = e[t]) == null || n.forEach((e) => r(t, e)), i(t);
11
+ }
12
+ function n(e, t) {
13
+ let n = `https://ds-assets.cupra.com/fonts/${e}/${t}.woff2`;
14
+ return new URL(n, document.baseURI).href;
15
+ }
16
+ function r(e, t) {
17
+ let r = n(e, t);
18
+ if (Array.from(document.head.querySelectorAll("link[rel=\"preload\"]")).some((e) => e.href === r)) return;
19
+ let i = document.createElement("link");
20
+ i.rel = "preload", i.as = "font", i.type = "font/woff2", i.href = r, i.crossOrigin = "anonymous", document.head.appendChild(i);
21
+ }
22
+ function i(e) {
23
+ let t = "/2.0.0-canary.247", n = `https://ds-assets.cupra.com${t}/styles/${e}/fonts.css`;
24
+ if (document.head.querySelector(`link[href="${n}"]`)) return;
25
+ let r = `ui-kit-fonts-${t}`, i = document.getElementById(r), a = document.createElement("link");
26
+ a.id = r, a.rel = "stylesheet", a.href = n, document.head.appendChild(a), i == null || i.remove();
27
+ }
28
+ //#endregion
29
+ export { t as addThemeFonts };
@@ -8,7 +8,7 @@ function e(e) {
8
8
  (n = globalThis) != null && (n = n.customElements) != null && n.get(a) || (r = globalThis) == null || (r = r.customElements) == null || (i = r.define) == null || i.call(r, a, class extends t {
9
9
  connectedCallback() {
10
10
  var n;
11
- (n = t.prototype.connectedCallback) == null || n.call(this), this.setAttribute("data-ui-kit-version", "2.0.0-canary.245"), this.setAttribute("data-ui-kit-component-name", e);
11
+ (n = t.prototype.connectedCallback) == null || n.call(this), this.setAttribute("data-ui-kit-version", "2.0.0-canary.247"), this.setAttribute("data-ui-kit-component-name", e);
12
12
  }
13
13
  });
14
14
  };
@@ -26,7 +26,7 @@ var n = class {
26
26
  return console.error(`Failed to fetch icon "${e}":`, t), "";
27
27
  }), t.subscribe("theme", this.handleChangeTheme);
28
28
  }
29
- }, r = Symbol.for("@cupra/ui-kit/icons-manager/2.0.0-canary.245"), i = globalThis, a = i[r];
29
+ }, r = Symbol.for("@cupra/ui-kit/icons-manager/2.0.0-canary.247"), i = globalThis, a = i[r];
30
30
  a || (a = new n(), Object.defineProperty(i, r, {
31
31
  value: a,
32
32
  writable: !1,
@@ -18,7 +18,7 @@ var e = class {
18
18
  }
19
19
  });
20
20
  }
21
- }, t = Symbol.for("@cupra/ui-kit/pubsub/2.0.0-canary.245"), n = globalThis, r = n[t];
21
+ }, t = Symbol.for("@cupra/ui-kit/pubsub/2.0.0-canary.247"), n = globalThis, r = n[t];
22
22
  r || (r = new e(), Object.defineProperty(n, t, {
23
23
  value: r,
24
24
  writable: !1,
@@ -1,4 +1,4 @@
1
1
  //#region src/utils/version.ts
2
- var e = "2.0.0-canary.245", t = `--v${e.replaceAll(".", "-")}`;
2
+ var e = "2.0.0-canary.247", t = `--v${e.replaceAll(".", "-")}`;
3
3
  //#endregion
4
4
  export { e as VERSION, t as VERSION_TAG_SUFFIX };
@@ -6,6 +6,7 @@ interface IconNamesConfig {
6
6
  interface BrandConfig {
7
7
  'icon-names': IconNamesConfig;
8
8
  'icon-button-variant'?: string;
9
+ 'title-text-transform'?: string;
9
10
  }
10
11
  type ThemeConfig = {
11
12
  [brand: string]: BrandConfig;
@@ -6,15 +6,12 @@ export declare class DsThemeProvider extends LitElement {
6
6
  loadUnusedStyles: DsThemeProviderAttrs['load-unused-styles'];
7
7
  theme: DsThemeProviderAttrs['theme'];
8
8
  private cssLoaded;
9
- private loadedFonts;
10
9
  private documentAttributesObserver?;
11
10
  connectedCallback(): void;
12
11
  disconnectedCallback(): void;
13
12
  private observeDocumentAttributes;
14
13
  private publishDocumentAttributes;
15
14
  protected updated(changedProperties: PropertyValues): void;
16
- private loadThemeFonts;
17
- private loadThemeFont;
18
15
  private loadThemeStyles;
19
16
  private applyUnusedStyles;
20
17
  render(): import("lit").TemplateResult<1> | typeof nothing;
@@ -0,0 +1 @@
1
+ export declare function addThemeFonts(theme: string): void;
@@ -1,8 +1,9 @@
1
- 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"),n=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 r=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),i=require("../base/UiKitElement.cjs"),a=require("./styles/common.styles.cjs"),o=require("./theme-config.cjs"),s=require("../../decorators/customUiKitElement.cjs"),c=require("../../utils/booleanConverter.cjs");require("../ds-icon/ds-icon.cjs");const l=require("./styles/cupra-diagonal.styles.cjs"),u=require("./styles/cupra.styles.cjs"),d=require("./styles/seat-legacy.styles.cjs"),f=require("./styles/seat.styles.cjs"),p=require("../../utils/uiKitHtml.cjs"),m=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 h=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/if-defined.cjs");var g=class extends i.UiKitElement{constructor(...e){super(...e),this.maxHeight=300,this.open=!1,this.mode=`light`,this.size=`large`,this.disabled=!1,this.showDivider=!0,this._open=!1}willUpdate(e){super.willUpdate(e),e.has(`open`)&&(this._open=this.open)}get containerClasses(){return{container:!0,disabled:this.disabled,open:this._open,[this.size]:!0,[this.mode]:!!this.mode}}get dividerClasses(){return{divider:!0,[this.mode]:!!this.mode}}get openIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.expandedIconName||(n==null?void 0:n.open)||`minus`;return p.uiKitHtml`<ds-icon class="icon open-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get closeIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.collapseIconName||(n==null?void 0:n.close)||`plus`;return p.uiKitHtml`<ds-icon class="icon close-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get styleTokens(){return e.html`
1
+ 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"),n=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 r=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),i=require("../base/UiKitElement.cjs"),a=require("./styles/common.styles.cjs"),o=require("./theme-config.cjs"),s=require("../../decorators/customUiKitElement.cjs"),c=require("../../utils/booleanConverter.cjs");require("../ds-icon/ds-icon.cjs");const l=require("./styles/cupra-diagonal.styles.cjs"),u=require("./styles/cupra.styles.cjs"),d=require("./styles/seat-legacy.styles.cjs"),f=require("./styles/seat.styles.cjs"),p=require("../../utils/uiKitHtml.cjs"),m=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 h=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/if-defined.cjs");var g=class extends i.UiKitElement{constructor(...e){super(...e),this.maxHeight=300,this.open=!1,this.mode=`light`,this.size=`large`,this.disabled=!1,this.showDivider=!0,this._open=!1}willUpdate(e){super.willUpdate(e),e.has(`open`)&&(this._open=this.open)}get containerClasses(){return{container:!0,disabled:this.disabled,open:this._open,[this.size]:!0,[this.mode]:!!this.mode}}get dividerClasses(){return{divider:!0,[this.mode]:!!this.mode}}get openIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.expandedIconName||(n==null?void 0:n.open)||`minus`;return p.uiKitHtml`<ds-icon class="icon open-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get closeIconTemplate(){var t;if(!this.theme)return e.nothing;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`icon-names`],r=this.collapseIconName||(n==null?void 0:n.close)||`plus`;return p.uiKitHtml`<ds-icon class="icon close-icon" role="presentation" icon-name=${h.ifDefined(r)}></ds-icon>`}get styleTokens(){var t;let n=(t=o.themeConfig[this.theme])==null?void 0:t[`title-text-transform`];return e.html`
2
2
  <style>
3
3
  :host{
4
4
  color-scheme: ${this.mode};
5
5
  pointer-events: ${this.disabled?`none`:`auto`};
6
+ ${n?`--ui-kit-private-accordion-title-text-transform: ${n};`:``}
6
7
  }
7
8
  </style>
8
9
  `}handleKeyDown(e){this.disabled&&(e.preventDefault(),e.stopPropagation())}handleToggle(e){this._open=e.newState===`open`}render(){return e.html`
@@ -22,6 +22,7 @@ const e=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_mo
22
22
  justify-content: space-between;
23
23
  cursor: pointer;
24
24
  user-select: none;
25
+ text-transform: var(--ui-kit-private-accordion-title-text-transform, none);
25
26
  }
26
27
 
27
28
  .open .close-icon,
@@ -1 +1 @@
1
- var e={cupra:{"icon-names":{open:`minus`,close:`plus`},"icon-button-variant":`secondary`},"cupra-diagonal":{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`},seat:{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`}};exports.themeConfig=e;
1
+ var e={cupra:{"icon-names":{open:`minus`,close:`plus`},"icon-button-variant":`secondary`},"cupra-diagonal":{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`,"title-text-transform":`uppercase`},seat:{"icon-names":{open:`arrow-up`,close:`arrow-down`},"icon-button-variant":`primary`,"title-text-transform":`none`}};exports.themeConfig=e;
@@ -1,4 +1 @@
1
- const e=require("../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.cjs"),t=require("./themeContext.cjs");require("../../core/theme.constants.cjs");const n=require("../../utils/PubSub.cjs"),r=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.cjs"),i=require("../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.cjs"),o=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 s=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),c=require("../../decorators/customUiKitElement.cjs"),l=require("../../utils/booleanConverter.cjs"),u=require("../../styles/source/shared/fonts-config.cjs");var d=class extends i.LitElement{constructor(...e){super(...e),this.loadFonts=!0,this.loadStyles=!0,this.loadUnusedStyles=!0,this.cssLoaded=!1,this.loadedFonts=new Set}connectedCallback(){super.connectedCallback(),this.publishDocumentAttributes(),this.observeDocumentAttributes()}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.documentAttributesObserver)==null||e.disconnect(),this.documentAttributesObserver=void 0}observeDocumentAttributes(){typeof MutationObserver<`u`&&typeof document<`u`&&(this.documentAttributesObserver=new MutationObserver(()=>this.publishDocumentAttributes()),this.documentAttributesObserver.observe(document.documentElement,{attributes:!0,attributeFilter:[`dir`,`lang`]}))}publishDocumentAttributes(){if(typeof document>`u`)return;let{documentElement:e}=document;n.pubSub.publish(`direction`,e.getAttribute(`dir`)===`rtl`?`rtl`:`ltr`),n.pubSub.publish(`lang`,e.getAttribute(`lang`))}updated(e){if(super.updated(e),e.has(`theme`)){var t,r;n.pubSub.publish(`theme`,this.theme),(t=sessionStorage)==null||t.setItem(`@cupra/ui-kit/theme`,this.theme),typeof FontFace<`u`&&(r=document)!=null&&r.fonts&&this.loadThemeFonts(),this.loadThemeStyles().then(()=>{this.cssLoaded=!0,this.dispatchEvent(new CustomEvent(`ui-kit:ready`,{bubbles:!0,composed:!0}))})}}loadThemeFonts(){var e;(e=u.fontsConfig[this.theme])==null||e.fonts.forEach(e=>{this.loadThemeFont(e)})}async loadThemeFont({weight:e,name:t,file:n,unicodeRange:r,display:i}){if(!this.loadFonts)return Promise.resolve();let a=r?`${t}-${e}-${r}`:`${t}-${e}`;if(this.loadedFonts.has(a))return;let o=new FontFace(t,`url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff2') format('woff2'),
2
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff') format('woff'),
3
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.ttf') format('truetype'),
4
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.otf') format('opentype')`,{style:`normal`,weight:e,display:i??(r?`swap`:`optional`),...r&&{unicodeRange:r}});try{r||await o.load(),document.fonts.add(o),this.loadedFonts.add(a)}catch(n){console.error(`Error loading "${t}" font with "${e}" weight:`,n)}}loadThemeStyles(){let e=`/2.0.0-canary.245`;return this.loadUnusedStyles&&this.applyUnusedStyles(e),this.loadStyles?new Promise((t,n)=>{let r=`https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;if(document.head.querySelector(`link[href="${r}"]`))t();else{let i=`ui-kit-theme-${e}`,a=document.getElementById(i),o=document.createElement(`link`);o.id=i,o.rel=`stylesheet`,o.href=r,o.onload=()=>t(),o.onerror=()=>n(Error(`Failed to load theme CSS: ${r}`)),document.head.appendChild(o),a==null||a.remove()}}):Promise.resolve()}applyUnusedStyles(e){let t=`https://ds-assets.cupra.com${e}/styles/${this.theme}/unused-styles.css`;if(document.head.querySelector(`link[href="${t}"]`))return;let n=`ui-kit-unused-styles-${e}`,r=document.getElementById(n),i=document.createElement(`link`);i.id=n,i.rel=`preload`,i.as=`style`,i.href=t,i.onload=()=>{i.rel=`stylesheet`},document.head.appendChild(i),r==null||r.remove()}render(){return this.cssLoaded?r.html`<slot></slot>`:r.nothing}};s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-fonts`})],d.prototype,`loadFonts`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-styles`})],d.prototype,`loadStyles`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-unused-styles`})],d.prototype,`loadUnusedStyles`,void 0),s.default([e.provide({context:t.themeContext}),a.property({type:String})],d.prototype,`theme`,void 0),s.default([o.state()],d.prototype,`cssLoaded`,void 0),s.default([o.state()],d.prototype,`loadedFonts`,void 0),d=s.default([c.customUiKitElement(`ds-theme-provider`)],d),Object.defineProperty(exports,"DsThemeProvider",{enumerable:!0,get:function(){return d}});
1
+ const e=require("../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.cjs"),t=require("./themeContext.cjs");require("../../core/theme.constants.cjs");const n=require("../../utils/PubSub.cjs"),r=require("../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.cjs"),i=require("../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.cjs");require("../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.cjs"),o=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 s=require("../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.cjs"),c=require("../../decorators/customUiKitElement.cjs"),l=require("../../utils/booleanConverter.cjs"),u=require("./themeFonts.cjs");var d=class extends i.LitElement{constructor(...e){super(...e),this.loadFonts=!0,this.loadStyles=!0,this.loadUnusedStyles=!0,this.cssLoaded=!1}connectedCallback(){super.connectedCallback(),this.publishDocumentAttributes(),this.observeDocumentAttributes()}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.documentAttributesObserver)==null||e.disconnect(),this.documentAttributesObserver=void 0}observeDocumentAttributes(){typeof MutationObserver<`u`&&typeof document<`u`&&(this.documentAttributesObserver=new MutationObserver(()=>this.publishDocumentAttributes()),this.documentAttributesObserver.observe(document.documentElement,{attributes:!0,attributeFilter:[`dir`,`lang`]}))}publishDocumentAttributes(){if(typeof document>`u`)return;let{documentElement:e}=document;n.pubSub.publish(`direction`,e.getAttribute(`dir`)===`rtl`?`rtl`:`ltr`),n.pubSub.publish(`lang`,e.getAttribute(`lang`))}updated(e){if(super.updated(e),e.has(`theme`)){var t;n.pubSub.publish(`theme`,this.theme),(t=sessionStorage)==null||t.setItem(`@cupra/ui-kit/theme`,this.theme),this.loadFonts&&u.addThemeFonts(this.theme),this.loadThemeStyles().then(()=>{this.cssLoaded=!0,this.dispatchEvent(new CustomEvent(`ui-kit:ready`,{bubbles:!0,composed:!0}))})}}loadThemeStyles(){let e=`/2.0.0-canary.247`;return this.loadUnusedStyles&&this.applyUnusedStyles(e),this.loadStyles?new Promise((t,n)=>{let r=`https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;if(document.head.querySelector(`link[href="${r}"]`))t();else{let i=`ui-kit-theme-${e}`,a=document.getElementById(i),o=document.createElement(`link`);o.id=i,o.rel=`stylesheet`,o.href=r,o.onload=()=>t(),o.onerror=()=>n(Error(`Failed to load theme CSS: ${r}`)),document.head.appendChild(o),a==null||a.remove()}}):Promise.resolve()}applyUnusedStyles(e){let t=`https://ds-assets.cupra.com${e}/styles/${this.theme}/unused-styles.css`;if(document.head.querySelector(`link[href="${t}"]`))return;let n=`ui-kit-unused-styles-${e}`,r=document.getElementById(n),i=document.createElement(`link`);i.id=n,i.rel=`preload`,i.as=`style`,i.href=t,i.onload=()=>{i.rel=`stylesheet`},document.head.appendChild(i),r==null||r.remove()}render(){return this.cssLoaded?r.html`<slot></slot>`:r.nothing}};s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-fonts`})],d.prototype,`loadFonts`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-styles`})],d.prototype,`loadStyles`,void 0),s.default([a.property({type:Boolean,converter:l.booleanConverter,attribute:`load-unused-styles`})],d.prototype,`loadUnusedStyles`,void 0),s.default([e.provide({context:t.themeContext}),a.property({type:String})],d.prototype,`theme`,void 0),s.default([o.state()],d.prototype,`cssLoaded`,void 0),d=s.default([c.customUiKitElement(`ds-theme-provider`)],d),Object.defineProperty(exports,"DsThemeProvider",{enumerable:!0,get:function(){return d}});
@@ -0,0 +1 @@
1
+ var e={seat:[`SeatBcn-Regular`,`SeatBcn-Medium`],"seat-legacy":[`SeatBcn-Regular`,`SeatBcn-Medium`],"cupra-diagonal":[`CupraScreen-Regular`,`CupraScreen-Medium`],cupra:[`CupraScreen-Regular`,`CupraScreen-Medium`]};function t(t){var n;(n=e[t])==null||n.forEach(e=>r(t,e)),i(t)}function n(e,t){let n=`https://ds-assets.cupra.com/fonts/${e}/${t}.woff2`;return new URL(n,document.baseURI).href}function r(e,t){let r=n(e,t);if(Array.from(document.head.querySelectorAll(`link[rel="preload"]`)).some(e=>e.href===r))return;let i=document.createElement(`link`);i.rel=`preload`,i.as=`font`,i.type=`font/woff2`,i.href=r,i.crossOrigin=`anonymous`,document.head.appendChild(i)}function i(e){let t=`/2.0.0-canary.247`,n=`https://ds-assets.cupra.com${t}/styles/${e}/fonts.css`;if(document.head.querySelector(`link[href="${n}"]`))return;let r=`ui-kit-fonts-${t}`,i=document.getElementById(r),a=document.createElement(`link`);a.id=r,a.rel=`stylesheet`,a.href=n,document.head.appendChild(a),i==null||i.remove()}exports.addThemeFonts=t;
@@ -1 +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.245`),this.setAttribute(`data-ui-kit-component-name`,t)}})}}exports.customUiKitElement=t;
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.247`),this.setAttribute(`data-ui-kit-component-name`,t)}})}}exports.customUiKitElement=t;
@@ -1 +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.245`),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;
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.247`),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;
@@ -1 +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.245`),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;
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.247`),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;
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=`2.0.0-canary.245`,t=`--v${e.replaceAll(`.`,`-`)}`;exports.VERSION=e,exports.VERSION_TAG_SUFFIX=t;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=`2.0.0-canary.247`,t=`--v${e.replaceAll(`.`,`-`)}`;exports.VERSION=e,exports.VERSION_TAG_SUFFIX=t;
@@ -55,11 +55,14 @@ var _ = class extends a {
55
55
  return m`<ds-icon class="icon close-icon" role="presentation" icon-name=${g(r)}></ds-icon>`;
56
56
  }
57
57
  get styleTokens() {
58
+ var t;
59
+ let n = (t = s[this.theme]) == null ? void 0 : t["title-text-transform"];
58
60
  return e`
59
61
  <style>
60
62
  :host{
61
63
  color-scheme: ${this.mode};
62
64
  pointer-events: ${this.disabled ? "none" : "auto"};
65
+ ${n ? `--ui-kit-private-accordion-title-text-transform: ${n};` : ""}
63
66
  }
64
67
  </style>
65
68
  `;
@@ -25,6 +25,7 @@ var t = e`
25
25
  justify-content: space-between;
26
26
  cursor: pointer;
27
27
  user-select: none;
28
+ text-transform: var(--ui-kit-private-accordion-title-text-transform, none);
28
29
  }
29
30
 
30
31
  .open .close-icon,
@@ -12,14 +12,16 @@ var e = {
12
12
  open: "arrow-up",
13
13
  close: "arrow-down"
14
14
  },
15
- "icon-button-variant": "primary"
15
+ "icon-button-variant": "primary",
16
+ "title-text-transform": "uppercase"
16
17
  },
17
18
  seat: {
18
19
  "icon-names": {
19
20
  open: "arrow-up",
20
21
  close: "arrow-down"
21
22
  },
22
- "icon-button-variant": "primary"
23
+ "icon-button-variant": "primary",
24
+ "title-text-transform": "none"
23
25
  }
24
26
  };
25
27
  //#endregion
@@ -11,11 +11,11 @@ import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
11
11
  import c from "../../_virtual/_@oxc-project_runtime@0.152.0/helpers/esm/decorate.js";
12
12
  import { customUiKitElement as l } from "../../decorators/customUiKitElement.js";
13
13
  import { booleanConverter as u } from "../../utils/booleanConverter.js";
14
- import { fontsConfig as d } from "../../styles/source/shared/fonts-config.js";
14
+ import { addThemeFonts as d } from "./themeFonts.js";
15
15
  //#region src/components/ds-theme-provider/ds-theme-provider.ts
16
16
  var f = class extends a {
17
17
  constructor(...e) {
18
- super(...e), this.loadFonts = !0, this.loadStyles = !0, this.loadUnusedStyles = !0, this.cssLoaded = !1, this.loadedFonts = /* @__PURE__ */ new Set();
18
+ super(...e), this.loadFonts = !0, this.loadStyles = !0, this.loadUnusedStyles = !0, this.cssLoaded = !1;
19
19
  }
20
20
  connectedCallback() {
21
21
  super.connectedCallback(), this.publishDocumentAttributes(), this.observeDocumentAttributes();
@@ -37,8 +37,8 @@ var f = class extends a {
37
37
  }
38
38
  updated(e) {
39
39
  if (super.updated(e), e.has("theme")) {
40
- var t, r;
41
- n.publish("theme", this.theme), (t = sessionStorage) == null || t.setItem("@cupra/ui-kit/theme", this.theme), typeof FontFace < "u" && (r = document) != null && r.fonts && this.loadThemeFonts(), this.loadThemeStyles().then(() => {
40
+ var t;
41
+ n.publish("theme", this.theme), (t = sessionStorage) == null || t.setItem("@cupra/ui-kit/theme", this.theme), this.loadFonts && d(this.theme), this.loadThemeStyles().then(() => {
42
42
  this.cssLoaded = !0, this.dispatchEvent(new CustomEvent("ui-kit:ready", {
43
43
  bubbles: !0,
44
44
  composed: !0
@@ -46,33 +46,8 @@ var f = class extends a {
46
46
  });
47
47
  }
48
48
  }
49
- loadThemeFonts() {
50
- var e;
51
- (e = d[this.theme]) == null || e.fonts.forEach((e) => {
52
- this.loadThemeFont(e);
53
- });
54
- }
55
- async loadThemeFont({ weight: e, name: t, file: n, unicodeRange: r, display: i }) {
56
- if (!this.loadFonts) return Promise.resolve();
57
- let a = r ? `${t}-${e}-${r}` : `${t}-${e}`;
58
- if (this.loadedFonts.has(a)) return;
59
- let o = new FontFace(t, `url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff2') format('woff2'),
60
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff') format('woff'),
61
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.ttf') format('truetype'),
62
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.otf') format('opentype')`, {
63
- style: "normal",
64
- weight: e,
65
- display: i ?? (r ? "swap" : "optional"),
66
- ...r && { unicodeRange: r }
67
- });
68
- try {
69
- r || await o.load(), document.fonts.add(o), this.loadedFonts.add(a);
70
- } catch (n) {
71
- console.error(`Error loading "${t}" font with "${e}" weight:`, n);
72
- }
73
- }
74
49
  loadThemeStyles() {
75
- let e = "/2.0.0-canary.245";
50
+ let e = "/2.0.0-canary.247";
76
51
  return this.loadUnusedStyles && this.applyUnusedStyles(e), this.loadStyles ? new Promise((t, n) => {
77
52
  let r = `https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;
78
53
  if (document.head.querySelector(`link[href="${r}"]`)) t();
@@ -106,6 +81,6 @@ c([o({
106
81
  type: Boolean,
107
82
  converter: u,
108
83
  attribute: "load-unused-styles"
109
- })], f.prototype, "loadUnusedStyles", void 0), c([e({ context: t }), o({ type: String })], f.prototype, "theme", void 0), c([s()], f.prototype, "cssLoaded", void 0), c([s()], f.prototype, "loadedFonts", void 0), f = c([l("ds-theme-provider")], f);
84
+ })], f.prototype, "loadUnusedStyles", void 0), c([e({ context: t }), o({ type: String })], f.prototype, "theme", void 0), c([s()], f.prototype, "cssLoaded", void 0), f = c([l("ds-theme-provider")], f);
110
85
  //#endregion
111
86
  export { f as DsThemeProvider };
@@ -0,0 +1,29 @@
1
+ //#region src/components/ds-theme-provider/themeFonts.ts
2
+ var e = {
3
+ seat: ["SeatBcn-Regular", "SeatBcn-Medium"],
4
+ "seat-legacy": ["SeatBcn-Regular", "SeatBcn-Medium"],
5
+ "cupra-diagonal": ["CupraScreen-Regular", "CupraScreen-Medium"],
6
+ cupra: ["CupraScreen-Regular", "CupraScreen-Medium"]
7
+ };
8
+ function t(t) {
9
+ var n;
10
+ (n = e[t]) == null || n.forEach((e) => r(t, e)), i(t);
11
+ }
12
+ function n(e, t) {
13
+ let n = `https://ds-assets.cupra.com/fonts/${e}/${t}.woff2`;
14
+ return new URL(n, document.baseURI).href;
15
+ }
16
+ function r(e, t) {
17
+ let r = n(e, t);
18
+ if (Array.from(document.head.querySelectorAll("link[rel=\"preload\"]")).some((e) => e.href === r)) return;
19
+ let i = document.createElement("link");
20
+ i.rel = "preload", i.as = "font", i.type = "font/woff2", i.href = r, i.crossOrigin = "anonymous", document.head.appendChild(i);
21
+ }
22
+ function i(e) {
23
+ let t = "/2.0.0-canary.247", n = `https://ds-assets.cupra.com${t}/styles/${e}/fonts.css`;
24
+ if (document.head.querySelector(`link[href="${n}"]`)) return;
25
+ let r = `ui-kit-fonts-${t}`, i = document.getElementById(r), a = document.createElement("link");
26
+ a.id = r, a.rel = "stylesheet", a.href = n, document.head.appendChild(a), i == null || i.remove();
27
+ }
28
+ //#endregion
29
+ export { t as addThemeFonts };
@@ -8,7 +8,7 @@ function t(t) {
8
8
  (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 {
9
9
  connectedCallback() {
10
10
  var e;
11
- (e = n.prototype.connectedCallback) == null || e.call(this), this.setAttribute("data-ui-kit-version", "2.0.0-canary.245"), this.setAttribute("data-ui-kit-component-name", t);
11
+ (e = n.prototype.connectedCallback) == null || e.call(this), this.setAttribute("data-ui-kit-version", "2.0.0-canary.247"), this.setAttribute("data-ui-kit-component-name", t);
12
12
  }
13
13
  });
14
14
  };
@@ -26,7 +26,7 @@ var n = class {
26
26
  return console.error(`Failed to fetch icon "${e}":`, t), "";
27
27
  }), t.subscribe("theme", this.handleChangeTheme);
28
28
  }
29
- }, r = Symbol.for("@cupra/ui-kit/icons-manager/2.0.0-canary.245"), i = globalThis, a = i[r];
29
+ }, r = Symbol.for("@cupra/ui-kit/icons-manager/2.0.0-canary.247"), i = globalThis, a = i[r];
30
30
  a || (a = new n(), Object.defineProperty(i, r, {
31
31
  value: a,
32
32
  writable: !1,
@@ -18,7 +18,7 @@ var e = class {
18
18
  }
19
19
  });
20
20
  }
21
- }, t = Symbol.for("@cupra/ui-kit/pubsub/2.0.0-canary.245"), n = globalThis, r = n[t];
21
+ }, t = Symbol.for("@cupra/ui-kit/pubsub/2.0.0-canary.247"), n = globalThis, r = n[t];
22
22
  r || (r = new e(), Object.defineProperty(n, t, {
23
23
  value: r,
24
24
  writable: !1,
@@ -1,4 +1,4 @@
1
1
  //#region src/utils/version.ts
2
- var e = "2.0.0-canary.245", t = `--v${e.replaceAll(".", "-")}`;
2
+ var e = "2.0.0-canary.247", t = `--v${e.replaceAll(".", "-")}`;
3
3
  //#endregion
4
4
  export { e as VERSION, t as VERSION_TAG_SUFFIX };
@@ -6,6 +6,7 @@ interface IconNamesConfig {
6
6
  interface BrandConfig {
7
7
  'icon-names': IconNamesConfig;
8
8
  'icon-button-variant'?: string;
9
+ 'title-text-transform'?: string;
9
10
  }
10
11
  type ThemeConfig = {
11
12
  [brand: string]: BrandConfig;
@@ -6,15 +6,12 @@ export declare class DsThemeProvider extends LitElement {
6
6
  loadUnusedStyles: DsThemeProviderAttrs['load-unused-styles'];
7
7
  theme: DsThemeProviderAttrs['theme'];
8
8
  private cssLoaded;
9
- private loadedFonts;
10
9
  private documentAttributesObserver?;
11
10
  connectedCallback(): void;
12
11
  disconnectedCallback(): void;
13
12
  private observeDocumentAttributes;
14
13
  private publishDocumentAttributes;
15
14
  protected updated(changedProperties: PropertyValues): void;
16
- private loadThemeFonts;
17
- private loadThemeFont;
18
15
  private loadThemeStyles;
19
16
  private applyUnusedStyles;
20
17
  render(): import("lit").TemplateResult<1> | typeof nothing;
@@ -0,0 +1 @@
1
+ export declare function addThemeFonts(theme: string): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cupra/ui-kit",
3
- "version": "2.0.0-canary.245",
3
+ "version": "2.0.0-canary.247",
4
4
  "description": "Web components library",
5
5
  "author": "SEAT S.A.",
6
6
  "license": "SEAT S.A. Library EULA 1.0",
@@ -144,7 +144,7 @@
144
144
  "clean-dist:react": "rm -rf ./dist-react",
145
145
  "build-ts": "tsc -p tsconfig.prod.json && tsc-alias -p tsconfig.prod.json",
146
146
  "build-ts:react": "tsc -p tsconfig.react.json && tsc-alias -p tsconfig.react.json",
147
- "build-assets": "pnpm build:tokens && postcss src/styles/source/themes/**/theme.css --dir .tmp/styles --base src/styles/source/themes && node scripts/split-theme-tokens/split-theme-tokens.js && node scripts/build-icons-zip/build-icons-zip.js",
147
+ "build-assets": "pnpm build:tokens && postcss src/styles/source/themes/**/theme.css --dir .tmp/styles --base src/styles/source/themes && node scripts/split-theme-tokens/split-theme-tokens.js && postcss src/styles/source/themes/**/fonts.css --dir public/assets/styles --base src/styles/source/themes && node scripts/build-icons-zip/build-icons-zip.js",
148
148
  "build-breakpoints": "mkdir -p dist/styles && cp src/styles/source/shared/breakpoints.css dist/styles/breakpoints.css",
149
149
  "build": "pnpm build-assets && pnpm clean-dist && pnpm build-ts && BUILD_FORMAT=esm vite build --emptyOutDir false && BUILD_FORMAT=cjs vite build --emptyOutDir false && pnpm build-breakpoints",
150
150
  "build-cdn": "pnpm build-assets && pnpm clean-dist-cdn && vite build --config vite.cdn.config.js --mode production",
@@ -1 +0,0 @@
1
- var e={cupra:{fonts:[{name:`cupra-screen`,weight:`300`,file:`CupraScreen-Light`},{name:`cupra-screen`,weight:`350`,file:`CupraScreen-Book`},{name:`cupra-screen`,weight:`400`,file:`CupraScreen-Regular`},{name:`cupra-screen`,weight:`500`,file:`CupraScreen-Medium`}]},"cupra-diagonal":{fonts:[{name:`cupra-screen`,weight:`300`,file:`CupraScreen-Light`},{name:`cupra-screen`,weight:`350`,file:`CupraScreen-Book`},{name:`cupra-screen`,weight:`400`,file:`CupraScreen-Regular`},{name:`cupra-screen`,weight:`500`,file:`CupraScreen-Medium`}]},seat:{fonts:[{name:`seat`,weight:`350`,file:`SeatBcn-Book`},{name:`seat`,weight:`400`,file:`SeatBcn-Regular`},{name:`seat`,weight:`500`,file:`SeatBcn-Medium`},{name:`seat`,weight:`700`,file:`SeatBcn-Bold`},{name:`seat`,weight:`900`,file:`SeatBcn-Black`}]},"seat-legacy":{fonts:[{name:`seat`,weight:`400`,file:`SeatBcn-Regular`},{name:`seat`,weight:`500`,file:`SeatBcn-Medium`},{name:`seat`,weight:`700`,file:`SeatBcn-Bold`}]}};exports.fontsConfig=e;
@@ -1,93 +0,0 @@
1
- //#region src/styles/source/shared/fonts-config.ts
2
- var e = {
3
- cupra: { fonts: [
4
- {
5
- name: "cupra-screen",
6
- weight: "300",
7
- file: "CupraScreen-Light"
8
- },
9
- {
10
- name: "cupra-screen",
11
- weight: "350",
12
- file: "CupraScreen-Book"
13
- },
14
- {
15
- name: "cupra-screen",
16
- weight: "400",
17
- file: "CupraScreen-Regular"
18
- },
19
- {
20
- name: "cupra-screen",
21
- weight: "500",
22
- file: "CupraScreen-Medium"
23
- }
24
- ] },
25
- "cupra-diagonal": { fonts: [
26
- {
27
- name: "cupra-screen",
28
- weight: "300",
29
- file: "CupraScreen-Light"
30
- },
31
- {
32
- name: "cupra-screen",
33
- weight: "350",
34
- file: "CupraScreen-Book"
35
- },
36
- {
37
- name: "cupra-screen",
38
- weight: "400",
39
- file: "CupraScreen-Regular"
40
- },
41
- {
42
- name: "cupra-screen",
43
- weight: "500",
44
- file: "CupraScreen-Medium"
45
- }
46
- ] },
47
- seat: { fonts: [
48
- {
49
- name: "seat",
50
- weight: "350",
51
- file: "SeatBcn-Book"
52
- },
53
- {
54
- name: "seat",
55
- weight: "400",
56
- file: "SeatBcn-Regular"
57
- },
58
- {
59
- name: "seat",
60
- weight: "500",
61
- file: "SeatBcn-Medium"
62
- },
63
- {
64
- name: "seat",
65
- weight: "700",
66
- file: "SeatBcn-Bold"
67
- },
68
- {
69
- name: "seat",
70
- weight: "900",
71
- file: "SeatBcn-Black"
72
- }
73
- ] },
74
- "seat-legacy": { fonts: [
75
- {
76
- name: "seat",
77
- weight: "400",
78
- file: "SeatBcn-Regular"
79
- },
80
- {
81
- name: "seat",
82
- weight: "500",
83
- file: "SeatBcn-Medium"
84
- },
85
- {
86
- name: "seat",
87
- weight: "700",
88
- file: "SeatBcn-Bold"
89
- }
90
- ] }
91
- };
92
- //#endregion
93
- export { e as fontsConfig };
@@ -1,15 +0,0 @@
1
- type FontDisplay = 'auto' | 'block' | 'swap' | 'fallback' | 'optional';
2
- export interface FontConfig {
3
- name: string;
4
- weight: string;
5
- file: string;
6
- unicodeRange?: string;
7
- display?: FontDisplay;
8
- }
9
- interface FontsConfig {
10
- [key: string]: {
11
- fonts: Array<FontConfig>;
12
- };
13
- }
14
- export declare const fontsConfig: FontsConfig;
15
- export {};
@@ -1 +0,0 @@
1
- var e={cupra:{fonts:[{name:`cupra-screen`,weight:`300`,file:`CupraScreen-Light`},{name:`cupra-screen`,weight:`350`,file:`CupraScreen-Book`},{name:`cupra-screen`,weight:`400`,file:`CupraScreen-Regular`},{name:`cupra-screen`,weight:`500`,file:`CupraScreen-Medium`}]},"cupra-diagonal":{fonts:[{name:`cupra-screen`,weight:`300`,file:`CupraScreen-Light`},{name:`cupra-screen`,weight:`350`,file:`CupraScreen-Book`},{name:`cupra-screen`,weight:`400`,file:`CupraScreen-Regular`},{name:`cupra-screen`,weight:`500`,file:`CupraScreen-Medium`}]},seat:{fonts:[{name:`seat`,weight:`350`,file:`SeatBcn-Book`},{name:`seat`,weight:`400`,file:`SeatBcn-Regular`},{name:`seat`,weight:`500`,file:`SeatBcn-Medium`},{name:`seat`,weight:`700`,file:`SeatBcn-Bold`},{name:`seat`,weight:`900`,file:`SeatBcn-Black`}]},"seat-legacy":{fonts:[{name:`seat`,weight:`400`,file:`SeatBcn-Regular`},{name:`seat`,weight:`500`,file:`SeatBcn-Medium`},{name:`seat`,weight:`700`,file:`SeatBcn-Bold`}]}};exports.fontsConfig=e;
@@ -1,93 +0,0 @@
1
- //#region src/styles/source/shared/fonts-config.ts
2
- var e = {
3
- cupra: { fonts: [
4
- {
5
- name: "cupra-screen",
6
- weight: "300",
7
- file: "CupraScreen-Light"
8
- },
9
- {
10
- name: "cupra-screen",
11
- weight: "350",
12
- file: "CupraScreen-Book"
13
- },
14
- {
15
- name: "cupra-screen",
16
- weight: "400",
17
- file: "CupraScreen-Regular"
18
- },
19
- {
20
- name: "cupra-screen",
21
- weight: "500",
22
- file: "CupraScreen-Medium"
23
- }
24
- ] },
25
- "cupra-diagonal": { fonts: [
26
- {
27
- name: "cupra-screen",
28
- weight: "300",
29
- file: "CupraScreen-Light"
30
- },
31
- {
32
- name: "cupra-screen",
33
- weight: "350",
34
- file: "CupraScreen-Book"
35
- },
36
- {
37
- name: "cupra-screen",
38
- weight: "400",
39
- file: "CupraScreen-Regular"
40
- },
41
- {
42
- name: "cupra-screen",
43
- weight: "500",
44
- file: "CupraScreen-Medium"
45
- }
46
- ] },
47
- seat: { fonts: [
48
- {
49
- name: "seat",
50
- weight: "350",
51
- file: "SeatBcn-Book"
52
- },
53
- {
54
- name: "seat",
55
- weight: "400",
56
- file: "SeatBcn-Regular"
57
- },
58
- {
59
- name: "seat",
60
- weight: "500",
61
- file: "SeatBcn-Medium"
62
- },
63
- {
64
- name: "seat",
65
- weight: "700",
66
- file: "SeatBcn-Bold"
67
- },
68
- {
69
- name: "seat",
70
- weight: "900",
71
- file: "SeatBcn-Black"
72
- }
73
- ] },
74
- "seat-legacy": { fonts: [
75
- {
76
- name: "seat",
77
- weight: "400",
78
- file: "SeatBcn-Regular"
79
- },
80
- {
81
- name: "seat",
82
- weight: "500",
83
- file: "SeatBcn-Medium"
84
- },
85
- {
86
- name: "seat",
87
- weight: "700",
88
- file: "SeatBcn-Bold"
89
- }
90
- ] }
91
- };
92
- //#endregion
93
- export { e as fontsConfig };
@@ -1,15 +0,0 @@
1
- type FontDisplay = 'auto' | 'block' | 'swap' | 'fallback' | 'optional';
2
- export interface FontConfig {
3
- name: string;
4
- weight: string;
5
- file: string;
6
- unicodeRange?: string;
7
- display?: FontDisplay;
8
- }
9
- interface FontsConfig {
10
- [key: string]: {
11
- fonts: Array<FontConfig>;
12
- };
13
- }
14
- export declare const fontsConfig: FontsConfig;
15
- export {};