colibri-ui 0.8.73 → 0.8.75

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 (37) hide show
  1. package/Calendar/Calendar.module.css +5 -5
  2. package/Chip/Chip.module.css +153 -12
  3. package/Chip/index.js +4 -2
  4. package/Chip/index.props.d.ts +4 -3
  5. package/Icons/Copy.d.ts +3 -0
  6. package/Icons/Copy.js +35 -0
  7. package/Icons/index.d.ts +1 -0
  8. package/Icons/index.js +2 -0
  9. package/NumberInput/NumberInput.module.css +3 -1
  10. package/README.md +5 -5
  11. package/Theme/index.d.ts +174 -0
  12. package/Theme/themes/buenos_aires.d.ts +87 -0
  13. package/Theme/themes/buenos_aires.js +87 -0
  14. package/Theme/themes/jaipur.d.ts +87 -0
  15. package/Theme/themes/jaipur.js +87 -0
  16. package/esm/Calendar/Calendar.module.css +5 -5
  17. package/esm/Chip/Chip.module.css +153 -12
  18. package/esm/Chip/index.js +4 -2
  19. package/esm/Chip/index.props.d.ts +4 -3
  20. package/esm/Icons/Copy.d.ts +3 -0
  21. package/esm/Icons/Copy.js +29 -0
  22. package/esm/Icons/index.d.ts +1 -0
  23. package/esm/NumberInput/NumberInput.module.css +3 -1
  24. package/esm/Theme/index.d.ts +174 -0
  25. package/esm/Theme/themes/buenos_aires.d.ts +87 -0
  26. package/esm/Theme/themes/buenos_aires.js +87 -0
  27. package/esm/Theme/themes/jaipur.d.ts +87 -0
  28. package/esm/Theme/themes/jaipur.js +87 -0
  29. package/esm/index.d.ts +1 -1
  30. package/esm/index.js +1 -0
  31. package/esm/theme_ba_variables.css +87 -0
  32. package/esm/theme_jaipur_variables.css +87 -0
  33. package/index.d.ts +1 -1
  34. package/index.js +2 -0
  35. package/package.json +1 -1
  36. package/theme_ba_variables.css +87 -0
  37. package/theme_jaipur_variables.css +87 -0
package/Calendar/Calendar.module.css CHANGED
@@ -190,7 +190,7 @@
190
190
  }
191
191
 
192
192
  .period-button {
193
- background: var(--component-menu-item-bg);
193
+ background: var(--component-calendar-item-bg);
194
194
  border: var(--space-0);
195
195
  border-radius: var(--calendar-radius);
196
196
  box-sizing: border-box;
@@ -215,7 +215,7 @@
215
215
  }
216
216
 
217
217
  .period-button:hover:not(:disabled, .period-button-selected) {
218
- background: var(--component-menu-item-bg-hover);
218
+ background: var(--component-calendar-item-bg-hover);
219
219
  }
220
220
 
221
221
  .period-button-selected {
@@ -223,7 +223,7 @@
223
223
  }
224
224
 
225
225
  .day {
226
- background: var(--component-menu-item-bg);
226
+ background: var(--component-calendar-item-bg);
227
227
  border: var(--space-0);
228
228
  border-radius: var(--calendar-radius);
229
229
  color: var(--color-text-primary);
@@ -251,7 +251,7 @@
251
251
  }
252
252
 
253
253
  .day:hover:not(:disabled, .selected) {
254
- background: var(--component-menu-item-bg-hover);
254
+ background: var(--component-calendar-item-bg-hover);
255
255
  }
256
256
 
257
257
  .outside {
@@ -268,7 +268,7 @@
268
268
  }
269
269
 
270
270
  .in-range {
271
- background: var(--component-menu-item-bg-hover);
271
+ background: var(--component-calendar-item-bg-hover);
272
272
  border-radius: var(--radius-none);
273
273
  }
274
274
 
package/Chip/Chip.module.css CHANGED
@@ -4,44 +4,158 @@
4
4
  }
5
5
 
6
6
  .inner {
7
+ --chip-bg: var(--component-chip-primary-bg);
8
+ --chip-bg-active: var(--component-chip-primary-bg-active);
9
+ --chip-bg-hover: var(--component-chip-primary-bg-hover);
10
+ --chip-bg-pressed: var(--component-chip-primary-bg-pressed);
11
+ --chip-icon: var(--component-chip-primary-icon);
12
+ --chip-icon-active: var(--component-chip-primary-icon-active);
13
+ --chip-icon-active-hover: var(--component-chip-primary-icon-active-hover);
14
+ --chip-icon-hover: var(--component-chip-primary-icon-hover);
15
+ --chip-text: var(--component-chip-primary-text);
16
+ --chip-text-active: var(--component-chip-primary-text-active);
17
+ --chip-text-hover: var(--component-chip-primary-text-hover);
18
+ --chip-text-pressed: var(--component-chip-primary-text-pressed);
7
19
  box-sizing: border-box;
8
- color: var(--component-chip-text);
20
+ color: var(--chip-text);
9
21
  display: flex;
10
22
  font: inherit;
11
23
  min-width: 0;
12
24
  place-items: stretch flex-start;
13
25
  transition-duration: 0.3s;
14
- transition-property: background, box-shadow, transform;
26
+ transition-property: background, box-shadow, color, transform;
15
27
  transition-timing-function: ease;
16
28
  }
17
29
  .inner_active {
18
- background: var(--component-chip-bg-active);
19
- color: var(--component-chip-text-active, var(--component-chip-text));
30
+ background: var(--chip-bg-active);
31
+ color: var(--chip-text-active);
20
32
  }
21
33
  .inner_inactive {
22
- background: var(--component-chip-bg);
34
+ background: var(--chip-bg);
23
35
  box-shadow: var(--shadow-raised);
24
36
  }
25
37
  .inner_inactive:hover {
26
- background: var(--component-chip-bg-hover);
38
+ background: var(--chip-bg-hover);
27
39
  box-shadow: var(--shadow-raised);
40
+ color: var(--chip-text-hover);
28
41
  transform: translateY(calc(var(--focus-ring-width) * -1));
29
42
  }
30
43
  .inner_inactive:active {
31
- background: var(--component-chip-bg-pressed);
44
+ background: var(--chip-bg-pressed);
32
45
  box-shadow: var(--shadow-pressed);
46
+ color: var(--chip-text-pressed);
33
47
  outline: 0;
34
48
  transition-duration: 0.15s;
35
49
  }
36
50
  @media (hover: none) {
37
51
  .inner_inactive:hover {
38
52
  box-shadow: var(--shadow-raised);
53
+ color: var(--chip-text);
39
54
  transform: translateY(0);
40
55
  }
41
56
  .inner_inactive:active {
42
57
  box-shadow: var(--shadow-pressed);
58
+ color: var(--chip-text-pressed);
43
59
  }
44
60
  }
61
+ .inner_variant_primary {
62
+ --chip-bg: var(--component-chip-primary-bg);
63
+ --chip-bg-active: var(--component-chip-primary-bg-active);
64
+ --chip-bg-hover: var(--component-chip-primary-bg-hover);
65
+ --chip-bg-pressed: var(--component-chip-primary-bg-pressed);
66
+ --chip-icon: var(--component-chip-primary-icon);
67
+ --chip-icon-active: var(--component-chip-primary-icon-active);
68
+ --chip-icon-active-hover: var(--component-chip-primary-icon-active-hover);
69
+ --chip-icon-hover: var(--component-chip-primary-icon-hover);
70
+ --chip-text: var(--component-chip-primary-text);
71
+ --chip-text-active: var(--component-chip-primary-text-active);
72
+ --chip-text-hover: var(--component-chip-primary-text-hover);
73
+ --chip-text-pressed: var(--component-chip-primary-text-pressed);
74
+ }
75
+ .inner_variant_secondary {
76
+ --chip-bg: var(--component-chip-secondary-bg);
77
+ --chip-bg-active: var(--component-chip-secondary-bg-active);
78
+ --chip-bg-hover: var(--component-chip-secondary-bg-hover);
79
+ --chip-bg-pressed: var(--component-chip-secondary-bg-pressed);
80
+ --chip-icon: var(--component-chip-secondary-icon);
81
+ --chip-icon-active: var(--component-chip-secondary-icon-active);
82
+ --chip-icon-active-hover: var(--component-chip-secondary-icon-active-hover);
83
+ --chip-icon-hover: var(--component-chip-secondary-icon-hover);
84
+ --chip-text: var(--component-chip-secondary-text);
85
+ --chip-text-active: var(--component-chip-secondary-text-active);
86
+ --chip-text-hover: var(--component-chip-secondary-text-hover);
87
+ --chip-text-pressed: var(--component-chip-secondary-text-pressed);
88
+ }
89
+ .inner_variant_outline {
90
+ --chip-bg: var(--component-chip-outline-bg);
91
+ --chip-bg-active: var(--component-chip-outline-bg-active);
92
+ --chip-bg-hover: var(--component-chip-outline-bg-hover);
93
+ --chip-bg-pressed: var(--component-chip-outline-bg-pressed);
94
+ --chip-icon: var(--component-chip-outline-icon);
95
+ --chip-icon-active: var(--component-chip-outline-icon-active);
96
+ --chip-icon-active-hover: var(--component-chip-outline-icon-active-hover);
97
+ --chip-icon-hover: var(--component-chip-outline-icon-hover);
98
+ --chip-text: var(--component-chip-outline-text);
99
+ --chip-text-active: var(--component-chip-outline-text-active);
100
+ --chip-text-hover: var(--component-chip-outline-text-hover);
101
+ --chip-text-pressed: var(--component-chip-outline-text-pressed);
102
+ }
103
+ .inner_variant_pseudo {
104
+ --chip-bg: var(--component-chip-pseudo-bg);
105
+ --chip-bg-active: var(--component-chip-pseudo-bg-active);
106
+ --chip-bg-hover: var(--component-chip-pseudo-bg-hover);
107
+ --chip-bg-pressed: var(--component-chip-pseudo-bg-pressed);
108
+ --chip-icon: var(--component-chip-pseudo-icon);
109
+ --chip-icon-active: var(--component-chip-pseudo-icon-active);
110
+ --chip-icon-active-hover: var(--component-chip-pseudo-icon-active-hover);
111
+ --chip-icon-hover: var(--component-chip-pseudo-icon-hover);
112
+ --chip-text: var(--component-chip-pseudo-text);
113
+ --chip-text-active: var(--component-chip-pseudo-text-active);
114
+ --chip-text-hover: var(--component-chip-pseudo-text-hover);
115
+ --chip-text-pressed: var(--component-chip-pseudo-text-pressed);
116
+ }
117
+ .inner_variant_alert {
118
+ --chip-bg: var(--component-chip-alert-bg);
119
+ --chip-bg-active: var(--component-chip-alert-bg-active);
120
+ --chip-bg-hover: var(--component-chip-alert-bg-hover);
121
+ --chip-bg-pressed: var(--component-chip-alert-bg-pressed);
122
+ --chip-icon: var(--component-chip-alert-icon);
123
+ --chip-icon-active: var(--component-chip-alert-icon-active);
124
+ --chip-icon-active-hover: var(--component-chip-alert-icon-active-hover);
125
+ --chip-icon-hover: var(--component-chip-alert-icon-hover);
126
+ --chip-text: var(--component-chip-alert-text);
127
+ --chip-text-active: var(--component-chip-alert-text-active);
128
+ --chip-text-hover: var(--component-chip-alert-text-hover);
129
+ --chip-text-pressed: var(--component-chip-alert-text-pressed);
130
+ }
131
+ .inner_variant_success {
132
+ --chip-bg: var(--component-chip-success-bg);
133
+ --chip-bg-active: var(--component-chip-success-bg-active);
134
+ --chip-bg-hover: var(--component-chip-success-bg-hover);
135
+ --chip-bg-pressed: var(--component-chip-success-bg-pressed);
136
+ --chip-icon: var(--component-chip-success-icon);
137
+ --chip-icon-active: var(--component-chip-success-icon-active);
138
+ --chip-icon-active-hover: var(--component-chip-success-icon-active-hover);
139
+ --chip-icon-hover: var(--component-chip-success-icon-hover);
140
+ --chip-text: var(--component-chip-success-text);
141
+ --chip-text-active: var(--component-chip-success-text-active);
142
+ --chip-text-hover: var(--component-chip-success-text-hover);
143
+ --chip-text-pressed: var(--component-chip-success-text-pressed);
144
+ }
145
+ .inner_variant_clear {
146
+ --chip-bg: var(--component-chip-clear-bg);
147
+ --chip-bg-active: var(--component-chip-clear-bg-active);
148
+ --chip-bg-hover: var(--component-chip-clear-bg-hover);
149
+ --chip-bg-pressed: var(--component-chip-clear-bg-pressed);
150
+ --chip-icon: var(--component-chip-clear-icon);
151
+ --chip-icon-active: var(--component-chip-clear-icon-active);
152
+ --chip-icon-active-hover: var(--component-chip-clear-icon-active-hover);
153
+ --chip-icon-hover: var(--component-chip-clear-icon-hover);
154
+ --chip-text: var(--component-chip-clear-text);
155
+ --chip-text-active: var(--component-chip-clear-text-active);
156
+ --chip-text-hover: var(--component-chip-clear-text-hover);
157
+ --chip-text-pressed: var(--component-chip-clear-text-pressed);
158
+ }
45
159
  .inner[data-size=s] {
46
160
  border-radius: var(--component-chip-radius);
47
161
  font-size: var(--component-chip-font-size-s);
@@ -62,7 +176,7 @@
62
176
  align-items: center;
63
177
  display: flex;
64
178
  justify-content: flex-start;
65
- max-width: var(--component-tooltip-max-width);
179
+ max-width: var(--component-chip-content-max-width);
66
180
  padding: 0 var(--space-4);
67
181
  user-select: none;
68
182
  }
@@ -75,19 +189,46 @@
75
189
 
76
190
  .icon-right {
77
191
  align-items: center;
78
- color: var(--component-chip-icon);
192
+ border-radius: var(--radius-full);
193
+ color: var(--chip-icon);
194
+ cursor: pointer;
79
195
  display: flex;
80
196
  justify-content: center;
81
197
  margin-left: calc(var(--space-3) * -1);
198
+ opacity: 1;
82
199
  padding-right: var(--space-3);
200
+ transform: scale(1);
201
+ transform-origin: center;
202
+ transition: color 0.15s linear, opacity 0.15s linear, transform 0.15s linear;
83
203
  }
84
204
  .icon-right:hover {
85
- color: var(--component-chip-icon-hover);
205
+ color: var(--chip-icon-hover);
206
+ opacity: 0.72;
207
+ }
208
+ .icon-right:active {
209
+ color: var(--chip-icon-active-hover);
210
+ opacity: 0.56;
211
+ transform: scale(0.9);
212
+ }
213
+ @media (hover: none) {
214
+ .icon-right:hover {
215
+ color: var(--chip-icon);
216
+ opacity: 1;
217
+ transform: scale(1);
218
+ }
219
+ .icon-right:active {
220
+ color: var(--chip-icon-active-hover);
221
+ opacity: 0.56;
222
+ transform: scale(0.9);
223
+ }
86
224
  }
87
225
 
88
226
  .inner_active .icon-right {
89
- color: var(--component-chip-icon-active, currentcolor);
227
+ color: var(--chip-icon-active);
90
228
  }
91
229
  .inner_active .icon-right:hover {
92
- color: var(--component-chip-icon-active-hover, currentcolor);
230
+ color: var(--chip-icon-active-hover);
231
+ }
232
+ .inner_active .icon-right:active {
233
+ color: var(--chip-icon-active-hover);
93
234
  }
package/Chip/index.js CHANGED
@@ -23,12 +23,14 @@ var Chip = function Chip(_a) {
23
23
  size = _a$size === void 0 ? "m" : _a$size,
24
24
  _a$testID = _a.testID,
25
25
  testID = _a$testID === void 0 ? "chip" : _a$testID,
26
- props = tslib.__rest(_a, ["children", "iconEnd", "isActive", "onClick", "onClickIcon", "size", "testID"]);
26
+ _a$variant = _a.variant,
27
+ variant = _a$variant === void 0 ? "primary" : _a$variant,
28
+ props = tslib.__rest(_a, ["children", "iconEnd", "isActive", "onClick", "onClickIcon", "size", "testID", "variant"]);
27
29
  return /*#__PURE__*/React__default.default.createElement("span", Object.assign({
28
30
  className: styles__default.default.chip,
29
31
  "data-testid": testID
30
32
  }, props), /*#__PURE__*/React__default.default.createElement("span", {
31
- className: clsx__default.default(styles__default.default.inner, _defineProperty__default.default(_defineProperty__default.default({}, styles__default.default["inner_active"], iconEnd || isActive), styles__default.default["inner_inactive"], !iconEnd && !isActive)),
33
+ className: clsx__default.default(styles__default.default.inner, styles__default.default["inner_variant_".concat(variant)], _defineProperty__default.default(_defineProperty__default.default({}, styles__default.default["inner_active"], iconEnd || isActive), styles__default.default["inner_inactive"], !iconEnd && !isActive)),
32
34
  "data-size": size
33
35
  }, /*#__PURE__*/React__default.default.createElement("span", {
34
36
  className: styles__default.default.content,
package/Chip/index.props.d.ts CHANGED
@@ -1,10 +1,11 @@
1
- type Size = "s" | "m" | "l";
1
+ export type ChipSize = "s" | "m" | "l";
2
+ export type ChipVariant = "primary" | "secondary" | "outline" | "pseudo" | "alert" | "success" | "clear";
2
3
  export type ChipProps = {
3
- size?: Size;
4
+ size?: ChipSize;
5
+ variant?: ChipVariant;
4
6
  testID?: string;
5
7
  isActive?: boolean;
6
8
  iconEnd?: React.ReactNode;
7
9
  onClick?: () => void;
8
10
  onClickIcon?: () => void;
9
11
  };
10
- export {};
package/Icons/Copy.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import React from "react";
2
+ import type { Props } from "./index.props";
3
+ export declare const Copy: ({ fill, width, height, ref, ...props }: Props) => React.JSX.Element;
package/Icons/Copy.js ADDED
@@ -0,0 +1,35 @@
1
+ 'use strict';
2
+
3
+ var tslib = require('tslib');
4
+ var React = require('react');
5
+
6
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
+
8
+ var React__default = /*#__PURE__*/_interopDefault(React);
9
+
10
+ var Copy = function Copy(_a) {
11
+ var _a$fill = _a.fill,
12
+ fill = _a$fill === void 0 ? "currentColor" : _a$fill,
13
+ _a$width = _a.width,
14
+ width = _a$width === void 0 ? 24 : _a$width,
15
+ _a$height = _a.height,
16
+ height = _a$height === void 0 ? 24 : _a$height,
17
+ ref = _a.ref,
18
+ props = tslib.__rest(_a, ["fill", "width", "height", "ref"]);
19
+ return /*#__PURE__*/React__default.default.createElement("svg", Object.assign({
20
+ xmlns: "http://www.w3.org/2000/svg",
21
+ fill: "none",
22
+ width: width,
23
+ height: height,
24
+ ref: ref
25
+ }, props, {
26
+ viewBox: "0 0 16 16"
27
+ }), /*#__PURE__*/React__default.default.createElement("path", {
28
+ fillRule: "evenodd",
29
+ clipRule: "evenodd",
30
+ d: "M1 5.71428V10.2857C1 11.2325 1.76751 12 2.71429 12H5.75V7.10957C5.75 6.54414 5.97724 6.00244 6.38065 5.60623L8.67403 3.35381C8.77447 3.25516 8.88376 3.16757 9 3.09182V2.71429C9 1.76751 8.23249 1 7.28571 1H5.8V4.42857C5.8 5.13865 5.22437 5.71428 4.51429 5.71428H1ZM9 4.78571L7.25654 6.49804C7.24689 6.50752 7.23749 6.5172 7.22834 6.52708C7.22208 6.53383 7.21594 6.54068 7.20991 6.54762C7.07504 6.70295 7 6.90234 7 7.10957V7.79762H9H10.0095C10.4829 7.79762 10.8667 7.41386 10.8667 6.94047V4H10.1505C9.92587 4 9.7102 4.0882 9.54992 4.24562L9 4.78571ZM4.86667 1H4.15053C3.92587 1 3.7102 1.0882 3.54992 1.24562L1.25654 3.49804C1.09244 3.65921 1 3.87957 1 4.10957V4.79762H4.00952C4.48291 4.79762 4.86667 4.41386 4.86667 3.94047V1ZM7 12V8.71428H9H10.5143C11.2244 8.71428 11.8 8.13865 11.8 7.42857V4H13.2857C14.2325 4 15 4.76751 15 5.71429V13.2857C15 14.2325 14.2325 15 13.2857 15H8.71429C7.76751 15 7 14.2325 7 13.2857V12Z",
31
+ fill: fill
32
+ }));
33
+ };
34
+
35
+ exports.Copy = Copy;
package/Icons/index.d.ts CHANGED
@@ -3,6 +3,7 @@ export { Cart } from "./Cart";
3
3
  export { Check } from "./Check";
4
4
  export { Chevron } from "./Chevron";
5
5
  export { Close } from "./Close";
6
+ export { Copy } from "./Copy";
6
7
  export { Cross } from "./Cross";
7
8
  export { CrossFill } from "./CrossFill";
8
9
  export { Edit } from "./Edit";
package/Icons/index.js CHANGED
@@ -5,6 +5,7 @@ var Cart = require('./Cart.js');
5
5
  var Check = require('./Check.js');
6
6
  var Chevron = require('./Chevron.js');
7
7
  var Close = require('./Close.js');
8
+ var Copy = require('./Copy.js');
8
9
  var Cross = require('./Cross.js');
9
10
  var CrossFill = require('./CrossFill.js');
10
11
  var Edit = require('./Edit.js');
@@ -28,6 +29,7 @@ exports.Cart = Cart.Cart;
28
29
  exports.Check = Check.Check;
29
30
  exports.Chevron = Chevron.Chevron;
30
31
  exports.Close = Close.Close;
32
+ exports.Copy = Copy.Copy;
31
33
  exports.Cross = Cross.Cross;
32
34
  exports.CrossFill = CrossFill.CrossFill;
33
35
  exports.Edit = Edit.Edit;
package/NumberInput/NumberInput.module.css CHANGED
@@ -1,5 +1,7 @@
1
1
  .field {
2
- width: 20rem;
2
+ max-width: 100%;
3
+ min-width: 0;
4
+ width: 100%;
3
5
  }
4
6
 
5
7
  .end_content {
package/README.md CHANGED
@@ -1,11 +1,11 @@
1
1
  # Colibri UI
2
2
 
3
3
  ![npm version](https://img.shields.io/npm/v/colibri-ui.svg?style=flat)
4
- ![tests](https://img.shields.io/badge/tests-40%20passed-brightgreen?style=flat)
5
- ![coverage statements](https://img.shields.io/badge/statements-90.3%25-brightgreen?style=flat)
6
- ![coverage branches](https://img.shields.io/badge/branches-73.3%25-yellowgreen?style=flat)
7
- ![coverage functions](https://img.shields.io/badge/functions-98.14%25-brightgreen?style=flat)
8
- ![coverage lines](https://img.shields.io/badge/lines-95.55%25-brightgreen?style=flat)
4
+ ![tests](https://img.shields.io/badge/tests-42%20passed-brightgreen?style=flat)
5
+ ![coverage statements](https://img.shields.io/badge/statements-80.27%25-yellowgreen?style=flat)
6
+ ![coverage branches](https://img.shields.io/badge/branches-61.77%25-yellow?style=flat)
7
+ ![coverage functions](https://img.shields.io/badge/functions-87.5%25-brightgreen?style=flat)
8
+ ![coverage lines](https://img.shields.io/badge/lines-86.64%25-brightgreen?style=flat)
9
9
 
10
10
  React UI components library.
11
11
 
package/Theme/index.d.ts CHANGED
@@ -384,6 +384,91 @@ export declare const THEMES: {
384
384
  "component-chip-icon-hover": string;
385
385
  "component-chip-icon-active": string;
386
386
  "component-chip-icon-active-hover": string;
387
+ "component-chip-content-max-width": string;
388
+ "component-chip-primary-bg": string;
389
+ "component-chip-primary-bg-hover": string;
390
+ "component-chip-primary-bg-pressed": string;
391
+ "component-chip-primary-bg-active": string;
392
+ "component-chip-primary-text": string;
393
+ "component-chip-primary-text-hover": string;
394
+ "component-chip-primary-text-pressed": string;
395
+ "component-chip-primary-text-active": string;
396
+ "component-chip-primary-icon": string;
397
+ "component-chip-primary-icon-hover": string;
398
+ "component-chip-primary-icon-active": string;
399
+ "component-chip-primary-icon-active-hover": string;
400
+ "component-chip-secondary-bg": string;
401
+ "component-chip-secondary-bg-hover": string;
402
+ "component-chip-secondary-bg-pressed": string;
403
+ "component-chip-secondary-bg-active": string;
404
+ "component-chip-secondary-text": string;
405
+ "component-chip-secondary-text-hover": string;
406
+ "component-chip-secondary-text-pressed": string;
407
+ "component-chip-secondary-text-active": string;
408
+ "component-chip-secondary-icon": string;
409
+ "component-chip-secondary-icon-hover": string;
410
+ "component-chip-secondary-icon-active": string;
411
+ "component-chip-secondary-icon-active-hover": string;
412
+ "component-chip-outline-bg": string;
413
+ "component-chip-outline-bg-hover": string;
414
+ "component-chip-outline-bg-pressed": string;
415
+ "component-chip-outline-bg-active": string;
416
+ "component-chip-outline-text": string;
417
+ "component-chip-outline-text-hover": string;
418
+ "component-chip-outline-text-pressed": string;
419
+ "component-chip-outline-text-active": string;
420
+ "component-chip-outline-icon": string;
421
+ "component-chip-outline-icon-hover": string;
422
+ "component-chip-outline-icon-active": string;
423
+ "component-chip-outline-icon-active-hover": string;
424
+ "component-chip-pseudo-bg": string;
425
+ "component-chip-pseudo-bg-hover": string;
426
+ "component-chip-pseudo-bg-pressed": string;
427
+ "component-chip-pseudo-bg-active": string;
428
+ "component-chip-pseudo-text": string;
429
+ "component-chip-pseudo-text-hover": string;
430
+ "component-chip-pseudo-text-pressed": string;
431
+ "component-chip-pseudo-text-active": string;
432
+ "component-chip-pseudo-icon": string;
433
+ "component-chip-pseudo-icon-hover": string;
434
+ "component-chip-pseudo-icon-active": string;
435
+ "component-chip-pseudo-icon-active-hover": string;
436
+ "component-chip-clear-bg": string;
437
+ "component-chip-clear-bg-hover": string;
438
+ "component-chip-clear-bg-pressed": string;
439
+ "component-chip-clear-bg-active": string;
440
+ "component-chip-clear-text": string;
441
+ "component-chip-clear-text-hover": string;
442
+ "component-chip-clear-text-pressed": string;
443
+ "component-chip-clear-text-active": string;
444
+ "component-chip-clear-icon": string;
445
+ "component-chip-clear-icon-hover": string;
446
+ "component-chip-clear-icon-active": string;
447
+ "component-chip-clear-icon-active-hover": string;
448
+ "component-chip-alert-bg": string;
449
+ "component-chip-alert-bg-hover": string;
450
+ "component-chip-alert-bg-pressed": string;
451
+ "component-chip-alert-bg-active": string;
452
+ "component-chip-alert-text": string;
453
+ "component-chip-alert-text-hover": string;
454
+ "component-chip-alert-text-pressed": string;
455
+ "component-chip-alert-text-active": string;
456
+ "component-chip-alert-icon": string;
457
+ "component-chip-alert-icon-hover": string;
458
+ "component-chip-alert-icon-active": string;
459
+ "component-chip-alert-icon-active-hover": string;
460
+ "component-chip-success-bg": string;
461
+ "component-chip-success-bg-hover": string;
462
+ "component-chip-success-bg-pressed": string;
463
+ "component-chip-success-bg-active": string;
464
+ "component-chip-success-text": string;
465
+ "component-chip-success-text-hover": string;
466
+ "component-chip-success-text-pressed": string;
467
+ "component-chip-success-text-active": string;
468
+ "component-chip-success-icon": string;
469
+ "component-chip-success-icon-hover": string;
470
+ "component-chip-success-icon-active": string;
471
+ "component-chip-success-icon-active-hover": string;
387
472
  "component-chip-radius": string;
388
473
  "component-chip-font-size-s": string;
389
474
  "component-chip-font-size-m": string;
@@ -465,6 +550,8 @@ export declare const THEMES: {
465
550
  "component-grid-item-flex-basis": string;
466
551
  "component-select-menu-max-height": string;
467
552
  "component-date-picker-calendar-max-width": string;
553
+ "component-calendar-item-bg": string;
554
+ "component-calendar-item-bg-hover": string;
468
555
  "component-calendar-min-block-size": string;
469
556
  "component-calendar-min-inline-size": string;
470
557
  "component-calendar-months-min-block-size": string;
@@ -1011,6 +1098,91 @@ export declare const THEMES: {
1011
1098
  "component-chip-icon-hover": string;
1012
1099
  "component-chip-icon-active": string;
1013
1100
  "component-chip-icon-active-hover": string;
1101
+ "component-chip-content-max-width": string;
1102
+ "component-chip-primary-bg": string;
1103
+ "component-chip-primary-bg-hover": string;
1104
+ "component-chip-primary-bg-pressed": string;
1105
+ "component-chip-primary-bg-active": string;
1106
+ "component-chip-primary-text": string;
1107
+ "component-chip-primary-text-hover": string;
1108
+ "component-chip-primary-text-pressed": string;
1109
+ "component-chip-primary-text-active": string;
1110
+ "component-chip-primary-icon": string;
1111
+ "component-chip-primary-icon-hover": string;
1112
+ "component-chip-primary-icon-active": string;
1113
+ "component-chip-primary-icon-active-hover": string;
1114
+ "component-chip-secondary-bg": string;
1115
+ "component-chip-secondary-bg-hover": string;
1116
+ "component-chip-secondary-bg-pressed": string;
1117
+ "component-chip-secondary-bg-active": string;
1118
+ "component-chip-secondary-text": string;
1119
+ "component-chip-secondary-text-hover": string;
1120
+ "component-chip-secondary-text-pressed": string;
1121
+ "component-chip-secondary-text-active": string;
1122
+ "component-chip-secondary-icon": string;
1123
+ "component-chip-secondary-icon-hover": string;
1124
+ "component-chip-secondary-icon-active": string;
1125
+ "component-chip-secondary-icon-active-hover": string;
1126
+ "component-chip-outline-bg": string;
1127
+ "component-chip-outline-bg-hover": string;
1128
+ "component-chip-outline-bg-pressed": string;
1129
+ "component-chip-outline-bg-active": string;
1130
+ "component-chip-outline-text": string;
1131
+ "component-chip-outline-text-hover": string;
1132
+ "component-chip-outline-text-pressed": string;
1133
+ "component-chip-outline-text-active": string;
1134
+ "component-chip-outline-icon": string;
1135
+ "component-chip-outline-icon-hover": string;
1136
+ "component-chip-outline-icon-active": string;
1137
+ "component-chip-outline-icon-active-hover": string;
1138
+ "component-chip-pseudo-bg": string;
1139
+ "component-chip-pseudo-bg-hover": string;
1140
+ "component-chip-pseudo-bg-pressed": string;
1141
+ "component-chip-pseudo-bg-active": string;
1142
+ "component-chip-pseudo-text": string;
1143
+ "component-chip-pseudo-text-hover": string;
1144
+ "component-chip-pseudo-text-pressed": string;
1145
+ "component-chip-pseudo-text-active": string;
1146
+ "component-chip-pseudo-icon": string;
1147
+ "component-chip-pseudo-icon-hover": string;
1148
+ "component-chip-pseudo-icon-active": string;
1149
+ "component-chip-pseudo-icon-active-hover": string;
1150
+ "component-chip-clear-bg": string;
1151
+ "component-chip-clear-bg-hover": string;
1152
+ "component-chip-clear-bg-pressed": string;
1153
+ "component-chip-clear-bg-active": string;
1154
+ "component-chip-clear-text": string;
1155
+ "component-chip-clear-text-hover": string;
1156
+ "component-chip-clear-text-pressed": string;
1157
+ "component-chip-clear-text-active": string;
1158
+ "component-chip-clear-icon": string;
1159
+ "component-chip-clear-icon-hover": string;
1160
+ "component-chip-clear-icon-active": string;
1161
+ "component-chip-clear-icon-active-hover": string;
1162
+ "component-chip-alert-bg": string;
1163
+ "component-chip-alert-bg-hover": string;
1164
+ "component-chip-alert-bg-pressed": string;
1165
+ "component-chip-alert-bg-active": string;
1166
+ "component-chip-alert-text": string;
1167
+ "component-chip-alert-text-hover": string;
1168
+ "component-chip-alert-text-pressed": string;
1169
+ "component-chip-alert-text-active": string;
1170
+ "component-chip-alert-icon": string;
1171
+ "component-chip-alert-icon-hover": string;
1172
+ "component-chip-alert-icon-active": string;
1173
+ "component-chip-alert-icon-active-hover": string;
1174
+ "component-chip-success-bg": string;
1175
+ "component-chip-success-bg-hover": string;
1176
+ "component-chip-success-bg-pressed": string;
1177
+ "component-chip-success-bg-active": string;
1178
+ "component-chip-success-text": string;
1179
+ "component-chip-success-text-hover": string;
1180
+ "component-chip-success-text-pressed": string;
1181
+ "component-chip-success-text-active": string;
1182
+ "component-chip-success-icon": string;
1183
+ "component-chip-success-icon-hover": string;
1184
+ "component-chip-success-icon-active": string;
1185
+ "component-chip-success-icon-active-hover": string;
1014
1186
  "component-chip-radius": string;
1015
1187
  "component-chip-font-size-s": string;
1016
1188
  "component-chip-font-size-m": string;
@@ -1092,6 +1264,8 @@ export declare const THEMES: {
1092
1264
  "component-grid-item-flex-basis": string;
1093
1265
  "component-select-menu-max-height": string;
1094
1266
  "component-date-picker-calendar-max-width": string;
1267
+ "component-calendar-item-bg": string;
1268
+ "component-calendar-item-bg-hover": string;
1095
1269
  "component-calendar-min-block-size": string;
1096
1270
  "component-calendar-min-inline-size": string;
1097
1271
  "component-calendar-months-min-block-size": string;