@cupra/ui-kit 2.0.0-canary.119 → 2.0.0-canary.121

package/dist-react/esm/utils/StylesRegistry/StylesRegistry.js

@@ -4,7 +4,7 @@ var t = e(20), n = class e {
 	constructor() {
 		this.stylePromises = /* @__PURE__ */ new Map(), this.getStyles = async ({ componentName: e, theme: n }) => {
 			if (!n || !e) return;
-			let r = `https://ds-assets.cupra.com/2.0.0-canary.119/styles/${n}/components/${e}.css`, i = this.getCachedStyleSheetPromise({ url: r });
+			let r = `https://ds-assets.cupra.com/2.0.0-canary.121/styles/${n}/components/${e}.css`, i = this.getCachedStyleSheetPromise({ url: r });
 			if (i) return i;
 			let a = t(() => this.fetchStyle({ url: r })).then((e) => (e || this.stylePromises.delete(r), e));
 			return this.stylePromises.set(r, a), this.stylePromises.get(r);

package/dist-react/esm/utils/componentFactory.js

@@ -54,6 +54,9 @@ var i = t(`ds-icon${r}`), a = t(`ds-calendar-day${r}`), o = t(`ds-button${r}`),
                 rel=${t?.rel}
                 target=${t?.target}
                 data-testid=${t?.["data-testid"]}
+                base-variant=${e(t?.["base-variant"])}
+                custom-background=${e(t?.["custom-background"])}
+                custom-color=${e(t?.["custom-color"])}
             >
                 ${t.children}
             </${o}>
@@ -82,6 +85,9 @@ var i = t(`ds-icon${r}`), a = t(`ds-calendar-day${r}`), o = t(`ds-button${r}`),
                 target=${t?.target}
                 data-testid=${t?.["data-testid"]}
                 data-aria-label=${t?.["data-aria-label"]}
+                base-variant=${e(t?.["base-variant"])}
+                custom-background=${e(t?.["custom-background"])}
+                custom-color=${e(t?.["custom-color"])}
             >
                 ${t.children}
             </${c}>

package/dist-react/esm/utils/cssWithTokens.js

@@ -2,7 +2,7 @@ import { i as e, r as t } from "../node_modules/.pnpm/@lit_reactive-element@2.1.
 import "../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
 //#region src/utils/cssWithTokens.ts
 function n(n, ...r) {
-	return e`${t(String.raw({ raw: n }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-119"))}`;
+	return e`${t(String.raw({ raw: n }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-121"))}`;
 }
 //#endregion
 export { n as cssWithTokens };

package/dist-react/esm/utils/htmlWithTokens.js

@@ -4,7 +4,7 @@ import { o as t } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-ht
 import "../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/unsafe-html.js";
 //#region src/utils/htmlWithTokens.ts
 function n(n, ...r) {
-	return e`${t(String.raw({ raw: n }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-119"))}`;
+	return e`${t(String.raw({ raw: n }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-121"))}`;
 }
 //#endregion
 export { n as htmlWithTokens };

package/dist-react/esm/utils/version.js

@@ -1,4 +1,4 @@
 //#region src/utils/version.ts
-var e = "2.0.0-canary.119", t = `--v${e.replaceAll(".", "-")}`;
+var e = "2.0.0-canary.121", t = `--v${e.replaceAll(".", "-")}`;
 //#endregion
 export { e as VERSION, t as VERSION_TAG_SUFFIX };

package/dist-react/types/components/ds-button/ds-button.d.ts

@@ -1,5 +1,5 @@
 import { UiKitElement } from '../base/UiKitElement.ts';
-import { nothing } from 'lit';
+import { type PropertyValues, nothing } from 'lit';
 import type { DsButtonAttrs } from './ds-button.types';
 declare const DsButton_base: (new (...args: any[]) => import("../../mixins/ViewportMixin").ViewportInterface) & typeof UiKitElement;
 export declare class DsButton extends DsButton_base {
@@ -19,6 +19,9 @@ export declare class DsButton extends DsButton_base {
     fullWidth: DsButtonAttrs['full-width'];
     loading: DsButtonAttrs['loading'];
     textLoading: DsButtonAttrs['text-loading'];
+    baseVariant: DsButtonAttrs['base-variant'];
+    customBackground: DsButtonAttrs['custom-background'];
+    customColor: DsButtonAttrs['custom-color'];
     private closestForm;
     static styles: import("lit").CSSResult[];
     connectedCallback(): void;
@@ -36,6 +39,7 @@ export declare class DsButton extends DsButton_base {
     protected get iconTemplate(): any;
     protected get loadingTemplate(): typeof nothing | import("lit").TemplateResult<1>;
     protected get contentTemplate(): import("lit").TemplateResult<1>;
+    updated(changedProperties: PropertyValues): void;
     protected get cssTokens(): import("lit").HTMLTemplateResult;
     render(): import("lit").TemplateResult<1>;
 }

package/dist-react/types/components/ds-button/ds-button.types.d.ts

@@ -23,8 +23,7 @@ type CustomElement = {
     target?: never;
 };
 type HtmlElement = Link | Button | CustomElement;
-export type DsButtonAttrs = {
-    variant?: string;
+type SharedButtonAttrs = {
     mode?: 'dark' | 'light';
     disabled?: boolean;
     destructive?: boolean;
@@ -37,5 +36,19 @@ export type DsButtonAttrs = {
     'full-width'?: boolean;
     loading?: boolean;
     'text-loading'?: string;
-} & HtmlElement & CommonAttrs;
+};
+export type DsButtonStandardVariant = 'primary' | 'secondary' | 'tertiary' | 'naked';
+type StandardVariantAttrs = {
+    variant?: DsButtonStandardVariant;
+    'base-variant'?: never;
+    'custom-background'?: never;
+    'custom-color'?: never;
+};
+type CustomVariantAttrs = {
+    variant: 'custom';
+    'base-variant'?: DsButtonStandardVariant;
+    'custom-background'?: string;
+    'custom-color'?: string;
+};
+export type DsButtonAttrs = (StandardVariantAttrs | CustomVariantAttrs) & SharedButtonAttrs & HtmlElement & CommonAttrs;
 export {};

package/dist-react/types/components/ds-checkbox/ds-checkbox.d.ts

@@ -6,7 +6,10 @@ export declare class DsCheckbox extends DsCheckbox_base {
     name: DsCheckboxAttrs['name'];
     value: DsCheckboxAttrs['value'];
     inputPlacement: DsCheckboxAttrs['input-placement'];
-    checked: DsCheckboxAttrs['checked'];
+    _checked: DsCheckboxAttrs['checked'];
+    private _checkedState;
+    get checked(): boolean;
+    set checked(value: boolean | undefined);
     required: DsCheckboxAttrs['required'];
     _disabled: DsCheckboxAttrs['disabled'];
     mode: DsCheckboxAttrs['mode'];

package/dist-react/types/components/ds-dialog/ds-dialog.d.ts

@@ -7,7 +7,10 @@ export declare class DsDialog extends UiKitElement {
     protected componentFactory: ComponentFactory;
     lockClose: DsDialogAttrs['lock-close'];
     lockScroll: DsDialogAttrs['lock-scroll'];
-    open: DsDialogAttrs['open'];
+    _open: DsDialogAttrs['open'];
+    private _openState;
+    get open(): boolean;
+    set open(value: DsDialogAttrs['open']);
     size: DsDialogAttrs['size'];
     dataAriaLabel: DsDialogAttrs['data-aria-label'];
     dataAriaDescription: DsDialogAttrs['data-aria-description'];

package/dist-react/types/components/ds-dialog-fullscreen/ds-dialog-fullscreen.d.ts

@@ -5,7 +5,10 @@ export declare class DsDialogFullscreen extends UiKitElement {
     static styles: import("lit").CSSResult[];
     lockClose: DsDialogFullscreenAttrs['lock-close'];
     lockScroll: DsDialogFullscreenAttrs['lock-scroll'];
-    open: DsDialogFullscreenAttrs['open'];
+    _open: DsDialogFullscreenAttrs['open'];
+    private _openState;
+    get open(): boolean;
+    set open(value: DsDialogFullscreenAttrs['open']);
     hasScroll: boolean;
     private hasBeenOpened;
     protected content: HTMLInputElement;

package/dist-react/types/components/ds-drawer/ds-drawer.d.ts

@@ -3,7 +3,10 @@ import { PropertyValues } from 'lit';
 import type { DsDrawerAttrs } from './ds-drawer.types.ts';
 export declare class DsDrawer extends UiKitElement {
     static styles: import("lit").CSSResult[];
-    open: DsDrawerAttrs['open'];
+    _open: DsDrawerAttrs['open'];
+    private _openState;
+    get open(): boolean;
+    set open(value: DsDrawerAttrs['open']);
     private get classes();
     private handleOverlayClick;
     private handleKeyDown;

package/dist-react/types/components/ds-drawer/ds-drawer.types.d.ts

@@ -1,4 +1,4 @@
 import { CommonAttrs } from '../../types/types';
 export interface DsDrawerAttrs extends CommonAttrs {
-    open: boolean;
+    open?: boolean;
 }

package/dist-react/types/components/ds-icon-button/ds-icon-button.d.ts

@@ -1,10 +1,13 @@
 import { UiKitElement } from '../base/UiKitElement.ts';
 import type { DsIconButtonAttrs } from '../ds-icon-button/ds-icon-button.types.ts';
-import { type TemplateResult } from 'lit';
+import { type PropertyValues, type TemplateResult } from 'lit';
 declare const DsIconButton_base: (new (...args: any[]) => import("../../mixins/ViewportMixin.ts").ViewportInterface) & typeof UiKitElement;
 export declare class DsIconButton extends DsIconButton_base {
     static styles: import("lit").CSSResult[];
     variant: DsIconButtonAttrs['variant'];
+    baseVariant: DsIconButtonAttrs['base-variant'];
+    customBackground: DsIconButtonAttrs['custom-background'];
+    customColor: DsIconButtonAttrs['custom-color'];
     mode: DsIconButtonAttrs['mode'];
     size: DsIconButtonAttrs['size'];
     disabled: DsIconButtonAttrs['disabled'];
@@ -23,6 +26,7 @@ export declare class DsIconButton extends DsIconButton_base {
         custom: boolean;
         disabled: boolean;
     };
+    updated(changedProperties: PropertyValues): void;
     protected get variantColorTokens(): TemplateResult;
     render(): TemplateResult<1>;
 }

package/dist-react/types/components/ds-icon-button/ds-icon-button.types.d.ts

@@ -23,12 +23,25 @@ type CustomElement = {
     target?: never;
 };
 type HtmlElement = Link | Button | CustomElement;
-export type DsIconButtonAttrs = {
-    variant?: string;
+type SharedIconButtonAttrs = {
     mode?: 'dark' | 'light';
     size?: Size | ResponsiveSize;
     disabled?: boolean;
     'data-aria-label'?: string;
     'icon-name'?: DsIconAttrs['icon-name'];
-} & HtmlElement & CommonAttrs;
+};
+export type DsIconButtonStandardVariant = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'naked' | 'rounded';
+type StandardVariantAttrs = {
+    variant?: DsIconButtonStandardVariant;
+    'base-variant'?: never;
+    'custom-background'?: never;
+    'custom-color'?: never;
+};
+type CustomVariantAttrs = {
+    variant: 'custom';
+    'base-variant'?: DsIconButtonStandardVariant;
+    'custom-background'?: string;
+    'custom-color'?: string;
+};
+export type DsIconButtonAttrs = (StandardVariantAttrs | CustomVariantAttrs) & SharedIconButtonAttrs & HtmlElement & CommonAttrs;
 export {};

package/dist-react/types/components/ds-media-control/ds-media-control.d.ts

@@ -2,7 +2,10 @@ import { UiKitElement } from '../base/UiKitElement.ts';
 import type { DsMediaControlAttrs } from './ds-media-control.types.ts';
 export declare class DsMediaControl extends UiKitElement {
     static styles: import("lit").CSSResult[];
-    state: DsMediaControlAttrs['state'];
+    _state: DsMediaControlAttrs['state'];
+    private _stateValue;
+    get state(): DsMediaControlAttrs['state'];
+    set state(value: DsMediaControlAttrs['state']);
     size: DsMediaControlAttrs['size'];
     progress: DsMediaControlAttrs['progress'];
     private get normalizedProgress();

package/dist-react/types/components/ds-tabs/ds-tabs.d.ts

@@ -3,7 +3,10 @@ import { type PropertyValues, type TemplateResult } from 'lit';
 import type { DsTabsAttrs } from './ds-tabs.types';
 export declare class DsTabs extends UiKitElement {
     static styles: import("lit").CSSResult[];
-    selectedTab: DsTabsAttrs['selected-tab'];
+    _selectedTab: DsTabsAttrs['selected-tab'];
+    private _selectedTabState;
+    get selectedTab(): number;
+    set selectedTab(value: DsTabsAttrs['selected-tab']);
     mode: DsTabsAttrs['mode'];
     variant: string;
     size: DsTabsAttrs['size'];

package/dist-react/types/components/ds-toggle-switch/ds-toggle-switch.d.ts

@@ -3,7 +3,10 @@ import type { DsToggleSwitchAttrs } from '../ds-toggle-switch/ds-toggle-switch.t
 export declare class DsToggleSwitch extends UiKitElement {
     static styles: import("lit").CSSResult[];
     size: DsToggleSwitchAttrs['size'];
-    checked: DsToggleSwitchAttrs['checked'];
+    _checked: DsToggleSwitchAttrs['checked'];
+    private _checkedState;
+    get checked(): boolean;
+    set checked(value: DsToggleSwitchAttrs['checked']);
     disabled: DsToggleSwitchAttrs['disabled'];
     mode: DsToggleSwitchAttrs['mode'];
     dataAriaLabel: DsToggleSwitchAttrs['data-aria-label'];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cupra/ui-kit",
-  "version": "2.0.0-canary.119",
+  "version": "2.0.0-canary.121",
   "description": "Web components library",
   "author": "SEAT S.A.",
   "license": "SEAT S.A. Library EULA 1.0",