@kaizen/components 1.78.0 → 1.78.1
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.
- package/dist/cjs/src/Filter/FilterBar/subcomponents/FilterBarSelect/FilterBarSelect.cjs +1 -1
- package/dist/esm/src/Filter/FilterBar/subcomponents/FilterBarSelect/FilterBarSelect.mjs +1 -1
- package/dist/styles.css +8656 -8657
- package/package.json +27 -26
- package/src/Avatar/Avatar.module.css +1 -1
- package/src/Badge/Badge.module.css +3 -3
- package/src/Filter/FilterBar/subcomponents/FilterBarSelect/FilterBarSelect.tsx +1 -1
- package/src/Link/Link.module.css +2 -2
- package/src/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.module.css +1 -1
- package/src/Popover/Popover.module.scss +1 -1
- package/src/Radio/RadioField/RadioField.module.scss +2 -3
- package/src/Table/Table.module.scss +2 -2
- package/src/TextArea/TextArea.module.css +7 -7
- package/src/Workflow/subcomponents/Footer/components/Root/FooterRoot.module.css +1 -1
- package/src/__next__/Button/Button.module.css +11 -11
- package/src/__next__/Select/subcomponents/SelectToggle/SelectToggle.module.scss +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kaizen/components",
|
|
3
|
-
"version": "1.78.
|
|
3
|
+
"version": "1.78.1",
|
|
4
4
|
"description": "Kaizen component library",
|
|
5
5
|
"author": "Geoffrey Chong <geoff.chong@cultureamp.com>",
|
|
6
6
|
"homepage": "https://cultureamp.design",
|
|
@@ -103,25 +103,25 @@
|
|
|
103
103
|
},
|
|
104
104
|
"dependencies": {
|
|
105
105
|
"@floating-ui/react-dom": "^2.1.2",
|
|
106
|
-
"@headlessui/react": "^2.2.
|
|
107
|
-
"@internationalized/date": "^3.8.
|
|
106
|
+
"@headlessui/react": "^2.2.4",
|
|
107
|
+
"@internationalized/date": "^3.8.1",
|
|
108
108
|
"@popperjs/core": "^2.11.8",
|
|
109
109
|
"@reach/tabs": "^0.18.0",
|
|
110
|
-
"@react-aria/button": "^3.13.
|
|
111
|
-
"@react-aria/datepicker": "^3.14.
|
|
112
|
-
"@react-aria/focus": "^3.20.
|
|
113
|
-
"@react-aria/i18n": "^3.12.
|
|
114
|
-
"@react-aria/listbox": "^3.14.
|
|
115
|
-
"@react-aria/menu": "^3.18.
|
|
116
|
-
"@react-aria/overlays": "^3.27.
|
|
117
|
-
"@react-aria/select": "^3.15.
|
|
118
|
-
"@react-aria/utils": "^3.
|
|
119
|
-
"@react-stately/collections": "^3.12.
|
|
120
|
-
"@react-stately/datepicker": "^3.14.
|
|
121
|
-
"@react-stately/list": "^3.12.
|
|
122
|
-
"@react-stately/menu": "^3.9.
|
|
123
|
-
"@react-stately/select": "^3.6.
|
|
124
|
-
"@react-types/shared": "^3.29.
|
|
110
|
+
"@react-aria/button": "^3.13.1",
|
|
111
|
+
"@react-aria/datepicker": "^3.14.3",
|
|
112
|
+
"@react-aria/focus": "^3.20.3",
|
|
113
|
+
"@react-aria/i18n": "^3.12.9",
|
|
114
|
+
"@react-aria/listbox": "^3.14.4",
|
|
115
|
+
"@react-aria/menu": "^3.18.3",
|
|
116
|
+
"@react-aria/overlays": "^3.27.1",
|
|
117
|
+
"@react-aria/select": "^3.15.5",
|
|
118
|
+
"@react-aria/utils": "^3.29.0",
|
|
119
|
+
"@react-stately/collections": "^3.12.4",
|
|
120
|
+
"@react-stately/datepicker": "^3.14.1",
|
|
121
|
+
"@react-stately/list": "^3.12.2",
|
|
122
|
+
"@react-stately/menu": "^3.9.4",
|
|
123
|
+
"@react-stately/select": "^3.6.13",
|
|
124
|
+
"@react-types/shared": "^3.29.1",
|
|
125
125
|
"classnames": "^2.5.1",
|
|
126
126
|
"date-fns": "^4.1.0",
|
|
127
127
|
"lodash.debounce": "^4.0.8",
|
|
@@ -136,10 +136,10 @@
|
|
|
136
136
|
"prosemirror-state": "^1.4.3",
|
|
137
137
|
"prosemirror-transform": "^1.10.4",
|
|
138
138
|
"prosemirror-utils": "^1.2.2",
|
|
139
|
-
"prosemirror-view": "^1.39.
|
|
139
|
+
"prosemirror-view": "^1.39.3",
|
|
140
140
|
"react-animate-height": "^3.2.3",
|
|
141
|
-
"react-aria": "^3.
|
|
142
|
-
"react-aria-components": "^1.
|
|
141
|
+
"react-aria": "^3.40.0",
|
|
142
|
+
"react-aria-components": "^1.9.0",
|
|
143
143
|
"react-day-picker": "9.6.7",
|
|
144
144
|
"react-focus-lock": "^2.13.6",
|
|
145
145
|
"react-focus-on": "^3.9.4",
|
|
@@ -154,9 +154,9 @@
|
|
|
154
154
|
"react-day-picker": "Version locked until a11y gets fixed (https://github.com/gpbl/react-day-picker/pull/1708)"
|
|
155
155
|
},
|
|
156
156
|
"devDependencies": {
|
|
157
|
-
"@cultureamp/frontend-apis": "
|
|
158
|
-
"@cultureamp/i18n-react-intl": "^2.
|
|
159
|
-
"@cultureamp/package-bundler": "^2.3.
|
|
157
|
+
"@cultureamp/frontend-apis": "13.3.0",
|
|
158
|
+
"@cultureamp/i18n-react-intl": "^2.9.1",
|
|
159
|
+
"@cultureamp/package-bundler": "^2.3.2",
|
|
160
160
|
"@testing-library/dom": "^10.4.0",
|
|
161
161
|
"@types/jest-axe": "^3.5.9",
|
|
162
162
|
"@types/lodash.debounce": "^4.0.9",
|
|
@@ -174,7 +174,7 @@
|
|
|
174
174
|
"postcss-import": "^16.1.0",
|
|
175
175
|
"postcss-preset-env": "^10.1.6",
|
|
176
176
|
"postcss-scss": "^4.0.9",
|
|
177
|
-
"query-string": "^9.
|
|
177
|
+
"query-string": "^9.2.0",
|
|
178
178
|
"react": "^19.0.0",
|
|
179
179
|
"react-dom": "^19.0.0",
|
|
180
180
|
"react-highlight": "^0.15.0",
|
|
@@ -190,7 +190,8 @@
|
|
|
190
190
|
},
|
|
191
191
|
"devDependenciesComments": {
|
|
192
192
|
"sass": "Prevent deprecation warnings introduced in 1.80 as we plan to move away from sass",
|
|
193
|
-
"typescript": "Installed in root"
|
|
193
|
+
"typescript": "Installed in root",
|
|
194
|
+
"frontend-apis": "There's an unresolved dep with 13.4.0 and onwards with node/msw, so we are locking to 13.3.0 for this update."
|
|
194
195
|
},
|
|
195
196
|
"peerDependencies": {
|
|
196
197
|
"@cultureamp/i18n-react-intl": "^2.5.9",
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
.reversed {
|
|
18
|
-
--badge-background-color:
|
|
18
|
+
--badge-background-color: rgb(var(--color-white-rgb), 0.1);
|
|
19
19
|
|
|
20
20
|
color: var(--color-white);
|
|
21
21
|
}
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
}
|
|
51
51
|
|
|
52
52
|
.dark {
|
|
53
|
-
--badge-background-color:
|
|
53
|
+
--badge-background-color: rgb(var(--color-purple-700-rgb), 0.1);
|
|
54
54
|
|
|
55
55
|
color: var(--color-purple-800);
|
|
56
56
|
}
|
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
.animationOn .badge.dark {
|
|
90
|
-
--badge-background-color:
|
|
90
|
+
--badge-background-color: rgb(var(--color-purple-700-rgb), 0.2);
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
.animationOn .badge.active {
|
|
@@ -60,7 +60,7 @@ export const FilterBarSelect = <Option extends SelectOption = SelectOption>({
|
|
|
60
60
|
<FilterBarButton {...triggerProps} filterId={id} isRemovable={filterState.isRemovable} />
|
|
61
61
|
)}
|
|
62
62
|
onSelectionChange={(key): void => {
|
|
63
|
-
updateValue(id, key)
|
|
63
|
+
updateValue(id, key ?? undefined)
|
|
64
64
|
onSelectionChange?.(key)
|
|
65
65
|
}}
|
|
66
66
|
isOpen={filterState.isOpen}
|
package/src/Link/Link.module.css
CHANGED
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
}
|
|
95
95
|
|
|
96
96
|
.white.isDisabled {
|
|
97
|
-
--link-text-color:
|
|
97
|
+
--link-text-color: rgb(var(--color-white-rgb), 0.2);
|
|
98
98
|
}
|
|
99
99
|
|
|
100
100
|
.reversed {
|
|
@@ -110,5 +110,5 @@
|
|
|
110
110
|
}
|
|
111
111
|
|
|
112
112
|
.reversed.isDisabled {
|
|
113
|
-
--link-text-color:
|
|
113
|
+
--link-text-color: rgb(var(--color-white-rgb), 0.2);
|
|
114
114
|
}
|
|
@@ -46,7 +46,7 @@ $large-width: 450px;
|
|
|
46
46
|
--border-width: var(--border-width-1);
|
|
47
47
|
|
|
48
48
|
border: var(--border-width) var(--border-solid-border-style);
|
|
49
|
-
filter: drop-shadow(0 0 7px
|
|
49
|
+
filter: drop-shadow(0 0 7px rgb(0, 0, 0, 0.1));
|
|
50
50
|
border-radius: $border-solid-border-radius;
|
|
51
51
|
color: $color-purple-800;
|
|
52
52
|
text-align: start;
|
|
@@ -7,9 +7,8 @@ $dt-color-radio-background-color-hover: $color-gray-200;
|
|
|
7
7
|
|
|
8
8
|
.container {
|
|
9
9
|
position: relative;
|
|
10
|
-
overflow-wrap:
|
|
11
|
-
word-
|
|
12
|
-
word-break: break-word;
|
|
10
|
+
overflow-wrap: anywhere;
|
|
11
|
+
word-break: normal;
|
|
13
12
|
margin-bottom: $spacing-sm;
|
|
14
13
|
|
|
15
14
|
label {
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
|
|
7
7
|
// Taken from design-tokens/sass/shadow
|
|
8
8
|
// we need control of the x and y offset in this component
|
|
9
|
-
$box-shadow-color-sm:
|
|
9
|
+
$box-shadow-color-sm: rgb(53, 55, 74, 0.09);
|
|
10
10
|
$row-height: 60px;
|
|
11
11
|
$row-height-data-variant: 48px;
|
|
12
12
|
|
|
@@ -170,7 +170,7 @@ $row-height-data-variant: 48px;
|
|
|
170
170
|
|
|
171
171
|
// This is an optical hack to stop the card shadow from overlapping over
|
|
172
172
|
// the proceeding cards
|
|
173
|
-
box-shadow: 0 4px 6px
|
|
173
|
+
box-shadow: 0 4px 6px rgb(53, 55, 74, 0.04);
|
|
174
174
|
border: solid 1px rgba($color-purple-700-rgb, 0.1);
|
|
175
175
|
transition:
|
|
176
176
|
box-shadow $animation-duration-rapid,
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
.default {
|
|
59
59
|
&:not(.error, .caution) {
|
|
60
60
|
&:disabled {
|
|
61
|
-
border-color:
|
|
61
|
+
border-color: rgb(var(--color-gray-500-rgb), 0.3);
|
|
62
62
|
}
|
|
63
63
|
}
|
|
64
64
|
|
|
@@ -91,13 +91,13 @@
|
|
|
91
91
|
|
|
92
92
|
&.disabled {
|
|
93
93
|
background-color: var(--color-white);
|
|
94
|
-
border-color:
|
|
95
|
-
color:
|
|
94
|
+
border-color: rgb(var(--color-gray-500-rgb), 0.3);
|
|
95
|
+
color: rgb(var(--color-purple-800-rgb), 0.3);
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
98
|
|
|
99
99
|
.reversed {
|
|
100
|
-
border-color:
|
|
100
|
+
border-color: rgb(var(--color-white-rgb), 0.65);
|
|
101
101
|
background: transparent;
|
|
102
102
|
color: var(--color-white);
|
|
103
103
|
|
|
@@ -108,7 +108,7 @@
|
|
|
108
108
|
&:focus:not([disabled]),
|
|
109
109
|
&:hover:not([disabled]),
|
|
110
110
|
&:hover:focus:not([disabled]) {
|
|
111
|
-
background:
|
|
111
|
+
background: rgb(var(--color-white-rgb), 0.1);
|
|
112
112
|
border-color: var(--color-white);
|
|
113
113
|
}
|
|
114
114
|
|
|
@@ -134,7 +134,7 @@
|
|
|
134
134
|
|
|
135
135
|
&.disabled {
|
|
136
136
|
background: transparent;
|
|
137
|
-
border-color:
|
|
138
|
-
color:
|
|
137
|
+
border-color: rgb(var(--color-white-rgb), 0.3);
|
|
138
|
+
color: rgb(var(--color-white-rgb), 0.3);
|
|
139
139
|
}
|
|
140
140
|
}
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
padding: var(--spacing-24) var(--spacing-12);
|
|
9
9
|
background: var(--color-white);
|
|
10
10
|
gap: var(--spacing-16);
|
|
11
|
-
border-top: 2px solid
|
|
11
|
+
border-top: 2px solid rgb(var(--color-gray-600-rgb), 0.1);
|
|
12
12
|
|
|
13
13
|
@media (width >= 768px) {
|
|
14
14
|
grid-template-columns: 1fr 5fr 1fr;
|
|
@@ -185,9 +185,9 @@
|
|
|
185
185
|
}
|
|
186
186
|
|
|
187
187
|
&.isDisabled {
|
|
188
|
-
--button-bg-color:
|
|
188
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.2);
|
|
189
189
|
--button-border-color: transparent;
|
|
190
|
-
--button-text-color:
|
|
190
|
+
--button-text-color: rgb(var(--color-purple-800-rgb), 0.7);
|
|
191
191
|
}
|
|
192
192
|
}
|
|
193
193
|
|
|
@@ -197,24 +197,24 @@
|
|
|
197
197
|
--button-text-color: var(--color-white);
|
|
198
198
|
|
|
199
199
|
&[data-hovered] {
|
|
200
|
-
--button-bg-color:
|
|
200
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.2);
|
|
201
201
|
--button-border-color: var(--color-white);
|
|
202
202
|
}
|
|
203
203
|
|
|
204
204
|
&[data-pressed] {
|
|
205
|
-
--button-bg-color:
|
|
205
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.1);
|
|
206
206
|
--button-border-color: var(--color-white);
|
|
207
207
|
}
|
|
208
208
|
|
|
209
209
|
&[data-pending] {
|
|
210
|
-
--button-bg-color:
|
|
210
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.1);
|
|
211
211
|
--button-border-color: var(--color-white);
|
|
212
212
|
}
|
|
213
213
|
|
|
214
214
|
&.isDisabled {
|
|
215
215
|
--button-bg-color: transparent;
|
|
216
|
-
--button-border-color:
|
|
217
|
-
--button-text-color:
|
|
216
|
+
--button-border-color: rgb(var(--color-white), 0.2);
|
|
217
|
+
--button-text-color: rgb(var(--color-white-rgb), 0.2);
|
|
218
218
|
}
|
|
219
219
|
}
|
|
220
220
|
|
|
@@ -224,24 +224,24 @@
|
|
|
224
224
|
--button-text-color: var(--color-white);
|
|
225
225
|
|
|
226
226
|
&[data-hovered] {
|
|
227
|
-
--button-bg-color:
|
|
227
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.2);
|
|
228
228
|
--button-border-color: transparent;
|
|
229
229
|
}
|
|
230
230
|
|
|
231
231
|
&[data-pressed] {
|
|
232
|
-
--button-bg-color:
|
|
232
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.1);
|
|
233
233
|
--button-border-color: transparent;
|
|
234
234
|
}
|
|
235
235
|
|
|
236
236
|
&[data-pending] {
|
|
237
|
-
--button-bg-color:
|
|
237
|
+
--button-bg-color: rgb(var(--color-white-rgb), 0.1);
|
|
238
238
|
--button-border-color: transparent;
|
|
239
239
|
}
|
|
240
240
|
|
|
241
241
|
&.isDisabled {
|
|
242
242
|
--button-bg-color: transparent;
|
|
243
243
|
--button-border-color: transparent;
|
|
244
|
-
--button-text-color:
|
|
244
|
+
--button-text-color: rgb(var(--color-white-rgb), 0.2);
|
|
245
245
|
}
|
|
246
246
|
}
|
|
247
247
|
|