@sproutsocial/seeds-react-table 1.0.3 → 1.0.5
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/.turbo/turbo-build.log +51 -35
- package/CHANGELOG.md +152 -0
- package/dist/Table-BzLSa3jk.d.ts +27 -0
- package/dist/Table-C6yuMYZA.d.mts +27 -0
- package/dist/{TableTypes-Dg7QrcGt.d.ts → TableTypes-DIUHC_FW.d.ts} +1 -1
- package/dist/{TableTypes-jS0O3bwQ.d.mts → TableTypes-i1Uir0xI.d.mts} +1 -1
- package/dist/esm/chunk-F73BV5I2.js +100 -0
- package/dist/esm/chunk-F73BV5I2.js.map +1 -0
- package/dist/esm/{chunk-SMHAMHIP.js → chunk-T7WTUUPA.js} +7 -7
- package/dist/esm/chunk-T7WTUUPA.js.map +1 -0
- package/dist/esm/{chunk-XJMS6762.js → chunk-WGM7UCXV.js} +6 -6
- package/dist/esm/chunk-WGM7UCXV.js.map +1 -0
- package/dist/esm/index.js +7 -97
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/{tableCell.js → v1/TableCell/index.js} +2 -2
- package/dist/esm/{tableHeaderCell.js → v1/TableHeaderCell/index.js} +2 -2
- package/dist/esm/{tableRowAccordion.js → v1/TableRowAccordion/index.js} +7 -7
- package/dist/esm/v1/TableRowAccordion/index.js.map +1 -0
- package/dist/esm/v1/index.js +13 -0
- package/dist/esm/v1/index.js.map +1 -0
- package/dist/esm/v2/index.js +138 -0
- package/dist/esm/v2/index.js.map +1 -0
- package/dist/index.d.mts +7 -26
- package/dist/index.d.ts +7 -26
- package/dist/index.js +20 -20
- package/dist/index.js.map +1 -1
- package/dist/{tableCell.d.ts → v1/TableCell/index.d.mts} +2 -2
- package/dist/{tableCell.d.mts → v1/TableCell/index.d.ts} +2 -2
- package/dist/{tableCell.js → v1/TableCell/index.js} +7 -7
- package/dist/v1/TableCell/index.js.map +1 -0
- package/dist/{tableHeaderCell.d.ts → v1/TableHeaderCell/index.d.mts} +3 -3
- package/dist/{tableHeaderCell.d.mts → v1/TableHeaderCell/index.d.ts} +3 -3
- package/dist/{tableHeaderCell.js → v1/TableHeaderCell/index.js} +8 -8
- package/dist/v1/TableHeaderCell/index.js.map +1 -0
- package/dist/{tableRowAccordion.d.mts → v1/TableRowAccordion/index.d.mts} +3 -3
- package/dist/{tableRowAccordion.d.ts → v1/TableRowAccordion/index.d.ts} +3 -3
- package/dist/{tableRowAccordion.js → v1/TableRowAccordion/index.js} +12 -12
- package/dist/v1/TableRowAccordion/index.js.map +1 -0
- package/dist/v1/index.d.mts +13 -0
- package/dist/v1/index.d.ts +13 -0
- package/dist/v1/index.js +323 -0
- package/dist/v1/index.js.map +1 -0
- package/dist/v2/index.d.mts +42 -0
- package/dist/v2/index.d.ts +42 -0
- package/dist/v2/index.js +189 -0
- package/dist/v2/index.js.map +1 -0
- package/package.json +24 -13
- package/src/index.ts +3 -2
- package/src/v1/index.ts +13 -0
- package/src/v2/TableV2.stories.tsx +242 -0
- package/src/v2/TableV2.tsx +91 -0
- package/src/v2/TableV2Types.ts +12 -0
- package/src/v2/__tests__/TableV2.typetest.tsx +109 -0
- package/src/v2/__tests__/table-v2.test.tsx +374 -0
- package/src/v2/index.ts +20 -0
- package/src/v2/styles.ts +82 -0
- package/tsup.config.ts +8 -6
- package/dist/esm/chunk-SMHAMHIP.js.map +0 -1
- package/dist/esm/chunk-XJMS6762.js.map +0 -1
- package/dist/esm/tableRowAccordion.js.map +0 -1
- package/dist/tableCell.js.map +0 -1
- package/dist/tableHeaderCell.js.map +0 -1
- package/dist/tableRowAccordion.js.map +0 -1
- /package/dist/esm/{tableCell.js.map → v1/TableCell/index.js.map} +0 -0
- /package/dist/esm/{tableHeaderCell.js.map → v1/TableHeaderCell/index.js.map} +0 -0
- /package/src/{Table.stories.tsx → v1/Table.stories.tsx} +0 -0
- /package/src/{Table.tsx → v1/Table.tsx} +0 -0
- /package/src/{TableCell → v1/TableCell}/TableCell.stories.tsx +0 -0
- /package/src/{TableCell → v1/TableCell}/TableCell.tsx +0 -0
- /package/src/{TableCell → v1/TableCell}/TableCellTypes.ts +0 -0
- /package/src/{TableCell → v1/TableCell}/__tests__/TabelCell.test.tsx +0 -0
- /package/src/{TableCell → v1/TableCell}/__tests__/TableCell.typetest.tsx +0 -0
- /package/src/{TableCell → v1/TableCell}/index.ts +0 -0
- /package/src/{TableCell → v1/TableCell}/styles.ts +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/TableHeaderCell.stories.tsx +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/TableHeaderCell.tsx +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/TableHeaderCellTypes.ts +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/__tests__/TableHeaderCell.test.tsx +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/__tests__/TableHeaderCell.typetest.tsx +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/constants.ts +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/index.ts +0 -0
- /package/src/{TableHeaderCell → v1/TableHeaderCell}/styles.ts +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/TableRowAccordion.stories.tsx +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/TableRowAccordion.tsx +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/TableRowAccordionTypes.ts +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/__tests__/TableRowAccordion.test.tsx +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/__tests__/TableRowAccordion.typetest.tsx +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/index.ts +0 -0
- /package/src/{TableRowAccordion → v1/TableRowAccordion}/styles.ts +0 -0
- /package/src/{TableTypes.ts → v1/TableTypes.ts} +0 -0
- /package/src/{__tests__ → v1/__tests__}/Table.test.tsx +0 -0
- /package/src/{__tests__ → v1/__tests__}/Table.typetest.tsx +0 -0
- /package/src/{styles.ts → v1/styles.ts} +0 -0
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
yarn run v1.22.22
|
|
2
2
|
$ tsup --dts
|
|
3
|
-
[34mCLI[39m Building entry:
|
|
3
|
+
[34mCLI[39m Building entry: src/index.ts, src/v1/index.ts, src/v2/index.ts, src/v1/TableCell/index.ts, src/v1/TableHeaderCell/index.ts, src/v1/TableRowAccordion/index.ts
|
|
4
4
|
[34mCLI[39m Using tsconfig: tsconfig.json
|
|
5
5
|
[34mCLI[39m tsup v8.5.0
|
|
6
6
|
[34mCLI[39m Using tsup config: /home/runner/work/seeds/seeds/seeds-react/seeds-react-table/tsup.config.ts
|
|
@@ -8,46 +8,62 @@ $ tsup --dts
|
|
|
8
8
|
[34mCLI[39m Cleaning output folder
|
|
9
9
|
[34mCJS[39m Build start
|
|
10
10
|
[34mESM[39m Build start
|
|
11
|
-
[32mESM[39m [1mdist/esm/index.js
|
|
12
|
-
[32mESM[39m [1mdist/esm/
|
|
13
|
-
[32mESM[39m [1mdist/esm/
|
|
14
|
-
[32mESM[39m [1mdist/esm/
|
|
15
|
-
[32mESM[39m [1mdist/esm/
|
|
16
|
-
[32mESM[39m [1mdist/esm/
|
|
17
|
-
[32mESM[39m [1mdist/esm/
|
|
18
|
-
[32mESM[39m [1mdist/esm/
|
|
19
|
-
[32mESM[39m [1mdist/esm/
|
|
20
|
-
[32mESM[39m [1mdist/esm/
|
|
21
|
-
[32mESM[39m [1mdist/esm/
|
|
22
|
-
[32mESM[39m [1mdist/esm/
|
|
23
|
-
[32mESM[39m
|
|
24
|
-
[
|
|
25
|
-
[
|
|
26
|
-
[
|
|
27
|
-
[
|
|
28
|
-
[
|
|
29
|
-
[
|
|
30
|
-
[32mCJS[39m [1mdist/
|
|
31
|
-
[32mCJS[39m [1mdist/
|
|
32
|
-
[32mCJS[39m
|
|
11
|
+
[32mESM[39m [1mdist/esm/v1/TableCell/index.js [22m[32m196.00 B[39m
|
|
12
|
+
[32mESM[39m [1mdist/esm/v1/index.js [22m[32m265.00 B[39m
|
|
13
|
+
[32mESM[39m [1mdist/esm/v1/TableHeaderCell/index.js [22m[32m264.00 B[39m
|
|
14
|
+
[32mESM[39m [1mdist/esm/v2/index.js [22m[32m4.16 KB[39m
|
|
15
|
+
[32mESM[39m [1mdist/esm/v1/TableRowAccordion/index.js [22m[32m2.94 KB[39m
|
|
16
|
+
[32mESM[39m [1mdist/esm/index.js [22m[32m306.00 B[39m
|
|
17
|
+
[32mESM[39m [1mdist/esm/chunk-F73BV5I2.js [22m[32m2.82 KB[39m
|
|
18
|
+
[32mESM[39m [1mdist/esm/chunk-T7WTUUPA.js [22m[32m3.91 KB[39m
|
|
19
|
+
[32mESM[39m [1mdist/esm/chunk-WGM7UCXV.js [22m[32m1.36 KB[39m
|
|
20
|
+
[32mESM[39m [1mdist/esm/v1/TableCell/index.js.map [22m[32m71.00 B[39m
|
|
21
|
+
[32mESM[39m [1mdist/esm/v1/index.js.map [22m[32m406.00 B[39m
|
|
22
|
+
[32mESM[39m [1mdist/esm/v2/index.js.map [22m[32m7.25 KB[39m
|
|
23
|
+
[32mESM[39m [1mdist/esm/v1/TableHeaderCell/index.js.map [22m[32m71.00 B[39m
|
|
24
|
+
[32mESM[39m [1mdist/esm/v1/TableRowAccordion/index.js.map [22m[32m5.28 KB[39m
|
|
25
|
+
[32mESM[39m [1mdist/esm/index.js.map [22m[32m1.91 KB[39m
|
|
26
|
+
[32mESM[39m [1mdist/esm/chunk-F73BV5I2.js.map [22m[32m4.98 KB[39m
|
|
27
|
+
[32mESM[39m [1mdist/esm/chunk-T7WTUUPA.js.map [22m[32m8.01 KB[39m
|
|
28
|
+
[32mESM[39m [1mdist/esm/chunk-WGM7UCXV.js.map [22m[32m3.80 KB[39m
|
|
29
|
+
[32mESM[39m ⚡️ Build success in 361ms
|
|
30
|
+
[32mCJS[39m [1mdist/index.js [22m[32m10.39 KB[39m
|
|
31
|
+
[32mCJS[39m [1mdist/v1/TableCell/index.js [22m[32m3.12 KB[39m
|
|
32
|
+
[32mCJS[39m [1mdist/v2/index.js [22m[32m7.07 KB[39m
|
|
33
|
+
[32mCJS[39m [1mdist/v1/TableHeaderCell/index.js [22m[32m5.97 KB[39m
|
|
34
|
+
[32mCJS[39m [1mdist/v1/TableRowAccordion/index.js [22m[32m6.38 KB[39m
|
|
35
|
+
[32mCJS[39m [1mdist/v1/index.js [22m[32m10.32 KB[39m
|
|
36
|
+
[32mCJS[39m [1mdist/index.js.map [22m[32m19.00 KB[39m
|
|
37
|
+
[32mCJS[39m [1mdist/v1/TableCell/index.js.map [22m[32m3.92 KB[39m
|
|
38
|
+
[32mCJS[39m [1mdist/v2/index.js.map [22m[32m7.85 KB[39m
|
|
39
|
+
[32mCJS[39m [1mdist/v1/TableHeaderCell/index.js.map [22m[32m8.15 KB[39m
|
|
40
|
+
[32mCJS[39m [1mdist/v1/TableRowAccordion/index.js.map [22m[32m9.33 KB[39m
|
|
41
|
+
[32mCJS[39m [1mdist/v1/index.js.map [22m[32m17.51 KB[39m
|
|
42
|
+
[32mCJS[39m ⚡️ Build success in 362ms
|
|
33
43
|
[34mDTS[39m Build start
|
|
34
|
-
[32mDTS[39m ⚡️ Build success in
|
|
35
|
-
[32mDTS[39m [1mdist/index.d.ts [22m[
|
|
36
|
-
[32mDTS[39m [1mdist/
|
|
37
|
-
[32mDTS[39m [1mdist/
|
|
38
|
-
[32mDTS[39m [1mdist/
|
|
44
|
+
[32mDTS[39m ⚡️ Build success in 138442ms
|
|
45
|
+
[32mDTS[39m [1mdist/index.d.ts [22m[32m474.00 B[39m
|
|
46
|
+
[32mDTS[39m [1mdist/v1/index.d.ts [22m[32m480.00 B[39m
|
|
47
|
+
[32mDTS[39m [1mdist/v2/index.d.ts [22m[32m2.49 KB[39m
|
|
48
|
+
[32mDTS[39m [1mdist/v1/TableCell/index.d.ts [22m[32m278.00 B[39m
|
|
49
|
+
[32mDTS[39m [1mdist/v1/TableHeaderCell/index.d.ts [22m[32m408.00 B[39m
|
|
50
|
+
[32mDTS[39m [1mdist/v1/TableRowAccordion/index.d.ts [22m[32m1.28 KB[39m
|
|
51
|
+
[32mDTS[39m [1mdist/Table-BzLSa3jk.d.ts [22m[32m1015.00 B[39m
|
|
39
52
|
[32mDTS[39m [1mdist/TableCell-CN71R1B5.d.ts [22m[32m453.00 B[39m
|
|
40
53
|
[32mDTS[39m [1mdist/TableHeaderCell-DnwlruQg.d.ts [22m[32m588.00 B[39m
|
|
41
|
-
[32mDTS[39m [1mdist/TableTypes-
|
|
54
|
+
[32mDTS[39m [1mdist/TableTypes-DIUHC_FW.d.ts [22m[32m1.55 KB[39m
|
|
42
55
|
[32mDTS[39m [1mdist/TableHeaderCellTypes-CH_zzW6X.d.ts [22m[32m1.06 KB[39m
|
|
43
56
|
[32mDTS[39m [1mdist/TableCellTypes-Cp-8r7l1.d.ts [22m[32m1013.00 B[39m
|
|
44
|
-
[32mDTS[39m [1mdist/index.d.mts [22m[
|
|
45
|
-
[32mDTS[39m [1mdist/
|
|
46
|
-
[32mDTS[39m [1mdist/
|
|
47
|
-
[32mDTS[39m [1mdist/
|
|
57
|
+
[32mDTS[39m [1mdist/index.d.mts [22m[32m480.00 B[39m
|
|
58
|
+
[32mDTS[39m [1mdist/v1/index.d.mts [22m[32m486.00 B[39m
|
|
59
|
+
[32mDTS[39m [1mdist/v2/index.d.mts [22m[32m2.49 KB[39m
|
|
60
|
+
[32mDTS[39m [1mdist/v1/TableCell/index.d.mts [22m[32m280.00 B[39m
|
|
61
|
+
[32mDTS[39m [1mdist/v1/TableHeaderCell/index.d.mts [22m[32m411.00 B[39m
|
|
62
|
+
[32mDTS[39m [1mdist/v1/TableRowAccordion/index.d.mts [22m[32m1.28 KB[39m
|
|
63
|
+
[32mDTS[39m [1mdist/Table-C6yuMYZA.d.mts [22m[32m1018.00 B[39m
|
|
48
64
|
[32mDTS[39m [1mdist/TableCell-B8GMRlv7.d.mts [22m[32m454.00 B[39m
|
|
49
65
|
[32mDTS[39m [1mdist/TableHeaderCell-DsJpGb2j.d.mts [22m[32m589.00 B[39m
|
|
50
|
-
[32mDTS[39m [1mdist/TableTypes-
|
|
66
|
+
[32mDTS[39m [1mdist/TableTypes-i1Uir0xI.d.mts [22m[32m1.55 KB[39m
|
|
51
67
|
[32mDTS[39m [1mdist/TableHeaderCellTypes-CsJQBwu2.d.mts [22m[32m1.06 KB[39m
|
|
52
68
|
[32mDTS[39m [1mdist/TableCellTypes-Cp-8r7l1.d.mts [22m[32m1013.00 B[39m
|
|
53
|
-
Done in
|
|
69
|
+
Done in 145.29s.
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,157 @@
|
|
|
1
1
|
# @sproutsocial/seeds-react-table
|
|
2
2
|
|
|
3
|
+
## 1.0.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [b1c3b44]
|
|
8
|
+
- @sproutsocial/seeds-react-theme@3.1.1
|
|
9
|
+
- @sproutsocial/seeds-react-icon@1.1.5
|
|
10
|
+
|
|
11
|
+
## 1.0.4
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- 14ada75: # Table Component Updates and Improvements
|
|
16
|
+
|
|
17
|
+
## Recent Changes
|
|
18
|
+
|
|
19
|
+
### Package Restructuring
|
|
20
|
+
|
|
21
|
+
- **Consolidated table packages**: Moved TableV2 from separate `@sproutsocial/seeds-react-table-v2` package into `@sproutsocial/seeds-react-table` as v2
|
|
22
|
+
- **Versioned exports**: Added v1 and v2 exports to maintain backward compatibility
|
|
23
|
+
- **Updated package configurations**: Streamlined build and export configurations
|
|
24
|
+
|
|
25
|
+
### API Improvements
|
|
26
|
+
|
|
27
|
+
- **Flattened exports**: Changed from compound components (`TableV2.Container`) to flat named exports (`TableWrapper`, `Table`, `TableRoot`, `TableCaption`, etc.) for better tree-shaking
|
|
28
|
+
- **Component naming**:
|
|
29
|
+
- Renamed `Caption` to `TableCaption` for consistency with other table component names
|
|
30
|
+
- `Table` now refers to the full TableV2 component (with caption, columns, and data props)
|
|
31
|
+
- Added `TableRoot` for the styled `<table>` element when building custom tables with compound components (follows Radix UI naming convention)
|
|
32
|
+
- **Enhanced export structure**: Added proper exports configuration for optimal bundle optimization
|
|
33
|
+
- **Updated type definitions**: Improved TypeScript support and type safety
|
|
34
|
+
|
|
35
|
+
### Component Refactoring
|
|
36
|
+
|
|
37
|
+
- **DataTable implementation**: Refactored to use individual table components instead of compound `TableV2` component
|
|
38
|
+
- **Dependency cleanup**: Removed unused `@sproutsocial/seeds-react-text` dependency from DataTable
|
|
39
|
+
- **Enhanced test coverage**: Updated tests to reflect new export structure and API changes
|
|
40
|
+
|
|
41
|
+
## Migration Notes
|
|
42
|
+
|
|
43
|
+
### For TableV2 Users
|
|
44
|
+
|
|
45
|
+
If you were using the separate `@sproutsocial/seeds-react-table-v2` package:
|
|
46
|
+
|
|
47
|
+
**Before:**
|
|
48
|
+
|
|
49
|
+
```tsx
|
|
50
|
+
import { TableV2 } from "@sproutsocial/seeds-react-table-v2";
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
**After:**
|
|
54
|
+
|
|
55
|
+
```tsx
|
|
56
|
+
import { TableV2 } from "@sproutsocial/seeds-react-table/v2";
|
|
57
|
+
// or
|
|
58
|
+
import { TableV2 } from "@sproutsocial/seeds-react-table";
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
### For Compound Component Users
|
|
62
|
+
|
|
63
|
+
If you were using compound components, update to flat exports:
|
|
64
|
+
|
|
65
|
+
**Before:**
|
|
66
|
+
|
|
67
|
+
```tsx
|
|
68
|
+
import TableV2 from "@sproutsocial/seeds-react-table/v2";
|
|
69
|
+
|
|
70
|
+
<TableV2.Container>
|
|
71
|
+
<TableV2.Table>
|
|
72
|
+
<TableV2.Caption>Title</TableV2.Caption>
|
|
73
|
+
<TableV2.TableHead>
|
|
74
|
+
<TableV2.TableRow>
|
|
75
|
+
<TableV2.TableHeaderCell>Header</TableV2.TableHeaderCell>
|
|
76
|
+
</TableV2.TableRow>
|
|
77
|
+
</TableV2.TableHead>
|
|
78
|
+
<TableV2.TableBody>
|
|
79
|
+
<TableV2.TableRow>
|
|
80
|
+
<TableV2.TableCell>Data</TableV2.TableCell>
|
|
81
|
+
</TableV2.TableRow>
|
|
82
|
+
</TableV2.TableBody>
|
|
83
|
+
</TableV2.Table>
|
|
84
|
+
</TableV2.Container>;
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
**After:**
|
|
88
|
+
|
|
89
|
+
```tsx
|
|
90
|
+
import {
|
|
91
|
+
TableWrapper,
|
|
92
|
+
TableRoot,
|
|
93
|
+
TableCaption,
|
|
94
|
+
TableHeader,
|
|
95
|
+
TableBody,
|
|
96
|
+
TableRow,
|
|
97
|
+
TableHeaderCell,
|
|
98
|
+
TableCell,
|
|
99
|
+
} from "@sproutsocial/seeds-react-table/v2";
|
|
100
|
+
|
|
101
|
+
<TableWrapper>
|
|
102
|
+
<TableRoot>
|
|
103
|
+
<TableCaption>Title</TableCaption>
|
|
104
|
+
<TableHeader>
|
|
105
|
+
<TableRow>
|
|
106
|
+
<TableHeaderCell>Header</TableHeaderCell>
|
|
107
|
+
</TableRow>
|
|
108
|
+
</TableHeader>
|
|
109
|
+
<TableBody>
|
|
110
|
+
<TableRow>
|
|
111
|
+
<TableCell>Data</TableCell>
|
|
112
|
+
</TableRow>
|
|
113
|
+
</TableBody>
|
|
114
|
+
</TableRoot>
|
|
115
|
+
</TableWrapper>;
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
**Key Changes:**
|
|
119
|
+
|
|
120
|
+
- `Caption` renamed to `TableCaption`
|
|
121
|
+
- Old `Table` (styled element) renamed to `TableRoot`
|
|
122
|
+
- New `Table` export refers to the full TableV2 component with props
|
|
123
|
+
|
|
124
|
+
**Simple Usage:**
|
|
125
|
+
|
|
126
|
+
```tsx
|
|
127
|
+
import { Table } from "@sproutsocial/seeds-react-table/v2";
|
|
128
|
+
|
|
129
|
+
<Table caption="Users" columns={["Name", "Age"]} data={data} />;
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
### For DataTable Users
|
|
133
|
+
|
|
134
|
+
No breaking changes - continue using the same import:
|
|
135
|
+
|
|
136
|
+
```tsx
|
|
137
|
+
import { DataTable } from "@sproutsocial/seeds-react-data-table";
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
## Benefits
|
|
141
|
+
|
|
142
|
+
- **Simplified package management**: Fewer packages to maintain and update
|
|
143
|
+
- **Better tree-shaking**: Flat exports enable more granular imports and smaller bundle sizes
|
|
144
|
+
- **Enhanced developer experience**: Cleaner import paths and better TypeScript support
|
|
145
|
+
- **Improved performance**: Removed unused dependencies and optimized component structure
|
|
146
|
+
- **Maintained backward compatibility**: Existing v1 Table component continues to work
|
|
147
|
+
|
|
148
|
+
## Next Steps
|
|
149
|
+
|
|
150
|
+
- Update imports if using the old `@sproutsocial/seeds-react-table-v2` package
|
|
151
|
+
- Migrate from compound components to flat exports for better tree-shaking
|
|
152
|
+
- Consider migrating to TableV2 or DataTable for new implementations
|
|
153
|
+
- Review Storybook examples for updated usage patterns
|
|
154
|
+
|
|
3
155
|
## 1.0.3
|
|
4
156
|
|
|
5
157
|
### Patch Changes
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { T as TableCell } from './TableCell-CN71R1B5.js';
|
|
3
|
+
import { T as TableHeaderCell } from './TableHeaderCell-DnwlruQg.js';
|
|
4
|
+
import { c as TypeTableProps, T as TypePassthroughProps } from './TableTypes-DIUHC_FW.js';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* The table component assist in rendering tabular data.
|
|
8
|
+
*/
|
|
9
|
+
declare const Table: {
|
|
10
|
+
({ head, rows, onSort, sortId, sortDirection, rowRender, children, color, ...rest }: TypeTableProps): react_jsx_runtime.JSX.Element;
|
|
11
|
+
TableHead: {
|
|
12
|
+
({ children, ...props }: TypePassthroughProps): react_jsx_runtime.JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
};
|
|
15
|
+
TableBody: {
|
|
16
|
+
({ children, ...props }: TypePassthroughProps): react_jsx_runtime.JSX.Element;
|
|
17
|
+
displayName: string;
|
|
18
|
+
};
|
|
19
|
+
TableRow: {
|
|
20
|
+
({ children, ...props }: TypePassthroughProps): react_jsx_runtime.JSX.Element;
|
|
21
|
+
displayName: string;
|
|
22
|
+
};
|
|
23
|
+
HeaderCell: typeof TableHeaderCell;
|
|
24
|
+
Cell: typeof TableCell;
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
export { Table as T };
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { T as TableCell } from './TableCell-B8GMRlv7.mjs';
|
|
3
|
+
import { T as TableHeaderCell } from './TableHeaderCell-DsJpGb2j.mjs';
|
|
4
|
+
import { c as TypeTableProps, T as TypePassthroughProps } from './TableTypes-i1Uir0xI.mjs';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* The table component assist in rendering tabular data.
|
|
8
|
+
*/
|
|
9
|
+
declare const Table: {
|
|
10
|
+
({ head, rows, onSort, sortId, sortDirection, rowRender, children, color, ...rest }: TypeTableProps): react_jsx_runtime.JSX.Element;
|
|
11
|
+
TableHead: {
|
|
12
|
+
({ children, ...props }: TypePassthroughProps): react_jsx_runtime.JSX.Element;
|
|
13
|
+
displayName: string;
|
|
14
|
+
};
|
|
15
|
+
TableBody: {
|
|
16
|
+
({ children, ...props }: TypePassthroughProps): react_jsx_runtime.JSX.Element;
|
|
17
|
+
displayName: string;
|
|
18
|
+
};
|
|
19
|
+
TableRow: {
|
|
20
|
+
({ children, ...props }: TypePassthroughProps): react_jsx_runtime.JSX.Element;
|
|
21
|
+
displayName: string;
|
|
22
|
+
};
|
|
23
|
+
HeaderCell: typeof TableHeaderCell;
|
|
24
|
+
Cell: typeof TableCell;
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
export { Table as T };
|
|
@@ -34,4 +34,4 @@ interface TypeTableProps extends TypeSystemCommonProps, Omit<React.ComponentProp
|
|
|
34
34
|
children?: React.ReactNode;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
export type {
|
|
37
|
+
export type { TypePassthroughProps as T, TypeTableRow as a, TypeTableHeadProp as b, TypeTableProps as c };
|
|
@@ -34,4 +34,4 @@ interface TypeTableProps extends TypeSystemCommonProps, Omit<React.ComponentProp
|
|
|
34
34
|
children?: React.ReactNode;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
export type {
|
|
37
|
+
export type { TypePassthroughProps as T, TypeTableRow as a, TypeTableHeadProp as b, TypeTableProps as c };
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
import {
|
|
2
|
+
TableHeaderCell_default2 as TableHeaderCell_default
|
|
3
|
+
} from "./chunk-T7WTUUPA.js";
|
|
4
|
+
import {
|
|
5
|
+
TableCell_default2 as TableCell_default
|
|
6
|
+
} from "./chunk-WGM7UCXV.js";
|
|
7
|
+
|
|
8
|
+
// src/v1/Table.tsx
|
|
9
|
+
import "react";
|
|
10
|
+
|
|
11
|
+
// src/v1/styles.ts
|
|
12
|
+
import styled from "styled-components";
|
|
13
|
+
import { COMMON } from "@sproutsocial/seeds-react-system-props";
|
|
14
|
+
var Container = styled.table`
|
|
15
|
+
width: 100%;
|
|
16
|
+
border-collapse: collapse;
|
|
17
|
+
|
|
18
|
+
thead {
|
|
19
|
+
vertical-align: bottom;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
tr,
|
|
23
|
+
thead {
|
|
24
|
+
border-bottom: 1px solid
|
|
25
|
+
${(props) => props.theme.colors.container.border.base};
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
${COMMON}
|
|
29
|
+
`;
|
|
30
|
+
var styles_default = Container;
|
|
31
|
+
|
|
32
|
+
// src/v1/Table.tsx
|
|
33
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
34
|
+
import { createElement } from "react";
|
|
35
|
+
var renderTableRow = (row) => {
|
|
36
|
+
return /* @__PURE__ */ jsx("tbody", { "data-qa-table-row": "", children: /* @__PURE__ */ jsx("tr", { children: row.cells.map((td) => {
|
|
37
|
+
return /* @__PURE__ */ createElement(TableCell_default, { ...td, key: td.id });
|
|
38
|
+
}) }) }, row.id);
|
|
39
|
+
};
|
|
40
|
+
var Table = ({
|
|
41
|
+
head = [],
|
|
42
|
+
rows = [],
|
|
43
|
+
onSort,
|
|
44
|
+
sortId,
|
|
45
|
+
sortDirection,
|
|
46
|
+
rowRender,
|
|
47
|
+
children,
|
|
48
|
+
color,
|
|
49
|
+
...rest
|
|
50
|
+
}) => {
|
|
51
|
+
if (children) {
|
|
52
|
+
return /* @__PURE__ */ jsx(styles_default, { ...rest, "data-qa-table": "", children });
|
|
53
|
+
}
|
|
54
|
+
return /* @__PURE__ */ jsxs(
|
|
55
|
+
styles_default,
|
|
56
|
+
{
|
|
57
|
+
...rest,
|
|
58
|
+
"data-qa-table": "",
|
|
59
|
+
color,
|
|
60
|
+
children: [
|
|
61
|
+
/* @__PURE__ */ jsx("colgroup", { children: head.map(({ id, colSpan = 1 }) => /* @__PURE__ */ jsx("col", { span: colSpan }, id)) }),
|
|
62
|
+
head.length > 0 && /* @__PURE__ */ jsx("thead", { "data-qa-table-header": "", children: /* @__PURE__ */ jsx("tr", { children: head.map(({ color: color2, ...th }) => {
|
|
63
|
+
return /* @__PURE__ */ createElement(
|
|
64
|
+
TableHeaderCell_default,
|
|
65
|
+
{
|
|
66
|
+
...th,
|
|
67
|
+
key: th.id,
|
|
68
|
+
onSort,
|
|
69
|
+
sortId,
|
|
70
|
+
sortDirection,
|
|
71
|
+
color: color2
|
|
72
|
+
}
|
|
73
|
+
);
|
|
74
|
+
}) }) }),
|
|
75
|
+
rows.map((row) => {
|
|
76
|
+
return rowRender ? rowRender(row) : renderTableRow(row);
|
|
77
|
+
})
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
);
|
|
81
|
+
};
|
|
82
|
+
var TableHead = ({ children, ...props }) => /* @__PURE__ */ jsx("thead", { ...props, children });
|
|
83
|
+
var TableBody = ({ children, ...props }) => /* @__PURE__ */ jsx("tbody", { ...props, children });
|
|
84
|
+
var TableRow = ({ children, ...props }) => /* @__PURE__ */ jsx("tr", { ...props, children });
|
|
85
|
+
TableHead.displayName = "Table.TableHead";
|
|
86
|
+
TableBody.displayName = "Table.TableBody";
|
|
87
|
+
TableRow.displayName = "Table.TableRow";
|
|
88
|
+
TableHeaderCell_default.displayName = "Table.HeaderCell";
|
|
89
|
+
TableCell_default.displayName = "Table.Cell";
|
|
90
|
+
Table.TableHead = TableHead;
|
|
91
|
+
Table.TableBody = TableBody;
|
|
92
|
+
Table.TableRow = TableRow;
|
|
93
|
+
Table.HeaderCell = TableHeaderCell_default;
|
|
94
|
+
Table.Cell = TableCell_default;
|
|
95
|
+
var Table_default = Table;
|
|
96
|
+
|
|
97
|
+
export {
|
|
98
|
+
Table_default
|
|
99
|
+
};
|
|
100
|
+
//# sourceMappingURL=chunk-F73BV5I2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/v1/Table.tsx","../../src/v1/styles.ts"],"sourcesContent":["import * as React from \"react\";\nimport TableCell from \"./TableCell\";\nimport TableHeaderCell from \"./TableHeaderCell\";\nimport Container from \"./styles\";\nimport type {\n TypePassthroughProps,\n TypeTableProps,\n TypeTableRow,\n} from \"./TableTypes\";\n\nconst renderTableRow = (row: TypeTableRow) => {\n return (\n <tbody key={row.id} data-qa-table-row=\"\">\n <tr>\n {row.cells.map((td) => {\n return <TableCell {...td} key={td.id} />;\n })}\n </tr>\n </tbody>\n );\n};\n\n/**\n * The table component assist in rendering tabular data.\n */\nexport const Table = ({\n head = [],\n rows = [],\n onSort,\n sortId,\n sortDirection,\n rowRender,\n children,\n color,\n ...rest\n}: TypeTableProps) => {\n if (children) {\n return (\n <Container {...rest} data-qa-table=\"\">\n {children}\n </Container>\n );\n }\n\n return (\n <Container\n {...rest}\n data-qa-table=\"\"\n // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n color={color}\n >\n <colgroup>\n {head.map(({ id, colSpan = 1 }) => (\n <col key={id} span={colSpan} />\n ))}\n </colgroup>\n {head.length > 0 && (\n <thead data-qa-table-header=\"\">\n <tr>\n {head.map(({ color, ...th }) => {\n return (\n <TableHeaderCell\n {...th}\n key={th.id}\n onSort={onSort}\n sortId={sortId}\n sortDirection={sortDirection}\n // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n color={color}\n />\n );\n })}\n </tr>\n </thead>\n )}\n {rows.map((row) => {\n return rowRender ? rowRender(row) : renderTableRow(row);\n })}\n </Container>\n );\n};\n\nexport const TableHead = ({ children, ...props }: TypePassthroughProps) => (\n <thead {...props}>{children}</thead>\n);\n\nexport const TableBody = ({ children, ...props }: TypePassthroughProps) => (\n <tbody {...props}>{children}</tbody>\n);\n\nexport const TableRow = ({ children, ...props }: TypePassthroughProps) => (\n <tr {...props}>{children}</tr>\n);\n\nTableHead.displayName = \"Table.TableHead\";\nTableBody.displayName = \"Table.TableBody\";\nTableRow.displayName = \"Table.TableRow\";\nTableHeaderCell.displayName = \"Table.HeaderCell\";\nTableCell.displayName = \"Table.Cell\";\n\nTable.TableHead = TableHead;\nTable.TableBody = TableBody;\nTable.TableRow = TableRow;\nTable.HeaderCell = TableHeaderCell;\nTable.Cell = TableCell;\n\nexport default Table;\n","import styled from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\n\nconst Container = styled.table`\n width: 100%;\n border-collapse: collapse;\n\n thead {\n vertical-align: bottom;\n }\n\n tr,\n thead {\n border-bottom: 1px solid\n ${(props) => props.theme.colors.container.border.base};\n }\n\n ${COMMON}\n`;\n\nexport default Container;\n"],"mappings":";;;;;;;;AAAA,OAAuB;;;ACAvB,OAAO,YAAY;AACnB,SAAS,cAAc;AAEvB,IAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAWjB,CAAC,UAAU,MAAM,MAAM,OAAO,UAAU,OAAO,IAAI;AAAA;AAAA;AAAA,IAGvD,MAAM;AAAA;AAGV,IAAO,iBAAQ;;;ADPT,cAgCF,YAhCE;AAEW;AALjB,IAAM,iBAAiB,CAAC,QAAsB;AAC5C,SACE,oBAAC,WAAmB,qBAAkB,IACpC,8BAAC,QACE,cAAI,MAAM,IAAI,CAAC,OAAO;AACrB,WAAO,8BAAC,qBAAW,GAAG,IAAI,KAAK,GAAG,IAAI;AAAA,EACxC,CAAC,GACH,KALU,IAAI,EAMhB;AAEJ;AAKO,IAAM,QAAQ,CAAC;AAAA,EACpB,OAAO,CAAC;AAAA,EACR,OAAO,CAAC;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAsB;AACpB,MAAI,UAAU;AACZ,WACE,oBAAC,kBAAW,GAAG,MAAM,iBAAc,IAChC,UACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,iBAAc;AAAA,MAId;AAAA,MAEA;AAAA,4BAAC,cACE,eAAK,IAAI,CAAC,EAAE,IAAI,UAAU,EAAE,MAC3B,oBAAC,SAAa,MAAM,WAAV,EAAmB,CAC9B,GACH;AAAA,QACC,KAAK,SAAS,KACb,oBAAC,WAAM,wBAAqB,IAC1B,8BAAC,QACE,eAAK,IAAI,CAAC,EAAE,OAAAA,QAAO,GAAG,GAAG,MAAM;AAC9B,iBACE;AAAA,YAAC;AAAA;AAAA,cACE,GAAG;AAAA,cACJ,KAAK,GAAG;AAAA,cACR;AAAA,cACA;AAAA,cACA;AAAA,cAIA,OAAOA;AAAA;AAAA,UACT;AAAA,QAEJ,CAAC,GACH,GACF;AAAA,QAED,KAAK,IAAI,CAAC,QAAQ;AACjB,iBAAO,YAAY,UAAU,GAAG,IAAI,eAAe,GAAG;AAAA,QACxD,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,MAC7C,oBAAC,WAAO,GAAG,OAAQ,UAAS;AAGvB,IAAM,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,MAC7C,oBAAC,WAAO,GAAG,OAAQ,UAAS;AAGvB,IAAM,WAAW,CAAC,EAAE,UAAU,GAAG,MAAM,MAC5C,oBAAC,QAAI,GAAG,OAAQ,UAAS;AAG3B,UAAU,cAAc;AACxB,UAAU,cAAc;AACxB,SAAS,cAAc;AACvB,wBAAgB,cAAc;AAC9B,kBAAU,cAAc;AAExB,MAAM,YAAY;AAClB,MAAM,YAAY;AAClB,MAAM,WAAW;AACjB,MAAM,aAAa;AACnB,MAAM,OAAO;AAEb,IAAO,gBAAQ;","names":["color"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
// src/TableHeaderCell/TableHeaderCell.tsx
|
|
1
|
+
// src/v1/TableHeaderCell/TableHeaderCell.tsx
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import Icon from "@sproutsocial/seeds-react-icon";
|
|
4
4
|
|
|
5
|
-
// src/TableHeaderCell/styles.ts
|
|
5
|
+
// src/v1/TableHeaderCell/styles.ts
|
|
6
6
|
import styled, { css } from "styled-components";
|
|
7
7
|
import { COMMON } from "@sproutsocial/seeds-react-system-props";
|
|
8
8
|
var Container = styled.th`
|
|
@@ -39,13 +39,13 @@ var UnstyledButton = styled.button`
|
|
|
39
39
|
`;
|
|
40
40
|
var styles_default = Container;
|
|
41
41
|
|
|
42
|
-
// src/TableHeaderCell/constants.ts
|
|
42
|
+
// src/v1/TableHeaderCell/constants.ts
|
|
43
43
|
var SORT_DIRECTIONS = {
|
|
44
44
|
ASC: "ASC",
|
|
45
45
|
DESC: "DESC"
|
|
46
46
|
};
|
|
47
47
|
|
|
48
|
-
// src/TableHeaderCell/TableHeaderCell.tsx
|
|
48
|
+
// src/v1/TableHeaderCell/TableHeaderCell.tsx
|
|
49
49
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
50
50
|
import { createElement } from "react";
|
|
51
51
|
var TableHeaderCell = class extends React.Component {
|
|
@@ -125,10 +125,10 @@ var TableHeaderCell = class extends React.Component {
|
|
|
125
125
|
};
|
|
126
126
|
var TableHeaderCell_default = TableHeaderCell;
|
|
127
127
|
|
|
128
|
-
// src/TableHeaderCell/TableHeaderCellTypes.ts
|
|
128
|
+
// src/v1/TableHeaderCell/TableHeaderCellTypes.ts
|
|
129
129
|
import "react";
|
|
130
130
|
|
|
131
|
-
// src/TableHeaderCell/index.ts
|
|
131
|
+
// src/v1/TableHeaderCell/index.ts
|
|
132
132
|
var TableHeaderCell_default2 = TableHeaderCell_default;
|
|
133
133
|
|
|
134
134
|
export {
|
|
@@ -136,4 +136,4 @@ export {
|
|
|
136
136
|
TableHeaderCell_default,
|
|
137
137
|
TableHeaderCell_default2
|
|
138
138
|
};
|
|
139
|
-
//# sourceMappingURL=chunk-
|
|
139
|
+
//# sourceMappingURL=chunk-T7WTUUPA.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/v1/TableHeaderCell/TableHeaderCell.tsx","../../src/v1/TableHeaderCell/styles.ts","../../src/v1/TableHeaderCell/constants.ts","../../src/v1/TableHeaderCell/TableHeaderCellTypes.ts","../../src/v1/TableHeaderCell/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n static displayName: string;\n\n getSortIcon = (\n isSorted: boolean,\n ariaSortDirection: \"ascending\" | \"descending\" | undefined\n ) => {\n const { sortDirection } = this.props;\n let iconName: TypeIconName = \"caret-up-down-outline\";\n\n if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n iconName = \"caret-up-solid\";\n } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n iconName = \"caret-down-solid\";\n }\n\n return (\n <SortIcon>\n <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n </SortIcon>\n );\n };\n\n // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n handleClick = (\n e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n ) => {\n const { onClick, onSort, isSortable, id } = this.props;\n\n if (onClick || isSortable) {\n e.preventDefault();\n }\n\n if (onClick) {\n // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n return;\n }\n\n if (!isSortable || !onSort) return;\n onSort(id);\n };\n\n override render() {\n const {\n id,\n content,\n colSpan,\n width,\n align,\n isSortable,\n sortId,\n sortDirection,\n children,\n /* eslint-disable @typescript-eslint/no-unused-vars */\n shouldTruncate,\n onSort,\n onClick,\n /* eslint-enable @typescript-eslint/no-unused-vars */\n color,\n ...rest\n } = this.props;\n\n const isSorted = sortId === id;\n const ariaSort = isSorted\n ? sortDirection === SORT_DIRECTIONS.ASC\n ? \"ascending\"\n : \"descending\"\n : undefined;\n\n const buttonProps = isSortable\n ? {\n role: \"button\",\n onClick: this.handleClick,\n }\n : {};\n\n const scope = colSpan ? \"colgroup\" : \"col\";\n\n return (\n <Container\n {...rest}\n key={id}\n alignment={align || \"left\"}\n sortable={isSortable}\n colSpan={colSpan}\n scope={scope}\n width={width}\n onClick={this.handleClick}\n data-tableheadercell-sortable={isSortable}\n data-qa-table-header-cell=\"\"\n data-qa-table-header-cell-sortdirection={sortDirection}\n // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n color={color}\n aria-sort={ariaSort}\n >\n {isSortable ? (\n <UnstyledButton {...buttonProps}>\n <div aria-live=\"polite\" role=\"status\">\n {children || content}\n {!children && this.getSortIcon(id === sortId, ariaSort)}\n </div>\n </UnstyledButton>\n ) : (\n children || content\n )}\n </Container>\n );\n }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n sortable?: boolean;\n alignment: TypeTableHeaderCellProps[\"align\"];\n width: TypeTableHeaderCellProps[\"width\"];\n}>`\n ${(props) => props.theme.typography[100]}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n padding: ${(props) => props.theme.space[300]};\n text-align: ${(props) => props.alignment};\n\n ${(props) =>\n props.sortable &&\n css`\n position: relative;\n cursor: pointer;\n `}\n\n ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n font-size: 0;\n padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n background: none;\n border: none;\n color: inherit;\n font: inherit;\n line-height: normal;\n overflow: visible;\n padding: 0;\n -webkit-appearance: none;\n -moz-appearance: none;\n cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n ASC: \"ASC\",\n DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n extends Omit<TypeTableCellProps, \"onClick\"> {\n /** Legacy Deteremines if a table column is sortable (optional) */\n isSortable?: boolean;\n\n /** Truncates text into a singular line with ellipsis (optional) */\n shouldTruncate?: boolean;\n\n /** Legacy: Callback for Sorting Table Columns (optional) */\n onSort?: (id: string) => void;\n\n /** Legacy: Controls which column is being sorted (optional) */\n sortId?: string;\n\n /** Legacy: Controls the current sort direction (optional) */\n sortDirection?: TypeEnumSortDirections;\n\n /** Callback for Click Events. If Included will override onSort prop */\n onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n","import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n"],"mappings":";AAAA,YAAY,WAAW;AACvB,OAAO,UAAiC;;;ACDxC,OAAO,UAAU,WAAW;AAC5B,SAAS,cAAc;AAGvB,IAAM,YAAY,OAAO;AAAA,IAKrB,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA,aAC/C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,gBAC9B,CAAC,UAAU,MAAM,SAAS;AAAA;AAAA,IAEtC,CAAC,UACD,MAAM,YACN;AAAA;AAAA;AAAA,KAGC;AAAA;AAAA,IAED,MAAM;AAAA;AAGH,IAAM,WAAW,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKhB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAGzC,IAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAarC,IAAO,iBAAQ;;;AC7CR,IAAM,kBAAkB;AAAA,EAC7B,KAAK;AAAA,EACL,MAAM;AACR;;;AFqBQ,cAkFI,YAlFJ;AA8DF;AAhFC,IAAM,kBAAN,cAAoC,gBAAoC;AAAA,EAC7E,OAAO;AAAA,EAEP,cAAc,CACZ,UACA,sBACG;AACH,UAAM,EAAE,cAAc,IAAI,KAAK;AAC/B,QAAI,WAAyB;AAE7B,QAAI,YAAY,kBAAkB,gBAAgB,KAAK;AACrD,iBAAW;AAAA,IACb,WAAW,YAAY,kBAAkB,gBAAgB,MAAM;AAC7D,iBAAW;AAAA,IACb;AAEA,WACE,oBAAC,YACC,8BAAC,QAAK,MAAK,QAAO,MAAM,UAAU,cAAY,mBAAmB,GACnE;AAAA,EAEJ;AAAA;AAAA,EAGA,cAAc,CACZ,MACG;AACH,UAAM,EAAE,SAAS,QAAQ,YAAY,GAAG,IAAI,KAAK;AAEjD,QAAI,WAAW,YAAY;AACzB,QAAE,eAAe;AAAA,IACnB;AAEA,QAAI,SAAS;AAEX,cAAQ,CAAmD;AAC3D;AAAA,IACF;AAEA,QAAI,CAAC,cAAc,CAAC,OAAQ;AAC5B,WAAO,EAAE;AAAA,EACX;AAAA,EAES,SAAS;AAChB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,KAAK;AAET,UAAM,WAAW,WAAW;AAC5B,UAAM,WAAW,WACb,kBAAkB,gBAAgB,MAChC,cACA,eACF;AAEJ,UAAM,cAAc,aAChB;AAAA,MACE,MAAM;AAAA,MACN,SAAS,KAAK;AAAA,IAChB,IACA,CAAC;AAEL,UAAM,QAAQ,UAAU,aAAa;AAErC,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,SAAS;AAAA,QACpB,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,KAAK;AAAA,QACd,iCAA+B;AAAA,QAC/B,6BAA0B;AAAA,QAC1B,2CAAyC;AAAA,QAIzC;AAAA,QACA,aAAW;AAAA;AAAA,MAEV,aACC,oBAAC,kBAAgB,GAAG,aAClB,+BAAC,SAAI,aAAU,UAAS,MAAK,UAC1B;AAAA,oBAAY;AAAA,QACZ,CAAC,YAAY,KAAK,YAAY,OAAO,QAAQ,QAAQ;AAAA,SACxD,GACF,IAEA,YAAY;AAAA,IAEhB;AAAA,EAEJ;AACF;AAEA,IAAO,0BAAQ;;;AGvHf,OAAuB;;;ACEvB,IAAOA,2BAAQ;","names":["TableHeaderCell_default"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
// src/TableCell/TableCell.tsx
|
|
1
|
+
// src/v1/TableCell/TableCell.tsx
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
|
|
4
|
-
// src/TableCell/styles.ts
|
|
4
|
+
// src/v1/TableCell/styles.ts
|
|
5
5
|
import styled from "styled-components";
|
|
6
6
|
import { COMMON } from "@sproutsocial/seeds-react-system-props";
|
|
7
7
|
var Container = styled.td`
|
|
@@ -14,7 +14,7 @@ var Container = styled.td`
|
|
|
14
14
|
`;
|
|
15
15
|
var styles_default = Container;
|
|
16
16
|
|
|
17
|
-
// src/TableCell/TableCell.tsx
|
|
17
|
+
// src/v1/TableCell/TableCell.tsx
|
|
18
18
|
import { createElement } from "react";
|
|
19
19
|
var TableCell = class extends React.Component {
|
|
20
20
|
static displayName;
|
|
@@ -49,14 +49,14 @@ var TableCell = class extends React.Component {
|
|
|
49
49
|
};
|
|
50
50
|
var TableCell_default = TableCell;
|
|
51
51
|
|
|
52
|
-
// src/TableCell/TableCellTypes.ts
|
|
52
|
+
// src/v1/TableCell/TableCellTypes.ts
|
|
53
53
|
import "react";
|
|
54
54
|
|
|
55
|
-
// src/TableCell/index.ts
|
|
55
|
+
// src/v1/TableCell/index.ts
|
|
56
56
|
var TableCell_default2 = TableCell_default;
|
|
57
57
|
|
|
58
58
|
export {
|
|
59
59
|
TableCell_default,
|
|
60
60
|
TableCell_default2
|
|
61
61
|
};
|
|
62
|
-
//# sourceMappingURL=chunk-
|
|
62
|
+
//# sourceMappingURL=chunk-WGM7UCXV.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/v1/TableCell/TableCell.tsx","../../src/v1/TableCell/styles.ts","../../src/v1/TableCell/TableCellTypes.ts","../../src/v1/TableCell/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport Container from \"./styles\";\nimport type { TypeTableCellProps } from \"./TableCellTypes\";\n\n/**\n * The table cell component is for rendering table cells and is meant to be used with the table component.\n */\nexport class TableCell extends React.Component<TypeTableCellProps> {\n static displayName: string;\n override render() {\n const {\n id,\n content,\n colSpan,\n width,\n align,\n scope,\n children,\n color,\n ...rest\n } = this.props;\n return (\n <Container\n {...rest}\n // If the `scope` property is passed we must render the element as a <th>\n as={scope ? \"th\" : \"td\"}\n scope={scope ? scope : undefined}\n alignment={align || \"left\"}\n key={id}\n colSpan={colSpan}\n width={width}\n data-qa-table-cell=\"\"\n // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n color={color}\n >\n {children || content}\n </Container>\n );\n }\n}\n\nexport default TableCell;\n","import styled from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableCellProps } from \"./TableCellTypes\";\n\nconst Container = styled.td<{\n alignment: TypeTableCellProps[\"align\"];\n}>`\n ${(props) => props.theme.typography[200]}\n font-weight: ${(props) => props.theme.fontWeights.normal};\n padding: ${(props) => props.theme.space[300]};\n text-align: ${(props) => props.alignment};\n\n ${COMMON}\n`;\n\nexport default Container;\n","import * as React from \"react\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeTableCellProps\n extends TypeSystemCommonProps,\n Omit<\n React.ComponentPropsWithoutRef<\"td\">,\n keyof TypeSystemCommonProps | \"content\"\n > {\n /** Table Cell Id */\n id: string;\n\n /** Content is deprecated. Please use children instead. Content to be render */\n content?: React.ReactNode;\n\n /** Controls the colSpan attribute (optional) */\n colSpan?: number;\n\n /** Controls the width attribute (optional) */\n width?: number;\n\n /** Controls the CSS text-align property (optional) */\n align?: \"left\" | \"right\" | \"center\" | \"justify\";\n\n /** Controls the scope attribute. If set, will change the element from a <td> to a <th>. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#scope (optional) */\n scope?: \"row\" | \"col\" | \"rowGroup\" | \"colGroup\";\n\n /** Children to be rendered */\n children?: React.ReactNode;\n}\n","import TableCell from \"./TableCell\";\n\nexport default TableCell;\nexport { TableCell };\nexport * from \"./TableCellTypes\";\n"],"mappings":";AAAA,YAAY,WAAW;;;ACAvB,OAAO,YAAY;AACnB,SAAS,cAAc;AAGvB,IAAM,YAAY,OAAO;AAAA,IAGrB,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,YAAY,MAAM;AAAA,aAC7C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,gBAC9B,CAAC,UAAU,MAAM,SAAS;AAAA;AAAA,IAEtC,MAAM;AAAA;AAGV,IAAO,iBAAQ;;;ADOT;AAfC,IAAM,YAAN,cAA8B,gBAA8B;AAAA,EACjE,OAAO;AAAA,EACE,SAAS;AAChB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,KAAK;AACT,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QAEJ,IAAI,QAAQ,OAAO;AAAA,QACnB,OAAO,QAAQ,QAAQ;AAAA,QACvB,WAAW,SAAS;AAAA,QACpB,KAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA,sBAAmB;AAAA,QAInB;AAAA;AAAA,MAEC,YAAY;AAAA,IACf;AAAA,EAEJ;AACF;AAEA,IAAO,oBAAQ;;;AE3Cf,OAAuB;;;ACEvB,IAAOA,qBAAQ;","names":["TableCell_default"]}
|