@semcore/data-table 4.51.0-prerelease.5 → 4.51.0-prerelease.6
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/lib/cjs/Body.js +477 -0
- package/lib/cjs/Body.js.map +1 -0
- package/lib/cjs/DataTable.js +629 -0
- package/lib/cjs/DataTable.js.map +1 -0
- package/lib/cjs/Head.js +398 -0
- package/lib/cjs/Head.js.map +1 -0
- package/lib/cjs/index.js +15 -38
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/data-table.shadow.css +413 -0
- package/lib/cjs/style/scroll-shadows.shadow.css +5 -50
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js +5 -4
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/cjs/translations/de.json +1 -6
- package/lib/cjs/translations/en.json +1 -6
- package/lib/cjs/translations/es.json +1 -6
- package/lib/cjs/translations/fr.json +1 -6
- package/lib/cjs/translations/it.json +1 -6
- package/lib/cjs/translations/ja.json +1 -6
- package/lib/cjs/translations/ko.json +1 -6
- package/lib/cjs/translations/nl.json +1 -6
- package/lib/cjs/translations/pl.json +1 -6
- package/lib/cjs/translations/pt.json +1 -6
- package/lib/cjs/translations/sv.json +1 -6
- package/lib/cjs/translations/tr.json +1 -6
- package/lib/cjs/translations/vi.json +1 -6
- package/lib/cjs/translations/zh.json +1 -6
- package/lib/cjs/types.js +4 -0
- package/lib/cjs/types.js.map +1 -0
- package/lib/cjs/utils.js +57 -0
- package/lib/cjs/utils.js.map +1 -0
- package/lib/es6/Body.js +469 -0
- package/lib/es6/Body.js.map +1 -0
- package/lib/es6/DataTable.js +619 -0
- package/lib/es6/DataTable.js.map +1 -0
- package/lib/es6/Head.js +390 -0
- package/lib/es6/Head.js.map +1 -0
- package/lib/es6/index.js +2 -7
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/data-table.shadow.css +413 -0
- package/lib/es6/style/scroll-shadows.shadow.css +5 -50
- package/lib/es6/translations/__intergalactic-dynamic-locales.js +2 -2
- package/lib/es6/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/es6/translations/de.json +1 -6
- package/lib/es6/translations/en.json +1 -6
- package/lib/es6/translations/es.json +1 -6
- package/lib/es6/translations/fr.json +1 -6
- package/lib/es6/translations/it.json +1 -6
- package/lib/es6/translations/ja.json +1 -6
- package/lib/es6/translations/ko.json +1 -6
- package/lib/es6/translations/nl.json +1 -6
- package/lib/es6/translations/pl.json +1 -6
- package/lib/es6/translations/pt.json +1 -6
- package/lib/es6/translations/sv.json +1 -6
- package/lib/es6/translations/tr.json +1 -6
- package/lib/es6/translations/vi.json +1 -6
- package/lib/es6/translations/zh.json +1 -6
- package/lib/es6/types.js +2 -0
- package/lib/es6/types.js.map +1 -0
- package/lib/es6/utils.js +48 -0
- package/lib/es6/utils.js.map +1 -0
- package/lib/esm/Body.mjs +430 -0
- package/lib/esm/DataTable.mjs +589 -0
- package/lib/esm/Head.mjs +368 -0
- package/lib/esm/index.mjs +5 -12
- package/lib/esm/style/data-table.shadow.css +413 -0
- package/lib/esm/style/scroll-shadows.shadow.css +5 -50
- package/lib/esm/translations/__intergalactic-dynamic-locales.mjs +2 -2
- package/lib/esm/translations/de.json.mjs +1 -6
- package/lib/esm/translations/en.json.mjs +1 -6
- package/lib/esm/translations/es.json.mjs +1 -6
- package/lib/esm/translations/fr.json.mjs +1 -6
- package/lib/esm/translations/it.json.mjs +1 -6
- package/lib/esm/translations/ja.json.mjs +1 -6
- package/lib/esm/translations/ko.json.mjs +1 -6
- package/lib/esm/translations/nl.json.mjs +1 -6
- package/lib/esm/translations/pl.json.mjs +1 -6
- package/lib/esm/translations/pt.json.mjs +1 -6
- package/lib/esm/translations/sv.json.mjs +1 -6
- package/lib/esm/translations/tr.json.mjs +1 -6
- package/lib/esm/translations/vi.json.mjs +1 -6
- package/lib/esm/translations/zh.json.mjs +1 -6
- package/lib/esm/utils.mjs +52 -0
- package/lib/types/Body.d.ts +61 -0
- package/lib/types/DataTable.d.ts +205 -0
- package/lib/types/Head.d.ts +45 -0
- package/lib/types/index.d.ts +2 -10
- package/lib/types/translations/__intergalactic-dynamic-locales.d.ts +0 -70
- package/lib/types/types.d.ts +73 -0
- package/lib/types/utils.d.ts +4 -0
- package/package.json +6 -6
- package/lib/cjs/components/AccordionRows/AccordionRows.js +0 -177
- package/lib/cjs/components/AccordionRows/AccordionRows.js.map +0 -1
- package/lib/cjs/components/Body/Body.js +0 -445
- package/lib/cjs/components/Body/Body.js.map +0 -1
- package/lib/cjs/components/Body/Body.types.js +0 -2
- package/lib/cjs/components/Body/Body.types.js.map +0 -1
- package/lib/cjs/components/Body/Cell.js +0 -205
- package/lib/cjs/components/Body/Cell.js.map +0 -1
- package/lib/cjs/components/Body/Cell.types.js +0 -2
- package/lib/cjs/components/Body/Cell.types.js.map +0 -1
- package/lib/cjs/components/Body/LimitOverlay.js +0 -191
- package/lib/cjs/components/Body/LimitOverlay.js.map +0 -1
- package/lib/cjs/components/Body/MergedCells.js +0 -31
- package/lib/cjs/components/Body/MergedCells.js.map +0 -1
- package/lib/cjs/components/Body/Row.js +0 -630
- package/lib/cjs/components/Body/Row.js.map +0 -1
- package/lib/cjs/components/Body/Row.types.js +0 -2
- package/lib/cjs/components/Body/Row.types.js.map +0 -1
- package/lib/cjs/components/Body/RowGroup.js +0 -118
- package/lib/cjs/components/Body/RowGroup.js.map +0 -1
- package/lib/cjs/components/Body/style.shadow.css +0 -367
- package/lib/cjs/components/DataTable/DataTable.js +0 -1303
- package/lib/cjs/components/DataTable/DataTable.js.map +0 -1
- package/lib/cjs/components/DataTable/DataTable.types.js +0 -2
- package/lib/cjs/components/DataTable/DataTable.types.js.map +0 -1
- package/lib/cjs/components/DataTable/ScrollBars.js +0 -63
- package/lib/cjs/components/DataTable/ScrollBars.js.map +0 -1
- package/lib/cjs/components/DataTable/dataTable.shadow.css +0 -43
- package/lib/cjs/components/Head/Column.js +0 -350
- package/lib/cjs/components/Head/Column.js.map +0 -1
- package/lib/cjs/components/Head/Column.types.js +0 -2
- package/lib/cjs/components/Head/Column.types.js.map +0 -1
- package/lib/cjs/components/Head/Group.js +0 -116
- package/lib/cjs/components/Head/Group.js.map +0 -1
- package/lib/cjs/components/Head/Group.type.js +0 -2
- package/lib/cjs/components/Head/Group.type.js.map +0 -1
- package/lib/cjs/components/Head/Head.js +0 -350
- package/lib/cjs/components/Head/Head.js.map +0 -1
- package/lib/cjs/components/Head/Head.types.js +0 -2
- package/lib/cjs/components/Head/Head.types.js.map +0 -1
- package/lib/cjs/components/Head/style.shadow.css +0 -292
- package/lib/cjs/components/RowSelector/RowsSelector.js +0 -132
- package/lib/cjs/components/RowSelector/RowsSelector.js.map +0 -1
- package/lib/cjs/components/RowSelector/SRAnnouncer.js +0 -62
- package/lib/cjs/components/RowSelector/SRAnnouncer.js.map +0 -1
- package/lib/cjs/components/RowSelector/SRReactiveAnnouncer.js +0 -39
- package/lib/cjs/components/RowSelector/SRReactiveAnnouncer.js.map +0 -1
- package/lib/cjs/enhancers/focusableCell.js +0 -76
- package/lib/cjs/enhancers/focusableCell.js.map +0 -1
- package/lib/cjs/store/SelectableRows.js +0 -211
- package/lib/cjs/store/SelectableRows.js.map +0 -1
- package/lib/es6/components/AccordionRows/AccordionRows.js +0 -171
- package/lib/es6/components/AccordionRows/AccordionRows.js.map +0 -1
- package/lib/es6/components/Body/Body.js +0 -439
- package/lib/es6/components/Body/Body.js.map +0 -1
- package/lib/es6/components/Body/Body.types.js +0 -2
- package/lib/es6/components/Body/Body.types.js.map +0 -1
- package/lib/es6/components/Body/Cell.js +0 -199
- package/lib/es6/components/Body/Cell.js.map +0 -1
- package/lib/es6/components/Body/Cell.types.js +0 -2
- package/lib/es6/components/Body/Cell.types.js.map +0 -1
- package/lib/es6/components/Body/LimitOverlay.js +0 -184
- package/lib/es6/components/Body/LimitOverlay.js.map +0 -1
- package/lib/es6/components/Body/MergedCells.js +0 -24
- package/lib/es6/components/Body/MergedCells.js.map +0 -1
- package/lib/es6/components/Body/Row.js +0 -624
- package/lib/es6/components/Body/Row.js.map +0 -1
- package/lib/es6/components/Body/Row.types.js +0 -2
- package/lib/es6/components/Body/Row.types.js.map +0 -1
- package/lib/es6/components/Body/RowGroup.js +0 -111
- package/lib/es6/components/Body/RowGroup.js.map +0 -1
- package/lib/es6/components/Body/style.shadow.css +0 -367
- package/lib/es6/components/DataTable/DataTable.js +0 -1298
- package/lib/es6/components/DataTable/DataTable.js.map +0 -1
- package/lib/es6/components/DataTable/DataTable.types.js +0 -2
- package/lib/es6/components/DataTable/DataTable.types.js.map +0 -1
- package/lib/es6/components/DataTable/ScrollBars.js +0 -57
- package/lib/es6/components/DataTable/ScrollBars.js.map +0 -1
- package/lib/es6/components/DataTable/dataTable.shadow.css +0 -43
- package/lib/es6/components/Head/Column.js +0 -344
- package/lib/es6/components/Head/Column.js.map +0 -1
- package/lib/es6/components/Head/Column.types.js +0 -2
- package/lib/es6/components/Head/Column.types.js.map +0 -1
- package/lib/es6/components/Head/Group.js +0 -111
- package/lib/es6/components/Head/Group.js.map +0 -1
- package/lib/es6/components/Head/Group.type.js +0 -2
- package/lib/es6/components/Head/Group.type.js.map +0 -1
- package/lib/es6/components/Head/Head.js +0 -345
- package/lib/es6/components/Head/Head.js.map +0 -1
- package/lib/es6/components/Head/Head.types.js +0 -2
- package/lib/es6/components/Head/Head.types.js.map +0 -1
- package/lib/es6/components/Head/style.shadow.css +0 -292
- package/lib/es6/components/RowSelector/RowsSelector.js +0 -125
- package/lib/es6/components/RowSelector/RowsSelector.js.map +0 -1
- package/lib/es6/components/RowSelector/SRAnnouncer.js +0 -55
- package/lib/es6/components/RowSelector/SRAnnouncer.js.map +0 -1
- package/lib/es6/components/RowSelector/SRReactiveAnnouncer.js +0 -32
- package/lib/es6/components/RowSelector/SRReactiveAnnouncer.js.map +0 -1
- package/lib/es6/enhancers/focusableCell.js +0 -69
- package/lib/es6/enhancers/focusableCell.js.map +0 -1
- package/lib/es6/store/SelectableRows.js +0 -204
- package/lib/es6/store/SelectableRows.js.map +0 -1
- package/lib/esm/components/AccordionRows/AccordionRows.mjs +0 -155
- package/lib/esm/components/Body/Body.mjs +0 -395
- package/lib/esm/components/Body/Cell.mjs +0 -192
- package/lib/esm/components/Body/LimitOverlay.mjs +0 -179
- package/lib/esm/components/Body/MergedCells.mjs +0 -27
- package/lib/esm/components/Body/Row.mjs +0 -556
- package/lib/esm/components/Body/RowGroup.mjs +0 -113
- package/lib/esm/components/Body/style.shadow.css +0 -367
- package/lib/esm/components/DataTable/DataTable.mjs +0 -1216
- package/lib/esm/components/DataTable/ScrollBars.mjs +0 -61
- package/lib/esm/components/DataTable/dataTable.shadow.css +0 -43
- package/lib/esm/components/Head/Column.mjs +0 -321
- package/lib/esm/components/Head/Group.mjs +0 -111
- package/lib/esm/components/Head/Head.mjs +0 -307
- package/lib/esm/components/Head/style.shadow.css +0 -292
- package/lib/esm/components/RowSelector/RowsSelector.mjs +0 -105
- package/lib/esm/components/RowSelector/SRAnnouncer.mjs +0 -51
- package/lib/esm/components/RowSelector/SRReactiveAnnouncer.mjs +0 -31
- package/lib/esm/enhancers/focusableCell.mjs +0 -72
- package/lib/esm/store/SelectableRows.mjs +0 -201
- package/lib/types/components/AccordionRows/AccordionRows.d.ts +0 -41
- package/lib/types/components/Body/Body.d.ts +0 -6
- package/lib/types/components/Body/Body.types.d.ts +0 -87
- package/lib/types/components/Body/Cell.d.ts +0 -1
- package/lib/types/components/Body/Cell.types.d.ts +0 -36
- package/lib/types/components/Body/LimitOverlay.d.ts +0 -17
- package/lib/types/components/Body/MergedCells.d.ts +0 -17
- package/lib/types/components/Body/Row.d.ts +0 -47
- package/lib/types/components/Body/Row.types.d.ts +0 -74
- package/lib/types/components/Body/RowGroup.d.ts +0 -19
- package/lib/types/components/DataTable/DataTable.d.ts +0 -14
- package/lib/types/components/DataTable/DataTable.types.d.ts +0 -202
- package/lib/types/components/DataTable/ScrollBars.d.ts +0 -11
- package/lib/types/components/Head/Column.d.ts +0 -39
- package/lib/types/components/Head/Column.types.d.ts +0 -85
- package/lib/types/components/Head/Group.d.ts +0 -15
- package/lib/types/components/Head/Group.type.d.ts +0 -18
- package/lib/types/components/Head/Head.d.ts +0 -9
- package/lib/types/components/Head/Head.types.d.ts +0 -58
- package/lib/types/components/RowSelector/RowsSelector.d.ts +0 -32
- package/lib/types/components/RowSelector/SRAnnouncer.d.ts +0 -10
- package/lib/types/components/RowSelector/SRReactiveAnnouncer.d.ts +0 -8
- package/lib/types/enhancers/focusableCell.d.ts +0 -9
- package/lib/types/store/SelectableRows.d.ts +0 -60
|
@@ -1,292 +0,0 @@
|
|
|
1
|
-
SHead, SGroupContainer {
|
|
2
|
-
display: contents;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
SHead[isDataEmpty][gridTemplateColumns] {
|
|
6
|
-
display: grid;
|
|
7
|
-
grid-template-columns: var(--gridTemplateColumns);
|
|
8
|
-
overflow: auto;
|
|
9
|
-
scrollbar-width: thin;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
SHead[animationDuration] > SColumn {
|
|
13
|
-
transition: top var(--animationDuration) ease-out;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
@keyframes moveWithScroll {
|
|
17
|
-
from {
|
|
18
|
-
transform: translateY(0);
|
|
19
|
-
}
|
|
20
|
-
to {
|
|
21
|
-
transform: translateY(var(--global-scroll-to));
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
SHead[withAnimation][sticky] SColumn, SHead[withAnimation][sticky] SGroup {
|
|
26
|
-
animation-name: moveWithScroll;
|
|
27
|
-
animation-timeline: --table-sticky-timeline;
|
|
28
|
-
animation-range-start: exit-crossing calc(-1 * var(--global-header-top));
|
|
29
|
-
animation-range-end: exit-crossing calc(100% - var(--global-header-top));
|
|
30
|
-
animation-timing-function: linear;
|
|
31
|
-
animation-fill-mode: both;
|
|
32
|
-
|
|
33
|
-
transform: none;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
SHead[sticky] SColumn, SHead[sticky] SGroup {
|
|
37
|
-
position: sticky;
|
|
38
|
-
top: 0;
|
|
39
|
-
z-index: 18;
|
|
40
|
-
transform: translateY(var(--global-scroll-translate));
|
|
41
|
-
will-change: scroll-position;
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
SHead[compact] SColumn {
|
|
45
|
-
padding: var(--intergalactic-spacing-3x, 12px) var(--intergalactic-spacing-2x, 8px);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
SGroup, SColumn {
|
|
49
|
-
display: flex;
|
|
50
|
-
align-items: flex-start;
|
|
51
|
-
font-size: var(--intergalactic-fs-100, 12px);
|
|
52
|
-
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
53
|
-
box-sizing: border-box;
|
|
54
|
-
height: 100%;
|
|
55
|
-
position: relative;
|
|
56
|
-
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;
|
|
57
|
-
overflow: hidden;
|
|
58
|
-
line-height: var(--intergalactic-lh-100, 133%);
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
SGroup {
|
|
62
|
-
justify-content: center;
|
|
63
|
-
text-align: center;
|
|
64
|
-
background-color: var(--intergalactic-table-th-primary-cell, oklch(0.98 0.001 180));
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
SGroup[use='primary'] {
|
|
68
|
-
padding: var(--intergalactic-spacing-3x, 12px);
|
|
69
|
-
|
|
70
|
-
&:has(~ SColumn[visibleSort]) {
|
|
71
|
-
background-color: var(--intergalactic-table-th-primary-cell-hover, oklch(0.94 0.002 180));
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
SGroup[use='secondary'] {
|
|
75
|
-
padding: var(--intergalactic-spacing-2x, 8px);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
SGroup[borders='both'], SColumn[borders='both'], SGroup[borders='left'], SColumn[borders='left'] {
|
|
79
|
-
border-left: 1px solid var(--intergalactic-border-secondary, oklch(0.176 0.033 175.7 / 0.07));
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
SGroup[borders='both'], SColumn[borders='both'], SGroup[borders='right'], SColumn[borders='right'] {
|
|
83
|
-
border-right: 1px solid var(--intergalactic-border-secondary, oklch(0.176 0.033 175.7 / 0.07));
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
SColumn[use='primary'] {
|
|
87
|
-
padding: var(--intergalactic-spacing-3x, 12px);
|
|
88
|
-
border-bottom: 1px solid var(--intergalactic-border-secondary, oklch(0.176 0.033 175.7 / 0.07));
|
|
89
|
-
background-color: var(--intergalactic-table-th-primary-cell, oklch(0.98 0.001 180));
|
|
90
|
-
|
|
91
|
-
SSortWrapper::before {
|
|
92
|
-
background: linear-gradient(
|
|
93
|
-
270deg,
|
|
94
|
-
var(--intergalactic-table-th-primary-cell-hover, oklch(0.94 0.002 180)) 67.5%,
|
|
95
|
-
rgba(224, 225, 233, 0) 105%
|
|
96
|
-
);
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
&[visibleSort] {
|
|
100
|
-
background-color: var(--intergalactic-table-th-primary-cell-hover, oklch(0.94 0.002 180));
|
|
101
|
-
|
|
102
|
-
SSortWrapper {
|
|
103
|
-
flex-basis: calc(var(--intergalactic-spacing-1x, 4px) + 16px);
|
|
104
|
-
opacity: 1;
|
|
105
|
-
|
|
106
|
-
&::before {
|
|
107
|
-
display: flex;
|
|
108
|
-
opacity: 1;
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
SSortButton {
|
|
113
|
-
display: flex;
|
|
114
|
-
opacity: 1;
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
&[justifyContent='right'] {
|
|
119
|
-
SSortWrapper {
|
|
120
|
-
position: absolute;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
&[changeSortSize][isSorted] {
|
|
124
|
-
SSortWrapper {
|
|
125
|
-
position: relative;
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
SColumn[use='secondary'] {
|
|
132
|
-
padding: var(--intergalactic-spacing-2x, 8px);
|
|
133
|
-
border-bottom: 1px solid var(--intergalactic-border-table-accent, oklch(0.137 0.026 175.7 / 0.161));
|
|
134
|
-
background-color: var(--intergalactic-table-th-secondary-cell, oklch(1 0 0));
|
|
135
|
-
|
|
136
|
-
SSortWrapper::before {
|
|
137
|
-
background: linear-gradient(
|
|
138
|
-
270deg,
|
|
139
|
-
var(--intergalactic-table-th-secondary-cell, oklch(1 0 0)) 67.5%,
|
|
140
|
-
rgba(255, 255, 255, 0) 105%
|
|
141
|
-
);
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
&[visibleSort] {
|
|
145
|
-
SSortWrapper {
|
|
146
|
-
flex-basis: calc(var(--intergalactic-spacing-1x, 4px) + 16px);
|
|
147
|
-
opacity: 1;
|
|
148
|
-
|
|
149
|
-
&::before {
|
|
150
|
-
display: flex;
|
|
151
|
-
opacity: 1;
|
|
152
|
-
}
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
SSortButton {
|
|
156
|
-
display: flex;
|
|
157
|
-
opacity: 1;
|
|
158
|
-
}
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
&[justifyContent='right'] {
|
|
162
|
-
SSortWrapper {
|
|
163
|
-
position: absolute;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
&[changeSortSize][isSorted] {
|
|
167
|
-
SSortWrapper {
|
|
168
|
-
position: relative;
|
|
169
|
-
}
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
SColumn[gridArea], SGroup[gridArea], SGroupTitle[gridArea] {
|
|
175
|
-
grid-area: var(--gridArea);
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
SHead[sticky] SColumn[fixed], SHead SColumn[fixed], SHead SGroup[fixed] {
|
|
179
|
-
position: sticky;
|
|
180
|
-
/* because up resizable */
|
|
181
|
-
z-index: 19;
|
|
182
|
-
}
|
|
183
|
-
|
|
184
|
-
SColumn[sortable]:hover {
|
|
185
|
-
cursor: pointer;
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
SSortWrapper {
|
|
189
|
-
align-items: center;
|
|
190
|
-
display: flex;
|
|
191
|
-
flex-shrink: 1;
|
|
192
|
-
position: relative;
|
|
193
|
-
flex-basis: 0;
|
|
194
|
-
min-height: 16px;
|
|
195
|
-
opacity: 0;
|
|
196
|
-
transition: all calc(var(--intergalactic-duration-extra-fast, 100) * 1ms) ease-in-out;
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
SSortWrapper:before {
|
|
200
|
-
display: none;
|
|
201
|
-
content: '';
|
|
202
|
-
position: absolute;
|
|
203
|
-
top: 0;
|
|
204
|
-
right: 0;
|
|
205
|
-
width: 20px;
|
|
206
|
-
height: 100%;
|
|
207
|
-
opacity: 0;
|
|
208
|
-
transition: opacity 0.3s ease;
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
SSortButton {
|
|
212
|
-
display: none;
|
|
213
|
-
fill: var(--intergalactic-icon-secondary-neutral-hover-active, oklch(0.1 0.023 159.1 / 0.433));
|
|
214
|
-
position: absolute;
|
|
215
|
-
right: 0;
|
|
216
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
217
|
-
opacity: 0;
|
|
218
|
-
transition: opacity 0.3s ease;
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
SHead[sideIndents='wide'] {
|
|
222
|
-
SColumn:first-child {
|
|
223
|
-
padding-left: var(--intergalactic-spacing-5x, 20px);
|
|
224
|
-
}
|
|
225
|
-
SColumn:last-child {
|
|
226
|
-
padding-right: var(--intergalactic-spacing-5x, 20px);
|
|
227
|
-
}
|
|
228
|
-
}
|
|
229
|
-
|
|
230
|
-
SHeadCheckboxCol {
|
|
231
|
-
cursor: pointer;
|
|
232
|
-
}
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
SColumn[fixed][shadowVertical], SGroup[fixed][shadowVertical] {
|
|
236
|
-
&:after {
|
|
237
|
-
content: '';
|
|
238
|
-
position: absolute;
|
|
239
|
-
pointer-events: none;
|
|
240
|
-
display: none;
|
|
241
|
-
top: 0;
|
|
242
|
-
width: 5px;
|
|
243
|
-
height: 100%;
|
|
244
|
-
z-index: 5;
|
|
245
|
-
}
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
/*SColumnChildrenWrapper*/
|
|
250
|
-
|
|
251
|
-
SColumn[fixed='left'][shadowVertical='median'],
|
|
252
|
-
SColumn[fixed='left'][shadowVertical='start'],
|
|
253
|
-
SGroup[fixed='left'][shadowVertical='median'],
|
|
254
|
-
SGroup[fixed='left'][shadowVertical='start'] {
|
|
255
|
-
margin-right: -5px;
|
|
256
|
-
border-right-color: transparent;
|
|
257
|
-
|
|
258
|
-
&[use='primary'] {
|
|
259
|
-
padding-right: calc(var(--intergalactic-spacing-3x, 12px) + 5px);
|
|
260
|
-
}
|
|
261
|
-
&[use='secondary'] {
|
|
262
|
-
padding-right: calc(var(--intergalactic-spacing-2x, 8px) + 5px);
|
|
263
|
-
}
|
|
264
|
-
|
|
265
|
-
&:after {
|
|
266
|
-
display: block;
|
|
267
|
-
right: 0;
|
|
268
|
-
background: var(--intergalactic-scroll-area-shadow-left,
|
|
269
|
-
linear-gradient(to right, oklch(from oklch(0.23 0.01 140) l c h / 0.08) 20.55%, transparent 100%));
|
|
270
|
-
}
|
|
271
|
-
}
|
|
272
|
-
SColumn[fixed='right'][shadowVertical='median'],
|
|
273
|
-
SColumn[fixed='right'][shadowVertical='end'],
|
|
274
|
-
SGroup[fixed='right'][shadowVertical='median'],
|
|
275
|
-
SGroup[fixed='right'][shadowVertical='end'] {
|
|
276
|
-
margin-left: -5px;
|
|
277
|
-
border-left-color: transparent;
|
|
278
|
-
|
|
279
|
-
&[use='primary'] {
|
|
280
|
-
padding-left: calc(var(--intergalactic-spacing-3x, 12px) + 5px);
|
|
281
|
-
}
|
|
282
|
-
&[use='secondary'] {
|
|
283
|
-
padding-left: calc(var(--intergalactic-spacing-2x, 8px) + 5px);
|
|
284
|
-
}
|
|
285
|
-
|
|
286
|
-
&:after {
|
|
287
|
-
display: block;
|
|
288
|
-
left: 0;
|
|
289
|
-
background: var(--intergalactic-scroll-area-shadow-right,
|
|
290
|
-
linear-gradient(to left, oklch(from oklch(0.23 0.01 140) l c h / 0.08) 20.55%, transparent 100%));
|
|
291
|
-
}
|
|
292
|
-
}
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
|
-
import _callSuper from "@babel/runtime/helpers/callSuper";
|
|
4
|
-
import _inherits from "@babel/runtime/helpers/inherits";
|
|
5
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
6
|
-
import Checkbox from '@semcore/checkbox';
|
|
7
|
-
import React from 'react';
|
|
8
|
-
import { SelectableRows } from '../../store/SelectableRows';
|
|
9
|
-
import { Row } from '../Body/Row';
|
|
10
|
-
import { UNIQ_ROW_KEY, SELECT_ALL } from '../DataTable/DataTable';
|
|
11
|
-
export var RowSelector = /*#__PURE__*/function (_React$PureComponent) {
|
|
12
|
-
function RowSelector(props) {
|
|
13
|
-
var _this;
|
|
14
|
-
_classCallCheck(this, RowSelector);
|
|
15
|
-
_this = _callSuper(this, RowSelector, [props]);
|
|
16
|
-
_defineProperty(_this, "state", {
|
|
17
|
-
checked: false
|
|
18
|
-
});
|
|
19
|
-
_defineProperty(_this, "unsubscribeToggle", undefined);
|
|
20
|
-
_defineProperty(_this, "handleSelectRow", function (value, event) {
|
|
21
|
-
var _this$props = _this.props,
|
|
22
|
-
row = _this$props.row,
|
|
23
|
-
rowIndex = _this$props.rowIndex,
|
|
24
|
-
onSelectRow = _this$props.onSelectRow,
|
|
25
|
-
selectedRows = _this$props.selectedRows;
|
|
26
|
-
onSelectRow === null || onSelectRow === void 0 || onSelectRow(value, rowIndex, row, event);
|
|
27
|
-
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
28
|
-
selectedRows.toggle(value, row);
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
_defineProperty(_this, "handleClickCheckbox", function (value) {
|
|
32
|
-
return function (event) {
|
|
33
|
-
event === null || event === void 0 || event.preventDefault();
|
|
34
|
-
event === null || event === void 0 || event.stopPropagation();
|
|
35
|
-
var _this$props2 = _this.props,
|
|
36
|
-
row = _this$props2.row,
|
|
37
|
-
rowIndex = _this$props2.rowIndex,
|
|
38
|
-
onSelectRow = _this$props2.onSelectRow,
|
|
39
|
-
selectedRows = _this$props2.selectedRows;
|
|
40
|
-
onSelectRow === null || onSelectRow === void 0 || onSelectRow(value, rowIndex, row, event);
|
|
41
|
-
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
42
|
-
selectedRows.toggle(value, row);
|
|
43
|
-
}
|
|
44
|
-
};
|
|
45
|
-
});
|
|
46
|
-
var _row = props.row,
|
|
47
|
-
_selectedRows = props.selectedRows;
|
|
48
|
-
if (_selectedRows && !Array.isArray(_selectedRows)) {
|
|
49
|
-
_this.state.checked = _selectedRows.has(_row[UNIQ_ROW_KEY]);
|
|
50
|
-
}
|
|
51
|
-
return _this;
|
|
52
|
-
}
|
|
53
|
-
_inherits(RowSelector, _React$PureComponent);
|
|
54
|
-
return _createClass(RowSelector, [{
|
|
55
|
-
key: "componentDidMount",
|
|
56
|
-
value: function componentDidMount() {
|
|
57
|
-
var _this2 = this;
|
|
58
|
-
var _this$props3 = this.props,
|
|
59
|
-
row = _this$props3.row,
|
|
60
|
-
selectedRows = _this$props3.selectedRows;
|
|
61
|
-
if (selectedRows && !Array.isArray(selectedRows)) {
|
|
62
|
-
this.unsubscribeToggle = selectedRows.on(SelectableRows.TOGGLE_EVENT, function (key) {
|
|
63
|
-
if (row[UNIQ_ROW_KEY] === key) {
|
|
64
|
-
_this2.setState({
|
|
65
|
-
checked: selectedRows.has(row[UNIQ_ROW_KEY])
|
|
66
|
-
});
|
|
67
|
-
}
|
|
68
|
-
});
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
}, {
|
|
72
|
-
key: "componentWillUnmount",
|
|
73
|
-
value: function componentWillUnmount() {
|
|
74
|
-
var _this$unsubscribeTogg;
|
|
75
|
-
(_this$unsubscribeTogg = this.unsubscribeToggle) === null || _this$unsubscribeTogg === void 0 || _this$unsubscribeTogg.call(this);
|
|
76
|
-
}
|
|
77
|
-
}, {
|
|
78
|
-
key: "render",
|
|
79
|
-
value: function render() {
|
|
80
|
-
var SCheckboxCell = Row.Cell;
|
|
81
|
-
var _this$props4 = this.props,
|
|
82
|
-
row = _this$props4.row,
|
|
83
|
-
rowIndex = _this$props4.rowIndex,
|
|
84
|
-
gridRowIndex = _this$props4.gridRowIndex,
|
|
85
|
-
expanded = _this$props4.expanded,
|
|
86
|
-
withAccordion = _this$props4.withAccordion,
|
|
87
|
-
isAccordionRow = _this$props4.isAccordionRow,
|
|
88
|
-
isCellHidden = _this$props4.isCellHidden,
|
|
89
|
-
theme = _this$props4.theme,
|
|
90
|
-
uid = _this$props4.uid,
|
|
91
|
-
selectedRows = _this$props4.selectedRows,
|
|
92
|
-
fixed = _this$props4.fixed;
|
|
93
|
-
var rowUniqKey = row[UNIQ_ROW_KEY];
|
|
94
|
-
var checked = Array.isArray(selectedRows) ? selectedRows.includes(rowUniqKey) : this.state.checked;
|
|
95
|
-
var style = {};
|
|
96
|
-
if (fixed) {
|
|
97
|
-
style.left = 0;
|
|
98
|
-
}
|
|
99
|
-
return /*#__PURE__*/React.createElement(SCheckboxCell, {
|
|
100
|
-
row: row,
|
|
101
|
-
rowIndex: rowIndex,
|
|
102
|
-
column: {
|
|
103
|
-
name: SELECT_ALL,
|
|
104
|
-
fixed: fixed
|
|
105
|
-
},
|
|
106
|
-
columnIndex: 0,
|
|
107
|
-
gridRowIndex: gridRowIndex,
|
|
108
|
-
onClick: this.handleClickCheckbox(!checked),
|
|
109
|
-
expanded: expanded,
|
|
110
|
-
isAccordionRow: isAccordionRow,
|
|
111
|
-
"aria-hidden": isCellHidden,
|
|
112
|
-
withAccordion: withAccordion,
|
|
113
|
-
theme: theme,
|
|
114
|
-
"data-row-selector": true,
|
|
115
|
-
fixed: fixed,
|
|
116
|
-
style: style
|
|
117
|
-
}, /*#__PURE__*/React.createElement(Checkbox, {
|
|
118
|
-
checked: checked,
|
|
119
|
-
"aria-labelledby": "".concat(uid, "_").concat(rowUniqKey, "_1"),
|
|
120
|
-
onChange: this.handleSelectRow
|
|
121
|
-
}, /*#__PURE__*/React.createElement(Checkbox.Value, null)));
|
|
122
|
-
}
|
|
123
|
-
}]);
|
|
124
|
-
}(React.PureComponent);
|
|
125
|
-
//# sourceMappingURL=RowsSelector.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RowsSelector.js","names":["Checkbox","React","SelectableRows","Row","UNIQ_ROW_KEY","SELECT_ALL","RowSelector","_React$PureComponent","props","_this","_classCallCheck","_callSuper","_defineProperty","checked","undefined","value","event","_this$props","row","rowIndex","onSelectRow","selectedRows","Array","isArray","toggle","preventDefault","stopPropagation","_this$props2","state","has","_inherits","_createClass","key","componentDidMount","_this2","_this$props3","unsubscribeToggle","on","TOGGLE_EVENT","setState","componentWillUnmount","_this$unsubscribeTogg","call","render","SCheckboxCell","Cell","_this$props4","gridRowIndex","expanded","withAccordion","isAccordionRow","isCellHidden","theme","uid","fixed","rowUniqKey","includes","style","left","createElement","column","name","columnIndex","onClick","handleClickCheckbox","concat","onChange","handleSelectRow","Value","PureComponent"],"sources":["../../../../src/components/RowSelector/RowsSelector.tsx"],"sourcesContent":["import Checkbox from '@semcore/checkbox';\nimport type { CSSProperties } from 'react';\nimport React from 'react';\n\nimport type { ISelectedRows } from '../../store/SelectableRows';\nimport { SelectableRows } from '../../store/SelectableRows';\nimport type { Theme } from '../Body/Cell.types';\nimport { Row } from '../Body/Row';\nimport type { DTRow } from '../Body/Row.types';\nimport { UNIQ_ROW_KEY, SELECT_ALL } from '../DataTable/DataTable';\n\ntype RowSelectorProps<UniqKeyType> = {\n row: DTRow<UniqKeyType>;\n rowIndex: number;\n gridRowIndex: number;\n expanded: boolean;\n withAccordion: boolean;\n\n uid: string;\n theme?: Theme;\n isCellHidden?: boolean;\n isAccordionRow?: boolean;\n selectedRows?: UniqKeyType[] | ISelectedRows<UniqKeyType>;\n onSelectRow?: (\n isSelect: boolean,\n selectedRowIndex: number,\n row: DTRow<UniqKeyType>,\n event?: React.SyntheticEvent<HTMLElement>,\n ) => void;\n fixed?: boolean;\n};\n\ntype State = {\n checked: boolean;\n};\n\nexport class RowSelector<UniqKeyType> extends React.PureComponent<RowSelectorProps<UniqKeyType>, State> {\n state: State = {\n checked: false,\n };\n\n private unsubscribeToggle: undefined | (() => void) = undefined;\n\n constructor(props: RowSelectorProps<UniqKeyType>) {\n super(props);\n\n const { row, selectedRows } = props;\n if (selectedRows && !Array.isArray(selectedRows)) {\n this.state.checked = selectedRows.has(row[UNIQ_ROW_KEY]);\n }\n }\n\n componentDidMount(): void {\n const { row, selectedRows } = this.props;\n if (selectedRows && !Array.isArray(selectedRows)) {\n this.unsubscribeToggle = selectedRows.on(SelectableRows.TOGGLE_EVENT, (key: UniqKeyType) => {\n if (row[UNIQ_ROW_KEY] === key) {\n this.setState({ checked: selectedRows.has(row[UNIQ_ROW_KEY]) });\n }\n });\n }\n }\n\n componentWillUnmount(): void {\n this.unsubscribeToggle?.();\n }\n\n handleSelectRow = (value: boolean, event?: React.SyntheticEvent<HTMLElement>) => {\n const { row, rowIndex, onSelectRow, selectedRows } = this.props;\n\n onSelectRow?.(value, rowIndex, row, event);\n\n if (selectedRows && !Array.isArray(selectedRows)) {\n selectedRows.toggle(value, row);\n }\n };\n\n handleClickCheckbox = (value: boolean) => (event?: React.SyntheticEvent<HTMLElement>) => {\n event?.preventDefault();\n event?.stopPropagation();\n const { row, rowIndex, onSelectRow, selectedRows } = this.props;\n\n onSelectRow?.(value, rowIndex, row, event);\n\n if (selectedRows && !Array.isArray(selectedRows)) {\n selectedRows.toggle(value, row);\n }\n };\n\n render() {\n const SCheckboxCell = Row.Cell;\n\n const {\n row,\n rowIndex,\n gridRowIndex,\n expanded,\n withAccordion,\n isAccordionRow,\n isCellHidden,\n theme,\n uid,\n selectedRows,\n fixed,\n } = this.props;\n const rowUniqKey = row[UNIQ_ROW_KEY];\n\n const checked = Array.isArray(selectedRows) ? selectedRows.includes(rowUniqKey) : this.state.checked;\n const style: CSSProperties = {};\n\n if (fixed) {\n style.left = 0;\n }\n\n return (\n <SCheckboxCell\n row={row}\n rowIndex={rowIndex}\n column={{ name: SELECT_ALL, fixed }}\n columnIndex={0}\n gridRowIndex={gridRowIndex}\n onClick={this.handleClickCheckbox(!checked)}\n expanded={expanded}\n isAccordionRow={isAccordionRow}\n aria-hidden={isCellHidden}\n withAccordion={withAccordion}\n theme={theme}\n data-row-selector\n fixed={fixed}\n style={style}\n >\n <Checkbox\n checked={checked}\n aria-labelledby={`${uid}_${rowUniqKey}_1`}\n onChange={this.handleSelectRow}\n >\n <Checkbox.Value />\n </Checkbox>\n </SCheckboxCell>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
import { ScreenReaderOnly } from '@semcore/base-components';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { UNIQ_ROW_KEY } from '../DataTable/DataTable';
|
|
5
|
-
export function SRAnnouncer(props) {
|
|
6
|
-
var _React$useState = React.useState(''),
|
|
7
|
-
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
8
|
-
ariaMessage = _React$useState2[0],
|
|
9
|
-
setAriaMessage = _React$useState2[1];
|
|
10
|
-
var _React$useState3 = React.useState(false),
|
|
11
|
-
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
12
|
-
selectedAll = _React$useState4[0],
|
|
13
|
-
setSelectedAll = _React$useState4[1];
|
|
14
|
-
React.useEffect(function () {
|
|
15
|
-
var selectedRowsSet = new Set(props.selectedRows);
|
|
16
|
-
var allChecked = [];
|
|
17
|
-
var allUnchecked = [];
|
|
18
|
-
props.flatRows.forEach(function (row) {
|
|
19
|
-
if (selectedRowsSet.has(row[UNIQ_ROW_KEY])) {
|
|
20
|
-
allChecked.push(row[UNIQ_ROW_KEY]);
|
|
21
|
-
} else {
|
|
22
|
-
allUnchecked.push(row[UNIQ_ROW_KEY]);
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
if (allChecked.length === props.data.length) {
|
|
26
|
-
setSelectedAll(true);
|
|
27
|
-
} else if (allUnchecked.length === props.data.length) {
|
|
28
|
-
setSelectedAll(false);
|
|
29
|
-
}
|
|
30
|
-
}, [props.selectedRows, props.data, props.flatRows]);
|
|
31
|
-
React.useEffect(function () {
|
|
32
|
-
var getI18nText = props.getI18nText;
|
|
33
|
-
var message = getI18nText(selectedAll ? 'DataTable.allItemsSelected:aria-live' : 'DataTable.allItemsDeselected:aria-live');
|
|
34
|
-
setAriaMessage(message);
|
|
35
|
-
var timeout = setTimeout(function () {
|
|
36
|
-
return setAriaMessage('');
|
|
37
|
-
}, 5000);
|
|
38
|
-
return function () {
|
|
39
|
-
return clearTimeout(timeout);
|
|
40
|
-
};
|
|
41
|
-
}, [selectedAll, props.getI18nText]);
|
|
42
|
-
React.useEffect(function () {
|
|
43
|
-
var timer = setTimeout(function () {
|
|
44
|
-
return setAriaMessage('');
|
|
45
|
-
}, 1000);
|
|
46
|
-
return function () {
|
|
47
|
-
return clearTimeout(timer);
|
|
48
|
-
};
|
|
49
|
-
}, [ariaMessage]);
|
|
50
|
-
return /*#__PURE__*/React.createElement(ScreenReaderOnly, {
|
|
51
|
-
role: "status",
|
|
52
|
-
"aria-live": "polite"
|
|
53
|
-
}, ariaMessage);
|
|
54
|
-
}
|
|
55
|
-
//# sourceMappingURL=SRAnnouncer.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SRAnnouncer.js","names":["ScreenReaderOnly","React","UNIQ_ROW_KEY","SRAnnouncer","props","_React$useState","useState","_React$useState2","_slicedToArray","ariaMessage","setAriaMessage","_React$useState3","_React$useState4","selectedAll","setSelectedAll","useEffect","selectedRowsSet","Set","selectedRows","allChecked","allUnchecked","flatRows","forEach","row","has","push","length","data","getI18nText","message","timeout","setTimeout","clearTimeout","timer","createElement","role"],"sources":["../../../../src/components/RowSelector/SRAnnouncer.tsx"],"sourcesContent":["import { ScreenReaderOnly } from '@semcore/base-components';\nimport React from 'react';\n\nimport type { DTRow } from '../Body/Row.types';\nimport { UNIQ_ROW_KEY } from '../DataTable/DataTable';\n\ntype Props<UniqKey> = {\n selectedRows: Array<UniqKey>;\n getI18nText: (key: string) => string;\n flatRows: DTRow<UniqKey>[];\n data: unknown[];\n};\n\nexport function SRAnnouncer<UniqKey>(props: Props<UniqKey>) {\n const [ariaMessage, setAriaMessage] = React.useState('');\n const [selectedAll, setSelectedAll] = React.useState(false);\n\n React.useEffect(() => {\n const selectedRowsSet = new Set<UniqKey>(props.selectedRows);\n\n const allChecked: UniqKey[] = [];\n const allUnchecked: UniqKey[] = [];\n\n props.flatRows.forEach((row) => {\n if (selectedRowsSet.has(row[UNIQ_ROW_KEY])) {\n allChecked.push(row[UNIQ_ROW_KEY]);\n } else {\n allUnchecked.push(row[UNIQ_ROW_KEY]);\n }\n });\n\n if (allChecked.length === props.data.length) {\n setSelectedAll(true);\n } else if (allUnchecked.length === props.data.length) {\n setSelectedAll(false);\n }\n }, [props.selectedRows, props.data, props.flatRows]);\n\n React.useEffect(() => {\n const { getI18nText } = props;\n\n const message = getI18nText(\n selectedAll\n ? 'DataTable.allItemsSelected:aria-live'\n : 'DataTable.allItemsDeselected:aria-live',\n );\n setAriaMessage(message);\n\n const timeout = setTimeout(() => setAriaMessage(''), 5000);\n\n return () => clearTimeout(timeout);\n }, [selectedAll, props.getI18nText]);\n\n React.useEffect(() => {\n const timer = setTimeout(() => setAriaMessage(''), 1000);\n return () => clearTimeout(timer);\n }, [ariaMessage]);\n\n return (\n <ScreenReaderOnly role='status' aria-live='polite'>\n {ariaMessage}\n </ScreenReaderOnly>\n );\n}\n"],"mappings":";AAAA,SAASA,gBAAgB,QAAQ,0BAA0B;AAC3D,OAAOC,KAAK,MAAM,OAAO;AAGzB,SAASC,YAAY,QAAQ,wBAAwB;AASrD,OAAO,SAASC,WAAWA,CAAUC,KAAqB,EAAE;EAC1D,IAAAC,eAAA,GAAsCJ,KAAK,CAACK,QAAQ,CAAC,EAAE,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAH,eAAA;IAAjDI,WAAW,GAAAF,gBAAA;IAAEG,cAAc,GAAAH,gBAAA;EAClC,IAAAI,gBAAA,GAAsCV,KAAK,CAACK,QAAQ,CAAC,KAAK,CAAC;IAAAM,gBAAA,GAAAJ,cAAA,CAAAG,gBAAA;IAApDE,WAAW,GAAAD,gBAAA;IAAEE,cAAc,GAAAF,gBAAA;EAElCX,KAAK,CAACc,SAAS,CAAC,YAAM;IACpB,IAAMC,eAAe,GAAG,IAAIC,GAAG,CAAUb,KAAK,CAACc,YAAY,CAAC;IAE5D,IAAMC,UAAqB,GAAG,EAAE;IAChC,IAAMC,YAAuB,GAAG,EAAE;IAElChB,KAAK,CAACiB,QAAQ,CAACC,OAAO,CAAC,UAACC,GAAG,EAAK;MAC9B,IAAIP,eAAe,CAACQ,GAAG,CAACD,GAAG,CAACrB,YAAY,CAAC,CAAC,EAAE;QAC1CiB,UAAU,CAACM,IAAI,CAACF,GAAG,CAACrB,YAAY,CAAC,CAAC;MACpC,CAAC,MAAM;QACLkB,YAAY,CAACK,IAAI,CAACF,GAAG,CAACrB,YAAY,CAAC,CAAC;MACtC;IACF,CAAC,CAAC;IAEF,IAAIiB,UAAU,CAACO,MAAM,KAAKtB,KAAK,CAACuB,IAAI,CAACD,MAAM,EAAE;MAC3CZ,cAAc,CAAC,IAAI,CAAC;IACtB,CAAC,MAAM,IAAIM,YAAY,CAACM,MAAM,KAAKtB,KAAK,CAACuB,IAAI,CAACD,MAAM,EAAE;MACpDZ,cAAc,CAAC,KAAK,CAAC;IACvB;EACF,CAAC,EAAE,CAACV,KAAK,CAACc,YAAY,EAAEd,KAAK,CAACuB,IAAI,EAAEvB,KAAK,CAACiB,QAAQ,CAAC,CAAC;EAEpDpB,KAAK,CAACc,SAAS,CAAC,YAAM;IACpB,IAAQa,WAAW,GAAKxB,KAAK,CAArBwB,WAAW;IAEnB,IAAMC,OAAO,GAAGD,WAAW,CACzBf,WAAW,GACP,sCAAsC,GACtC,wCACN,CAAC;IACDH,cAAc,CAACmB,OAAO,CAAC;IAEvB,IAAMC,OAAO,GAAGC,UAAU,CAAC;MAAA,OAAMrB,cAAc,CAAC,EAAE,CAAC;IAAA,GAAE,IAAI,CAAC;IAE1D,OAAO;MAAA,OAAMsB,YAAY,CAACF,OAAO,CAAC;IAAA;EACpC,CAAC,EAAE,CAACjB,WAAW,EAAET,KAAK,CAACwB,WAAW,CAAC,CAAC;EAEpC3B,KAAK,CAACc,SAAS,CAAC,YAAM;IACpB,IAAMkB,KAAK,GAAGF,UAAU,CAAC;MAAA,OAAMrB,cAAc,CAAC,EAAE,CAAC;IAAA,GAAE,IAAI,CAAC;IACxD,OAAO;MAAA,OAAMsB,YAAY,CAACC,KAAK,CAAC;IAAA;EAClC,CAAC,EAAE,CAACxB,WAAW,CAAC,CAAC;EAEjB,oBACER,KAAA,CAAAiC,aAAA,CAAClC,gBAAgB;IAACmC,IAAI,EAAC,QAAQ;IAAC,aAAU;EAAQ,GAC/C1B,WACe,CAAC;AAEvB","ignoreList":[]}
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
import { ScreenReaderOnly } from '@semcore/base-components';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { SelectableRows } from '../../store/SelectableRows';
|
|
5
|
-
export function SRReactiveAnnouncer(props) {
|
|
6
|
-
var _React$useState = React.useState(''),
|
|
7
|
-
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
8
|
-
ariaMessage = _React$useState2[0],
|
|
9
|
-
setAriaMessage = _React$useState2[1];
|
|
10
|
-
var setAriaCallback = React.useCallback(function () {
|
|
11
|
-
var isAllSelected = props.selectedRows.isAllSelected();
|
|
12
|
-
var message = props.getI18nText(isAllSelected ? 'DataTable.allItemsSelected:aria-live' : 'DataTable.allItemsDeselected:aria-live');
|
|
13
|
-
setAriaMessage(message);
|
|
14
|
-
}, [props.selectedRows]);
|
|
15
|
-
React.useEffect(function () {
|
|
16
|
-
var unsubscribe = props.selectedRows.on(SelectableRows.SELECT_ALL_EVENT, setAriaCallback);
|
|
17
|
-
return unsubscribe;
|
|
18
|
-
}, [props.selectedRows]);
|
|
19
|
-
React.useEffect(function () {
|
|
20
|
-
var timer = setTimeout(function () {
|
|
21
|
-
return setAriaMessage('');
|
|
22
|
-
}, 1000);
|
|
23
|
-
return function () {
|
|
24
|
-
return clearTimeout(timer);
|
|
25
|
-
};
|
|
26
|
-
}, [ariaMessage]);
|
|
27
|
-
return /*#__PURE__*/React.createElement(ScreenReaderOnly, {
|
|
28
|
-
role: "status",
|
|
29
|
-
"aria-live": "polite"
|
|
30
|
-
}, ariaMessage);
|
|
31
|
-
}
|
|
32
|
-
//# sourceMappingURL=SRReactiveAnnouncer.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SRReactiveAnnouncer.js","names":["ScreenReaderOnly","React","SelectableRows","SRReactiveAnnouncer","props","_React$useState","useState","_React$useState2","_slicedToArray","ariaMessage","setAriaMessage","setAriaCallback","useCallback","isAllSelected","selectedRows","message","getI18nText","useEffect","unsubscribe","on","SELECT_ALL_EVENT","timer","setTimeout","clearTimeout","createElement","role"],"sources":["../../../../src/components/RowSelector/SRReactiveAnnouncer.tsx"],"sourcesContent":["import { ScreenReaderOnly } from '@semcore/base-components';\nimport React from 'react';\n\nimport type { ISelectedRows } from '../../store/SelectableRows';\nimport { SelectableRows } from '../../store/SelectableRows';\n\ntype Props<UniqKey> = {\n selectedRows: ISelectedRows<UniqKey>;\n getI18nText: (key: string) => string;\n};\n\nexport function SRReactiveAnnouncer<UniqKey>(props: Props<UniqKey>) {\n const [ariaMessage, setAriaMessage] = React.useState('');\n\n const setAriaCallback = React.useCallback(() => {\n const isAllSelected = props.selectedRows.isAllSelected();\n\n const message = props.getI18nText(\n isAllSelected\n ? 'DataTable.allItemsSelected:aria-live'\n : 'DataTable.allItemsDeselected:aria-live',\n );\n setAriaMessage(message);\n }, [props.selectedRows]);\n\n React.useEffect(() => {\n const unsubscribe = props.selectedRows.on(SelectableRows.SELECT_ALL_EVENT, setAriaCallback);\n\n return unsubscribe;\n }, [props.selectedRows]);\n\n React.useEffect(() => {\n const timer = setTimeout(() => setAriaMessage(''), 1000);\n return () => clearTimeout(timer);\n }, [ariaMessage]);\n\n return (\n <ScreenReaderOnly role='status' aria-live='polite'>\n {ariaMessage}\n </ScreenReaderOnly>\n );\n}\n"],"mappings":";AAAA,SAASA,gBAAgB,QAAQ,0BAA0B;AAC3D,OAAOC,KAAK,MAAM,OAAO;AAGzB,SAASC,cAAc,QAAQ,4BAA4B;AAO3D,OAAO,SAASC,mBAAmBA,CAAUC,KAAqB,EAAE;EAClE,IAAAC,eAAA,GAAsCJ,KAAK,CAACK,QAAQ,CAAC,EAAE,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAH,eAAA;IAAjDI,WAAW,GAAAF,gBAAA;IAAEG,cAAc,GAAAH,gBAAA;EAElC,IAAMI,eAAe,GAAGV,KAAK,CAACW,WAAW,CAAC,YAAM;IAC9C,IAAMC,aAAa,GAAGT,KAAK,CAACU,YAAY,CAACD,aAAa,CAAC,CAAC;IAExD,IAAME,OAAO,GAAGX,KAAK,CAACY,WAAW,CAC/BH,aAAa,GACT,sCAAsC,GACtC,wCACN,CAAC;IACDH,cAAc,CAACK,OAAO,CAAC;EACzB,CAAC,EAAE,CAACX,KAAK,CAACU,YAAY,CAAC,CAAC;EAExBb,KAAK,CAACgB,SAAS,CAAC,YAAM;IACpB,IAAMC,WAAW,GAAGd,KAAK,CAACU,YAAY,CAACK,EAAE,CAACjB,cAAc,CAACkB,gBAAgB,EAAET,eAAe,CAAC;IAE3F,OAAOO,WAAW;EACpB,CAAC,EAAE,CAACd,KAAK,CAACU,YAAY,CAAC,CAAC;EAExBb,KAAK,CAACgB,SAAS,CAAC,YAAM;IACpB,IAAMI,KAAK,GAAGC,UAAU,CAAC;MAAA,OAAMZ,cAAc,CAAC,EAAE,CAAC;IAAA,GAAE,IAAI,CAAC;IACxD,OAAO;MAAA,OAAMa,YAAY,CAACF,KAAK,CAAC;IAAA;EAClC,CAAC,EAAE,CAACZ,WAAW,CAAC,CAAC;EAEjB,oBACER,KAAA,CAAAuB,aAAA,CAACxB,gBAAgB;IAACyB,IAAI,EAAC,QAAQ;IAAC,aAAU;EAAQ,GAC/ChB,WACe,CAAC;AAEvB","ignoreList":[]}
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
import { getFocusableIn } from '@semcore/core/lib/utils/focus-lock/getFocusableIn';
|
|
2
|
-
export function handleFocusCell(lockedCell, target, currentTarget) {
|
|
3
|
-
if (target instanceof HTMLElement && currentTarget instanceof HTMLElement && target === currentTarget && target.matches(':focus-visible')) {
|
|
4
|
-
target.scrollIntoView({
|
|
5
|
-
block: 'center',
|
|
6
|
-
inline: 'center'
|
|
7
|
-
});
|
|
8
|
-
var focusableChildren = Array.from(currentTarget.children).flatMap(function (node) {
|
|
9
|
-
return getFocusableIn(node);
|
|
10
|
-
});
|
|
11
|
-
if (focusableChildren.length === 1) {
|
|
12
|
-
focusableChildren[0].focus({
|
|
13
|
-
focusVisible: true
|
|
14
|
-
});
|
|
15
|
-
focusableChildren[0].scrollIntoView({
|
|
16
|
-
block: 'center',
|
|
17
|
-
inline: 'center'
|
|
18
|
-
});
|
|
19
|
-
} else if (focusableChildren.length > 1) {
|
|
20
|
-
lockedCell[0] = currentTarget;
|
|
21
|
-
lockedCell[1] = false;
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
export function handleKeydownFocusCell(lockedCell, e) {
|
|
26
|
-
if (e.currentTarget === lockedCell[0]) {
|
|
27
|
-
var focusableChildren = Array.from(lockedCell[0].children).flatMap(function (node) {
|
|
28
|
-
return getFocusableIn(node);
|
|
29
|
-
});
|
|
30
|
-
if (lockedCell[1]) {
|
|
31
|
-
if (e.key === 'Escape') {
|
|
32
|
-
var _lockedCell$;
|
|
33
|
-
(_lockedCell$ = lockedCell[0]) === null || _lockedCell$ === void 0 || _lockedCell$.focus({
|
|
34
|
-
focusVisible: true
|
|
35
|
-
});
|
|
36
|
-
lockedCell[1] = false;
|
|
37
|
-
}
|
|
38
|
-
if (e.key.startsWith('Arrow')) {
|
|
39
|
-
e.stopPropagation();
|
|
40
|
-
e.preventDefault();
|
|
41
|
-
}
|
|
42
|
-
if (e.key === 'Tab') {
|
|
43
|
-
if (e.target === focusableChildren[0] && e.shiftKey) {
|
|
44
|
-
var _focusableChildren;
|
|
45
|
-
(_focusableChildren = focusableChildren[focusableChildren.length - 1]) === null || _focusableChildren === void 0 || _focusableChildren.focus({
|
|
46
|
-
focusVisible: true
|
|
47
|
-
});
|
|
48
|
-
e.preventDefault();
|
|
49
|
-
} else if (e.target === focusableChildren[focusableChildren.length - 1] && !e.shiftKey) {
|
|
50
|
-
var _focusableChildren$;
|
|
51
|
-
(_focusableChildren$ = focusableChildren[0]) === null || _focusableChildren$ === void 0 || _focusableChildren$.focus({
|
|
52
|
-
focusVisible: true
|
|
53
|
-
});
|
|
54
|
-
e.preventDefault();
|
|
55
|
-
}
|
|
56
|
-
e.stopPropagation();
|
|
57
|
-
}
|
|
58
|
-
} else if (e.key === 'Enter') {
|
|
59
|
-
var _focusableChildren$2;
|
|
60
|
-
e.preventDefault();
|
|
61
|
-
e.stopPropagation();
|
|
62
|
-
lockedCell[1] = true;
|
|
63
|
-
(_focusableChildren$2 = focusableChildren[0]) === null || _focusableChildren$2 === void 0 || _focusableChildren$2.focus({
|
|
64
|
-
focusVisible: true
|
|
65
|
-
});
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
//# sourceMappingURL=focusableCell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"focusableCell.js","names":["getFocusableIn","handleFocusCell","lockedCell","target","currentTarget","HTMLElement","matches","scrollIntoView","block","inline","focusableChildren","Array","from","children","flatMap","node","length","focus","focusVisible","handleKeydownFocusCell","e","key","_lockedCell$","startsWith","stopPropagation","preventDefault","shiftKey","_focusableChildren","_focusableChildren$","_focusableChildren$2"],"sources":["../../../src/enhancers/focusableCell.ts"],"sourcesContent":["import { getFocusableIn } from '@semcore/core/lib/utils/focus-lock/getFocusableIn';\nimport type * as React from 'react';\n\nexport type LockedCell = [HTMLElement | null, boolean];\n\nexport function handleFocusCell(lockedCell: LockedCell, target: Element, currentTarget: Element) {\n if (target instanceof HTMLElement && currentTarget instanceof HTMLElement && target === currentTarget && target.matches(':focus-visible')) {\n target.scrollIntoView({\n block: 'center',\n inline: 'center',\n });\n\n const focusableChildren = Array.from(currentTarget.children).flatMap((node) =>\n getFocusableIn(node as HTMLElement),\n );\n\n if (focusableChildren.length === 1) {\n focusableChildren[0].focus({ focusVisible: true });\n focusableChildren[0].scrollIntoView({\n block: 'center',\n inline: 'center',\n });\n } else if (focusableChildren.length > 1) {\n lockedCell[0] = currentTarget;\n lockedCell[1] = false;\n }\n }\n}\nexport function handleKeydownFocusCell(lockedCell: LockedCell, e: React.KeyboardEvent): void {\n if (e.currentTarget === lockedCell[0]) {\n const focusableChildren = Array.from(lockedCell[0].children).flatMap((node) =>\n getFocusableIn(node as HTMLElement),\n );\n\n if (lockedCell[1]) {\n if (e.key === 'Escape') {\n lockedCell[0]?.focus({ focusVisible: true });\n lockedCell[1] = false;\n }\n if (e.key.startsWith('Arrow')) {\n e.stopPropagation();\n e.preventDefault();\n }\n if (e.key === 'Tab') {\n if (e.target === focusableChildren[0] && e.shiftKey) {\n focusableChildren[focusableChildren.length - 1]?.focus({ focusVisible: true });\n e.preventDefault();\n } else if (e.target === focusableChildren[focusableChildren.length - 1] && !e.shiftKey) {\n focusableChildren[0]?.focus({ focusVisible: true });\n e.preventDefault();\n }\n e.stopPropagation();\n }\n } else if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n lockedCell[1] = true;\n focusableChildren[0]?.focus({ focusVisible: true });\n }\n }\n}\n\nexport interface IFocusableCell {\n lockedCell: LockedCell;\n handleFocusableCellKeyDown: (e: React.KeyboardEvent) => void;\n handleFocusableCellFocus: (e: React.FocusEvent<HTMLElement, HTMLElement>) => void;\n}\n"],"mappings":"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","ignoreList":[]}
|