@semcore/data-table 17.0.0-prerelease.30 → 17.0.0-prerelease.34
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/CHANGELOG.md +9 -1
- package/lib/cjs/components/AccordionRows/AccordionRows.js +50 -51
- package/lib/cjs/components/AccordionRows/AccordionRows.js.map +1 -1
- package/lib/cjs/components/Body/Body.js +65 -88
- package/lib/cjs/components/Body/Body.js.map +1 -1
- package/lib/cjs/components/Body/Body.types.js.map +1 -1
- package/lib/cjs/components/Body/Cell.js +50 -51
- package/lib/cjs/components/Body/Cell.js.map +1 -1
- package/lib/cjs/components/Body/LimitOverlay.js +50 -51
- package/lib/cjs/components/Body/LimitOverlay.js.map +1 -1
- package/lib/cjs/components/Body/Row.js +65 -90
- package/lib/cjs/components/Body/Row.js.map +1 -1
- package/lib/cjs/components/Body/Row.types.js.map +1 -1
- package/lib/cjs/components/Body/RowGroup.js +133 -0
- package/lib/cjs/components/Body/RowGroup.js.map +1 -0
- package/lib/cjs/components/Body/style.shadow.css +86 -152
- package/lib/cjs/components/DataTable/DataTable.js +35 -12
- package/lib/cjs/components/DataTable/DataTable.js.map +1 -1
- package/lib/cjs/components/DataTable/DataTable.types.js.map +1 -1
- package/lib/cjs/components/Head/Column.js +37 -36
- package/lib/cjs/components/Head/Column.js.map +1 -1
- package/lib/cjs/components/Head/Group.js +36 -36
- package/lib/cjs/components/Head/Head.js +81 -50
- package/lib/cjs/components/Head/Head.js.map +1 -1
- package/lib/cjs/components/Head/Head.types.js.map +1 -1
- package/lib/cjs/components/Head/style.shadow.css +0 -1
- package/lib/cjs/components/RowSelector/RowsSelector.js +112 -0
- package/lib/cjs/components/RowSelector/RowsSelector.js.map +1 -0
- package/lib/cjs/index.js +7 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/store/SelectableRows.js +129 -0
- package/lib/cjs/store/SelectableRows.js.map +1 -0
- package/lib/es6/components/AccordionRows/AccordionRows.js +50 -51
- package/lib/es6/components/AccordionRows/AccordionRows.js.map +1 -1
- package/lib/es6/components/Body/Body.js +67 -90
- package/lib/es6/components/Body/Body.js.map +1 -1
- package/lib/es6/components/Body/Body.types.js.map +1 -1
- package/lib/es6/components/Body/Cell.js +50 -51
- package/lib/es6/components/Body/Cell.js.map +1 -1
- package/lib/es6/components/Body/LimitOverlay.js +50 -51
- package/lib/es6/components/Body/LimitOverlay.js.map +1 -1
- package/lib/es6/components/Body/Row.js +66 -91
- package/lib/es6/components/Body/Row.js.map +1 -1
- package/lib/es6/components/Body/Row.types.js.map +1 -1
- package/lib/es6/components/Body/RowGroup.js +125 -0
- package/lib/es6/components/Body/RowGroup.js.map +1 -0
- package/lib/es6/components/Body/style.shadow.css +86 -152
- package/lib/es6/components/DataTable/DataTable.js +35 -12
- package/lib/es6/components/DataTable/DataTable.js.map +1 -1
- package/lib/es6/components/DataTable/DataTable.types.js.map +1 -1
- package/lib/es6/components/Head/Column.js +37 -36
- package/lib/es6/components/Head/Column.js.map +1 -1
- package/lib/es6/components/Head/Group.js +36 -36
- package/lib/es6/components/Head/Head.js +81 -50
- package/lib/es6/components/Head/Head.js.map +1 -1
- package/lib/es6/components/Head/Head.types.js.map +1 -1
- package/lib/es6/components/Head/style.shadow.css +0 -1
- package/lib/es6/components/RowSelector/RowsSelector.js +104 -0
- package/lib/es6/components/RowSelector/RowsSelector.js.map +1 -0
- package/lib/es6/index.js +2 -1
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/store/SelectableRows.js +121 -0
- package/lib/es6/store/SelectableRows.js.map +1 -0
- package/lib/esm/components/AccordionRows/AccordionRows.mjs +51 -52
- package/lib/esm/components/Body/Body.mjs +68 -91
- package/lib/esm/components/Body/Cell.mjs +51 -52
- package/lib/esm/components/Body/LimitOverlay.mjs +51 -52
- package/lib/esm/components/Body/Row.mjs +66 -90
- package/lib/esm/components/Body/RowGroup.mjs +124 -0
- package/lib/esm/components/Body/style.shadow.css +86 -152
- package/lib/esm/components/DataTable/DataTable.mjs +34 -12
- package/lib/esm/components/Head/Column.mjs +38 -37
- package/lib/esm/components/Head/Group.mjs +37 -37
- package/lib/esm/components/Head/Head.mjs +83 -51
- package/lib/esm/components/Head/style.shadow.css +0 -1
- package/lib/esm/components/RowSelector/RowsSelector.mjs +107 -0
- package/lib/esm/index.mjs +2 -0
- package/lib/esm/store/SelectableRows.mjs +123 -0
- package/lib/types/components/Body/Body.types.d.ts +2 -1
- package/lib/types/components/Body/Row.d.ts +0 -2
- package/lib/types/components/Body/Row.types.d.ts +2 -1
- package/lib/types/components/Body/RowGroup.d.ts +19 -0
- package/lib/types/components/DataTable/DataTable.types.d.ts +21 -12
- package/lib/types/components/Head/Head.types.d.ts +2 -1
- package/lib/types/components/RowSelector/RowsSelector.d.ts +31 -0
- package/lib/types/index.d.ts +2 -1
- package/lib/types/store/SelectableRows.d.ts +56 -0
- package/package.json +18 -18
|
@@ -10,46 +10,46 @@ const style = (
|
|
|
10
10
|
/*__reshadow_css_start__*/
|
|
11
11
|
(sstyled.insert(
|
|
12
12
|
/*__inner_css_start__*/
|
|
13
|
-
'.
|
|
13
|
+
'.___SGroupContainer_1mbam_gg_,.___SHead_1mbam_gg_{display:contents}.___SHead_1mbam_gg_.__isDataEmpty_1mbam_gg_.__gridTemplateColumns_1mbam_gg_{display:grid;grid-template-columns:var(--gridTemplateColumns_1mbam);overflow:auto;scrollbar-width:thin}.___SHead_1mbam_gg_.__animationDuration_1mbam_gg_>.___SColumn_1mbam_gg_{transition:top var(--animationDuration_1mbam) ease-out}.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SColumn_1mbam_gg_,.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SGroup_1mbam_gg_{position:sticky;top:0;z-index:18}.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SGroupContainer_1mbam_gg_>.___SColumn_1mbam_gg_{position:sticky;z-index:18}.___SHead_1mbam_gg_.__compact_1mbam_gg_ .___SColumn_1mbam_gg_{padding:var(--intergalactic-spacing-3x, 12px) var(--intergalactic-spacing-2x, 8px)}.___SColumn_1mbam_gg_,.___SGroup_1mbam_gg_{display:flex;align-items:flex-start;font-size:var(--intergalactic-fs-100, 12px);color:var(--intergalactic-text-primary, #191b23);box-sizing:border-box;height:100%;position:relative;transition:width calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out,min-width calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out,max-width calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out;overflow:hidden;line-height:var(--intergalactic-lh-100, 133%)}.___SGroup_1mbam_gg_{justify-content:center;text-align:center;background-color:var(--intergalactic-table-th-primary-cell, #f4f5f9)}.___SGroup_1mbam_gg_._use_primary_1mbam_gg_{padding:var(--intergalactic-spacing-3x, 12px)}.___SGroup_1mbam_gg_._use_primary_1mbam_gg_:has(~.___SColumn_1mbam_gg_.__visibleSort_1mbam_gg_){background-color:var(--intergalactic-table-th-primary-cell-hover, #e0e1e9)}.___SGroup_1mbam_gg_._use_secondary_1mbam_gg_{padding:var(--intergalactic-spacing-2x, 8px)}.___SColumn_1mbam_gg_._borders_both_1mbam_gg_,.___SColumn_1mbam_gg_._borders_left_1mbam_gg_,.___SGroup_1mbam_gg_._borders_both_1mbam_gg_,.___SGroup_1mbam_gg_._borders_left_1mbam_gg_{border-left:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___SColumn_1mbam_gg_._borders_both_1mbam_gg_,.___SColumn_1mbam_gg_._borders_right_1mbam_gg_,.___SGroup_1mbam_gg_._borders_both_1mbam_gg_,.___SGroup_1mbam_gg_._borders_right_1mbam_gg_{border-right:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_{padding:var(--intergalactic-spacing-3x, 12px);border-bottom:1px solid var(--intergalactic-border-secondary, #e0e1e9);background-color:var(--intergalactic-table-th-primary-cell, #f4f5f9)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before{background:linear-gradient(270deg,var(--intergalactic-table-th-primary-cell-hover, #e0e1e9) 67.5%,rgba(224,225,233,0) 105%)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_{background-color:var(--intergalactic-table-th-primary-cell-hover, #e0e1e9)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_{flex-basis:calc(var(--intergalactic-spacing-1x, 4px) + 16px);opacity:1}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortButton_1mbam_gg_,.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before,.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before{display:flex;opacity:1}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_._justifyContent_right_1mbam_gg_ .___SSortWrapper_1mbam_gg_{position:absolute}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_._justifyContent_right_1mbam_gg_.__changeSortSize_1mbam_gg_.__isSorted_1mbam_gg_ .___SSortWrapper_1mbam_gg_,.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_._justifyContent_right_1mbam_gg_.__changeSortSize_1mbam_gg_.__isSorted_1mbam_gg_ .___SSortWrapper_1mbam_gg_{position:relative}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_{padding:var(--intergalactic-spacing-2x, 8px);border-bottom:1px solid var(--intergalactic-border-table-accent, #a9abb6);background-color:var(--intergalactic-table-th-secondary-cell, #ffffff)}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before{background:linear-gradient(270deg,var(--intergalactic-table-th-secondary-cell, #ffffff) 67.5%,rgba(255,255,255,0) 105%)}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_{flex-basis:calc(var(--intergalactic-spacing-1x, 4px) + 16px);opacity:1}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortButton_1mbam_gg_{display:flex;opacity:1}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_._justifyContent_right_1mbam_gg_ .___SSortWrapper_1mbam_gg_{position:absolute}.___SColumn_1mbam_gg_.__gridArea_1mbam_gg_,.___SGroupTitle_1mbam_gg_.__gridArea_1mbam_gg_,.___SGroup_1mbam_gg_.__gridArea_1mbam_gg_{grid-area:var(--gridArea_1mbam)}.___SHead_1mbam_gg_ .___SColumn_1mbam_gg_.__fixed_1mbam_gg_,.___SHead_1mbam_gg_ .___SGroup_1mbam_gg_.__fixed_1mbam_gg_,.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SColumn_1mbam_gg_.__fixed_1mbam_gg_{position:sticky;z-index:19}@media (hover:hover){.___SColumn_1mbam_gg_.__sortable_1mbam_gg_:hover{cursor:pointer}}.___SSortWrapper_1mbam_gg_{align-items:center;display:flex;flex-shrink:1;position:relative;flex-basis:0;min-height:16px;opacity:0;transition:all calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out}.___SSortButton_1mbam_gg_,.___SSortWrapper_1mbam_gg_:before{display:none;position:absolute;right:0;opacity:0;transition:opacity .3s ease}.___SSortWrapper_1mbam_gg_:before{content:"";top:0;width:20px;height:100%}.___SSortButton_1mbam_gg_{fill:var(--intergalactic-icon-secondary-neutral-hover-active, #878992);margin-left:var(--intergalactic-spacing-1x, 4px)}.___SHead_1mbam_gg_._sideIndents_wide_1mbam_gg_ .___SColumn_1mbam_gg_:first-child{padding-left:var(--intergalactic-spacing-5x, 20px)}.___SHead_1mbam_gg_._sideIndents_wide_1mbam_gg_ .___SColumn_1mbam_gg_:last-child{padding-right:var(--intergalactic-spacing-5x, 20px)}.___SHeadCheckboxCol_1mbam_gg_{cursor:pointer}.___SColumn_1mbam_gg_.__fixed_1mbam_gg_.__shadowVertical_1mbam_gg_:after,.___SGroup_1mbam_gg_.__fixed_1mbam_gg_.__shadowVertical_1mbam_gg_:after{content:"";position:absolute;pointer-events:none;display:none;top:0;width:5px;height:100%;z-index:5}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_{margin-right:-5px;border-right-color:transparent}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_primary_1mbam_gg_{padding-right:calc(var(--intergalactic-spacing-3x, 12px) + 5px)}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_secondary_1mbam_gg_{padding-right:calc(var(--intergalactic-spacing-2x, 8px) + 5px)}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_:after,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_:after{display:block;right:0;background:var(--intergalactic-scroll-area-shadow-left,\n linear-gradient(to right, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_{margin-left:-5px;border-left-color:transparent}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_primary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_{padding-left:calc(var(--intergalactic-spacing-3x, 12px) + 5px)}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_secondary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_{padding-left:calc(var(--intergalactic-spacing-2x, 8px) + 5px)}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_:after,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_:after{display:block;left:0;background:var(--intergalactic-scroll-area-shadow-right,\n linear-gradient(to left, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}',
|
|
14
14
|
/*__inner_css_end__*/
|
|
15
|
-
"
|
|
15
|
+
"1mbam_gg_"
|
|
16
16
|
), /*__reshadow_css_end__*/
|
|
17
17
|
{
|
|
18
|
-
"__SHead": "
|
|
19
|
-
"__SGroupContainer": "
|
|
20
|
-
"_isDataEmpty": "
|
|
21
|
-
"_gridTemplateColumns": "
|
|
22
|
-
"--gridTemplateColumns": "--
|
|
23
|
-
"_animationDuration": "
|
|
24
|
-
"__SColumn": "
|
|
25
|
-
"--animationDuration": "--
|
|
26
|
-
"_sticky": "
|
|
27
|
-
"__SGroup": "
|
|
28
|
-
"_compact": "
|
|
29
|
-
"_use_secondary": "
|
|
30
|
-
"_borders_both": "
|
|
31
|
-
"_borders_left": "
|
|
32
|
-
"_borders_right": "
|
|
33
|
-
"_gridArea": "
|
|
34
|
-
"__SGroupTitle": "
|
|
35
|
-
"--gridArea": "--
|
|
36
|
-
"_fixed": "
|
|
37
|
-
"_sortable": "
|
|
38
|
-
"__SSortWrapper": "
|
|
39
|
-
"__SSortButton": "
|
|
40
|
-
"__SHeadCheckboxCol": "
|
|
41
|
-
"_use_primary": "
|
|
42
|
-
"_visibleSort": "
|
|
43
|
-
"_justifyContent_right": "
|
|
44
|
-
"_changeSortSize": "
|
|
45
|
-
"_isSorted": "
|
|
46
|
-
"_sideIndents_wide": "
|
|
47
|
-
"_shadowVertical": "
|
|
48
|
-
"_fixed_left": "
|
|
49
|
-
"_shadowVertical_median": "
|
|
50
|
-
"_shadowVertical_start": "
|
|
51
|
-
"_fixed_right": "
|
|
52
|
-
"_shadowVertical_end": "
|
|
18
|
+
"__SHead": "___SHead_1mbam_gg_",
|
|
19
|
+
"__SGroupContainer": "___SGroupContainer_1mbam_gg_",
|
|
20
|
+
"_isDataEmpty": "__isDataEmpty_1mbam_gg_",
|
|
21
|
+
"_gridTemplateColumns": "__gridTemplateColumns_1mbam_gg_",
|
|
22
|
+
"--gridTemplateColumns": "--gridTemplateColumns_1mbam",
|
|
23
|
+
"_animationDuration": "__animationDuration_1mbam_gg_",
|
|
24
|
+
"__SColumn": "___SColumn_1mbam_gg_",
|
|
25
|
+
"--animationDuration": "--animationDuration_1mbam",
|
|
26
|
+
"_sticky": "__sticky_1mbam_gg_",
|
|
27
|
+
"__SGroup": "___SGroup_1mbam_gg_",
|
|
28
|
+
"_compact": "__compact_1mbam_gg_",
|
|
29
|
+
"_use_secondary": "_use_secondary_1mbam_gg_",
|
|
30
|
+
"_borders_both": "_borders_both_1mbam_gg_",
|
|
31
|
+
"_borders_left": "_borders_left_1mbam_gg_",
|
|
32
|
+
"_borders_right": "_borders_right_1mbam_gg_",
|
|
33
|
+
"_gridArea": "__gridArea_1mbam_gg_",
|
|
34
|
+
"__SGroupTitle": "___SGroupTitle_1mbam_gg_",
|
|
35
|
+
"--gridArea": "--gridArea_1mbam",
|
|
36
|
+
"_fixed": "__fixed_1mbam_gg_",
|
|
37
|
+
"_sortable": "__sortable_1mbam_gg_",
|
|
38
|
+
"__SSortWrapper": "___SSortWrapper_1mbam_gg_",
|
|
39
|
+
"__SSortButton": "___SSortButton_1mbam_gg_",
|
|
40
|
+
"__SHeadCheckboxCol": "___SHeadCheckboxCol_1mbam_gg_",
|
|
41
|
+
"_use_primary": "_use_primary_1mbam_gg_",
|
|
42
|
+
"_visibleSort": "__visibleSort_1mbam_gg_",
|
|
43
|
+
"_justifyContent_right": "_justifyContent_right_1mbam_gg_",
|
|
44
|
+
"_changeSortSize": "__changeSortSize_1mbam_gg_",
|
|
45
|
+
"_isSorted": "__isSorted_1mbam_gg_",
|
|
46
|
+
"_sideIndents_wide": "_sideIndents_wide_1mbam_gg_",
|
|
47
|
+
"_shadowVertical": "__shadowVertical_1mbam_gg_",
|
|
48
|
+
"_fixed_left": "_fixed_left_1mbam_gg_",
|
|
49
|
+
"_shadowVertical_median": "_shadowVertical_median_1mbam_gg_",
|
|
50
|
+
"_shadowVertical_start": "_shadowVertical_start_1mbam_gg_",
|
|
51
|
+
"_fixed_right": "_fixed_right_1mbam_gg_",
|
|
52
|
+
"_shadowVertical_end": "_shadowVertical_end_1mbam_gg_"
|
|
53
53
|
})
|
|
54
54
|
);
|
|
55
55
|
class Group extends Component {
|
|
@@ -6,73 +6,83 @@ import Checkbox from "@semcore/checkbox";
|
|
|
6
6
|
import React__default from "react";
|
|
7
7
|
import { Column } from "./Column.mjs";
|
|
8
8
|
import { Group } from "./Group.mjs";
|
|
9
|
+
import { SelectableRows } from "../../store/SelectableRows.mjs";
|
|
9
10
|
import { UNIQ_ROW_KEY, SELECT_ALL, DataTable } from "../DataTable/DataTable.mjs";
|
|
10
11
|
/*!__reshadow-styles__:"./style.shadow.css"*/
|
|
11
12
|
const style = (
|
|
12
13
|
/*__reshadow_css_start__*/
|
|
13
14
|
(sstyled.insert(
|
|
14
15
|
/*__inner_css_start__*/
|
|
15
|
-
'.
|
|
16
|
+
'.___SGroupContainer_1mbam_gg_,.___SHead_1mbam_gg_{display:contents}.___SHead_1mbam_gg_.__isDataEmpty_1mbam_gg_.__gridTemplateColumns_1mbam_gg_{display:grid;grid-template-columns:var(--gridTemplateColumns_1mbam);overflow:auto;scrollbar-width:thin}.___SHead_1mbam_gg_.__animationDuration_1mbam_gg_>.___SColumn_1mbam_gg_{transition:top var(--animationDuration_1mbam) ease-out}.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SColumn_1mbam_gg_,.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SGroup_1mbam_gg_{position:sticky;top:0;z-index:18}.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SGroupContainer_1mbam_gg_>.___SColumn_1mbam_gg_{position:sticky;z-index:18}.___SHead_1mbam_gg_.__compact_1mbam_gg_ .___SColumn_1mbam_gg_{padding:var(--intergalactic-spacing-3x, 12px) var(--intergalactic-spacing-2x, 8px)}.___SColumn_1mbam_gg_,.___SGroup_1mbam_gg_{display:flex;align-items:flex-start;font-size:var(--intergalactic-fs-100, 12px);color:var(--intergalactic-text-primary, #191b23);box-sizing:border-box;height:100%;position:relative;transition:width calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out,min-width calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out,max-width calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out;overflow:hidden;line-height:var(--intergalactic-lh-100, 133%)}.___SGroup_1mbam_gg_{justify-content:center;text-align:center;background-color:var(--intergalactic-table-th-primary-cell, #f4f5f9)}.___SGroup_1mbam_gg_._use_primary_1mbam_gg_{padding:var(--intergalactic-spacing-3x, 12px)}.___SGroup_1mbam_gg_._use_primary_1mbam_gg_:has(~.___SColumn_1mbam_gg_.__visibleSort_1mbam_gg_){background-color:var(--intergalactic-table-th-primary-cell-hover, #e0e1e9)}.___SGroup_1mbam_gg_._use_secondary_1mbam_gg_{padding:var(--intergalactic-spacing-2x, 8px)}.___SColumn_1mbam_gg_._borders_both_1mbam_gg_,.___SColumn_1mbam_gg_._borders_left_1mbam_gg_,.___SGroup_1mbam_gg_._borders_both_1mbam_gg_,.___SGroup_1mbam_gg_._borders_left_1mbam_gg_{border-left:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___SColumn_1mbam_gg_._borders_both_1mbam_gg_,.___SColumn_1mbam_gg_._borders_right_1mbam_gg_,.___SGroup_1mbam_gg_._borders_both_1mbam_gg_,.___SGroup_1mbam_gg_._borders_right_1mbam_gg_{border-right:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_{padding:var(--intergalactic-spacing-3x, 12px);border-bottom:1px solid var(--intergalactic-border-secondary, #e0e1e9);background-color:var(--intergalactic-table-th-primary-cell, #f4f5f9)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before{background:linear-gradient(270deg,var(--intergalactic-table-th-primary-cell-hover, #e0e1e9) 67.5%,rgba(224,225,233,0) 105%)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_{background-color:var(--intergalactic-table-th-primary-cell-hover, #e0e1e9)}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_{flex-basis:calc(var(--intergalactic-spacing-1x, 4px) + 16px);opacity:1}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortButton_1mbam_gg_,.___SColumn_1mbam_gg_._use_primary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before,.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before{display:flex;opacity:1}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_._justifyContent_right_1mbam_gg_ .___SSortWrapper_1mbam_gg_{position:absolute}.___SColumn_1mbam_gg_._use_primary_1mbam_gg_._justifyContent_right_1mbam_gg_.__changeSortSize_1mbam_gg_.__isSorted_1mbam_gg_ .___SSortWrapper_1mbam_gg_,.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_._justifyContent_right_1mbam_gg_.__changeSortSize_1mbam_gg_.__isSorted_1mbam_gg_ .___SSortWrapper_1mbam_gg_{position:relative}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_{padding:var(--intergalactic-spacing-2x, 8px);border-bottom:1px solid var(--intergalactic-border-table-accent, #a9abb6);background-color:var(--intergalactic-table-th-secondary-cell, #ffffff)}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_ .___SSortWrapper_1mbam_gg_::before{background:linear-gradient(270deg,var(--intergalactic-table-th-secondary-cell, #ffffff) 67.5%,rgba(255,255,255,0) 105%)}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortWrapper_1mbam_gg_{flex-basis:calc(var(--intergalactic-spacing-1x, 4px) + 16px);opacity:1}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_.__visibleSort_1mbam_gg_ .___SSortButton_1mbam_gg_{display:flex;opacity:1}.___SColumn_1mbam_gg_._use_secondary_1mbam_gg_._justifyContent_right_1mbam_gg_ .___SSortWrapper_1mbam_gg_{position:absolute}.___SColumn_1mbam_gg_.__gridArea_1mbam_gg_,.___SGroupTitle_1mbam_gg_.__gridArea_1mbam_gg_,.___SGroup_1mbam_gg_.__gridArea_1mbam_gg_{grid-area:var(--gridArea_1mbam)}.___SHead_1mbam_gg_ .___SColumn_1mbam_gg_.__fixed_1mbam_gg_,.___SHead_1mbam_gg_ .___SGroup_1mbam_gg_.__fixed_1mbam_gg_,.___SHead_1mbam_gg_.__sticky_1mbam_gg_ .___SColumn_1mbam_gg_.__fixed_1mbam_gg_{position:sticky;z-index:19}@media (hover:hover){.___SColumn_1mbam_gg_.__sortable_1mbam_gg_:hover{cursor:pointer}}.___SSortWrapper_1mbam_gg_{align-items:center;display:flex;flex-shrink:1;position:relative;flex-basis:0;min-height:16px;opacity:0;transition:all calc(var(--intergalactic-duration-extra-fast, 100)*1ms) ease-in-out}.___SSortButton_1mbam_gg_,.___SSortWrapper_1mbam_gg_:before{display:none;position:absolute;right:0;opacity:0;transition:opacity .3s ease}.___SSortWrapper_1mbam_gg_:before{content:"";top:0;width:20px;height:100%}.___SSortButton_1mbam_gg_{fill:var(--intergalactic-icon-secondary-neutral-hover-active, #878992);margin-left:var(--intergalactic-spacing-1x, 4px)}.___SHead_1mbam_gg_._sideIndents_wide_1mbam_gg_ .___SColumn_1mbam_gg_:first-child{padding-left:var(--intergalactic-spacing-5x, 20px)}.___SHead_1mbam_gg_._sideIndents_wide_1mbam_gg_ .___SColumn_1mbam_gg_:last-child{padding-right:var(--intergalactic-spacing-5x, 20px)}.___SHeadCheckboxCol_1mbam_gg_{cursor:pointer}.___SColumn_1mbam_gg_.__fixed_1mbam_gg_.__shadowVertical_1mbam_gg_:after,.___SGroup_1mbam_gg_.__fixed_1mbam_gg_.__shadowVertical_1mbam_gg_:after{content:"";position:absolute;pointer-events:none;display:none;top:0;width:5px;height:100%;z-index:5}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_{margin-right:-5px;border-right-color:transparent}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_primary_1mbam_gg_{padding-right:calc(var(--intergalactic-spacing-3x, 12px) + 5px)}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_._use_secondary_1mbam_gg_{padding-right:calc(var(--intergalactic-spacing-2x, 8px) + 5px)}.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_:after,.___SColumn_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_median_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_left_1mbam_gg_._shadowVertical_start_1mbam_gg_:after{display:block;right:0;background:var(--intergalactic-scroll-area-shadow-left,\n linear-gradient(to right, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_{margin-left:-5px;border-left-color:transparent}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_primary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_primary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_primary_1mbam_gg_{padding-left:calc(var(--intergalactic-spacing-3x, 12px) + 5px)}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_secondary_1mbam_gg_,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_._use_secondary_1mbam_gg_,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_._use_secondary_1mbam_gg_{padding-left:calc(var(--intergalactic-spacing-2x, 8px) + 5px)}.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_:after,.___SColumn_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_end_1mbam_gg_:after,.___SGroup_1mbam_gg_._fixed_right_1mbam_gg_._shadowVertical_median_1mbam_gg_:after{display:block;left:0;background:var(--intergalactic-scroll-area-shadow-right,\n linear-gradient(to left, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}',
|
|
16
17
|
/*__inner_css_end__*/
|
|
17
|
-
"
|
|
18
|
+
"1mbam_gg_"
|
|
18
19
|
), /*__reshadow_css_end__*/
|
|
19
20
|
{
|
|
20
|
-
"__SHead": "
|
|
21
|
-
"__SGroupContainer": "
|
|
22
|
-
"_isDataEmpty": "
|
|
23
|
-
"_gridTemplateColumns": "
|
|
24
|
-
"--gridTemplateColumns": "--
|
|
25
|
-
"_animationDuration": "
|
|
26
|
-
"__SColumn": "
|
|
27
|
-
"--animationDuration": "--
|
|
28
|
-
"_sticky": "
|
|
29
|
-
"__SGroup": "
|
|
30
|
-
"_compact": "
|
|
31
|
-
"_use_secondary": "
|
|
32
|
-
"_borders_both": "
|
|
33
|
-
"_borders_left": "
|
|
34
|
-
"_borders_right": "
|
|
35
|
-
"_gridArea": "
|
|
36
|
-
"__SGroupTitle": "
|
|
37
|
-
"--gridArea": "--
|
|
38
|
-
"_fixed": "
|
|
39
|
-
"_sortable": "
|
|
40
|
-
"__SSortWrapper": "
|
|
41
|
-
"__SSortButton": "
|
|
42
|
-
"__SHeadCheckboxCol": "
|
|
43
|
-
"_use_primary": "
|
|
44
|
-
"_visibleSort": "
|
|
45
|
-
"_justifyContent_right": "
|
|
46
|
-
"_changeSortSize": "
|
|
47
|
-
"_isSorted": "
|
|
48
|
-
"_sideIndents_wide": "
|
|
49
|
-
"_shadowVertical": "
|
|
50
|
-
"_fixed_left": "
|
|
51
|
-
"_shadowVertical_median": "
|
|
52
|
-
"_shadowVertical_start": "
|
|
53
|
-
"_fixed_right": "
|
|
54
|
-
"_shadowVertical_end": "
|
|
21
|
+
"__SHead": "___SHead_1mbam_gg_",
|
|
22
|
+
"__SGroupContainer": "___SGroupContainer_1mbam_gg_",
|
|
23
|
+
"_isDataEmpty": "__isDataEmpty_1mbam_gg_",
|
|
24
|
+
"_gridTemplateColumns": "__gridTemplateColumns_1mbam_gg_",
|
|
25
|
+
"--gridTemplateColumns": "--gridTemplateColumns_1mbam",
|
|
26
|
+
"_animationDuration": "__animationDuration_1mbam_gg_",
|
|
27
|
+
"__SColumn": "___SColumn_1mbam_gg_",
|
|
28
|
+
"--animationDuration": "--animationDuration_1mbam",
|
|
29
|
+
"_sticky": "__sticky_1mbam_gg_",
|
|
30
|
+
"__SGroup": "___SGroup_1mbam_gg_",
|
|
31
|
+
"_compact": "__compact_1mbam_gg_",
|
|
32
|
+
"_use_secondary": "_use_secondary_1mbam_gg_",
|
|
33
|
+
"_borders_both": "_borders_both_1mbam_gg_",
|
|
34
|
+
"_borders_left": "_borders_left_1mbam_gg_",
|
|
35
|
+
"_borders_right": "_borders_right_1mbam_gg_",
|
|
36
|
+
"_gridArea": "__gridArea_1mbam_gg_",
|
|
37
|
+
"__SGroupTitle": "___SGroupTitle_1mbam_gg_",
|
|
38
|
+
"--gridArea": "--gridArea_1mbam",
|
|
39
|
+
"_fixed": "__fixed_1mbam_gg_",
|
|
40
|
+
"_sortable": "__sortable_1mbam_gg_",
|
|
41
|
+
"__SSortWrapper": "___SSortWrapper_1mbam_gg_",
|
|
42
|
+
"__SSortButton": "___SSortButton_1mbam_gg_",
|
|
43
|
+
"__SHeadCheckboxCol": "___SHeadCheckboxCol_1mbam_gg_",
|
|
44
|
+
"_use_primary": "_use_primary_1mbam_gg_",
|
|
45
|
+
"_visibleSort": "__visibleSort_1mbam_gg_",
|
|
46
|
+
"_justifyContent_right": "_justifyContent_right_1mbam_gg_",
|
|
47
|
+
"_changeSortSize": "__changeSortSize_1mbam_gg_",
|
|
48
|
+
"_isSorted": "__isSorted_1mbam_gg_",
|
|
49
|
+
"_sideIndents_wide": "_sideIndents_wide_1mbam_gg_",
|
|
50
|
+
"_shadowVertical": "__shadowVertical_1mbam_gg_",
|
|
51
|
+
"_fixed_left": "_fixed_left_1mbam_gg_",
|
|
52
|
+
"_shadowVertical_median": "_shadowVertical_median_1mbam_gg_",
|
|
53
|
+
"_shadowVertical_start": "_shadowVertical_start_1mbam_gg_",
|
|
54
|
+
"_fixed_right": "_fixed_right_1mbam_gg_",
|
|
55
|
+
"_shadowVertical_end": "_shadowVertical_end_1mbam_gg_"
|
|
55
56
|
})
|
|
56
57
|
);
|
|
57
58
|
class HeadRoot extends Component {
|
|
58
59
|
constructor(...args) {
|
|
59
60
|
super(...args);
|
|
61
|
+
_defineProperty(this, "unsubscribeSelectAll", void 0);
|
|
60
62
|
_defineProperty(this, "handleSelectAll", (value, event) => {
|
|
61
63
|
var _a, _b;
|
|
62
64
|
const {
|
|
63
|
-
selectedRows
|
|
65
|
+
selectedRows
|
|
64
66
|
} = this.asProps;
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
67
|
+
if (Array.isArray(selectedRows)) {
|
|
68
|
+
const idsSet = new Set(selectedRows);
|
|
69
|
+
if (value) {
|
|
70
|
+
this.selectableRows.forEach((row) => {
|
|
71
|
+
idsSet.add(row[UNIQ_ROW_KEY]);
|
|
72
|
+
});
|
|
73
|
+
} else {
|
|
74
|
+
this.selectableRows.forEach((row) => {
|
|
75
|
+
idsSet.delete(row[UNIQ_ROW_KEY]);
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
(_b = (_a = this.asProps).onChangeSelectAll) == null ? void 0 : _b.call(_a, Array.from(idsSet), event);
|
|
79
|
+
} else if (selectedRows) {
|
|
80
|
+
if (value) {
|
|
81
|
+
selectedRows.selectAll();
|
|
82
|
+
} else {
|
|
83
|
+
selectedRows.clearAllAvailable();
|
|
84
|
+
}
|
|
74
85
|
}
|
|
75
|
-
(_b = (_a = this.asProps).onChangeSelectAll) == null ? void 0 : _b.call(_a, Array.from(idsSet), event);
|
|
76
86
|
});
|
|
77
87
|
_defineProperty(this, "handleClickSelectAll", (value) => (event) => {
|
|
78
88
|
event == null ? void 0 : event.preventDefault();
|
|
@@ -80,6 +90,20 @@ class HeadRoot extends Component {
|
|
|
80
90
|
this.handleSelectAll(value, event);
|
|
81
91
|
});
|
|
82
92
|
}
|
|
93
|
+
componentDidMount() {
|
|
94
|
+
const {
|
|
95
|
+
selectedRows
|
|
96
|
+
} = this.asProps;
|
|
97
|
+
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
98
|
+
this.unsubscribeSelectAll = selectedRows.subscribe(SelectableRows.SELECT_ALL_EVENT, () => {
|
|
99
|
+
this.forceUpdate();
|
|
100
|
+
});
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
componentWillUnmount() {
|
|
104
|
+
var _a;
|
|
105
|
+
(_a = this.unsubscribeSelectAll) == null ? void 0 : _a.call(this);
|
|
106
|
+
}
|
|
83
107
|
sortableColumnDescribeId() {
|
|
84
108
|
const {
|
|
85
109
|
uid
|
|
@@ -189,15 +213,23 @@ class HeadRoot extends Component {
|
|
|
189
213
|
}
|
|
190
214
|
get areAllRowsSelected() {
|
|
191
215
|
const {
|
|
192
|
-
selectedRows
|
|
216
|
+
selectedRows
|
|
193
217
|
} = this.asProps;
|
|
194
|
-
|
|
218
|
+
if (Array.isArray(selectedRows)) {
|
|
219
|
+
return selectedRows.length > 0 && this.selectableRows.every((row) => selectedRows == null ? void 0 : selectedRows.includes(row[UNIQ_ROW_KEY]));
|
|
220
|
+
} else if (selectedRows) {
|
|
221
|
+
return selectedRows.isAllSelected();
|
|
222
|
+
}
|
|
195
223
|
}
|
|
196
224
|
get isIndeterminate() {
|
|
197
225
|
const {
|
|
198
226
|
selectedRows
|
|
199
227
|
} = this.asProps;
|
|
200
|
-
|
|
228
|
+
if (Array.isArray(selectedRows)) {
|
|
229
|
+
return this.selectableRows.some((row) => selectedRows == null ? void 0 : selectedRows.includes(row[UNIQ_ROW_KEY]));
|
|
230
|
+
} else if (selectedRows) {
|
|
231
|
+
return selectedRows.isIndeterminate();
|
|
232
|
+
}
|
|
201
233
|
}
|
|
202
234
|
get selectableRows() {
|
|
203
235
|
const {
|
|
@@ -195,7 +195,6 @@ SSortButton {
|
|
|
195
195
|
display: none;
|
|
196
196
|
fill: var(--intergalactic-icon-secondary-neutral-hover-active, #878992);
|
|
197
197
|
position: absolute;
|
|
198
|
-
top: calc(-1 * (1em * 1.25 - 16px));
|
|
199
198
|
right: 0;
|
|
200
199
|
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
201
200
|
opacity: 0;
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import Checkbox from "@semcore/checkbox";
|
|
3
|
+
import React__default from "react";
|
|
4
|
+
import { SelectableRows } from "../../store/SelectableRows.mjs";
|
|
5
|
+
import { Row } from "../Body/Row.mjs";
|
|
6
|
+
import { UNIQ_ROW_KEY, SELECT_ALL } from "../DataTable/DataTable.mjs";
|
|
7
|
+
class RowSelector extends React__default.PureComponent {
|
|
8
|
+
constructor(props) {
|
|
9
|
+
super(props);
|
|
10
|
+
_defineProperty(this, "state", {
|
|
11
|
+
checked: false
|
|
12
|
+
});
|
|
13
|
+
_defineProperty(this, "unsubscribeToggle", void 0);
|
|
14
|
+
_defineProperty(this, "handleSelectRow", (value, event) => {
|
|
15
|
+
const {
|
|
16
|
+
row,
|
|
17
|
+
rowIndex,
|
|
18
|
+
onSelectRow,
|
|
19
|
+
selectedRows
|
|
20
|
+
} = this.props;
|
|
21
|
+
onSelectRow == null ? void 0 : onSelectRow(value, rowIndex, row, event);
|
|
22
|
+
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
23
|
+
selectedRows.toggle(value, row);
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
_defineProperty(this, "handleClickCheckbox", (value) => (event) => {
|
|
27
|
+
event == null ? void 0 : event.preventDefault();
|
|
28
|
+
event == null ? void 0 : event.stopPropagation();
|
|
29
|
+
const {
|
|
30
|
+
row,
|
|
31
|
+
rowIndex,
|
|
32
|
+
onSelectRow,
|
|
33
|
+
selectedRows
|
|
34
|
+
} = this.props;
|
|
35
|
+
onSelectRow == null ? void 0 : onSelectRow(value, rowIndex, row, event);
|
|
36
|
+
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
37
|
+
selectedRows.toggle(value, row);
|
|
38
|
+
}
|
|
39
|
+
});
|
|
40
|
+
const {
|
|
41
|
+
row: _row,
|
|
42
|
+
selectedRows: _selectedRows
|
|
43
|
+
} = props;
|
|
44
|
+
if (_selectedRows && !Array.isArray(_selectedRows)) {
|
|
45
|
+
this.state.checked = _selectedRows.has(_row[UNIQ_ROW_KEY]);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
componentDidMount() {
|
|
49
|
+
const {
|
|
50
|
+
row,
|
|
51
|
+
selectedRows
|
|
52
|
+
} = this.props;
|
|
53
|
+
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
54
|
+
this.unsubscribeToggle = selectedRows.subscribe(SelectableRows.TOGGLE_EVENT, (key) => {
|
|
55
|
+
if (row[UNIQ_ROW_KEY] === key) {
|
|
56
|
+
this.setState({
|
|
57
|
+
checked: selectedRows.has(row[UNIQ_ROW_KEY])
|
|
58
|
+
});
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
componentWillUnmount() {
|
|
64
|
+
var _a;
|
|
65
|
+
(_a = this.unsubscribeToggle) == null ? void 0 : _a.call(this);
|
|
66
|
+
}
|
|
67
|
+
render() {
|
|
68
|
+
const SCheckboxCell = Row.Cell;
|
|
69
|
+
const {
|
|
70
|
+
row,
|
|
71
|
+
rowIndex,
|
|
72
|
+
gridRowIndex,
|
|
73
|
+
expanded,
|
|
74
|
+
withAccordion,
|
|
75
|
+
isAccordionRow,
|
|
76
|
+
isCellHidden,
|
|
77
|
+
theme,
|
|
78
|
+
uid,
|
|
79
|
+
selectedRows
|
|
80
|
+
} = this.props;
|
|
81
|
+
const rowUniqKey = row[UNIQ_ROW_KEY];
|
|
82
|
+
const checked = Array.isArray(selectedRows) ? selectedRows.includes(rowUniqKey) : this.state.checked;
|
|
83
|
+
return /* @__PURE__ */ React__default.createElement(SCheckboxCell, {
|
|
84
|
+
row,
|
|
85
|
+
rowIndex,
|
|
86
|
+
column: {
|
|
87
|
+
name: SELECT_ALL.toString()
|
|
88
|
+
},
|
|
89
|
+
columnIndex: 0,
|
|
90
|
+
gridRowIndex,
|
|
91
|
+
onClick: this.handleClickCheckbox(!checked),
|
|
92
|
+
expanded,
|
|
93
|
+
isAccordionRow,
|
|
94
|
+
"aria-hidden": isCellHidden,
|
|
95
|
+
withAccordion,
|
|
96
|
+
theme,
|
|
97
|
+
"data-row-selector": true
|
|
98
|
+
}, /* @__PURE__ */ React__default.createElement(Checkbox, {
|
|
99
|
+
checked,
|
|
100
|
+
"aria-labelledby": `${uid}_${rowUniqKey}_1`,
|
|
101
|
+
onChange: this.handleSelectRow
|
|
102
|
+
}, /* @__PURE__ */ React__default.createElement(Checkbox.Value, null)));
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
export {
|
|
106
|
+
RowSelector
|
|
107
|
+
};
|
package/lib/esm/index.mjs
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { MergedColumnsCell, MergedRowsCell } from "./components/Body/MergedCells.mjs";
|
|
2
2
|
import { ACCORDION, DataTable, ROW_GROUP } from "./components/DataTable/DataTable.mjs";
|
|
3
|
+
import { SelectableRows } from "./store/SelectableRows.mjs";
|
|
3
4
|
const wrapDataTable = (wrapper) => wrapper;
|
|
4
5
|
export {
|
|
5
6
|
ACCORDION,
|
|
@@ -7,5 +8,6 @@ export {
|
|
|
7
8
|
MergedColumnsCell,
|
|
8
9
|
MergedRowsCell,
|
|
9
10
|
ROW_GROUP,
|
|
11
|
+
SelectableRows,
|
|
10
12
|
wrapDataTable
|
|
11
13
|
};
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import EventEmitter from "@semcore/core/lib/utils/eventEmitter";
|
|
3
|
+
import { UNIQ_ROW_KEY } from "../components/DataTable/DataTable.mjs";
|
|
4
|
+
class SelectableRows extends EventEmitter {
|
|
5
|
+
constructor(initValues = []) {
|
|
6
|
+
super();
|
|
7
|
+
_defineProperty(this, "values", void 0);
|
|
8
|
+
_defineProperty(this, "availableKeys", /* @__PURE__ */ new Set());
|
|
9
|
+
_defineProperty(this, "lastSelectedRow", null);
|
|
10
|
+
_defineProperty(this, "isPressedShift", false);
|
|
11
|
+
this.values = new Set(initValues);
|
|
12
|
+
}
|
|
13
|
+
setAvailableKeys(value) {
|
|
14
|
+
this.availableKeys = new Set(value);
|
|
15
|
+
}
|
|
16
|
+
get() {
|
|
17
|
+
return Array.from(this.values.keys());
|
|
18
|
+
}
|
|
19
|
+
isChecked(key) {
|
|
20
|
+
return this.values.has(key);
|
|
21
|
+
}
|
|
22
|
+
replace(value) {
|
|
23
|
+
this.clearAll();
|
|
24
|
+
value.forEach((val) => {
|
|
25
|
+
this.values.add(val);
|
|
26
|
+
this.emit(SelectableRows.TOGGLE_EVENT, val);
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
has(value) {
|
|
30
|
+
return this.values.has(value);
|
|
31
|
+
}
|
|
32
|
+
isAllSelected() {
|
|
33
|
+
let isAllSelected = true;
|
|
34
|
+
if (this.availableKeys.size === 0 || this.values.size === 0) {
|
|
35
|
+
return false;
|
|
36
|
+
}
|
|
37
|
+
for (const key of this.availableKeys.values()) {
|
|
38
|
+
if (!this.values.has(key)) {
|
|
39
|
+
isAllSelected = false;
|
|
40
|
+
break;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
return isAllSelected;
|
|
44
|
+
}
|
|
45
|
+
isIndeterminate() {
|
|
46
|
+
let isIndeterminate = false;
|
|
47
|
+
for (const key of this.availableKeys.values()) {
|
|
48
|
+
if (this.values.has(key)) {
|
|
49
|
+
isIndeterminate = true;
|
|
50
|
+
break;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
return isIndeterminate;
|
|
54
|
+
}
|
|
55
|
+
selectAll() {
|
|
56
|
+
for (const key of this.availableKeys.values()) {
|
|
57
|
+
this.values.add(key);
|
|
58
|
+
this.emit(SelectableRows.TOGGLE_EVENT, key);
|
|
59
|
+
}
|
|
60
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
61
|
+
}
|
|
62
|
+
clearAll() {
|
|
63
|
+
const keys = Array.from(this.values.values());
|
|
64
|
+
this.values.clear();
|
|
65
|
+
for (const key of keys) {
|
|
66
|
+
this.emit(SelectableRows.TOGGLE_EVENT, key);
|
|
67
|
+
}
|
|
68
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
69
|
+
}
|
|
70
|
+
clearAllAvailable() {
|
|
71
|
+
for (const key of this.availableKeys.values()) {
|
|
72
|
+
this.values.delete(key);
|
|
73
|
+
this.emit(SelectableRows.TOGGLE_EVENT, key);
|
|
74
|
+
}
|
|
75
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
76
|
+
}
|
|
77
|
+
toggle(selected, row) {
|
|
78
|
+
if (this.isPressedShift && this.values.size > 0 && this.lastSelectedRow && (selected ? this.values.has(this.lastSelectedRow) : true)) {
|
|
79
|
+
let select = false;
|
|
80
|
+
for (const item of this.availableKeys.values()) {
|
|
81
|
+
if (!select && (item === row[UNIQ_ROW_KEY] || item === this.lastSelectedRow)) {
|
|
82
|
+
select = true;
|
|
83
|
+
this.toggleOneRow(selected, item);
|
|
84
|
+
continue;
|
|
85
|
+
}
|
|
86
|
+
if (select) {
|
|
87
|
+
this.toggleOneRow(selected, item);
|
|
88
|
+
}
|
|
89
|
+
if (select && (item === row[UNIQ_ROW_KEY] || item === this.lastSelectedRow)) {
|
|
90
|
+
break;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
} else {
|
|
94
|
+
this.toggleOneRow(selected, row[UNIQ_ROW_KEY]);
|
|
95
|
+
}
|
|
96
|
+
this.lastSelectedRow = row[UNIQ_ROW_KEY];
|
|
97
|
+
}
|
|
98
|
+
toggleOneRow(isSelected, key) {
|
|
99
|
+
if (isSelected) {
|
|
100
|
+
if (this.values.size === 0) {
|
|
101
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
102
|
+
}
|
|
103
|
+
this.values.add(key);
|
|
104
|
+
if (this.values.size === this.availableKeys.size) {
|
|
105
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
106
|
+
}
|
|
107
|
+
} else {
|
|
108
|
+
if (this.values.size === this.availableKeys.size) {
|
|
109
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
110
|
+
}
|
|
111
|
+
this.values.delete(key);
|
|
112
|
+
if (this.values.size === 0) {
|
|
113
|
+
this.emit(SelectableRows.SELECT_ALL_EVENT);
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
this.emit(SelectableRows.TOGGLE_EVENT, key);
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
_defineProperty(SelectableRows, "TOGGLE_EVENT", "toggle_selected_row");
|
|
120
|
+
_defineProperty(SelectableRows, "SELECT_ALL_EVENT", "select_all_selected_rows");
|
|
121
|
+
export {
|
|
122
|
+
SelectableRows
|
|
123
|
+
};
|
|
@@ -2,6 +2,7 @@ import type { Intergalactic } from '@semcore/core';
|
|
|
2
2
|
import type * as React from 'react';
|
|
3
3
|
import type { DataTableCellProps, Theme } from './Cell.types';
|
|
4
4
|
import type { DTRow, RowPropsInner } from './Row.types';
|
|
5
|
+
import type { ISelectedRows } from '../../store/SelectableRows';
|
|
5
6
|
import type { ACCORDION } from '../DataTable/DataTable';
|
|
6
7
|
import type { DataRowItem, DTUse, VirtualScroll, DataTableProps, DataTableData } from '../DataTable/DataTable.types';
|
|
7
8
|
import type { DTColumn } from '../Head/Column.types';
|
|
@@ -67,7 +68,7 @@ export type BodyPropsInner<Data extends DataTableData, UniqKeyType> = DataTableB
|
|
|
67
68
|
renderCell?: (props: CellRenderProps<Data[number], UniqKeyType>) => React.ReactNode | Record<string, any>;
|
|
68
69
|
onBackFromAccordion: (colName: string) => void;
|
|
69
70
|
stickyHeader?: boolean;
|
|
70
|
-
selectedRows?: UniqKeyType[]
|
|
71
|
+
selectedRows?: UniqKeyType[] | ISelectedRows<UniqKeyType>;
|
|
71
72
|
onSelectRow?: (isSelect: boolean, selectedRowIndex: number, row: DTRow<UniqKeyType>, event?: React.SyntheticEvent<HTMLElement>) => void;
|
|
72
73
|
renderEmptyData: () => React.ReactNode;
|
|
73
74
|
sideIndents?: 'wide';
|