@worknice/whiteboard 0.66.1 → 0.67.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/controls/FilterModal.d.ts +2 -2
- package/dist/icons/components/Bolt.js +1 -1
- package/dist/icons/components/Clock.d.ts +5 -0
- package/dist/icons/components/Clock.js +14 -0
- package/dist/icons/components/Shield.d.ts +5 -0
- package/dist/icons/components/Shield.js +14 -0
- package/dist/icons/components/UserPlus.js +1 -1
- package/dist/icons/components/index.d.ts +2 -0
- package/dist/icons/components/index.js +5 -1
- package/dist/icons/svgs/Clock.js +2 -0
- package/dist/icons/svgs/Shield.js +2 -0
- package/dist/presentation/CardGrid.d.ts +2 -1
- package/dist/presentation/CardGrid.js +3 -2
- package/dist/presentation/CardGrid_module.css +1 -1
- package/dist/presentation/RichList/RichList.d.ts +23 -3
- package/dist/presentation/RichList/RichList.js +141 -26
- package/dist/presentation/RichList/RichList.module.js +2 -0
- package/dist/presentation/RichList/RichList.stories.d.ts +14 -0
- package/dist/presentation/RichList/RichList.stories.js +18 -1
- package/dist/presentation/RichList/RichListDisplayModal.js +2 -15
- package/dist/presentation/RichList/RichListRow.d.ts +16 -1
- package/dist/presentation/RichList/RichListRow.js +10 -3
- package/dist/presentation/RichList/RichListRow_module.css +5 -1
- package/dist/presentation/RichList/RichListSkeleton.d.ts +9 -0
- package/dist/presentation/RichList/RichListSkeleton.js +114 -0
- package/dist/presentation/RichList/RichListSkeleton.module.js +14 -0
- package/dist/presentation/RichList/RichListSkeleton_module.css +84 -0
- package/dist/presentation/RichList/RichListVirtualBody.d.ts +43 -0
- package/dist/presentation/RichList/RichListVirtualBody.js +68 -0
- package/dist/presentation/RichList/RichList_module.css +16 -4
- package/dist/presentation/RichList/stories/LargeList.d.ts +10 -0
- package/dist/presentation/RichList/stories/LargeList.js +137 -0
- package/dist/presentation/RichList/stories/Skeleton.d.ts +3 -0
- package/dist/presentation/RichList/stories/Skeleton.js +84 -0
- package/dist/presentation/RichList/types.d.ts +13 -2
- package/dist/static/svg/Clock.svg +1 -0
- package/dist/static/svg/Shield.svg +1 -0
- package/package.json +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type ReactNode } from "react";
|
|
2
|
-
type SingleFilterOption<Type> = {
|
|
2
|
+
export type SingleFilterOption<Type> = {
|
|
3
3
|
id: string;
|
|
4
4
|
label: string;
|
|
5
5
|
/**
|
|
@@ -7,7 +7,7 @@ type SingleFilterOption<Type> = {
|
|
|
7
7
|
*/
|
|
8
8
|
predicate?: (row: Type) => boolean;
|
|
9
9
|
};
|
|
10
|
-
type MultiFilterOption<Type> = {
|
|
10
|
+
export type MultiFilterOption<Type> = {
|
|
11
11
|
id: string;
|
|
12
12
|
label: string;
|
|
13
13
|
predicate: (row: Type) => boolean;
|
|
@@ -3,8 +3,8 @@ import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createI
|
|
|
3
3
|
const BoltSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
|
|
4
4
|
xmlns: "http://www.w3.org/2000/svg",
|
|
5
5
|
viewBox: "0 0 640 640",
|
|
6
|
-
fill: "currentColor",
|
|
7
6
|
"aria-hidden": "true",
|
|
7
|
+
fill: "currentColor",
|
|
8
8
|
...props,
|
|
9
9
|
children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
|
|
10
10
|
d: "M437.2 51.9C446.3 57.9 450.2 69.2 446.8 79.5L388 256L508.9 256C528.3 256 544 271.7 544 291.1C544 301.1 539.8 310.6 532.3 317.2L232 585.9C223.9 593.2 211.9 594.1 202.8 588.1C193.7 582.1 189.8 570.8 193.2 560.5L252 384L131.1 384C111.7 384 96 368.3 96 348.9C96 339 100.2 329.5 107.7 322.8L408 54.1C416.1 46.8 428.1 46 437.2 51.9zM164.9 336L285.3 336C293 336 300.3 339.7 304.8 346C309.3 352.3 310.5 360.3 308.1 367.6L267.3 489.9L475.1 304L354.7 304C347 304 339.7 300.3 335.2 294C330.7 287.7 329.5 279.7 331.9 272.4L372.7 150.1L164.9 336z"
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
|
|
2
|
+
import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createIcon.js";
|
|
3
|
+
const ClockSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
|
|
4
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
5
|
+
viewBox: "0 0 640 640",
|
|
6
|
+
"aria-hidden": "true",
|
|
7
|
+
fill: "currentColor",
|
|
8
|
+
...props,
|
|
9
|
+
children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
|
|
10
|
+
d: "M528 320C528 434.9 434.9 528 320 528C205.1 528 112 434.9 112 320C112 205.1 205.1 112 320 112C434.9 112 528 205.1 528 320zM64 320C64 461.4 178.6 576 320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320zM296 184L296 320C296 328 300 335.5 306.7 340L402.7 404C413.7 411.4 428.6 408.4 436 397.3C443.4 386.2 440.4 371.4 429.3 364L344 307.2L344 184C344 170.7 333.3 160 320 160C306.7 160 296 170.7 296 184z"
|
|
11
|
+
})
|
|
12
|
+
});
|
|
13
|
+
const Clock_rslib_entry_ = (0, __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__.createIcon)(ClockSvg);
|
|
14
|
+
export { Clock_rslib_entry_ as default };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
|
|
2
|
+
import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createIcon.js";
|
|
3
|
+
const ShieldSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
|
|
4
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
5
|
+
viewBox: "0 0 640 640",
|
|
6
|
+
"aria-hidden": "true",
|
|
7
|
+
fill: "currentColor",
|
|
8
|
+
...props,
|
|
9
|
+
children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
|
|
10
|
+
d: "M320 113.4L137.1 191C131.2 193.5 128 198.8 128.1 203.8C128.6 295.2 166.5 453.1 314.5 523.9C318.1 525.6 322.3 525.6 325.8 523.9C473.8 453.1 511.7 295.2 512.1 203.8C512.1 198.8 509 193.6 503.1 191L320 113.4zM333.4 66.9L521.8 146.8C543.8 156.1 560.2 177.8 560.1 204C559.6 303.2 518.8 484.7 346.5 567.2C329.8 575.2 310.4 575.2 293.7 567.2C121.3 484.7 80.5 303.2 80.1 204C80 177.8 96.4 156.1 118.4 146.8L306.7 66.9C310.9 65 315.4 64 320 64C324.6 64 329.2 65 333.4 66.9z"
|
|
11
|
+
})
|
|
12
|
+
});
|
|
13
|
+
const Shield_rslib_entry_ = (0, __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__.createIcon)(ShieldSvg);
|
|
14
|
+
export { Shield_rslib_entry_ as default };
|
|
@@ -3,8 +3,8 @@ import * as __WEBPACK_EXTERNAL_MODULE__createIcon_js_4dc54f83__ from "../createI
|
|
|
3
3
|
const UserPlusSvg = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
|
|
4
4
|
xmlns: "http://www.w3.org/2000/svg",
|
|
5
5
|
viewBox: "0 0 640 640",
|
|
6
|
-
fill: "currentColor",
|
|
7
6
|
"aria-hidden": "true",
|
|
7
|
+
fill: "currentColor",
|
|
8
8
|
...props,
|
|
9
9
|
children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("path", {
|
|
10
10
|
d: "M304 368C401.2 368 480 446.8 480 544L480 552C480 565.3 469.3 576 456 576C442.7 576 432 565.3 432 552L432 544C432 473.3 374.7 416 304 416L208 416C137.3 416 80 473.3 80 544L80 552C80 565.3 69.3 576 56 576C42.7 576 32 565.3 32 552L32 544C32 446.8 110.8 368 208 368L304 368zM528 144C541.3 144 552 154.7 552 168L552 216L600 216C613.3 216 624 226.7 624 240C624 253.3 613.3 264 600 264L552 264L552 312C552 325.3 541.3 336 528 336C514.7 336 504 325.3 504 312L504 264L456 264C442.7 264 432 253.3 432 240C432 226.7 442.7 216 456 216L504 216L504 168C504 154.7 514.7 144 528 144zM256 320C185.3 320 128 262.7 128 192C128 121.3 185.3 64 256 64C326.7 64 384 121.3 384 192C384 262.7 326.7 320 256 320zM256 112C211.8 112 176 147.8 176 192C176 236.2 211.8 272 256 272C300.2 272 336 236.2 336 192C336 147.8 300.2 112 256 112z"
|
|
@@ -27,6 +27,7 @@ export { default as ChevronDown } from "./ChevronDown";
|
|
|
27
27
|
export { default as ChevronLeft } from "./ChevronLeft";
|
|
28
28
|
export { default as ChevronRight } from "./ChevronRight";
|
|
29
29
|
export { default as ChevronUp } from "./ChevronUp";
|
|
30
|
+
export { default as Clock } from "./Clock";
|
|
30
31
|
export { default as Close } from "./Close";
|
|
31
32
|
export { default as Columns } from "./Columns";
|
|
32
33
|
export { default as Comment } from "./Comment";
|
|
@@ -87,6 +88,7 @@ export { default as Review } from "./Review";
|
|
|
87
88
|
export { default as Schedule } from "./Schedule";
|
|
88
89
|
export { default as Search } from "./Search";
|
|
89
90
|
export { default as Settings } from "./Settings";
|
|
91
|
+
export { default as Shield } from "./Shield";
|
|
90
92
|
export { default as Sidebar } from "./Sidebar";
|
|
91
93
|
export { default as Sliders } from "./Sliders";
|
|
92
94
|
export { default as SortAsc } from "./SortAsc";
|
|
@@ -27,6 +27,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__ChevronDown_js_e7b8160e__ from "./Chevron
|
|
|
27
27
|
import * as __WEBPACK_EXTERNAL_MODULE__ChevronLeft_js_85bb6c78__ from "./ChevronLeft.js";
|
|
28
28
|
import * as __WEBPACK_EXTERNAL_MODULE__ChevronRight_js_12dc64c9__ from "./ChevronRight.js";
|
|
29
29
|
import * as __WEBPACK_EXTERNAL_MODULE__ChevronUp_js_a85f6d13__ from "./ChevronUp.js";
|
|
30
|
+
import * as __WEBPACK_EXTERNAL_MODULE__Clock_js_0ef6ed85__ from "./Clock.js";
|
|
30
31
|
import * as __WEBPACK_EXTERNAL_MODULE__Close_js_acf66f73__ from "./Close.js";
|
|
31
32
|
import * as __WEBPACK_EXTERNAL_MODULE__Columns_js_c661916a__ from "./Columns.js";
|
|
32
33
|
import * as __WEBPACK_EXTERNAL_MODULE__Comment_js_bc023d48__ from "./Comment.js";
|
|
@@ -87,6 +88,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__Review_js_02e341de__ from "./Review.js";
|
|
|
87
88
|
import * as __WEBPACK_EXTERNAL_MODULE__Schedule_js_8f84e4d0__ from "./Schedule.js";
|
|
88
89
|
import * as __WEBPACK_EXTERNAL_MODULE__Search_js_267571c1__ from "./Search.js";
|
|
89
90
|
import * as __WEBPACK_EXTERNAL_MODULE__Settings_js_76e75328__ from "./Settings.js";
|
|
91
|
+
import * as __WEBPACK_EXTERNAL_MODULE__Shield_js_680f03a6__ from "./Shield.js";
|
|
90
92
|
import * as __WEBPACK_EXTERNAL_MODULE__Sidebar_js_eb7c69a7__ from "./Sidebar.js";
|
|
91
93
|
import * as __WEBPACK_EXTERNAL_MODULE__Sliders_js_7897eace__ from "./Sliders.js";
|
|
92
94
|
import * as __WEBPACK_EXTERNAL_MODULE__SortAsc_js_767bd30f__ from "./SortAsc.js";
|
|
@@ -136,6 +138,7 @@ var __webpack_exports__ChevronDown = __WEBPACK_EXTERNAL_MODULE__ChevronDown_js_e
|
|
|
136
138
|
var __webpack_exports__ChevronLeft = __WEBPACK_EXTERNAL_MODULE__ChevronLeft_js_85bb6c78__["default"];
|
|
137
139
|
var __webpack_exports__ChevronRight = __WEBPACK_EXTERNAL_MODULE__ChevronRight_js_12dc64c9__["default"];
|
|
138
140
|
var __webpack_exports__ChevronUp = __WEBPACK_EXTERNAL_MODULE__ChevronUp_js_a85f6d13__["default"];
|
|
141
|
+
var __webpack_exports__Clock = __WEBPACK_EXTERNAL_MODULE__Clock_js_0ef6ed85__["default"];
|
|
139
142
|
var __webpack_exports__Close = __WEBPACK_EXTERNAL_MODULE__Close_js_acf66f73__["default"];
|
|
140
143
|
var __webpack_exports__Columns = __WEBPACK_EXTERNAL_MODULE__Columns_js_c661916a__["default"];
|
|
141
144
|
var __webpack_exports__Comment = __WEBPACK_EXTERNAL_MODULE__Comment_js_bc023d48__["default"];
|
|
@@ -196,6 +199,7 @@ var __webpack_exports__Review = __WEBPACK_EXTERNAL_MODULE__Review_js_02e341de__[
|
|
|
196
199
|
var __webpack_exports__Schedule = __WEBPACK_EXTERNAL_MODULE__Schedule_js_8f84e4d0__["default"];
|
|
197
200
|
var __webpack_exports__Search = __WEBPACK_EXTERNAL_MODULE__Search_js_267571c1__["default"];
|
|
198
201
|
var __webpack_exports__Settings = __WEBPACK_EXTERNAL_MODULE__Settings_js_76e75328__["default"];
|
|
202
|
+
var __webpack_exports__Shield = __WEBPACK_EXTERNAL_MODULE__Shield_js_680f03a6__["default"];
|
|
199
203
|
var __webpack_exports__Sidebar = __WEBPACK_EXTERNAL_MODULE__Sidebar_js_eb7c69a7__["default"];
|
|
200
204
|
var __webpack_exports__Sliders = __WEBPACK_EXTERNAL_MODULE__Sliders_js_7897eace__["default"];
|
|
201
205
|
var __webpack_exports__SortAsc = __WEBPACK_EXTERNAL_MODULE__SortAsc_js_767bd30f__["default"];
|
|
@@ -216,4 +220,4 @@ var __webpack_exports__UserPlus = __WEBPACK_EXTERNAL_MODULE__UserPlus_js_796202e
|
|
|
216
220
|
var __webpack_exports__Visible = __WEBPACK_EXTERNAL_MODULE__Visible_js_aa1c6acc__["default"];
|
|
217
221
|
var __webpack_exports__Warning = __WEBPACK_EXTERNAL_MODULE__Warning_js_d0de15e9__["default"];
|
|
218
222
|
var __webpack_exports__Workflows = __WEBPACK_EXTERNAL_MODULE__Workflows_js_35639a49__["default"];
|
|
219
|
-
export { __webpack_exports__Approval as Approval, __webpack_exports__Apps as Apps, __webpack_exports__Archive as Archive, __webpack_exports__ArrowLeft as ArrowLeft, __webpack_exports__ArrowRight as ArrowRight, __webpack_exports__ArrowTurnLeftUp as ArrowTurnLeftUp, __webpack_exports__ArrowsCompress as ArrowsCompress, __webpack_exports__ArrowsExpand as ArrowsExpand, __webpack_exports__ArrowsUpDown as ArrowsUpDown, __webpack_exports__Assign as Assign, __webpack_exports__AssignmentCertificate as AssignmentCertificate, __webpack_exports__AssignmentDocument as AssignmentDocument, __webpack_exports__AssignmentForm as AssignmentForm, __webpack_exports__AssignmentQuestionnaire as AssignmentQuestionnaire, __webpack_exports__BankAccount as BankAccount, __webpack_exports__Bolt as Bolt, __webpack_exports__BookOpenLines as BookOpenLines, __webpack_exports__Bug as Bug, __webpack_exports__Calendar as Calendar, __webpack_exports__Cancel as Cancel, __webpack_exports__CaratDown as CaratDown, __webpack_exports__CaratLeft as CaratLeft, __webpack_exports__CaratRight as CaratRight, __webpack_exports__CaratUp as CaratUp, __webpack_exports__CheckMark as CheckMark, __webpack_exports__ChevronDown as ChevronDown, __webpack_exports__ChevronLeft as ChevronLeft, __webpack_exports__ChevronRight as ChevronRight, __webpack_exports__ChevronUp as ChevronUp, __webpack_exports__Close as Close, __webpack_exports__Columns as Columns, __webpack_exports__Comment as Comment, __webpack_exports__Copy as Copy, __webpack_exports__Dash as Dash, __webpack_exports__Delete as Delete, __webpack_exports__Directory as Directory, __webpack_exports__DocumentProcessingFailed as DocumentProcessingFailed, __webpack_exports__Download as Download, __webpack_exports__Edit as Edit, __webpack_exports__Email as Email, __webpack_exports__EmergencyContact as EmergencyContact, __webpack_exports__Events as Events, __webpack_exports__External as External, __webpack_exports__FileExport as FileExport, __webpack_exports__Filter as Filter, __webpack_exports__FilterList as FilterList, __webpack_exports__FitView as FitView, __webpack_exports__Globe as Globe, __webpack_exports__GripLines as GripLines, __webpack_exports__Help as Help, __webpack_exports__Hidden as Hidden, __webpack_exports__History as History, __webpack_exports__Inbox as Inbox, __webpack_exports__Info as Info, __webpack_exports__Insights as Insights, __webpack_exports__Job as Job, __webpack_exports__Leave as Leave, __webpack_exports__Lightbulb as Lightbulb, __webpack_exports__Loading as Loading, __webpack_exports__LocationCheck as LocationCheck, __webpack_exports__Logout as Logout, __webpack_exports__Messages as Messages, __webpack_exports__Microsoft as Microsoft, __webpack_exports__Minus as Minus, __webpack_exports__Newspaper as Newspaper, __webpack_exports__Overflow as Overflow, __webpack_exports__Paperwork as Paperwork, __webpack_exports__PaperworkAssigned as PaperworkAssigned, __webpack_exports__PaperworkDraft as PaperworkDraft, __webpack_exports__PaperworkExpired as PaperworkExpired, __webpack_exports__PaperworkExpiringSoon as PaperworkExpiringSoon, __webpack_exports__PaperworkMissing as PaperworkMissing, __webpack_exports__PaperworkProcessed as PaperworkProcessed, __webpack_exports__PaperworkSubmitted as PaperworkSubmitted, __webpack_exports__People as People, __webpack_exports__Phone as Phone, __webpack_exports__Plus as Plus, __webpack_exports__Positions as Positions, __webpack_exports__Profile as Profile, __webpack_exports__ProfileFemale as ProfileFemale, __webpack_exports__ProfileMale as ProfileMale, __webpack_exports__QuestionMark as QuestionMark, __webpack_exports__Remuneration as Remuneration, __webpack_exports__Reschedule as Reschedule, __webpack_exports__Restore as Restore, __webpack_exports__Review as Review, __webpack_exports__Schedule as Schedule, __webpack_exports__Search as Search, __webpack_exports__Settings as Settings, __webpack_exports__Sidebar as Sidebar, __webpack_exports__Sliders as Sliders, __webpack_exports__SortAsc as SortAsc, __webpack_exports__SortDefault as SortDefault, __webpack_exports__SortDes as SortDes, __webpack_exports__StepsComplete as StepsComplete, __webpack_exports__StepsCurrent as StepsCurrent, __webpack_exports__StepsIncomplete as StepsIncomplete, __webpack_exports__Submit as Submit, __webpack_exports__Success as Success, __webpack_exports__SuperFund as SuperFund, __webpack_exports__Sync as Sync, __webpack_exports__Table as Table, __webpack_exports__Task as Task, __webpack_exports__Tax as Tax, __webpack_exports__Tenure as Tenure, __webpack_exports__UserPlus as UserPlus, __webpack_exports__Visible as Visible, __webpack_exports__Warning as Warning, __webpack_exports__Workflows as Workflows };
|
|
223
|
+
export { __webpack_exports__Approval as Approval, __webpack_exports__Apps as Apps, __webpack_exports__Archive as Archive, __webpack_exports__ArrowLeft as ArrowLeft, __webpack_exports__ArrowRight as ArrowRight, __webpack_exports__ArrowTurnLeftUp as ArrowTurnLeftUp, __webpack_exports__ArrowsCompress as ArrowsCompress, __webpack_exports__ArrowsExpand as ArrowsExpand, __webpack_exports__ArrowsUpDown as ArrowsUpDown, __webpack_exports__Assign as Assign, __webpack_exports__AssignmentCertificate as AssignmentCertificate, __webpack_exports__AssignmentDocument as AssignmentDocument, __webpack_exports__AssignmentForm as AssignmentForm, __webpack_exports__AssignmentQuestionnaire as AssignmentQuestionnaire, __webpack_exports__BankAccount as BankAccount, __webpack_exports__Bolt as Bolt, __webpack_exports__BookOpenLines as BookOpenLines, __webpack_exports__Bug as Bug, __webpack_exports__Calendar as Calendar, __webpack_exports__Cancel as Cancel, __webpack_exports__CaratDown as CaratDown, __webpack_exports__CaratLeft as CaratLeft, __webpack_exports__CaratRight as CaratRight, __webpack_exports__CaratUp as CaratUp, __webpack_exports__CheckMark as CheckMark, __webpack_exports__ChevronDown as ChevronDown, __webpack_exports__ChevronLeft as ChevronLeft, __webpack_exports__ChevronRight as ChevronRight, __webpack_exports__ChevronUp as ChevronUp, __webpack_exports__Clock as Clock, __webpack_exports__Close as Close, __webpack_exports__Columns as Columns, __webpack_exports__Comment as Comment, __webpack_exports__Copy as Copy, __webpack_exports__Dash as Dash, __webpack_exports__Delete as Delete, __webpack_exports__Directory as Directory, __webpack_exports__DocumentProcessingFailed as DocumentProcessingFailed, __webpack_exports__Download as Download, __webpack_exports__Edit as Edit, __webpack_exports__Email as Email, __webpack_exports__EmergencyContact as EmergencyContact, __webpack_exports__Events as Events, __webpack_exports__External as External, __webpack_exports__FileExport as FileExport, __webpack_exports__Filter as Filter, __webpack_exports__FilterList as FilterList, __webpack_exports__FitView as FitView, __webpack_exports__Globe as Globe, __webpack_exports__GripLines as GripLines, __webpack_exports__Help as Help, __webpack_exports__Hidden as Hidden, __webpack_exports__History as History, __webpack_exports__Inbox as Inbox, __webpack_exports__Info as Info, __webpack_exports__Insights as Insights, __webpack_exports__Job as Job, __webpack_exports__Leave as Leave, __webpack_exports__Lightbulb as Lightbulb, __webpack_exports__Loading as Loading, __webpack_exports__LocationCheck as LocationCheck, __webpack_exports__Logout as Logout, __webpack_exports__Messages as Messages, __webpack_exports__Microsoft as Microsoft, __webpack_exports__Minus as Minus, __webpack_exports__Newspaper as Newspaper, __webpack_exports__Overflow as Overflow, __webpack_exports__Paperwork as Paperwork, __webpack_exports__PaperworkAssigned as PaperworkAssigned, __webpack_exports__PaperworkDraft as PaperworkDraft, __webpack_exports__PaperworkExpired as PaperworkExpired, __webpack_exports__PaperworkExpiringSoon as PaperworkExpiringSoon, __webpack_exports__PaperworkMissing as PaperworkMissing, __webpack_exports__PaperworkProcessed as PaperworkProcessed, __webpack_exports__PaperworkSubmitted as PaperworkSubmitted, __webpack_exports__People as People, __webpack_exports__Phone as Phone, __webpack_exports__Plus as Plus, __webpack_exports__Positions as Positions, __webpack_exports__Profile as Profile, __webpack_exports__ProfileFemale as ProfileFemale, __webpack_exports__ProfileMale as ProfileMale, __webpack_exports__QuestionMark as QuestionMark, __webpack_exports__Remuneration as Remuneration, __webpack_exports__Reschedule as Reschedule, __webpack_exports__Restore as Restore, __webpack_exports__Review as Review, __webpack_exports__Schedule as Schedule, __webpack_exports__Search as Search, __webpack_exports__Settings as Settings, __webpack_exports__Shield as Shield, __webpack_exports__Sidebar as Sidebar, __webpack_exports__Sliders as Sliders, __webpack_exports__SortAsc as SortAsc, __webpack_exports__SortDefault as SortDefault, __webpack_exports__SortDes as SortDes, __webpack_exports__StepsComplete as StepsComplete, __webpack_exports__StepsCurrent as StepsCurrent, __webpack_exports__StepsIncomplete as StepsIncomplete, __webpack_exports__Submit as Submit, __webpack_exports__Success as Success, __webpack_exports__SuperFund as SuperFund, __webpack_exports__Sync as Sync, __webpack_exports__Table as Table, __webpack_exports__Task as Task, __webpack_exports__Tax as Tax, __webpack_exports__Tenure as Tenure, __webpack_exports__UserPlus as UserPlus, __webpack_exports__Visible as Visible, __webpack_exports__Warning as Warning, __webpack_exports__Workflows as Workflows };
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { ReactNode } from "react";
|
|
2
2
|
type Props = {
|
|
3
3
|
children: ReactNode;
|
|
4
|
+
spacing?: "n2" | "n1" | "00" | "p1" | "p2";
|
|
4
5
|
/** Minimum width of each column before the grid drops one. Defaults to 280. */
|
|
5
6
|
minColumnWidth?: number;
|
|
6
7
|
};
|
|
@@ -8,5 +9,5 @@ type Props = {
|
|
|
8
9
|
* A responsive grid of cards. Columns reflow automatically by available width
|
|
9
10
|
* (down to a single column on narrow/mobile viewports) based on `minColumnWidth`.
|
|
10
11
|
*/
|
|
11
|
-
declare const CardGrid: ({ children, minColumnWidth }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
declare const CardGrid: ({ children, spacing, minColumnWidth }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
12
13
|
export default CardGrid;
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
|
|
2
2
|
import * as __WEBPACK_EXTERNAL_MODULE__utils_customProperties_js_aeb40bdf__ from "../utils/customProperties.js";
|
|
3
3
|
import * as __WEBPACK_EXTERNAL_MODULE__CardGrid_module_js_156110b7__ from "./CardGrid.module.js";
|
|
4
|
-
const CardGrid = ({ children, minColumnWidth = 280 })=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
|
|
4
|
+
const CardGrid = ({ children, spacing = "p2", minColumnWidth = 280 })=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
|
|
5
5
|
className: __WEBPACK_EXTERNAL_MODULE__CardGrid_module_js_156110b7__["default"].grid,
|
|
6
6
|
style: (0, __WEBPACK_EXTERNAL_MODULE__utils_customProperties_js_aeb40bdf__["default"])({
|
|
7
|
-
"--min-column-width": `${minColumnWidth}px
|
|
7
|
+
"--min-column-width": `${minColumnWidth}px`,
|
|
8
|
+
"--spacing": `var(--size-${spacing})`
|
|
8
9
|
}),
|
|
9
10
|
children: children
|
|
10
11
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { type CSSProperties, type ReactNode } from "react";
|
|
2
2
|
import { type ZodTypeAny } from "zod";
|
|
3
3
|
import { type RichListRowHeight } from "./helpers";
|
|
4
|
-
import { type RichListBulkAction, type RichListContentSlot, type RichListMainSlot, type RichListRowAction, type RichListSlot } from "./types";
|
|
4
|
+
import { type RichListActiveFilter, type RichListBulkAction, type RichListContentSlot, type RichListMainSlot, type RichListRowAction, type RichListSlot } from "./types";
|
|
5
5
|
type CommonProps<Type> = {
|
|
6
6
|
data: Array<Type>;
|
|
7
7
|
getRowId: (row: Type) => string;
|
|
@@ -121,6 +121,18 @@ type CommonProps<Type> = {
|
|
|
121
121
|
* @default (omitted) stored JSON is not parsed with Zod before use.
|
|
122
122
|
*/
|
|
123
123
|
localStorageSchema?: ZodTypeAny;
|
|
124
|
+
/**
|
|
125
|
+
* Fired after the active filter set changes (modal filters, the inline single-select
|
|
126
|
+
* scope, and Reset). The merged value matches what `RichList` persists, so it includes
|
|
127
|
+
* the inline single-select list scope even though that is not a TanStack `columnFilter`.
|
|
128
|
+
*
|
|
129
|
+
* Also fires once on mount with the initial filter state (including any state restored
|
|
130
|
+
* from persistence) so external UI can sync immediately. Wrap the handler in
|
|
131
|
+
* `useCallback` to avoid re-emitting on every render. Does **not** include the search
|
|
132
|
+
* term.
|
|
133
|
+
* @default (omitted) no filter-change notifications.
|
|
134
|
+
*/
|
|
135
|
+
onFiltersChange?: (filters: Array<RichListActiveFilter>) => void;
|
|
124
136
|
};
|
|
125
137
|
type NavigationProps<Type> = {
|
|
126
138
|
/**
|
|
@@ -153,6 +165,14 @@ type NavigationProps<Type> = {
|
|
|
153
165
|
* `helpers.ts`.
|
|
154
166
|
*/
|
|
155
167
|
export type RichListProps<Type> = CommonProps<Type> & NavigationProps<Type>;
|
|
156
|
-
|
|
168
|
+
/**
|
|
169
|
+
* Public `RichList`. For large datasets it shows a prop-derived skeleton on the
|
|
170
|
+
* first paint, then mounts the real list (`RichListInner`) after a frame so the
|
|
171
|
+
* expensive `getRowModel()` build runs off the initial paint's critical path —
|
|
172
|
+
* masking the otherwise-blank, unresponsive gap during hydration. Small lists
|
|
173
|
+
* mount `RichListInner` immediately with no skeleton. This is fully transparent
|
|
174
|
+
* to consumers; the props are unchanged.
|
|
175
|
+
*/
|
|
176
|
+
declare const RichList: <Type>(props: RichListProps<Type>) => import("react/jsx-runtime").JSX.Element;
|
|
157
177
|
export default RichList;
|
|
158
|
-
export type { RichListBulkAction, RichListColumnWidthMode, RichListContentSlot, RichListGrouping, RichListLayoutVisibility, RichListMainSlot, RichListRowAction, RichListSlot, RichListSlotSize, RichListTextField, } from "./types";
|
|
178
|
+
export type { RichListActiveFilter, RichListBulkAction, RichListColumnWidthMode, RichListContentSlot, RichListGrouping, RichListLayoutVisibility, RichListMainSlot, RichListRowAction, RichListSlot, RichListSlotSize, RichListTextField, } from "./types";
|
|
@@ -14,7 +14,9 @@ import * as __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__ from "./Ric
|
|
|
14
14
|
import * as __WEBPACK_EXTERNAL_MODULE__RichListBulkActionBar_js_d46cecae__ from "./RichListBulkActionBar.js";
|
|
15
15
|
import * as __WEBPACK_EXTERNAL_MODULE__RichListDisplayModal_js_6277e838__ from "./RichListDisplayModal.js";
|
|
16
16
|
import * as __WEBPACK_EXTERNAL_MODULE__RichListRow_js_08189b13__ from "./RichListRow.js";
|
|
17
|
+
import * as __WEBPACK_EXTERNAL_MODULE__RichListSkeleton_js_f2547a8c__ from "./RichListSkeleton.js";
|
|
17
18
|
import * as __WEBPACK_EXTERNAL_MODULE__RichListToolbar_js_747b658d__ from "./RichListToolbar.js";
|
|
19
|
+
import * as __WEBPACK_EXTERNAL_MODULE__RichListVirtualBody_js_119c4f49__ from "./RichListVirtualBody.js";
|
|
18
20
|
const EMPTY_RICH_LIST_CONTENT_SLOTS = [];
|
|
19
21
|
const EMPTY_RICH_LIST_BULK_ACTIONS = [];
|
|
20
22
|
function countColumnFiltersDifferingFromInitial(currentFilters, initialFilters) {
|
|
@@ -41,7 +43,7 @@ function mergeInlineSinglePersistedColumnFilters(tableColumnFilters, inlineColum
|
|
|
41
43
|
}
|
|
42
44
|
];
|
|
43
45
|
}
|
|
44
|
-
const
|
|
46
|
+
const RichListInner = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_RICH_LIST_CONTENT_SLOTS, contentAlignment = "space-evenly", trailingSlot, href, onClick, rowActions, bulkActions = EMPTY_RICH_LIST_BULK_ACTIONS, secondaryBulkActions = EMPTY_RICH_LIST_BULK_ACTIONS, rowHeight = "medium", csvFilename, fillContainerHeight = false, compactBreakpoint: compactBreakpointProp, emptyState = "No results", id, pathName, localStorageSchema, header, onFiltersChange })=>{
|
|
45
47
|
const [searchTerm, setSearchTerm] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)("");
|
|
46
48
|
const [inlineSingleSelectChoice, setInlineSingleSelectChoice] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(void 0);
|
|
47
49
|
const [isFilterModalOpen, setIsFilterModalOpen] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(false);
|
|
@@ -52,6 +54,7 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
52
54
|
whileElementsMounted: __WEBPACK_EXTERNAL_MODULE__floating_ui_react_dom_d5bb3c23__.autoUpdate
|
|
53
55
|
});
|
|
54
56
|
const listScopeRef = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
|
|
57
|
+
const headRef = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
|
|
55
58
|
const [isCompactContentSlots, setIsCompactContentSlots] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(false);
|
|
56
59
|
const compactBreakpointPx = compactBreakpointProp ?? __WEBPACK_EXTERNAL_MODULE__helpers_js_87289b43__.RICH_LIST_CONTENT_COMPACT_MAX_PX;
|
|
57
60
|
const renderableContentSlots = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>contentSlots.filter((slot)=>{
|
|
@@ -363,6 +366,9 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
363
366
|
]);
|
|
364
367
|
const rows = table.getRowModel().rows;
|
|
365
368
|
const filteredSelectedRows = table.getFilteredSelectedRowModel();
|
|
369
|
+
const anyRowCanBeSelected = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>rows.some((row)=>row.getCanSelect()), [
|
|
370
|
+
rows
|
|
371
|
+
]);
|
|
366
372
|
const throttledSetGlobalFilter = (0, __WEBPACK_EXTERNAL_MODULE__react_hook_throttle_d66151d4__.useThrottleCallback)((value)=>table.setGlobalFilter(value), 4);
|
|
367
373
|
const activeFilterCount = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>countColumnFiltersDifferingFromInitial(tableState.columnFilters, modalColumnFiltersBaseline), [
|
|
368
374
|
tableState.columnFilters,
|
|
@@ -385,6 +391,18 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
385
391
|
inlineSingleSelectExcludedFromTableColumnId,
|
|
386
392
|
inlineSingleSelectOptionIdResolved
|
|
387
393
|
]);
|
|
394
|
+
(0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
|
|
395
|
+
if (!onFiltersChange) return;
|
|
396
|
+
onFiltersChange(mergeInlineSinglePersistedColumnFilters(tableState.columnFilters, inlineSingleSelectExcludedFromTableColumnId, inlineSingleSelectOptionIdResolved).map((filter)=>({
|
|
397
|
+
columnId: filter.id,
|
|
398
|
+
value: filter.value
|
|
399
|
+
})));
|
|
400
|
+
}, [
|
|
401
|
+
onFiltersChange,
|
|
402
|
+
tableState.columnFilters,
|
|
403
|
+
inlineSingleSelectExcludedFromTableColumnId,
|
|
404
|
+
inlineSingleSelectOptionIdResolved
|
|
405
|
+
]);
|
|
388
406
|
const validPrimaryBulkActions = bulkActions.filter((bulkAction)=>filteredSelectedRows.rows.some((row)=>bulkAction.predicate ? bulkAction.predicate(row.original) : true));
|
|
389
407
|
const validSecondaryBulkActions = secondaryBulkActions.filter((bulkAction)=>filteredSelectedRows.rows.some((row)=>bulkAction.predicate ? bulkAction.predicate(row.original) : true));
|
|
390
408
|
const shouldShowCsvExport = csvExportColumns.length > 0 && Boolean(csvFilename);
|
|
@@ -456,6 +474,88 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
456
474
|
rowActions,
|
|
457
475
|
getRowId
|
|
458
476
|
]);
|
|
477
|
+
const estimateSize = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)(()=>resolvedRowHeightPx, [
|
|
478
|
+
resolvedRowHeightPx
|
|
479
|
+
]);
|
|
480
|
+
const groupingKey = tableState.grouping.join(",");
|
|
481
|
+
const getItemKey = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((index)=>`${rows[index].id}-${groupingKey}`, [
|
|
482
|
+
rows,
|
|
483
|
+
groupingKey
|
|
484
|
+
]);
|
|
485
|
+
const fixedHeightRowCount = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>rows.reduce((count, row)=>row.getIsGrouped() ? count : count + 1, 0), [
|
|
486
|
+
rows
|
|
487
|
+
]);
|
|
488
|
+
const estimatedTotalPx = fixedHeightRowCount * resolvedRowHeightPx;
|
|
489
|
+
const [scrollMode, setScrollMode] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)("window");
|
|
490
|
+
(0, __WEBPACK_EXTERNAL_MODULE_react__.useLayoutEffect)(()=>{
|
|
491
|
+
const scope = listScopeRef.current;
|
|
492
|
+
if (!scope) return;
|
|
493
|
+
const measure = ()=>{
|
|
494
|
+
const headHeight = headRef.current?.clientHeight ?? 0;
|
|
495
|
+
const availableBodyHeight = scope.clientHeight - headHeight;
|
|
496
|
+
const isHeightConstrained = availableBodyHeight > 0 && estimatedTotalPx - availableBodyHeight > 1;
|
|
497
|
+
setScrollMode(isHeightConstrained ? "element" : "window");
|
|
498
|
+
};
|
|
499
|
+
measure();
|
|
500
|
+
const observer = new ResizeObserver(measure);
|
|
501
|
+
observer.observe(scope);
|
|
502
|
+
if (headRef.current) observer.observe(headRef.current);
|
|
503
|
+
return ()=>observer.disconnect();
|
|
504
|
+
}, [
|
|
505
|
+
estimatedTotalPx
|
|
506
|
+
]);
|
|
507
|
+
const renderRow = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((row, meta)=>{
|
|
508
|
+
const groupEntry = groupableEntries.find((entry)=>entry.id === row.groupingColumnId);
|
|
509
|
+
return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListRow_js_08189b13__["default"], {
|
|
510
|
+
row: row,
|
|
511
|
+
table: table,
|
|
512
|
+
groupEntry: groupEntry,
|
|
513
|
+
enableRowSelection: enableRowSelection,
|
|
514
|
+
anyRowCanBeSelected: anyRowCanBeSelected,
|
|
515
|
+
href: href,
|
|
516
|
+
onClick: onClick,
|
|
517
|
+
normalizedLeadingSlots: normalizedLeadingSlots,
|
|
518
|
+
normalizedPrimary: normalizedPrimary,
|
|
519
|
+
normalizedSecondary: normalizedSecondary,
|
|
520
|
+
mainSlotMaxWidthPx: mainSlot.size,
|
|
521
|
+
shouldFillMainSlot: mainSlot.fill ?? false,
|
|
522
|
+
normalizedContentSlots: normalizedContentSlots,
|
|
523
|
+
normalizedTrailingSlots: normalizedTrailingSlots,
|
|
524
|
+
isCompactContentSlots: isCompactContentSlots,
|
|
525
|
+
rowMainHidesContentSlotColumns: rowMainHidesContentSlotColumns,
|
|
526
|
+
contentSlotsJustifyContent: contentAlignment,
|
|
527
|
+
actionsForRow: actionsByRowId.get(row.id) ?? [],
|
|
528
|
+
lastSelectedRowRef: lastSelectedRowRef,
|
|
529
|
+
virtualStyle: {
|
|
530
|
+
position: "absolute",
|
|
531
|
+
top: 0,
|
|
532
|
+
left: 0,
|
|
533
|
+
width: "100%",
|
|
534
|
+
transform: `translateY(${meta.offset}px)`
|
|
535
|
+
},
|
|
536
|
+
dataIndex: meta.index,
|
|
537
|
+
measureRef: meta.measureRef
|
|
538
|
+
}, row.id);
|
|
539
|
+
}, [
|
|
540
|
+
groupableEntries,
|
|
541
|
+
table,
|
|
542
|
+
enableRowSelection,
|
|
543
|
+
anyRowCanBeSelected,
|
|
544
|
+
href,
|
|
545
|
+
onClick,
|
|
546
|
+
normalizedLeadingSlots,
|
|
547
|
+
normalizedPrimary,
|
|
548
|
+
normalizedSecondary,
|
|
549
|
+
mainSlot.size,
|
|
550
|
+
mainSlot.fill,
|
|
551
|
+
normalizedContentSlots,
|
|
552
|
+
normalizedTrailingSlots,
|
|
553
|
+
isCompactContentSlots,
|
|
554
|
+
rowMainHidesContentSlotColumns,
|
|
555
|
+
contentAlignment,
|
|
556
|
+
actionsByRowId,
|
|
557
|
+
lastSelectedRowRef
|
|
558
|
+
]);
|
|
459
559
|
const filterableColumnsForModal = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>entriesWithFilter.map((entry)=>({
|
|
460
560
|
id: entry.id,
|
|
461
561
|
filter: entry.filter
|
|
@@ -499,6 +599,7 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
499
599
|
"data-richlist-compact": isCompactContentSlots ? "" : void 0,
|
|
500
600
|
children: [
|
|
501
601
|
/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
|
|
602
|
+
ref: headRef,
|
|
502
603
|
className: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].richListHead,
|
|
503
604
|
children: [
|
|
504
605
|
showBulkBar ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListBulkActionBar_js_d46cecae__["default"], {
|
|
@@ -572,31 +673,22 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
572
673
|
}) : null
|
|
573
674
|
]
|
|
574
675
|
}),
|
|
575
|
-
rows.length > 0 ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
normalizedContentSlots: normalizedContentSlots,
|
|
592
|
-
normalizedTrailingSlots: normalizedTrailingSlots,
|
|
593
|
-
isCompactContentSlots: isCompactContentSlots,
|
|
594
|
-
rowMainHidesContentSlotColumns: rowMainHidesContentSlotColumns,
|
|
595
|
-
contentSlotsJustifyContent: contentAlignment,
|
|
596
|
-
actionsForRow: actionsByRowId.get(row.id) ?? [],
|
|
597
|
-
lastSelectedRowRef: lastSelectedRowRef
|
|
598
|
-
}, row.id);
|
|
599
|
-
})
|
|
676
|
+
rows.length > 0 ? "element" === scrollMode ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListVirtualBody_js_119c4f49__.RichListElementBody, {
|
|
677
|
+
rows: rows,
|
|
678
|
+
estimateSize: estimateSize,
|
|
679
|
+
getItemKey: getItemKey,
|
|
680
|
+
overscan: 10,
|
|
681
|
+
viewportClassName: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].scrollViewport,
|
|
682
|
+
listClassName: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].list,
|
|
683
|
+
renderRow: renderRow
|
|
684
|
+
}) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListVirtualBody_js_119c4f49__.RichListWindowBody, {
|
|
685
|
+
rows: rows,
|
|
686
|
+
estimateSize: estimateSize,
|
|
687
|
+
getItemKey: getItemKey,
|
|
688
|
+
overscan: 10,
|
|
689
|
+
viewportClassName: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].windowViewport,
|
|
690
|
+
listClassName: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].list,
|
|
691
|
+
renderRow: renderRow
|
|
600
692
|
}) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
|
|
601
693
|
className: __WEBPACK_EXTERNAL_MODULE__RichList_module_js_320d4975__["default"].emptyState,
|
|
602
694
|
children: emptyState
|
|
@@ -637,5 +729,28 @@ const RichList = ({ data, getRowId, leadingSlot, mainSlot, contentSlots = EMPTY_
|
|
|
637
729
|
]
|
|
638
730
|
});
|
|
639
731
|
};
|
|
732
|
+
const RICH_LIST_DEFER_ROW_THRESHOLD = 1000;
|
|
733
|
+
const RichList = (props)=>{
|
|
734
|
+
const shouldDefer = props.data.length > RICH_LIST_DEFER_ROW_THRESHOLD;
|
|
735
|
+
const [ready, setReady] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(!shouldDefer);
|
|
736
|
+
(0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
|
|
737
|
+
if (ready) return;
|
|
738
|
+
let innerHandle = 0;
|
|
739
|
+
const outerHandle = requestAnimationFrame(()=>{
|
|
740
|
+
innerHandle = requestAnimationFrame(()=>setReady(true));
|
|
741
|
+
});
|
|
742
|
+
return ()=>{
|
|
743
|
+
cancelAnimationFrame(outerHandle);
|
|
744
|
+
cancelAnimationFrame(innerHandle);
|
|
745
|
+
};
|
|
746
|
+
}, [
|
|
747
|
+
ready
|
|
748
|
+
]);
|
|
749
|
+
return ready ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(RichListInner, {
|
|
750
|
+
...props
|
|
751
|
+
}) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichListSkeleton_js_f2547a8c__["default"], {
|
|
752
|
+
...props
|
|
753
|
+
});
|
|
754
|
+
};
|
|
640
755
|
const RichList_rslib_entry_ = RichList;
|
|
641
756
|
export { RichList_rslib_entry_ as default };
|
|
@@ -6,6 +6,8 @@ const RichList_module_rslib_entry_ = {
|
|
|
6
6
|
richListHead: "richListHead-YX3P21",
|
|
7
7
|
listHeader: "listHeader-LmUwi0",
|
|
8
8
|
toolbarStatus: "toolbarStatus-OBimHB",
|
|
9
|
+
scrollViewport: "scrollViewport-RvFsVE",
|
|
10
|
+
windowViewport: "windowViewport-gkFnVD",
|
|
9
11
|
list: "list-j1kaiA",
|
|
10
12
|
emptyState: "emptyState-xAYoQA"
|
|
11
13
|
};
|
|
@@ -23,4 +23,18 @@ export declare const Positions: Story;
|
|
|
23
23
|
export declare const EmployeePeople: Story;
|
|
24
24
|
/** Performance-style review rows: search, inline status filter, type badges, due dates. */
|
|
25
25
|
export declare const Reviews: Story;
|
|
26
|
+
/**
|
|
27
|
+
* The baked-in loading placeholder `RichList` shows on first paint for lists over the
|
|
28
|
+
* defer threshold (1,000 rows), masking the synchronous row-model build. Normally on
|
|
29
|
+
* screen for only ~1–2 frames; rendered directly here so the prop-derived shape stays
|
|
30
|
+
* visible for inspection.
|
|
31
|
+
*/
|
|
32
|
+
export declare const Skeleton: Story;
|
|
33
|
+
/**
|
|
34
|
+
* Artificial 10,000-row list. Because it's over the defer threshold (1,000 rows), the
|
|
35
|
+
* `RichList` wrapper shows the skeleton for ~1–2 frames before the real, virtualized
|
|
36
|
+
* list swaps in — reload to see the flash. Doubles as a scale check that virtualization
|
|
37
|
+
* keeps the DOM small.
|
|
38
|
+
*/
|
|
39
|
+
export declare const LargeList10k: Story;
|
|
26
40
|
export declare const EmptyList: Story;
|
|
@@ -7,6 +7,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__stories_CustomFields_js_2f5c29d0__ from "
|
|
|
7
7
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_EmployeeCompliance_js_97782914__ from "./stories/EmployeeCompliance.js";
|
|
8
8
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_EmployeePaperwork_js_ce2a4560__ from "./stories/EmployeePaperwork.js";
|
|
9
9
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_EmployeePeople_js_30f49b1f__ from "./stories/EmployeePeople.js";
|
|
10
|
+
import * as __WEBPACK_EXTERNAL_MODULE__stories_LargeList_js_0371cdb7__ from "./stories/LargeList.js";
|
|
10
11
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_Leave_js_fe8f2780__ from "./stories/Leave.js";
|
|
11
12
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_Paperwork_js_6aeab56c__ from "./stories/Paperwork.js";
|
|
12
13
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_PaperworkApprovals_js_59df2dae__ from "./stories/PaperworkApprovals.js";
|
|
@@ -15,6 +16,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__stories_PeopleTags_js_7b425bf0__ from "./
|
|
|
15
16
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_Positions_js_26e8c2fc__ from "./stories/Positions.js";
|
|
16
17
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_Reviews_js_1264af6d__ from "./stories/Reviews.js";
|
|
17
18
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_SavedQuestions_js_d58c31d5__ from "./stories/SavedQuestions.js";
|
|
19
|
+
import * as __WEBPACK_EXTERNAL_MODULE__stories_Skeleton_js_e0334ff7__ from "./stories/Skeleton.js";
|
|
18
20
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_Tables_js_73ee4da7__ from "./stories/Tables.js";
|
|
19
21
|
import * as __WEBPACK_EXTERNAL_MODULE__stories_Tasks_js_9f5cc0bc__ from "./stories/Tasks.js";
|
|
20
22
|
function richListStoryDecoratorHeight() {
|
|
@@ -301,6 +303,21 @@ const Reviews = {
|
|
|
301
303
|
rowHeight: args.rowHeight
|
|
302
304
|
})
|
|
303
305
|
};
|
|
306
|
+
const Skeleton = {
|
|
307
|
+
render: (args)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__stories_Skeleton_js_e0334ff7__["default"], {
|
|
308
|
+
rowHeight: args.rowHeight
|
|
309
|
+
})
|
|
310
|
+
};
|
|
311
|
+
const LargeList10k = {
|
|
312
|
+
args: {
|
|
313
|
+
compactBreakpoint: 800
|
|
314
|
+
},
|
|
315
|
+
render: (args)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__stories_LargeList_js_0371cdb7__["default"], {
|
|
316
|
+
compactBreakpoint: args.compactBreakpoint,
|
|
317
|
+
contentAlignment: args.contentAlignment,
|
|
318
|
+
rowHeight: args.rowHeight
|
|
319
|
+
})
|
|
320
|
+
};
|
|
304
321
|
const EmptyList = {
|
|
305
322
|
render: (args)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__RichList_js_174fa6e8__["default"], {
|
|
306
323
|
data: [],
|
|
@@ -322,4 +339,4 @@ const EmptyList = {
|
|
|
322
339
|
}
|
|
323
340
|
})
|
|
324
341
|
};
|
|
325
|
-
export { ComplianceGroups, CustomFields, EmployeeCompliance, EmployeePaperwork, EmployeePeople, EmptyList, Leave, Paperwork, PaperworkApprovals, PeopleDirectory, PeopleTags, Positions, Reviews, SavedQuestions, Tables, Tasks, RichList_stories_rslib_entry_ as default };
|
|
342
|
+
export { ComplianceGroups, CustomFields, EmployeeCompliance, EmployeePaperwork, EmployeePeople, EmptyList, LargeList10k, Leave, Paperwork, PaperworkApprovals, PeopleDirectory, PeopleTags, Positions, Reviews, SavedQuestions, Skeleton, Tables, Tasks, RichList_stories_rslib_entry_ as default };
|
|
@@ -180,24 +180,11 @@ const RichListDisplayModal = ({ onClose, sortableColumns, currentSorting, onAppl
|
|
|
180
180
|
}));
|
|
181
181
|
},
|
|
182
182
|
disabled: !isSortActive
|
|
183
|
-
})
|
|
184
|
-
hasGroupSection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__inputs_SelectInput_js_a37c3c04__["default"], {
|
|
185
|
-
id: "richListDisplayGroupColumn",
|
|
186
|
-
options: groupOptions,
|
|
187
|
-
optionToId: (o)=>o.id,
|
|
188
|
-
optionToLabel: (o)=>o.label,
|
|
189
|
-
value: groupColumnOption,
|
|
190
|
-
onChange: (option)=>{
|
|
191
|
-
setData((prev)=>({
|
|
192
|
-
...prev,
|
|
193
|
-
groupColumnId: option.id
|
|
194
|
-
}));
|
|
195
|
-
}
|
|
196
|
-
}) : null
|
|
183
|
+
})
|
|
197
184
|
]
|
|
198
185
|
})
|
|
199
186
|
}) : null,
|
|
200
|
-
|
|
187
|
+
hasGroupSection ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__controls_FilterModal_js_c5dcd344__.FilterExpander, {
|
|
201
188
|
label: "Group by",
|
|
202
189
|
highlight: isGroupActive,
|
|
203
190
|
defaultOpen: !hasDisplaySection || isGroupActive,
|
|
@@ -12,6 +12,12 @@ type Props<Type> = {
|
|
|
12
12
|
groupEntry: GroupEntry<Type> | undefined;
|
|
13
13
|
/** When the list has bulk actions, rows can be selected via the checkbox lane. */
|
|
14
14
|
enableRowSelection: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* `true` when at least one currently-displayed row passes the bulk-action predicates.
|
|
17
|
+
* Used to show the checkbox lane on all rows (including ineligible ones, rendered as
|
|
18
|
+
* disabled) so the column is consistent across the list.
|
|
19
|
+
*/
|
|
20
|
+
anyRowCanBeSelected: boolean;
|
|
15
21
|
href: ((row: Type) => string) | undefined;
|
|
16
22
|
onClick: ((row: Type) => void) | undefined;
|
|
17
23
|
normalizedLeadingSlots: Array<NormalizedSlot<Type>>;
|
|
@@ -44,6 +50,15 @@ type Props<Type> = {
|
|
|
44
50
|
contentSlotsJustifyContent: NonNullable<CSSProperties["justifyContent"]>;
|
|
45
51
|
actionsForRow: Array<RichListRowAction<Type>>;
|
|
46
52
|
lastSelectedRowRef: MutableRefObject<Row<Type> | undefined>;
|
|
53
|
+
/**
|
|
54
|
+
* Inline positioning style applied to the row's `<li>` when the list is virtualized
|
|
55
|
+
* (absolute position + `translateY`). Provided by `RichListVirtualBody`.
|
|
56
|
+
*/
|
|
57
|
+
virtualStyle?: CSSProperties;
|
|
58
|
+
/** Row index within the full (filtered/sorted) row model; surfaced as `data-index`. */
|
|
59
|
+
dataIndex?: number;
|
|
60
|
+
/** Virtualizer remeasure ref attached to the row's `<li>`. */
|
|
61
|
+
measureRef?: (element: HTMLLIElement | null) => void;
|
|
47
62
|
};
|
|
48
|
-
declare const RichListRow: <Type>({ row, table, groupEntry, enableRowSelection, href, onClick, normalizedLeadingSlots, normalizedPrimary, normalizedSecondary, mainSlotMaxWidthPx, shouldFillMainSlot, normalizedContentSlots, normalizedTrailingSlots, isCompactContentSlots, rowMainHidesContentSlotColumns, contentSlotsJustifyContent, actionsForRow, lastSelectedRowRef, }: Props<Type>) => import("react/jsx-runtime").JSX.Element;
|
|
63
|
+
declare const RichListRow: <Type>({ row, table, groupEntry, enableRowSelection, anyRowCanBeSelected, href, onClick, normalizedLeadingSlots, normalizedPrimary, normalizedSecondary, mainSlotMaxWidthPx, shouldFillMainSlot, normalizedContentSlots, normalizedTrailingSlots, isCompactContentSlots, rowMainHidesContentSlotColumns, contentSlotsJustifyContent, actionsForRow, lastSelectedRowRef, virtualStyle, dataIndex, measureRef, }: Props<Type>) => import("react/jsx-runtime").JSX.Element;
|
|
49
64
|
export default RichListRow;
|