@dmsi/wedgekit-react 0.0.81 → 0.0.83

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.
Files changed (46) hide show
  1. package/dist/{chunk-6R2HCLEL.js → chunk-37TJJQL3.js} +2 -2
  2. package/dist/{chunk-B6PDZCU7.js → chunk-5GUW4DUY.js} +1 -1
  3. package/dist/{chunk-ATOEGP3V.js → chunk-CKSDMI2Q.js} +14 -7
  4. package/dist/{chunk-2DCVAATK.js → chunk-MQWWNAO3.js} +4 -4
  5. package/dist/{chunk-FOC6LTSX.js → chunk-UPBBOZM3.js} +1 -1
  6. package/dist/{chunk-SWA5WVQO.js → chunk-WNQ53SVY.js} +30 -0
  7. package/dist/components/DataGridCell.cjs +53 -43
  8. package/dist/components/DataGridCell.js +5 -5
  9. package/dist/components/Menu.cjs +17 -14
  10. package/dist/components/Menu.js +3 -3
  11. package/dist/components/MenuOption.cjs +10 -7
  12. package/dist/components/MenuOption.js +2 -2
  13. package/dist/components/Modal.cjs +18 -15
  14. package/dist/components/Modal.js +3 -3
  15. package/dist/components/NestedMenu.cjs +12 -9
  16. package/dist/components/NestedMenu.js +2 -2
  17. package/dist/components/PDFViewer.cjs +21 -18
  18. package/dist/components/PDFViewer.js +3 -3
  19. package/dist/components/ProjectBar.cjs +6 -3
  20. package/dist/components/ProjectBar.js +1 -1
  21. package/dist/components/TopBar.cjs +1 -1
  22. package/dist/components/TopBar.js +1 -1
  23. package/dist/components/{DataGrid.cjs → index.cjs} +1424 -1335
  24. package/dist/components/{DataGrid.js → index.js} +948 -883
  25. package/dist/components/useMenuSystem.cjs +20 -17
  26. package/dist/components/useMenuSystem.js +2 -2
  27. package/dist/hooks/index.cjs +34 -3
  28. package/dist/hooks/index.js +3 -1
  29. package/package.json +6 -1
  30. package/src/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.tsx +32 -0
  31. package/src/components/DataGrid/ColumnSelectorHeaderCell/index.tsx +66 -0
  32. package/src/components/DataGrid/PinnedColumns.tsx +145 -0
  33. package/src/components/DataGrid/TableBody/LoadingCell.tsx +40 -0
  34. package/src/components/DataGrid/TableBody/TableBodyRow.tsx +129 -0
  35. package/src/components/DataGrid/TableBody/index.tsx +159 -0
  36. package/src/components/{DataGrid.tsx → DataGrid/index.tsx} +42 -678
  37. package/src/components/DataGrid/types.ts +86 -0
  38. package/src/components/DataGrid/utils.tsx +15 -0
  39. package/src/components/DataGridCell.tsx +37 -21
  40. package/src/components/TopBar.tsx +1 -1
  41. package/src/components/index.ts +20 -0
  42. package/src/hooks/index.ts +1 -0
  43. package/dist/chunk-AWQSSKCK.js +0 -32
  44. package/dist/components/useInfiniteScroll.cjs +0 -57
  45. package/dist/components/useInfiniteScroll.js +0 -8
  46. /package/src/{components → hooks}/useInfiniteScroll.tsx +0 -0
@@ -64,7 +64,7 @@ __export(Modal_exports, {
64
64
  });
65
65
  module.exports = __toCommonJS(Modal_exports);
66
66
  var import_clsx9 = __toESM(require("clsx"), 1);
67
- var import_react4 = require("react");
67
+ var import_react5 = require("react");
68
68
 
69
69
  // src/components/Heading.tsx
70
70
  var import_clsx2 = __toESM(require("clsx"), 1);
@@ -584,11 +584,14 @@ var import_react_use = require("react-use");
584
584
  // src/hooks/useKeydown.ts
585
585
  var import_react = require("react");
586
586
 
587
- // src/hooks/useMatchesMedia.ts
587
+ // src/hooks/useInfiniteScroll.tsx
588
588
  var import_react2 = require("react");
589
+
590
+ // src/hooks/useMatchesMedia.ts
591
+ var import_react3 = require("react");
589
592
  var useMatchesMedia = (query) => {
590
- const [matches, setMatches] = (0, import_react2.useState)();
591
- (0, import_react2.useLayoutEffect)(() => {
593
+ const [matches, setMatches] = (0, import_react3.useState)();
594
+ (0, import_react3.useLayoutEffect)(() => {
592
595
  const mediaQueryList = window.matchMedia(query);
593
596
  const listener = () => setMatches(mediaQueryList.matches);
594
597
  listener();
@@ -600,10 +603,10 @@ var useMatchesMedia = (query) => {
600
603
  var useMatchesMobile = () => useMatchesMedia("(width < 48rem)");
601
604
 
602
605
  // src/components/useMounted.tsx
603
- var import_react3 = require("react");
606
+ var import_react4 = require("react");
604
607
  var useMounted = () => {
605
- const [isMounted, setIsMounted] = (0, import_react3.useState)(false);
606
- (0, import_react3.useEffect)(() => {
608
+ const [isMounted, setIsMounted] = (0, import_react4.useState)(false);
609
+ (0, import_react4.useEffect)(() => {
607
610
  setIsMounted(true);
608
611
  return () => setIsMounted(false);
609
612
  }, []);
@@ -687,12 +690,12 @@ var Modal = ({
687
690
  }) => {
688
691
  var _a;
689
692
  const mounted = useMounted();
690
- const modalRef = (0, import_react4.useRef)(null);
691
- const bgRef = (0, import_react4.useRef)(null);
693
+ const modalRef = (0, import_react5.useRef)(null);
694
+ const bgRef = (0, import_react5.useRef)(null);
692
695
  const wasOpen = (0, import_react_use.usePrevious)(open);
693
696
  const isMobile = useMatchesMobile();
694
697
  const computedFixedHeightScrolling = isMobile || fixedHeightScrolling;
695
- (0, import_react4.useEffect)(() => {
698
+ (0, import_react5.useEffect)(() => {
696
699
  if (!mounted) return;
697
700
  if (!modalRef.current || !bgRef.current) {
698
701
  console.error("Modal or background reference is not set.");
@@ -712,7 +715,7 @@ var Modal = ({
712
715
  bgFadeIn(bgRef.current);
713
716
  }
714
717
  }, [mounted, open]);
715
- const handleKeyDown = (0, import_react4.useCallback)(
718
+ const handleKeyDown = (0, import_react5.useCallback)(
716
719
  (e) => {
717
720
  if (e.key === "Escape") {
718
721
  if (onClose) {
@@ -723,12 +726,12 @@ var Modal = ({
723
726
  },
724
727
  [onClose, bgRef, modalRef]
725
728
  );
726
- const handleClose = (0, import_react4.useCallback)(() => {
729
+ const handleClose = (0, import_react5.useCallback)(() => {
727
730
  if (onClose) {
728
731
  onClose();
729
732
  }
730
733
  }, [onClose]);
731
- (0, import_react4.useEffect)(() => {
734
+ (0, import_react5.useEffect)(() => {
732
735
  if (open) {
733
736
  document.addEventListener("keyup", handleKeyDown);
734
737
  }
@@ -736,7 +739,7 @@ var Modal = ({
736
739
  document.removeEventListener("keyup", handleKeyDown);
737
740
  };
738
741
  }, [open, handleKeyDown]);
739
- (0, import_react4.useEffect)(() => {
742
+ (0, import_react5.useEffect)(() => {
740
743
  if (!open) return;
741
744
  const scrollY = window.scrollY;
742
745
  const body = document.body;
@@ -757,7 +760,7 @@ var Modal = ({
757
760
  };
758
761
  }, [open]);
759
762
  const { sizeClass } = (_a = sizes[size]) != null ? _a : sizes.small;
760
- const backgroundClickHandler = (0, import_react4.useCallback)(
763
+ const backgroundClickHandler = (0, import_react5.useCallback)(
761
764
  (e) => {
762
765
  const target = e.target;
763
766
  const currentTarget = e.currentTarget;
@@ -1,14 +1,14 @@
1
1
  "use client";
2
2
  import {
3
3
  Modal
4
- } from "../chunk-2DCVAATK.js";
4
+ } from "../chunk-MQWWNAO3.js";
5
5
  import "../chunk-4RJKB7LC.js";
6
- import "../chunk-QUPHLL7D.js";
7
6
  import "../chunk-FWPJ73IK.js";
8
7
  import "../chunk-TVDFTRGL.js";
9
8
  import "../chunk-4JLU7TAC.js";
9
+ import "../chunk-QUPHLL7D.js";
10
10
  import "../chunk-J6LETUNM.js";
11
- import "../chunk-SWA5WVQO.js";
11
+ import "../chunk-WNQ53SVY.js";
12
12
  import "../chunk-4T7F5BZZ.js";
13
13
  import "../chunk-MZJS2ZAU.js";
14
14
  import "../chunk-IGQVA7SC.js";
@@ -63,7 +63,7 @@ __export(NestedMenu_exports, {
63
63
  NestedMenu: () => NestedMenu
64
64
  });
65
65
  module.exports = __toCommonJS(NestedMenu_exports);
66
- var import_react4 = require("react");
66
+ var import_react5 = require("react");
67
67
 
68
68
  // src/components/Icon.tsx
69
69
  var import_clsx = __toESM(require("clsx"), 1);
@@ -99,7 +99,7 @@ function Icon(_a) {
99
99
 
100
100
  // src/components/MenuOption.tsx
101
101
  var import_clsx5 = __toESM(require("clsx"), 1);
102
- var import_react3 = require("react");
102
+ var import_react4 = require("react");
103
103
 
104
104
  // src/classNames.ts
105
105
  var import_clsx2 = __toESM(require("clsx"), 1);
@@ -347,11 +347,14 @@ function useKeydown(keys, isActive) {
347
347
  }, [keys, isActive]);
348
348
  }
349
349
 
350
- // src/hooks/useMatchesMedia.ts
350
+ // src/hooks/useInfiniteScroll.tsx
351
351
  var import_react2 = require("react");
352
+
353
+ // src/hooks/useMatchesMedia.ts
354
+ var import_react3 = require("react");
352
355
  var useMatchesMedia = (query) => {
353
- const [matches, setMatches] = (0, import_react2.useState)();
354
- (0, import_react2.useLayoutEffect)(() => {
356
+ const [matches, setMatches] = (0, import_react3.useState)();
357
+ (0, import_react3.useLayoutEffect)(() => {
355
358
  const mediaQueryList = window.matchMedia(query);
356
359
  const listener = () => setMatches(mediaQueryList.matches);
357
360
  listener();
@@ -388,10 +391,10 @@ var MenuOption = ({
388
391
  highlightMatchingText = false,
389
392
  menuValue
390
393
  }) => {
391
- const uniqueId = (0, import_react3.useId)();
392
- const internalRef = (0, import_react3.useRef)(null);
394
+ const uniqueId = (0, import_react4.useId)();
395
+ const internalRef = (0, import_react4.useRef)(null);
393
396
  const actualRef = ref || internalRef;
394
- const menuId = (0, import_react3.useRef)(`menu-${uniqueId}`);
397
+ const menuId = (0, import_react4.useRef)(`menu-${uniqueId}`);
395
398
  const isMobile = useMatchesMobile();
396
399
  const handleMouseEnter = () => {
397
400
  if (subMenu && onSubMenuHover && !disabled) {
@@ -537,7 +540,7 @@ var import_jsx_runtime5 = require("react/jsx-runtime");
537
540
  function NestedMenu(props) {
538
541
  var _a;
539
542
  const { onMenuClick, currentMenu } = props;
540
- const [selectedIndex, setSelectedIndex] = (0, import_react4.useState)(0);
543
+ const [selectedIndex, setSelectedIndex] = (0, import_react5.useState)(0);
541
544
  useKeydown(
542
545
  {
543
546
  Escape: () => {
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  MenuOption
4
- } from "../chunk-FOC6LTSX.js";
4
+ } from "../chunk-UPBBOZM3.js";
5
5
  import {
6
6
  useKeydown
7
- } from "../chunk-SWA5WVQO.js";
7
+ } from "../chunk-WNQ53SVY.js";
8
8
  import "../chunk-VG4EPHJA.js";
9
9
  import "../chunk-S5K22XTH.js";
10
10
  import {
@@ -64,11 +64,11 @@ __export(PDFViewer_exports, {
64
64
  });
65
65
  module.exports = __toCommonJS(PDFViewer_exports);
66
66
  var import_react_pdf = require("@mikecousins/react-pdf");
67
- var import_react5 = require("react");
67
+ var import_react6 = require("react");
68
68
 
69
69
  // src/components/Modal.tsx
70
70
  var import_clsx9 = __toESM(require("clsx"), 1);
71
- var import_react4 = require("react");
71
+ var import_react5 = require("react");
72
72
 
73
73
  // src/components/Heading.tsx
74
74
  var import_clsx2 = __toESM(require("clsx"), 1);
@@ -588,11 +588,14 @@ var import_react_use = require("react-use");
588
588
  // src/hooks/useKeydown.ts
589
589
  var import_react = require("react");
590
590
 
591
- // src/hooks/useMatchesMedia.ts
591
+ // src/hooks/useInfiniteScroll.tsx
592
592
  var import_react2 = require("react");
593
+
594
+ // src/hooks/useMatchesMedia.ts
595
+ var import_react3 = require("react");
593
596
  var useMatchesMedia = (query) => {
594
- const [matches, setMatches] = (0, import_react2.useState)();
595
- (0, import_react2.useLayoutEffect)(() => {
597
+ const [matches, setMatches] = (0, import_react3.useState)();
598
+ (0, import_react3.useLayoutEffect)(() => {
596
599
  const mediaQueryList = window.matchMedia(query);
597
600
  const listener = () => setMatches(mediaQueryList.matches);
598
601
  listener();
@@ -604,10 +607,10 @@ var useMatchesMedia = (query) => {
604
607
  var useMatchesMobile = () => useMatchesMedia("(width < 48rem)");
605
608
 
606
609
  // src/components/useMounted.tsx
607
- var import_react3 = require("react");
610
+ var import_react4 = require("react");
608
611
  var useMounted = () => {
609
- const [isMounted, setIsMounted] = (0, import_react3.useState)(false);
610
- (0, import_react3.useEffect)(() => {
612
+ const [isMounted, setIsMounted] = (0, import_react4.useState)(false);
613
+ (0, import_react4.useEffect)(() => {
611
614
  setIsMounted(true);
612
615
  return () => setIsMounted(false);
613
616
  }, []);
@@ -691,12 +694,12 @@ var Modal = ({
691
694
  }) => {
692
695
  var _a;
693
696
  const mounted = useMounted();
694
- const modalRef = (0, import_react4.useRef)(null);
695
- const bgRef = (0, import_react4.useRef)(null);
697
+ const modalRef = (0, import_react5.useRef)(null);
698
+ const bgRef = (0, import_react5.useRef)(null);
696
699
  const wasOpen = (0, import_react_use.usePrevious)(open);
697
700
  const isMobile = useMatchesMobile();
698
701
  const computedFixedHeightScrolling = isMobile || fixedHeightScrolling;
699
- (0, import_react4.useEffect)(() => {
702
+ (0, import_react5.useEffect)(() => {
700
703
  if (!mounted) return;
701
704
  if (!modalRef.current || !bgRef.current) {
702
705
  console.error("Modal or background reference is not set.");
@@ -716,7 +719,7 @@ var Modal = ({
716
719
  bgFadeIn(bgRef.current);
717
720
  }
718
721
  }, [mounted, open]);
719
- const handleKeyDown = (0, import_react4.useCallback)(
722
+ const handleKeyDown = (0, import_react5.useCallback)(
720
723
  (e) => {
721
724
  if (e.key === "Escape") {
722
725
  if (onClose) {
@@ -727,12 +730,12 @@ var Modal = ({
727
730
  },
728
731
  [onClose, bgRef, modalRef]
729
732
  );
730
- const handleClose = (0, import_react4.useCallback)(() => {
733
+ const handleClose = (0, import_react5.useCallback)(() => {
731
734
  if (onClose) {
732
735
  onClose();
733
736
  }
734
737
  }, [onClose]);
735
- (0, import_react4.useEffect)(() => {
738
+ (0, import_react5.useEffect)(() => {
736
739
  if (open) {
737
740
  document.addEventListener("keyup", handleKeyDown);
738
741
  }
@@ -740,7 +743,7 @@ var Modal = ({
740
743
  document.removeEventListener("keyup", handleKeyDown);
741
744
  };
742
745
  }, [open, handleKeyDown]);
743
- (0, import_react4.useEffect)(() => {
746
+ (0, import_react5.useEffect)(() => {
744
747
  if (!open) return;
745
748
  const scrollY = window.scrollY;
746
749
  const body = document.body;
@@ -761,7 +764,7 @@ var Modal = ({
761
764
  };
762
765
  }, [open]);
763
766
  const { sizeClass } = (_a = sizes[size]) != null ? _a : sizes.small;
764
- const backgroundClickHandler = (0, import_react4.useCallback)(
767
+ const backgroundClickHandler = (0, import_react5.useCallback)(
765
768
  (e) => {
766
769
  const target = e.target;
767
770
  const currentTarget = e.currentTarget;
@@ -841,8 +844,8 @@ Modal.displayName = "Modal";
841
844
  var import_jsx_runtime9 = require("react/jsx-runtime");
842
845
  function PDFViewer(props) {
843
846
  const { base64, isOpen, onClose, datab64 } = props;
844
- const [page, setPage] = (0, import_react5.useState)(1);
845
- const canvasRef = (0, import_react5.useRef)(null);
847
+ const [page, setPage] = (0, import_react6.useState)(1);
848
+ const canvasRef = (0, import_react6.useRef)(null);
846
849
  const { pdfDocument } = (0, import_react_pdf.usePdf)({
847
850
  file: datab64 ? datab64 : `data:application/pdf;base64,${base64}`,
848
851
  workerSrc: "/scripts/pdf.worker.min.mjs",
@@ -1,14 +1,14 @@
1
1
  "use client";
2
2
  import {
3
3
  Modal
4
- } from "../chunk-2DCVAATK.js";
4
+ } from "../chunk-MQWWNAO3.js";
5
5
  import "../chunk-4RJKB7LC.js";
6
- import "../chunk-QUPHLL7D.js";
7
6
  import "../chunk-FWPJ73IK.js";
8
7
  import "../chunk-TVDFTRGL.js";
9
8
  import "../chunk-4JLU7TAC.js";
9
+ import "../chunk-QUPHLL7D.js";
10
10
  import "../chunk-J6LETUNM.js";
11
- import "../chunk-SWA5WVQO.js";
11
+ import "../chunk-WNQ53SVY.js";
12
12
  import "../chunk-4T7F5BZZ.js";
13
13
  import {
14
14
  Button
@@ -178,11 +178,14 @@ var gapUsingContainerPadding = (0, import_clsx.default)(
178
178
  // src/hooks/useKeydown.ts
179
179
  var import_react = require("react");
180
180
 
181
- // src/hooks/useMatchesMedia.ts
181
+ // src/hooks/useInfiniteScroll.tsx
182
182
  var import_react2 = require("react");
183
+
184
+ // src/hooks/useMatchesMedia.ts
185
+ var import_react3 = require("react");
183
186
  var useMatchesMedia = (query) => {
184
- const [matches, setMatches] = (0, import_react2.useState)();
185
- (0, import_react2.useLayoutEffect)(() => {
187
+ const [matches, setMatches] = (0, import_react3.useState)();
188
+ (0, import_react3.useLayoutEffect)(() => {
186
189
  const mediaQueryList = window.matchMedia(query);
187
190
  const listener = () => setMatches(mediaQueryList.matches);
188
191
  listener();
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  useMatchesMobile
3
- } from "../chunk-SWA5WVQO.js";
3
+ } from "../chunk-WNQ53SVY.js";
4
4
  import {
5
5
  containerPaddingX,
6
6
  layoutGap,
@@ -294,7 +294,7 @@ var TopBarBase = (_a) => {
294
294
  className: (0, import_clsx2.default)(
295
295
  "hidden desktop:flex items-center shrink-0 ml-auto",
296
296
  "[&>a]:leading-6",
297
- layoutGroupGap
297
+ layoutGap
298
298
  ),
299
299
  children: [
300
300
  topNavLinks,
@@ -65,7 +65,7 @@ var TopBarBase = (_a) => {
65
65
  className: clsx(
66
66
  "hidden desktop:flex items-center shrink-0 ml-auto",
67
67
  "[&>a]:leading-6",
68
- layoutGroupGap
68
+ layoutGap
69
69
  ),
70
70
  children: [
71
71
  topNavLinks,