@cupra/ui-kit 2.0.0-canary.82 → 2.0.0-canary.83

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 (69) hide show
  1. package/dist/cjs/components/ds-calendar/ds-calendar.cjs +7 -15
  2. package/dist/cjs/components/ds-calendar-day/ds-calendar-day.cjs +3 -3
  3. package/dist/cjs/components/ds-date-picker/ds-date-picker.cjs +20 -0
  4. package/dist/cjs/components/ds-date-picker/styles/common.styles.cjs +5 -0
  5. package/dist/cjs/components/ds-theme-provider/ds-theme-provider.cjs +1 -1
  6. package/dist/cjs/index.cjs +1 -1
  7. package/dist/cjs/utils/IconsManager.cjs +1 -1
  8. package/dist/cjs/utils/PubSub.cjs +1 -1
  9. package/dist/cjs/utils/StylesRegistry/StylesRegistry.cjs +1 -1
  10. package/dist/cjs/utils/componentFactory.cjs +24 -2
  11. package/dist/cjs/utils/cssWithTokens.cjs +1 -1
  12. package/dist/cjs/utils/htmlWithTokens.cjs +1 -1
  13. package/dist/esm/components/ds-calendar/ds-calendar.js +89 -83
  14. package/dist/esm/components/ds-calendar-day/ds-calendar-day.js +13 -9
  15. package/dist/esm/components/ds-date-picker/ds-date-picker.js +137 -0
  16. package/dist/esm/components/ds-date-picker/styles/common.styles.js +12 -0
  17. package/dist/esm/components/ds-theme-provider/ds-theme-provider.js +1 -1
  18. package/dist/esm/index.js +3 -2
  19. package/dist/esm/utils/IconsManager.js +1 -1
  20. package/dist/esm/utils/PubSub.js +1 -1
  21. package/dist/esm/utils/StylesRegistry/StylesRegistry.js +1 -1
  22. package/dist/esm/utils/componentFactory.js +26 -2
  23. package/dist/esm/utils/cssWithTokens.js +1 -1
  24. package/dist/esm/utils/htmlWithTokens.js +1 -1
  25. package/dist/types/components/ds-calendar/ds-calendar.d.ts +3 -1
  26. package/dist/types/components/ds-calendar/ds-calendar.types.d.ts +3 -0
  27. package/dist/types/components/ds-calendar-day/ds-calendar-day.d.ts +3 -1
  28. package/dist/types/components/ds-calendar-day/ds-calendar-day.types.d.ts +2 -0
  29. package/dist/types/components/ds-date-picker/ds-date-picker.d.ts +29 -0
  30. package/dist/types/components/ds-date-picker/ds-date-picker.test.d.ts +9 -0
  31. package/dist/types/components/ds-date-picker/ds-date-picker.types.d.ts +9 -0
  32. package/dist/types/components/ds-date-picker/styles/common.styles.d.ts +1 -0
  33. package/dist/types/components/index.d.ts +1 -0
  34. package/dist/types/utils/componentFactory.d.ts +2 -0
  35. package/dist-react/cjs/components/ds-calendar/ds-calendar.cjs +7 -15
  36. package/dist-react/cjs/components/ds-calendar-day/ds-calendar-day.cjs +3 -3
  37. package/dist-react/cjs/components/ds-date-picker/ds-date-picker.cjs +20 -0
  38. package/dist-react/cjs/components/ds-date-picker/styles/common.styles.cjs +5 -0
  39. package/dist-react/cjs/components/ds-theme-provider/ds-theme-provider.cjs +1 -1
  40. package/dist-react/cjs/index.cjs +1 -1
  41. package/dist-react/cjs/utils/IconsManager.cjs +1 -1
  42. package/dist-react/cjs/utils/PubSub.cjs +1 -1
  43. package/dist-react/cjs/utils/StylesRegistry/StylesRegistry.cjs +1 -1
  44. package/dist-react/cjs/utils/componentFactory.cjs +13 -2
  45. package/dist-react/cjs/utils/cssWithTokens.cjs +1 -1
  46. package/dist-react/cjs/utils/htmlWithTokens.cjs +1 -1
  47. package/dist-react/esm/components/ds-calendar/ds-calendar.js +89 -83
  48. package/dist-react/esm/components/ds-calendar-day/ds-calendar-day.js +13 -9
  49. package/dist-react/esm/components/ds-date-picker/ds-date-picker.js +137 -0
  50. package/dist-react/esm/components/ds-date-picker/styles/common.styles.js +12 -0
  51. package/dist-react/esm/components/ds-theme-provider/ds-theme-provider.js +1 -1
  52. package/dist-react/esm/index.js +3 -2
  53. package/dist-react/esm/utils/IconsManager.js +1 -1
  54. package/dist-react/esm/utils/PubSub.js +1 -1
  55. package/dist-react/esm/utils/StylesRegistry/StylesRegistry.js +1 -1
  56. package/dist-react/esm/utils/componentFactory.js +14 -2
  57. package/dist-react/esm/utils/cssWithTokens.js +1 -1
  58. package/dist-react/esm/utils/htmlWithTokens.js +1 -1
  59. package/dist-react/types/components/ds-calendar/ds-calendar.d.ts +3 -1
  60. package/dist-react/types/components/ds-calendar/ds-calendar.types.d.ts +3 -0
  61. package/dist-react/types/components/ds-calendar-day/ds-calendar-day.d.ts +3 -1
  62. package/dist-react/types/components/ds-calendar-day/ds-calendar-day.types.d.ts +2 -0
  63. package/dist-react/types/components/ds-date-picker/ds-date-picker.d.ts +29 -0
  64. package/dist-react/types/components/ds-date-picker/ds-date-picker.test.d.ts +9 -0
  65. package/dist-react/types/components/ds-date-picker/ds-date-picker.types.d.ts +9 -0
  66. package/dist-react/types/components/ds-date-picker/styles/common.styles.d.ts +1 -0
  67. package/dist-react/types/components/index.d.ts +1 -0
  68. package/dist-react/types/utils/componentFactory.d.ts +2 -0
  69. package/package.json +1 -1
@@ -54,7 +54,7 @@ let m = class extends v {
54
54
  }
55
55
  loadThemeStyles() {
56
56
  return this.loadStyles ? new Promise((t, o) => {
57
- const s = "/2.0.0-canary.82", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
57
+ const s = "/2.0.0-canary.83", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
58
58
  if (document.head.querySelector(`link[href="${r}"]`)) t();
59
59
  else {
60
60
  const e = `ui-kit-theme-${s}`, a = document.getElementById(e), n = document.createElement("link");
@@ -17,6 +17,7 @@ import "./components/ds-checkbox-group/ds-checkbox-group.js";
17
17
  import "./components/ds-chip/ds-chip.js";
18
18
  import "./components/ds-chips/ds-chips.js";
19
19
  import "./components/ds-currency/ds-currency.js";
20
+ import "./components/ds-date-picker/ds-date-picker.js";
20
21
  import "./components/ds-dialog/ds-dialog.js";
21
22
  import "./components/ds-dialog-body/ds-dialog-body.js";
22
23
  import "./components/ds-dialog-footer/ds-dialog-footer.js";
@@ -80,7 +81,7 @@ import "./components/ds-navigation-controls/ds-navigation-controls.js";
80
81
  import "./components/ds-table/ds-table.js";
81
82
  import "./components/ds-table-row/ds-table-row.js";
82
83
  import "./components/ds-table-cell/ds-table-cell.js";
83
- import { iconNames as Eo } from "./components/ds-icon/iconNames.js";
84
+ import { iconNames as Fo } from "./components/ds-icon/iconNames.js";
84
85
  export {
85
- Eo as iconNames
86
+ Fo as iconNames
86
87
  };
@@ -25,7 +25,7 @@ class l {
25
25
  }), f.subscribe("theme", this.handleChangeTheme);
26
26
  }
27
27
  }
28
- const c = Symbol.for("@cupra/ui-kit/icons-manager/2.0.0-canary.82"), h = globalThis;
28
+ const c = Symbol.for("@cupra/ui-kit/icons-manager/2.0.0-canary.83"), h = globalThis;
29
29
  let i = h[c];
30
30
  i || (i = new l(), Object.defineProperty(h, c, {
31
31
  value: i,
@@ -18,7 +18,7 @@ class e {
18
18
  });
19
19
  }
20
20
  }
21
- const u = Symbol.for("@cupra/ui-kit/pubsub/2.0.0-canary.82"), t = globalThis;
21
+ const u = Symbol.for("@cupra/ui-kit/pubsub/2.0.0-canary.83"), t = globalThis;
22
22
  let b = t[u];
23
23
  b || (b = new e(), Object.defineProperty(t, u, {
24
24
  value: b,
@@ -7,7 +7,7 @@ class s {
7
7
  theme: t
8
8
  }) => {
9
9
  if (!t || !e) return;
10
- const c = `https://ds-assets.cupra.com/2.0.0-canary.82/styles/${t}/components/${e}.css`, r = this.getCachedStyleSheetPromise({ url: c });
10
+ const c = `https://ds-assets.cupra.com/2.0.0-canary.83/styles/${t}/components/${e}.css`, r = this.getCachedStyleSheetPromise({ url: c });
11
11
  if (r) return r;
12
12
  const i = h(() => this.fetchStyle({ url: c })).then((n) => (n || this.stylePromises.delete(c), n));
13
13
  return this.stylePromises.set(c, i), this.stylePromises.get(c);
@@ -21,6 +21,18 @@ const m = {
21
21
  ${t.children}
22
22
  </ds-icon-react>
23
23
  `),
24
+ createCalendarDay: (t = {}) => (i("ds-calendar-day-react", () => import("../components/ds-calendar-day/ds-calendar-day.js")), a`
25
+ <ds-calendar-day-react
26
+ class=${e(t == null ? void 0 : t.class)}
27
+ day=${e(t == null ? void 0 : t.day)}
28
+ size=${e(t == null ? void 0 : t.size)}
29
+ ?disabled=${t == null ? void 0 : t.disabled}
30
+ ?selected=${t == null ? void 0 : t.selected}
31
+ ?today=${t == null ? void 0 : t.today}
32
+ ?outside-month=${t == null ? void 0 : t["outside-month"]}
33
+ data-testid=${e(t == null ? void 0 : t["data-testid"])}
34
+ ></ds-calendar-day-react>
35
+ `),
24
36
  createButton: (t = {}) => (i("ds-button-react", () => import("../components/ds-button/ds-button.js")), a`
25
37
  <ds-button-react
26
38
  class=${t == null ? void 0 : t.class}
@@ -118,9 +130,9 @@ const m = {
118
130
  </ds-tooltip-react>
119
131
  `)
120
132
  };
121
- function i(t, n) {
133
+ function i(t, d) {
122
134
  try {
123
- typeof window < "u" && typeof customElements < "u" && !customElements.get(t) && n();
135
+ typeof window < "u" && typeof customElements < "u" && !customElements.get(t) && d();
124
136
  } catch {
125
137
  }
126
138
  }
@@ -3,7 +3,7 @@ import "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
3
3
  import "../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
4
4
  import { unsafeCSS as n, css as o } from "../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
5
5
  function x(t, ...r) {
6
- const e = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-82"), i = n(e);
6
+ const e = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-83"), i = n(e);
7
7
  return o`${i}`;
8
8
  }
9
9
  export {
@@ -3,7 +3,7 @@ import { html as n } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit
3
3
  import "../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
4
4
  import { unsafeHTML as i } from "../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/unsafe-html.js";
5
5
  function x(t, ...r) {
6
- const o = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-82"), e = i(o);
6
+ const o = String.raw({ raw: t }, ...r).replace(/(--private-[\w-]+)(?=\s*[):,])/g, "$1-v2-0-0-canary-83"), e = i(o);
7
7
  return n`${e}`;
8
8
  }
9
9
  export {
@@ -1,10 +1,11 @@
1
1
  import { UiKitElement } from '../base/UiKitElement.ts';
2
2
  import '../ds-calendar-day/ds-calendar-day.ts';
3
- import type { DsCalendarAttrs, DsCalendarVariant, WeekDay } from './ds-calendar.types';
3
+ import type { DsCalendarAttrs, DsCalendarSize, DsCalendarVariant, WeekDay } from './ds-calendar.types';
4
4
  export declare class DsCalendar extends UiKitElement {
5
5
  static styles: import("lit").CSSResult[];
6
6
  value: DsCalendarAttrs['value'];
7
7
  variant: DsCalendarVariant;
8
+ size: DsCalendarSize;
8
9
  locale: DsCalendarAttrs['locale'];
9
10
  firstDayOfWeek: WeekDay;
10
11
  minDate: DsCalendarAttrs['min-date'];
@@ -34,6 +35,7 @@ export declare class DsCalendar extends UiKitElement {
34
35
  private handlePrevMonth;
35
36
  private handleNextMonth;
36
37
  private handleDayChange;
38
+ private get navButtonSize();
37
39
  private get prevButtonTemplate();
38
40
  private get nextButtonTemplate();
39
41
  private get weekdaysTemplate();
@@ -1,11 +1,14 @@
1
1
  import type { CommonAttrs } from '../../types/types';
2
2
  export type DsCalendarVariant = 'plane' | 'elevated';
3
+ export type DsCalendarSize = 'large' | 'medium';
3
4
  export type WeekDay = 0 | 1 | 2 | 3 | 4 | 5 | 6;
4
5
  export interface DsCalendarAttrs extends CommonAttrs {
5
6
  /** Selected date in ISO format (YYYY-MM-DD) */
6
7
  value?: string;
7
8
  /** Visual style variant */
8
9
  variant?: DsCalendarVariant;
10
+ /** Size variant */
11
+ size?: DsCalendarSize;
9
12
  /** BCP 47 locale for formatting (e.g., 'es-ES', 'en-US') */
10
13
  locale?: string;
11
14
  /** First day of week (0=Sunday, 1=Monday, etc.) */
@@ -1,13 +1,15 @@
1
1
  import { UiKitElement } from '../base/UiKitElement.ts';
2
- import type { DsCalendarDayAttrs } from './ds-calendar-day.types';
2
+ import type { DsCalendarDayAttrs, DsCalendarDaySize } from './ds-calendar-day.types';
3
3
  export declare class DsCalendarDay extends UiKitElement {
4
4
  static styles: import("lit").CSSResult[];
5
5
  day: DsCalendarDayAttrs['day'];
6
+ size: DsCalendarDaySize;
6
7
  disabled: DsCalendarDayAttrs['disabled'];
7
8
  selected: DsCalendarDayAttrs['selected'];
8
9
  today: DsCalendarDayAttrs['today'];
9
10
  outsideMonth: DsCalendarDayAttrs['outside-month'];
10
11
  protected get classes(): {
12
+ [x: string]: boolean;
11
13
  day: boolean;
12
14
  disabled: boolean;
13
15
  selected: boolean;
@@ -1,8 +1,10 @@
1
1
  import type { CommonAttrs } from '../../types/types';
2
2
  export type DsCalendarDayState = 'default' | 'hover' | 'pressed' | 'disabled' | 'selected' | 'today';
3
+ export type DsCalendarDaySize = 'large' | 'medium';
3
4
  export interface DsCalendarDayAttrs extends CommonAttrs {
4
5
  day?: number;
5
6
  state?: DsCalendarDayState;
7
+ size?: DsCalendarDaySize;
6
8
  disabled?: boolean;
7
9
  selected?: boolean;
8
10
  today?: boolean;
@@ -0,0 +1,29 @@
1
+ import { UiKitElement } from '../base/UiKitElement.ts';
2
+ import type { DsDatePickerAttrs } from './ds-date-picker.types.ts';
3
+ declare const DsDatePicker_base: (new (...args: any[]) => import("../../mixins/inputStatesMixin.ts").InputStatesInterface) & typeof UiKitElement;
4
+ export declare class DsDatePicker extends DsDatePicker_base {
5
+ static styles: import("lit").CSSResult[];
6
+ size: DsDatePickerAttrs['size'];
7
+ helperText: DsDatePickerAttrs['helper-text'];
8
+ forcedError: DsDatePickerAttrs['forced-error'];
9
+ invalidError: DsDatePickerAttrs['invalid-error'];
10
+ readonlyText: DsDatePickerAttrs['readonly-text'];
11
+ dataAriaLabelCalendarButton: DsDatePickerAttrs['data-aria-label-calendar-button'];
12
+ private isExpanded;
13
+ private handleCalendarButtonClick;
14
+ private handleCalendarChange;
15
+ private handleDocumentClick;
16
+ private static nativeStylesInjected;
17
+ connectedCallback(): void;
18
+ private static injectNativeInputStyles;
19
+ disconnectedCallback(): void;
20
+ private get classes();
21
+ render(): import("lit").TemplateResult<1>;
22
+ private get calendarDropdownTemplate();
23
+ private get calendarButtonTemplate();
24
+ private get helperTextTemplate();
25
+ private get forcedErrorTemplate();
26
+ private get readonlyTextTemplate();
27
+ private get invalidErrorTemplate();
28
+ }
29
+ export {};
@@ -0,0 +1,9 @@
1
+ import type { DsDatePicker } from './ds-date-picker.ts';
2
+ import './ds-date-picker.ts';
3
+ import '../ds-theme-provider/ds-theme-provider.ts';
4
+ import '../ds-icon-button/ds-icon-button.ts';
5
+ declare global {
6
+ interface HTMLElementTagNameMap {
7
+ 'ds-date-picker': DsDatePicker;
8
+ }
9
+ }
@@ -0,0 +1,9 @@
1
+ import type { CommonAttrs } from '../../types/types';
2
+ export type DsDatePickerAttrs = {
3
+ size?: 'large' | 'medium';
4
+ 'helper-text'?: string;
5
+ 'forced-error'?: string;
6
+ 'invalid-error'?: string;
7
+ 'readonly-text'?: string;
8
+ 'data-aria-label-calendar-button'?: string;
9
+ } & CommonAttrs;
@@ -0,0 +1 @@
1
+ export declare const commonStyles: import("lit").CSSResult;
@@ -17,6 +17,7 @@ import './ds-checkbox-group/ds-checkbox-group.ts';
17
17
  import './ds-chip/ds-chip.ts';
18
18
  import './ds-chips/ds-chips.ts';
19
19
  import './ds-currency/ds-currency.ts';
20
+ import './ds-date-picker/ds-date-picker.ts';
20
21
  import './ds-dialog/ds-dialog.ts';
21
22
  import './ds-dialog-body/ds-dialog-body.ts';
22
23
  import './ds-dialog-footer/ds-dialog-footer.ts';
@@ -1,4 +1,5 @@
1
1
  import type { DsButtonAttrs } from '../components/ds-button/ds-button.types.ts';
2
+ import type { DsCalendarDayAttrs } from '../components/ds-calendar-day/ds-calendar-day.types.ts';
2
3
  import { DsDividerAttrs } from '../components/ds-divider/ds-divider.types';
3
4
  import type { DsIconButtonAttrs } from '../components/ds-icon-button/ds-icon-button.types.ts';
4
5
  import type { DsIconAttrs } from '../components/ds-icon/ds-icon.types.ts';
@@ -11,6 +12,7 @@ type GetAttributes<T> = (props?: T) => any;
11
12
  export type ComponentFactory = {
12
13
  createIcon: GetAttributes<DsIconAttrs>;
13
14
  createButton: GetAttributes<DsButtonAttrs>;
15
+ createCalendarDay: GetAttributes<DsCalendarDayAttrs>;
14
16
  createDivider: GetAttributes<DsDividerAttrs>;
15
17
  createIconButton: GetAttributes<DsIconButtonAttrs>;
16
18
  createLoaderSpinner: GetAttributes<DsLoaderSpinnerAttrs>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cupra/ui-kit",
3
- "version": "2.0.0-canary.82",
3
+ "version": "2.0.0-canary.83",
4
4
  "description": "Web components library",
5
5
  "author": "SEAT S.A.",
6
6
  "license": "SEAT S.A. Library EULA 1.0",