@spaced-out/ui-design-system 0.3.40 → 0.3.41
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/.all-contributorsrc +1 -1
- package/CHANGELOG.md +12 -0
- package/README.md +26 -17
- package/lib/components/Avatar/Avatar.d.ts +0 -1
- package/lib/components/Avatar/Avatar.js.flow +0 -1
- package/lib/components/Icon/ClickableIcon.d.ts +1 -1
- package/lib/components/Icon/ClickableIcon.js +1 -1
- package/lib/components/Icon/ClickableIcon.js.flow +1 -1
- package/lib/components/Table/DefaultRow.d.ts +1 -0
- package/lib/components/Table/DefaultRow.js +1 -0
- package/lib/components/Table/DefaultRow.js.flow +1 -0
- package/lib/components/Table/DefaultTableHeader.d.ts +1 -0
- package/lib/components/Table/DefaultTableHeader.js.flow +1 -0
- package/lib/components/Table/StaticTable.d.ts +10 -3
- package/lib/components/Table/StaticTable.js +5 -3
- package/lib/components/Table/StaticTable.js.flow +10 -4
- package/lib/components/Table/Table.d.ts +1 -0
- package/lib/components/Table/Table.docs.d.ts +12 -0
- package/lib/components/Table/Table.docs.js +11 -0
- package/lib/components/Table/Table.docs.js.flow +10 -0
- package/lib/components/Table/Table.js.flow +1 -0
- package/package.json +1 -1
package/.all-contributorsrc
CHANGED
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
### [0.3.41](https://github.com/spaced-out/ui-design-system/compare/v0.3.40...v0.3.41) (2025-05-19)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
* **table:** added disabledKeys functionality in table component ([#345](https://github.com/spaced-out/ui-design-system/issues/345)) ([06b2bc3](https://github.com/spaced-out/ui-design-system/commit/06b2bc35047e50f988f552ca58d07262afdb1d10))
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
### Bug Fixes
|
|
14
|
+
|
|
15
|
+
* formatting fixes ([a091cce](https://github.com/spaced-out/ui-design-system/commit/a091cced24908ae2d0c42a1f6b4742b238046633))
|
|
16
|
+
|
|
5
17
|
### [0.3.40](https://github.com/spaced-out/ui-design-system/compare/v0.3.40-beta.0...v0.3.40) (2025-05-16)
|
|
6
18
|
|
|
7
19
|
|
package/README.md
CHANGED
|
@@ -260,32 +260,39 @@ Check out our [**Changelog here**](https://spaced-out.github.io/ui-design-system
|
|
|
260
260
|
|
|
261
261
|
## Contributors
|
|
262
262
|
|
|
263
|
+
<div style="overflow-x: auto">
|
|
264
|
+
|
|
263
265
|
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
|
|
264
266
|
<!-- prettier-ignore-start -->
|
|
265
267
|
<!-- markdownlint-disable -->
|
|
266
|
-
<table
|
|
268
|
+
<table style="
|
|
269
|
+
width: -webkit-fill-available;
|
|
270
|
+
min-width: 800px;
|
|
271
|
+
">
|
|
267
272
|
<tbody>
|
|
268
273
|
<tr>
|
|
269
|
-
<td align="center" valign="top" width="
|
|
270
|
-
<td align="center" valign="top" width="
|
|
271
|
-
<td align="center" valign="top" width="
|
|
272
|
-
<td align="center" valign="top" width="
|
|
273
|
-
<td align="center" valign="top" width="
|
|
274
|
-
|
|
275
|
-
|
|
274
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/superrover"><img src="https://avatars.githubusercontent.com/u/86281150?v=4?s=100" width="100px;" alt="Nishant Gaurav"/><br /><sub><b>Nishant Gaurav</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=superrover" title="Code">💻</a> <a href="#infra-superrover" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a></td>
|
|
275
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/Anant-Raj"><img src="https://avatars.githubusercontent.com/u/8904071?v=4?s=100" width="100px;" alt="Anant Raj"/><br /><sub><b>Anant Raj</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=Anant-Raj" title="Code">💻</a></td>
|
|
276
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/ashwinikemshetty"><img src="https://avatars.githubusercontent.com/u/12839599?v=4?s=100" width="100px;" alt="Ashwini Kemshetty"/><br /><sub><b>Ashwini Kemshetty</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=ashwinikemshetty" title="Code">💻</a></td>
|
|
277
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/VivekJangid"><img src="https://avatars.githubusercontent.com/u/33223696?v=4?s=100" width="100px;" alt="Vivek Jangid"/><br /><sub><b>Vivek Jangid</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=VivekJangid" title="Code">💻</a></td>
|
|
278
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/sharad-kushwah"><img src="https://avatars.githubusercontent.com/u/161806585?v=4?s=100" width="100px;" alt="Sharad Kushwah"/><br /><sub><b>Sharad Kushwah</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=sharad-kushwah" title="Code">💻</a></td>
|
|
279
|
+
</tr>
|
|
280
|
+
<tr>
|
|
281
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/sanskar-s"><img src="https://avatars.githubusercontent.com/u/137482980?v=4?s=100" width="100px;" alt="Sanskar Saxena"/><br /><sub><b>Sanskar Saxena</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=sanskar-s" title="Code">💻</a></td>
|
|
282
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/aditya-kaushal"><img src="https://avatars.githubusercontent.com/u/141118827?v=4?s=100" width="100px;" alt="aditya-kaushal"/><br /><sub><b>aditya-kaushal</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=aditya-kaushal" title="Code">💻</a></td>
|
|
283
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/bhatiarush27"><img src="https://avatars.githubusercontent.com/u/161808754?v=4?s=100" width="100px;" alt="Arush Bhatia"/><br /><sub><b>Arush Bhatia</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=bhatiarush27" title="Code">💻</a></td>
|
|
284
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/LakshayKumar-1"><img src="https://avatars.githubusercontent.com/u/183346574?v=4?s=100" width="100px;" alt="LakshayKumar-1"/><br /><sub><b>LakshayKumar-1</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=LakshayKumar-1" title="Code">💻</a></td>
|
|
285
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/Swatantramishra1"><img src="https://avatars.githubusercontent.com/u/5427027?v=4?s=100" width="100px;" alt="Swatantra Mishra"/><br /><sub><b>Swatantra Mishra</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=Swatantramishra1" title="Code">💻</a></td>
|
|
276
286
|
</tr>
|
|
277
287
|
<tr>
|
|
278
|
-
<td align="center" valign="top" width="
|
|
279
|
-
<td align="center" valign="top" width="
|
|
280
|
-
<td align="center" valign="top" width="
|
|
281
|
-
<td align="center" valign="top" width="
|
|
282
|
-
<td align="center" valign="top" width="
|
|
283
|
-
<td align="center" valign="top" width="14.28%"><a href="https://github.com/pearel-sense"><img src="https://avatars.githubusercontent.com/u/113005498?v=4?s=100" width="100px;" alt="Pearel Nazareth"/><br /><sub><b>Pearel Nazareth</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=pearel-sense" title="Code">💻</a></td>
|
|
284
|
-
<td align="center" valign="top" width="14.28%"><a href="https://github.com/deepak-rao-96"><img src="https://avatars.githubusercontent.com/u/185754227?v=4?s=100" width="100px;" alt="deepak-rao-96"/><br /><sub><b>deepak-rao-96</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=deepak-rao-96" title="Code">💻</a></td>
|
|
288
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/VishalBarnawal"><img src="https://avatars.githubusercontent.com/u/113020105?v=4?s=100" width="100px;" alt="Vishal-sense"/><br /><sub><b>Vishal-sense</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=VishalBarnawal" title="Code">💻</a></td>
|
|
289
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/vish-sah"><img src="https://avatars.githubusercontent.com/u/108925162?v=4?s=100" width="100px;" alt="Vishwanath Sah"/><br /><sub><b>Vishwanath Sah</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=vish-sah" title="Code">💻</a></td>
|
|
290
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/pearel-sense"><img src="https://avatars.githubusercontent.com/u/113005498?v=4?s=100" width="100px;" alt="Pearel Nazareth"/><br /><sub><b>Pearel Nazareth</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=pearel-sense" title="Code">💻</a></td>
|
|
291
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/deepak-rao-96"><img src="https://avatars.githubusercontent.com/u/185754227?v=4?s=100" width="100px;" alt="deepak-rao-96"/><br /><sub><b>deepak-rao-96</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=deepak-rao-96" title="Code">💻</a></td>
|
|
292
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/darsh-mecwan-sense"><img src="https://avatars.githubusercontent.com/u/186684223?v=4?s=100" width="100px;" alt="Darsh Mecwan"/><br /><sub><b>Darsh Mecwan</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=darsh-mecwan-sense" title="Code">💻</a></td>
|
|
285
293
|
</tr>
|
|
286
294
|
<tr>
|
|
287
|
-
<td align="center" valign="top" width="
|
|
288
|
-
<td align="center" valign="top" width="14.28%"><a href="https://github.com/diwakersurya"><img src="https://avatars.githubusercontent.com/u/7386665?v=4?s=100" width="100px;" alt="Diwaker Singh"/><br /><sub><b>Diwaker Singh</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=diwakersurya" title="Code">💻</a></td>
|
|
295
|
+
<td align="center" valign="top" width="20%"><a href="https://github.com/diwakersurya"><img src="https://avatars.githubusercontent.com/u/7386665?v=4?s=100" width="100px;" alt="Diwaker Singh"/><br /><sub><b>Diwaker Singh</b></sub></a><br /><a href="https://github.com/Spaced-Out/ui-design-system/commits?author=diwakersurya" title="Code">💻</a></td>
|
|
289
296
|
</tr>
|
|
290
297
|
</tbody>
|
|
291
298
|
</table>
|
|
@@ -294,3 +301,5 @@ Check out our [**Changelog here**](https://spaced-out.github.io/ui-design-system
|
|
|
294
301
|
<!-- prettier-ignore-end -->
|
|
295
302
|
|
|
296
303
|
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
|
304
|
+
|
|
305
|
+
</div>
|
|
@@ -55,6 +55,7 @@ export function StaticTable<
|
|
|
55
55
|
sortKey,
|
|
56
56
|
sortDirection,
|
|
57
57
|
selectedKeys,
|
|
58
|
+
disabledKeys = [],
|
|
58
59
|
onSelect,
|
|
59
60
|
isLoading,
|
|
60
61
|
idName = 'id',
|
|
@@ -159,7 +160,13 @@ export function StaticTable<
|
|
|
159
160
|
|
|
160
161
|
data as Data;
|
|
161
162
|
const selected =
|
|
162
|
-
selectedKeys
|
|
163
|
+
selectedKeys && Array.isArray(selectedKeys)
|
|
164
|
+
? selectedKeys.includes(get(data, idName))
|
|
165
|
+
: undefined;
|
|
166
|
+
const isRowDisabled =
|
|
167
|
+
disabledKeys && Array.isArray(disabledKeys)
|
|
168
|
+
? disabledKeys.includes(get(data, idName))
|
|
169
|
+
: false;
|
|
163
170
|
return TableRow ? (
|
|
164
171
|
<TableRow
|
|
165
172
|
key={key}
|
|
@@ -168,7 +175,7 @@ export function StaticTable<
|
|
|
168
175
|
extras={extras}
|
|
169
176
|
sortedKeys={rowKeys ?? mappedKeys}
|
|
170
177
|
selected={selected}
|
|
171
|
-
disabled={disabled}
|
|
178
|
+
disabled={disabled || isRowDisabled}
|
|
172
179
|
/>
|
|
173
180
|
) : (
|
|
174
181
|
<DefaultRow
|
|
@@ -182,7 +189,7 @@ export function StaticTable<
|
|
|
182
189
|
? (_v) => onSelect?.(xor(selectedKeys ?? [], [key]))
|
|
183
190
|
: undefined
|
|
184
191
|
}
|
|
185
|
-
disabled={disabled}
|
|
192
|
+
disabled={disabled || isRowDisabled}
|
|
186
193
|
classNames={{
|
|
187
194
|
tableRow: classNames?.tableRow,
|
|
188
195
|
checkbox: classNames?.checkbox,
|
|
@@ -51,6 +51,7 @@ function StaticTable(props) {
|
|
|
51
51
|
sortKey,
|
|
52
52
|
sortDirection,
|
|
53
53
|
selectedKeys,
|
|
54
|
+
disabledKeys = [],
|
|
54
55
|
onSelect,
|
|
55
56
|
isLoading,
|
|
56
57
|
idName = 'id',
|
|
@@ -128,7 +129,8 @@ function StaticTable(props) {
|
|
|
128
129
|
return null;
|
|
129
130
|
}
|
|
130
131
|
data;
|
|
131
|
-
const selected = selectedKeys
|
|
132
|
+
const selected = selectedKeys && Array.isArray(selectedKeys) ? selectedKeys.includes((0, _get.default)(data, idName)) : undefined;
|
|
133
|
+
const isRowDisabled = disabledKeys && Array.isArray(disabledKeys) ? disabledKeys.includes((0, _get.default)(data, idName)) : false;
|
|
132
134
|
return TableRow ? /*#__PURE__*/React.createElement(TableRow, {
|
|
133
135
|
key: key,
|
|
134
136
|
data: data,
|
|
@@ -138,7 +140,7 @@ function StaticTable(props) {
|
|
|
138
140
|
extras: extras,
|
|
139
141
|
sortedKeys: rowKeys ?? mappedKeys,
|
|
140
142
|
selected: selected,
|
|
141
|
-
disabled: disabled
|
|
143
|
+
disabled: disabled || isRowDisabled
|
|
142
144
|
}) : /*#__PURE__*/React.createElement(_DefaultRow.DefaultRow, {
|
|
143
145
|
key: key,
|
|
144
146
|
data: data,
|
|
@@ -146,7 +148,7 @@ function StaticTable(props) {
|
|
|
146
148
|
headers: headers,
|
|
147
149
|
selected: selected,
|
|
148
150
|
onSelect: selectedKeys != null ? _v => onSelect?.((0, _xor.default)(selectedKeys ?? [], [key])) : undefined,
|
|
149
|
-
disabled: disabled,
|
|
151
|
+
disabled: disabled || isRowDisabled,
|
|
150
152
|
classNames: {
|
|
151
153
|
tableRow: classNames?.tableRow,
|
|
152
154
|
checkbox: classNames?.checkbox
|
|
@@ -60,6 +60,7 @@ export function StaticTable<Data: GenericObject, Extras: GenericObject>(props: {
|
|
|
60
60
|
sortKey,
|
|
61
61
|
sortDirection,
|
|
62
62
|
selectedKeys,
|
|
63
|
+
disabledKeys = [],
|
|
63
64
|
onSelect,
|
|
64
65
|
isLoading,
|
|
65
66
|
idName = 'id',
|
|
@@ -104,7 +105,6 @@ export function StaticTable<Data: GenericObject, Extras: GenericObject>(props: {
|
|
|
104
105
|
}
|
|
105
106
|
}
|
|
106
107
|
: undefined;
|
|
107
|
-
|
|
108
108
|
return (
|
|
109
109
|
<div
|
|
110
110
|
className={classify(css.tableContainer, classNames?.wrapper)}
|
|
@@ -165,7 +165,13 @@ export function StaticTable<Data: GenericObject, Extras: GenericObject>(props: {
|
|
|
165
165
|
}
|
|
166
166
|
(data: Data);
|
|
167
167
|
const selected =
|
|
168
|
-
selectedKeys
|
|
168
|
+
selectedKeys && Array.isArray(selectedKeys)
|
|
169
|
+
? selectedKeys.includes(get(data, idName))
|
|
170
|
+
: undefined;
|
|
171
|
+
const isRowDisabled =
|
|
172
|
+
disabledKeys && Array.isArray(disabledKeys)
|
|
173
|
+
? disabledKeys.includes(get(data, idName))
|
|
174
|
+
: false;
|
|
169
175
|
|
|
170
176
|
return TableRow ? (
|
|
171
177
|
<TableRow
|
|
@@ -176,7 +182,7 @@ export function StaticTable<Data: GenericObject, Extras: GenericObject>(props: {
|
|
|
176
182
|
extras={extras}
|
|
177
183
|
sortedKeys={rowKeys ?? mappedKeys}
|
|
178
184
|
selected={selected}
|
|
179
|
-
disabled={disabled}
|
|
185
|
+
disabled={disabled || isRowDisabled}
|
|
180
186
|
/>
|
|
181
187
|
) : (
|
|
182
188
|
<DefaultRow
|
|
@@ -190,7 +196,7 @@ export function StaticTable<Data: GenericObject, Extras: GenericObject>(props: {
|
|
|
190
196
|
? (_v) => onSelect?.(xor(selectedKeys ?? [], [key]))
|
|
191
197
|
: undefined
|
|
192
198
|
}
|
|
193
|
-
disabled={disabled}
|
|
199
|
+
disabled={disabled || isRowDisabled}
|
|
194
200
|
classNames={{
|
|
195
201
|
tableRow: classNames?.tableRow,
|
|
196
202
|
checkbox: classNames?.checkbox,
|
|
@@ -31,6 +31,7 @@ export type TableProps<T, U> = {
|
|
|
31
31
|
// Please start using this prop if you want internal sorting to work in the table
|
|
32
32
|
enableInternalSorting?: boolean;
|
|
33
33
|
selectedKeys?: string[];
|
|
34
|
+
disabledKeys?: string[];
|
|
34
35
|
onSelect?: (keys: string[]) => unknown;
|
|
35
36
|
idName?: $Keys<T>;
|
|
36
37
|
onSort?: (key: $Keys<T>, direction: SortDirection) => void;
|
|
@@ -116,6 +116,18 @@ export const TABLE_DOCS = {
|
|
|
116
116
|
},
|
|
117
117
|
},
|
|
118
118
|
},
|
|
119
|
+
disabledKeys: {
|
|
120
|
+
description:
|
|
121
|
+
'array of keys which are disabled. This prop is used to disable the checkbox and its events for particular rows.',
|
|
122
|
+
control: {
|
|
123
|
+
type: 'object',
|
|
124
|
+
},
|
|
125
|
+
table: {
|
|
126
|
+
type: {
|
|
127
|
+
summary: 'string[]',
|
|
128
|
+
},
|
|
129
|
+
},
|
|
130
|
+
},
|
|
119
131
|
//onSelect?: (keys: string[]) => mixed
|
|
120
132
|
onSelect: {
|
|
121
133
|
description: 'callback function when any row is selected',
|
|
@@ -114,6 +114,17 @@ const TABLE_DOCS = {
|
|
|
114
114
|
}
|
|
115
115
|
}
|
|
116
116
|
},
|
|
117
|
+
disabledKeys: {
|
|
118
|
+
description: 'array of keys which are disabled. This prop is used to disable the checkbox and its events for particular rows.',
|
|
119
|
+
control: {
|
|
120
|
+
type: 'object'
|
|
121
|
+
},
|
|
122
|
+
table: {
|
|
123
|
+
type: {
|
|
124
|
+
summary: 'string[]'
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
},
|
|
117
128
|
//onSelect?: (keys: string[]) => mixed
|
|
118
129
|
onSelect: {
|
|
119
130
|
description: 'callback function when any row is selected',
|
|
@@ -97,6 +97,16 @@ export const TABLE_DOCS = {
|
|
|
97
97
|
type: {summary: 'string[]'},
|
|
98
98
|
},
|
|
99
99
|
},
|
|
100
|
+
disabledKeys: {
|
|
101
|
+
description:
|
|
102
|
+
'array of keys which are disabled. This prop is used to disable the checkbox and its events for particular rows.',
|
|
103
|
+
control: {
|
|
104
|
+
type: 'object',
|
|
105
|
+
},
|
|
106
|
+
table: {
|
|
107
|
+
type: {summary: 'string[]'},
|
|
108
|
+
},
|
|
109
|
+
},
|
|
100
110
|
//onSelect?: (keys: string[]) => mixed
|
|
101
111
|
onSelect: {
|
|
102
112
|
description: 'callback function when any row is selected',
|