@popsure/dirty-swan 0.66.24 → 0.66.26

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 (54) hide show
  1. package/dist/cjs/index.d.ts +1 -1
  2. package/dist/cjs/index.js +59 -5
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/cjs/lib/components/table/utils/useTableNavigation/useTableNavigation.d.ts +3 -1
  5. package/dist/cjs/lib/context.d.ts +13 -0
  6. package/dist/cjs/lib/context.test.d.ts +1 -0
  7. package/dist/cjs/lib/index.d.ts +2 -1
  8. package/dist/esm/components/modal/bottomModal/index.js +1 -0
  9. package/dist/esm/components/modal/bottomModal/index.js.map +1 -1
  10. package/dist/esm/components/modal/bottomOrRegularModal/index.js +1 -0
  11. package/dist/esm/components/modal/bottomOrRegularModal/index.js.map +1 -1
  12. package/dist/esm/components/modal/fullScreenModal/index.js +1 -0
  13. package/dist/esm/components/modal/fullScreenModal/index.js.map +1 -1
  14. package/dist/esm/components/modal/genericModal/index.js +2 -0
  15. package/dist/esm/components/modal/genericModal/index.js.map +1 -1
  16. package/dist/esm/components/modal/index.stories.js +1 -0
  17. package/dist/esm/components/modal/index.stories.js.map +1 -1
  18. package/dist/esm/components/modal/regularModal/index.js +1 -0
  19. package/dist/esm/components/modal/regularModal/index.js.map +1 -1
  20. package/dist/esm/components/table/Table.js +5 -3
  21. package/dist/esm/components/table/Table.js.map +1 -1
  22. package/dist/esm/components/table/Table.stories.js +2 -1
  23. package/dist/esm/components/table/Table.stories.js.map +1 -1
  24. package/dist/esm/components/table/Table.test.js +43 -3
  25. package/dist/esm/components/table/Table.test.js.map +1 -1
  26. package/dist/esm/components/table/utils/useTableNavigation/useTableNavigation.test.js +51 -1
  27. package/dist/esm/components/table/utils/useTableNavigation/useTableNavigation.test.js.map +1 -1
  28. package/dist/esm/context.js +39 -0
  29. package/dist/esm/context.js.map +1 -0
  30. package/dist/esm/context.stories.js +67 -0
  31. package/dist/esm/context.stories.js.map +1 -0
  32. package/dist/esm/context.test.js +58 -0
  33. package/dist/esm/context.test.js.map +1 -0
  34. package/dist/esm/index.d.ts +1 -1
  35. package/dist/esm/index.js +2 -1
  36. package/dist/esm/index.js.map +1 -1
  37. package/dist/esm/lib/components/table/utils/useTableNavigation/useTableNavigation.d.ts +3 -1
  38. package/dist/esm/lib/context.d.ts +13 -0
  39. package/dist/esm/lib/context.test.d.ts +1 -0
  40. package/dist/esm/lib/index.d.ts +2 -1
  41. package/dist/esm/{useTableNavigation-CrxoXTVd.js → useTableNavigation-C-vb2BxI.js} +20 -5
  42. package/dist/esm/useTableNavigation-C-vb2BxI.js.map +1 -0
  43. package/package.json +1 -1
  44. package/src/index.tsx +3 -0
  45. package/src/lib/components/modal/genericModal/index.tsx +2 -0
  46. package/src/lib/components/table/Table.test.tsx +64 -0
  47. package/src/lib/components/table/Table.tsx +5 -5
  48. package/src/lib/components/table/utils/useTableNavigation/useTableNavigation.test.tsx +58 -0
  49. package/src/lib/components/table/utils/useTableNavigation/useTableNavigation.ts +25 -3
  50. package/src/lib/context.stories.tsx +136 -0
  51. package/src/lib/context.test.tsx +88 -0
  52. package/src/lib/context.tsx +60 -0
  53. package/src/lib/index.tsx +4 -0
  54. package/dist/esm/useTableNavigation-CrxoXTVd.js.map +0 -1
@@ -1,3 +1,3 @@
1
- export { Accordion, DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, IbanInput, CurrencyInput, BottomModal, RegularModal, BottomOrRegularModal, FullScreenModal, InfoCard, CardButton, Card, Button, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, DownloadButton, Checkbox, Radio, Link, InformationBox, Badge, images, illustrations, Spinner, Table, Toggle, Toaster, toast, useEscapeKey, useFocusWithin, useMediaQuery, useOnClickOutside, LogoColor, LogoWhite, LogoBlack, LogoOrangeBox, LogoInvertedColor, LogoInverted, LogoPositiveColor, LogoPositiveBlack, SearchableDropdown, } from './lib';
1
+ export { Accordion, DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, IbanInput, CurrencyInput, BottomModal, RegularModal, BottomOrRegularModal, FullScreenModal, InfoCard, CardButton, Card, Button, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, DownloadButton, Checkbox, Radio, Link, InformationBox, Badge, images, illustrations, Spinner, Table, Toggle, Toaster, toast, useEscapeKey, useFocusWithin, useMediaQuery, useOnClickOutside, LogoColor, LogoWhite, LogoBlack, LogoOrangeBox, LogoInvertedColor, LogoInverted, LogoPositiveColor, LogoPositiveBlack, SearchableDropdown, DirtySwanProvider, useDirtySwan, useModalTrack, } from './lib';
2
2
  export * from './lib/components/icon';
3
3
  export type { AccordionProps, BadgeProps, DownloadStatus, InformationBoxProps, InputProps, IllustrationKeys, FileType, MultiDropzoneProps, TableHeader, UploadedFile, UploadStatus, CardProps, IconWrapperProps, TableData, TableProps, SearchableDropdownProps, SearchableDropdownOption, } from './lib';
package/dist/cjs/index.js CHANGED
@@ -14842,6 +14842,40 @@ var useOnClose = function (onClose, isOpen, dismissable) {
14842
14842
  };
14843
14843
  };
14844
14844
 
14845
+ var DirtySwanContext = React.createContext(null);
14846
+ var DirtySwanProvider = function (_a) {
14847
+ var children = _a.children, onModalChange = _a.onModalChange;
14848
+ var countRef = React.useRef(0);
14849
+ var onModalChangeRef = React.useRef(onModalChange);
14850
+ onModalChangeRef.current = onModalChange;
14851
+ var onModalOpen = React.useCallback(function () {
14852
+ var _a;
14853
+ countRef.current += 1;
14854
+ if (countRef.current === 1) {
14855
+ (_a = onModalChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onModalChangeRef, true);
14856
+ }
14857
+ }, []);
14858
+ var onModalClose = React.useCallback(function () {
14859
+ var _a;
14860
+ countRef.current -= 1;
14861
+ if (countRef.current === 0) {
14862
+ (_a = onModalChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onModalChangeRef, false);
14863
+ }
14864
+ }, []);
14865
+ var value = React.useMemo(function () { return ({ onModalOpen: onModalOpen, onModalClose: onModalClose }); }, [onModalOpen, onModalClose]);
14866
+ return (jsxRuntime.jsx(DirtySwanContext.Provider, { value: value, children: children }));
14867
+ };
14868
+ var useDirtySwan = function () { return React.useContext(DirtySwanContext); };
14869
+ var useModalTrack = function (isVisible) {
14870
+ var dirtySwan = useDirtySwan();
14871
+ React.useEffect(function () {
14872
+ if (!isVisible)
14873
+ return;
14874
+ dirtySwan === null || dirtySwan === void 0 ? void 0 : dirtySwan.onModalOpen();
14875
+ return function () { return dirtySwan === null || dirtySwan === void 0 ? void 0 : dirtySwan.onModalClose(); };
14876
+ }, [isVisible, dirtySwan]);
14877
+ };
14878
+
14845
14879
  var css_248z$y = "@keyframes style-module_fade-in__f_VRg {\n 0% {\n background-color: rgba(0, 0, 0, 0);\n visibility: hidden;\n }\n 100% {\n background-color: rgba(0, 0, 0, 0.3);\n visibility: visible;\n }\n}\n@keyframes style-module_fade-out__1tEwS {\n from {\n background-color: rgba(0, 0, 0, 0.3);\n visibility: visible;\n }\n to {\n background-color: rgba(0, 0, 0, 0);\n visibility: hidden;\n }\n}\n.style-module_overlay__2f00R {\n z-index: 1000;\n overflow: hidden;\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n animation: style-module_fade-in__f_VRg 0.3s both;\n}\n.style-module_overlayClose__1p313 {\n animation-delay: 0.1s;\n animation: style-module_fade-out__1tEwS 0.3s both;\n}\n\n.style-module_header__284Rz {\n position: sticky;\n top: 0;\n}\n\n.style-module_closeButton__1AbX8 {\n width: 32px;\n height: 32px;\n padding: 0;\n}\n\n.style-module_body__QtlTn {\n flex-grow: 1;\n overflow: auto;\n background: linear-gradient(#fff 30%, #fff), linear-gradient(#fff, #fff 70%), linear-gradient(#e7e7ed 30%, #e7e7ed), linear-gradient(#e7e7ed, #e7e7ed 70%);\n background-repeat: no-repeat;\n background-size: 100% 1px;\n background-attachment: local, local, scroll, scroll;\n}\n\n.style-module_footer__Sh5bv {\n position: sticky;\n bottom: 0;\n border-top: 1px solid #e7e7ed;\n}";
14846
14880
  var styles$x = {"overlay":"style-module_overlay__2f00R","overlayClose":"style-module_overlayClose__1p313","header":"style-module_header__284Rz","closeButton":"style-module_closeButton__1AbX8","body":"style-module_body__QtlTn","footer":"style-module_footer__Sh5bv"};
14847
14881
  styleInject(css_248z$y);
@@ -17679,6 +17713,7 @@ var InnerModal = function (_a) {
17679
17713
  var GenericModal = function (props) {
17680
17714
  var isOpen = props.isOpen, onClose = props.onClose, _a = props.dismissible, dismissible = _a === void 0 ? true : _a;
17681
17715
  var _b = useOnClose(onClose, isOpen, dismissible), isVisible = _b.isVisible, rest = __rest$1(_b, ["isVisible"]);
17716
+ useModalTrack(isVisible);
17682
17717
  if (!isVisible) {
17683
17718
  return null;
17684
17719
  }
@@ -22949,8 +22984,17 @@ var TableContents = function (_a) {
22949
22984
  };
22950
22985
 
22951
22986
  var useTableNavigation = function (_a) {
22952
- var enabled = _a.enabled, containerRef = _a.containerRef, onSelectionChanged = _a.onSelectionChanged;
22953
- var _b = React.useState(0), activeSection = _b[0], setActiveSection = _b[1];
22987
+ var enabled = _a.enabled, containerRef = _a.containerRef, _b = _a.initialSection, initialSection = _b === void 0 ? 0 : _b, onSelectionChanged = _a.onSelectionChanged;
22988
+ var _c = React.useState(initialSection), activeSection = _c[0], setActiveSection = _c[1];
22989
+ var activeSectionRef = React.useRef(initialSection);
22990
+ var skipNextReportRef = React.useRef(false);
22991
+ var syncActiveSection = React.useCallback(function (section) {
22992
+ if (section === activeSectionRef.current) {
22993
+ return;
22994
+ }
22995
+ skipNextReportRef.current = true;
22996
+ setActiveSection(section);
22997
+ }, []);
22954
22998
  var handleScrollToSection = function (increase) {
22955
22999
  if (!enabled) {
22956
23000
  return;
@@ -22977,10 +23021,15 @@ var useTableNavigation = function (_a) {
22977
23021
  return container === null || container === void 0 ? void 0 : container.removeEventListener('scroll', handleTableScroll);
22978
23022
  }, [enabled]);
22979
23023
  React.useEffect(function () {
23024
+ activeSectionRef.current = activeSection;
23025
+ var skipReport = skipNextReportRef.current;
23026
+ skipNextReportRef.current = false;
22980
23027
  if (!enabled) {
22981
23028
  return;
22982
23029
  }
22983
- onSelectionChanged === null || onSelectionChanged === void 0 ? void 0 : onSelectionChanged(activeSection + 1);
23030
+ if (!skipReport) {
23031
+ onSelectionChanged === null || onSelectionChanged === void 0 ? void 0 : onSelectionChanged(activeSection + 1);
23032
+ }
22984
23033
  if (containerRef.current) {
22985
23034
  var containerWidth = containerRef.current.getBoundingClientRect().width;
22986
23035
  var cellWidth = containerWidth / 2;
@@ -22995,6 +23044,7 @@ var useTableNavigation = function (_a) {
22995
23044
  activeSection: activeSection + 1,
22996
23045
  navigateTable: handleScrollToSection,
22997
23046
  setActiveSection: setActiveSection,
23047
+ syncActiveSection: syncActiveSection,
22998
23048
  };
22999
23049
  };
23000
23050
 
@@ -23088,8 +23138,9 @@ var Table = function (_a) {
23088
23138
  var _s = useTableNavigation({
23089
23139
  enabled: isMobile,
23090
23140
  containerRef: containerRef,
23141
+ initialSection: externalActiveSection ? externalActiveSection - 1 : 0,
23091
23142
  onSelectionChanged: onSelectionChanged,
23092
- }), activeSection = _s.activeSection, navigateTable = _s.navigateTable, setActiveSection = _s.setActiveSection;
23143
+ }), activeSection = _s.activeSection, navigateTable = _s.navigateTable, setActiveSection = _s.setActiveSection, syncActiveSection = _s.syncActiveSection;
23093
23144
  var headerRow = (_c = (_b = tableData === null || tableData === void 0 ? void 0 : tableData[0]) === null || _b === void 0 ? void 0 : _b.rows) === null || _c === void 0 ? void 0 : _c[0];
23094
23145
  var titleCell = __assign({ text: '' }, ((headerRow === null || headerRow === void 0 ? void 0 : headerRow[0]) || {}));
23095
23146
  var currentActiveSection = headerRow === null || headerRow === void 0 ? void 0 : headerRow[activeSection];
@@ -23116,7 +23167,7 @@ var Table = function (_a) {
23116
23167
  }, []);
23117
23168
  React.useEffect(function () {
23118
23169
  if (externalActiveSection && externalActiveSection !== activeSection) {
23119
- setActiveSection(externalActiveSection - 1);
23170
+ syncActiveSection(externalActiveSection - 1);
23120
23171
  }
23121
23172
  }, [externalActiveSection]);
23122
23173
  return (jsxRuntime.jsxs("div", { className: classNames(styles$6.wrapper, 'bg-white'), children: [isMobile ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!useTabs && (titleCell === null || titleCell === void 0 ? void 0 : titleCell.text) && (jsxRuntime.jsx(TableCell, __assign({}, titleCell, { align: "left", isNavigation: true, isTopLeftCell: true, type: undefined }))), !hideTableNavigation && currentActiveSection && (useTabs ? (jsxRuntime.jsx("div", { className: classNames('bg-white', styles$6.stickyHeader), style: { top: "".concat(stickyHeaderTopOffset, "px") }, children: jsxRuntime.jsx(Tabs, { tabs: mobileTabs, activeIndex: activeSection - 1, onTabChange: function (index) { return setActiveSection(index); }, className: "mb16" }) })) : (jsxRuntime.jsx(TableControls, { activeSection: activeSection, columnsLength: columnsLength, navigateTable: navigateTable, stickyHeaderTopOffset: stickyHeaderTopOffset, children: jsxRuntime.jsx(TableCell, __assign({}, (isBaseCell(currentActiveSection)
@@ -23334,6 +23385,7 @@ exports.DentalTreatmentToothIcon = DentalTreatmentTooth;
23334
23385
  exports.DependentsFamilyAddIcon = DependentsFamilyAdd;
23335
23386
  exports.DependentsFamilyIcon = DependentsFamily;
23336
23387
  exports.DiabetesIcon = Diabetes;
23388
+ exports.DirtySwanProvider = DirtySwanProvider;
23337
23389
  exports.DiscIcon = Disc;
23338
23390
  exports.DoctorIcon = Doctor;
23339
23391
  exports.DoctorStethoscopeIcon = DoctorStethoscope;
@@ -23634,8 +23686,10 @@ exports.ZoomOutIcon = ZoomOut;
23634
23686
  exports.illustrations = illustrations;
23635
23687
  exports.images = images;
23636
23688
  exports.toast = toast;
23689
+ exports.useDirtySwan = useDirtySwan;
23637
23690
  exports.useEscapeKey = useEscapeKey;
23638
23691
  exports.useFocusWithin = useFocusWithin;
23639
23692
  exports.useMediaQuery = useMediaQuery;
23693
+ exports.useModalTrack = useModalTrack;
23640
23694
  exports.useOnClickOutside = useOnClickOutside;
23641
23695
  //# sourceMappingURL=index.js.map