@central-design-system/components 3.0.0-beta.12 → 3.0.0-beta.13

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 (39) hide show
  1. package/dist/cds.css +1 -1
  2. package/dist/cds.es.js +4681 -4625
  3. package/dist/cds.umd.js +5 -5
  4. package/dist/components/CdsAutocomplete/CdsAutocomplete.vue.d.ts +24 -9
  5. package/dist/components/CdsBadge/CdsBadge.vue.d.ts +3 -3
  6. package/dist/components/CdsButton/CdsButton.vue.d.ts +8 -8
  7. package/dist/components/CdsCombobox/CdsCombobox.vue.d.ts +38 -13
  8. package/dist/components/CdsContainer/CdsContainer.vue.d.ts +5 -5
  9. package/dist/components/CdsDrawer/CdsDrawer.vue.d.ts +4 -4
  10. package/dist/components/CdsDropdown/CdsDropdown.vue.d.ts +44 -37
  11. package/dist/components/CdsExpandablePanel/CdsExpandablePanels.vue.d.ts +5 -5
  12. package/dist/components/CdsFooter/CdsFooter.vue.d.ts +12 -3
  13. package/dist/components/CdsHeader/CdsHeader.vue.d.ts +12 -3
  14. package/dist/components/CdsIcon/CdsIcon.vue.d.ts +11 -0
  15. package/dist/components/CdsList/CdsList.vue.d.ts +12 -3
  16. package/dist/components/CdsList/CdsListItem.vue.d.ts +1 -1
  17. package/dist/components/CdsStatus/CdsStatus.vue.d.ts +5 -5
  18. package/dist/components/CdsTable/composable/scroll.d.ts +4607 -0
  19. package/dist/components/CdsTable/utils/index.d.ts +1 -0
  20. package/dist/components/CdsTable/utils/vnode.d.ts +10 -0
  21. package/dist/components/CdsTabs/CdsTabs.vue.d.ts +3 -3
  22. package/dist/components/CdsToolbar/CdsToolbar.vue.d.ts +42 -0
  23. package/dist/composable/appearance.d.ts +1 -1
  24. package/dist/composable/index.d.ts +2 -1
  25. package/dist/composable/invertColor.d.ts +19 -0
  26. package/dist/composable/select.d.ts +8 -3
  27. package/dist/composable/transparent.d.ts +19 -0
  28. package/package.json +1 -1
  29. package/src/scss/modules/grid/_css-grid.scss +12 -19
  30. package/src/scss/modules/grid/_flex-grid.scss +9 -5
  31. package/src/scss/modules/grid/_mixins.scss +23 -31
  32. package/src/scss/themes/index.ts +1 -1
  33. package/src/scss/utility/index.scss +1 -0
  34. package/src/scss/utility/typography.scss +63 -0
  35. package/src/scss/utility/variables/exports/_display.scss +4 -4
  36. package/src/scss/utility/variables/exports/_typography.scss +22 -0
  37. package/src/scss/utility/variables/index.scss +1 -0
  38. package/src/scss/utility/variables/typography.scss +93 -0
  39. package/dist/composable/dark.d.ts +0 -19
package/dist/components/CdsFooter/CdsFooter.vue.d.ts CHANGED
@@ -5,7 +5,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
5
5
  available: readonly ["cds", "b2b", "promo", "dark"];
6
6
  default: undefined;
7
7
  };
8
- dark: {
8
+ transparent: {
9
+ type: import("vue").PropType<boolean>;
10
+ default: boolean;
11
+ };
12
+ invertColor: {
9
13
  type: import("vue").PropType<boolean>;
10
14
  default: boolean;
11
15
  };
@@ -42,7 +46,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
42
46
  available: readonly ["cds", "b2b", "promo", "dark"];
43
47
  default: undefined;
44
48
  };
45
- dark: {
49
+ transparent: {
50
+ type: import("vue").PropType<boolean>;
51
+ default: boolean;
52
+ };
53
+ invertColor: {
46
54
  type: import("vue").PropType<boolean>;
47
55
  default: boolean;
48
56
  };
@@ -74,7 +82,8 @@ declare const _sfc_main: import("vue").DefineComponent<{
74
82
  onFocusin?: ((event: FocusEvent) => any) | undefined;
75
83
  onReveal?: ((value: boolean) => any) | undefined;
76
84
  }, {
77
- dark: boolean;
85
+ invertColor: boolean;
86
+ transparent: boolean;
78
87
  theme: string;
79
88
  modelValue: boolean;
80
89
  height: string | number;
package/dist/components/CdsHeader/CdsHeader.vue.d.ts CHANGED
@@ -5,7 +5,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
5
5
  available: readonly ["cds", "b2b", "promo", "dark"];
6
6
  default: undefined;
7
7
  };
8
- dark: {
8
+ transparent: {
9
+ type: import("vue").PropType<boolean>;
10
+ default: boolean;
11
+ };
12
+ invertColor: {
9
13
  type: import("vue").PropType<boolean>;
10
14
  default: boolean;
11
15
  };
@@ -42,7 +46,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
42
46
  available: readonly ["cds", "b2b", "promo", "dark"];
43
47
  default: undefined;
44
48
  };
45
- dark: {
49
+ transparent: {
50
+ type: import("vue").PropType<boolean>;
51
+ default: boolean;
52
+ };
53
+ invertColor: {
46
54
  type: import("vue").PropType<boolean>;
47
55
  default: boolean;
48
56
  };
@@ -74,7 +82,8 @@ declare const _sfc_main: import("vue").DefineComponent<{
74
82
  onFocusin?: ((event: FocusEvent) => any) | undefined;
75
83
  onReveal?: ((value: boolean) => any) | undefined;
76
84
  }, {
77
- dark: boolean;
85
+ invertColor: boolean;
86
+ transparent: boolean;
78
87
  theme: string;
79
88
  modelValue: boolean;
80
89
  height: string | number;
package/dist/components/CdsIcon/CdsIcon.vue.d.ts CHANGED
@@ -7,6 +7,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
7
7
  available: readonly ["cds", "b2b", "promo", "dark"];
8
8
  default: undefined;
9
9
  };
10
+ invertColor: {
11
+ type: PropType<boolean>;
12
+ default: boolean;
13
+ };
10
14
  size: {
11
15
  type: PropType<"xs" | "sm" | "md" | "lg" | "xl">;
12
16
  default: string;
@@ -25,9 +29,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
25
29
  iconComponent: import("vue").ComputedRef<string>;
26
30
  sizeClasses: import("vue").ComputedRef<string>;
27
31
  themeClasses: Readonly<import("vue").ComputedRef<string | undefined>>;
32
+ invertColorClasses: import("vue").ComputedRef<string | undefined>;
28
33
  } | {
29
34
  sizeClasses: import("vue").ComputedRef<string>;
30
35
  themeClasses: Readonly<import("vue").ComputedRef<string | undefined>>;
36
+ invertColorClasses: import("vue").ComputedRef<string | undefined>;
31
37
  iconComponent?: undefined;
32
38
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
33
39
  theme: {
@@ -35,6 +41,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
35
41
  available: readonly ["cds", "b2b", "promo", "dark"];
36
42
  default: undefined;
37
43
  };
44
+ invertColor: {
45
+ type: PropType<boolean>;
46
+ default: boolean;
47
+ };
38
48
  size: {
39
49
  type: PropType<"xs" | "sm" | "md" | "lg" | "xl">;
40
50
  default: string;
@@ -51,6 +61,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
51
61
  };
52
62
  }>> & {}, {
53
63
  size: "xs" | "sm" | "md" | "lg" | "xl";
64
+ invertColor: boolean;
54
65
  theme: string;
55
66
  name: "search" | "link" | "list" | "filters" | "add" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "funnel" | "globe" | "infinity" | "info-fill" | "info" | "insert" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "telegram" | "timer" | "tool" | "truck" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "winner" | "workspace" | "youtube";
56
67
  }>;
package/dist/components/CdsList/CdsList.vue.d.ts CHANGED
@@ -17,7 +17,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
17
17
  opened: PropType<unknown[]>;
18
18
  selected: PropType<unknown[]>;
19
19
  required: BooleanConstructor;
20
- dark: {
20
+ transparent: {
21
+ type: PropType<boolean>;
22
+ default: boolean;
23
+ };
24
+ invertColor: {
21
25
  type: PropType<boolean>;
22
26
  default: boolean;
23
27
  };
@@ -118,7 +122,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
118
122
  opened: PropType<unknown[]>;
119
123
  selected: PropType<unknown[]>;
120
124
  required: BooleanConstructor;
121
- dark: {
125
+ transparent: {
126
+ type: PropType<boolean>;
127
+ default: boolean;
128
+ };
129
+ invertColor: {
122
130
  type: PropType<boolean>;
123
131
  default: boolean;
124
132
  };
@@ -196,7 +204,8 @@ declare const _sfc_main: import("vue").DefineComponent<{
196
204
  tag: string;
197
205
  size: NonNullable<"xs" | "sm" | "md" | "lg" | "xl">;
198
206
  disabled: boolean;
199
- dark: boolean;
207
+ invertColor: boolean;
208
+ transparent: boolean;
200
209
  required: boolean;
201
210
  selectStrategy: NonNullable<import("../../composable/nested/selectStrategies").TSelectStrategyProp>;
202
211
  openStrategy: NonNullable<import("../../composable/nested/openStrategies").TOpenStrategyProp>;
package/dist/components/CdsList/CdsListItem.vue.d.ts CHANGED
@@ -65,7 +65,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
65
65
  default: boolean;
66
66
  };
67
67
  }, {
68
- tag: import("vue").ComputedRef<string>;
68
+ internalTag: import("vue").ComputedRef<string>;
69
69
  href: import("vue").ComputedRef<string | undefined>;
70
70
  to: import("vue").ComputedRef<import("vue-router").RouteLocationRaw | undefined>;
71
71
  slotProps: import("vue").ComputedRef<IItemSlotProps>;
package/dist/components/CdsStatus/CdsStatus.vue.d.ts CHANGED
@@ -13,10 +13,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
13
13
  validator: (value: "error" | "info" | "success" | "warning" | "progress") => boolean;
14
14
  };
15
15
  appearance: {
16
- type: import("vue").PropType<"primary" | "secondary" | "transparent">;
16
+ type: import("vue").PropType<"transparent" | "primary" | "secondary">;
17
17
  default: string;
18
18
  available: readonly ["primary", "secondary", "transparent"];
19
- validator: (value: "primary" | "secondary" | "transparent") => boolean;
19
+ validator: (value: "transparent" | "primary" | "secondary") => boolean;
20
20
  };
21
21
  text: {
22
22
  type: import("vue").PropType<string>;
@@ -40,10 +40,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
40
40
  validator: (value: "error" | "info" | "success" | "warning" | "progress") => boolean;
41
41
  };
42
42
  appearance: {
43
- type: import("vue").PropType<"primary" | "secondary" | "transparent">;
43
+ type: import("vue").PropType<"transparent" | "primary" | "secondary">;
44
44
  default: string;
45
45
  available: readonly ["primary", "secondary", "transparent"];
46
- validator: (value: "primary" | "secondary" | "transparent") => boolean;
46
+ validator: (value: "transparent" | "primary" | "secondary") => boolean;
47
47
  };
48
48
  text: {
49
49
  type: import("vue").PropType<string>;
@@ -52,7 +52,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
52
52
  }>>, {
53
53
  theme: string;
54
54
  text: string;
55
- appearance: "primary" | "secondary" | "transparent";
55
+ appearance: "transparent" | "primary" | "secondary";
56
56
  status: "error" | "info" | "success" | "warning" | "progress";
57
57
  }>;
58
58
  export default _sfc_main;