@bikdotai/bik-component-library 0.0.744-beta.14 → 0.0.744-beta.15

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 (105) hide show
  1. package/dist/cjs/assets/icons/ActiveChecklistIcon.d.ts +3 -0
  2. package/dist/cjs/assets/icons/ActiveChecklistIcon.js +1 -0
  3. package/dist/cjs/assets/icons/CheckIndicatorIcon.d.ts +1 -0
  4. package/dist/cjs/assets/icons/CheckIndicatorIcon.js +1 -0
  5. package/dist/cjs/assets/icons/CompletedChecklistIcon.d.ts +3 -0
  6. package/dist/cjs/assets/icons/CompletedChecklistIcon.js +1 -0
  7. package/dist/cjs/assets/icons/CustomiseIcon.d.ts +7 -0
  8. package/dist/cjs/assets/icons/EnableIcon.d.ts +7 -0
  9. package/dist/cjs/assets/icons/GoLiveIcon.d.ts +7 -0
  10. package/dist/cjs/assets/icons/InactiveChecklistIcon.d.ts +3 -0
  11. package/dist/cjs/assets/icons/InactiveChecklistIcon.js +1 -0
  12. package/dist/cjs/assets/icons/NudgesIcon.d.ts +7 -0
  13. package/dist/cjs/assets/icons/OrderTrackingIcon.d.ts +7 -0
  14. package/dist/cjs/assets/icons/ProgressBadgeIcon.d.ts +3 -0
  15. package/dist/cjs/assets/icons/ShoppingIcon.d.ts +7 -0
  16. package/dist/cjs/assets/icons/SmallCheckIcon.d.ts +3 -0
  17. package/dist/cjs/assets/icons/SmallCheckIcon.js +1 -0
  18. package/dist/cjs/assets/icons/SupportIcon.d.ts +7 -0
  19. package/dist/cjs/assets/icons/TrainingIcon.d.ts +7 -0
  20. package/dist/cjs/components/ProgressChecklist/MultiChecklistItem.d.ts +10 -0
  21. package/dist/cjs/components/ProgressChecklist/MultiChecklistItem.js +1 -0
  22. package/dist/cjs/components/ProgressChecklist/ProgressChecklist.d.ts +70 -0
  23. package/dist/cjs/components/ProgressChecklist/ProgressChecklist.js +1 -0
  24. package/dist/cjs/components/ProgressChecklist/ProgressChecklist.style.d.ts +30 -0
  25. package/dist/cjs/components/ProgressChecklist/ProgressChecklist.style.js +133 -0
  26. package/dist/cjs/components/ProgressChecklist/ProgressStepper.d.ts +15 -0
  27. package/dist/cjs/components/ProgressChecklist/ProgressStepper.js +1 -0
  28. package/dist/cjs/components/ProgressChecklist/SimpleChecklistItem.d.ts +19 -0
  29. package/dist/cjs/components/ProgressChecklist/SimpleChecklistItem.js +1 -0
  30. package/dist/cjs/components/ProgressChecklist/index.d.ts +2 -0
  31. package/dist/cjs/components/QueryBuilder/helpers/MetaCustomProcessor.d.ts +1 -1
  32. package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
  33. package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
  34. package/dist/cjs/components/feature-announcements/MajorUpdatePopup.js +1 -1
  35. package/dist/cjs/components/feature-announcements/constants/dimensions.d.ts +25 -99
  36. package/dist/cjs/components/feature-announcements/constants/dimensions.js +1 -1
  37. package/dist/cjs/components/feature-announcements/styles/joyride.styles.d.ts +2 -2
  38. package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.d.ts +2 -18
  39. package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.js +1 -1
  40. package/dist/cjs/components/feature-announcements/types/feature.types.d.ts +0 -36
  41. package/dist/cjs/components/feature-announcements/types/props.types.d.ts +3 -25
  42. package/dist/cjs/components/post-live-checklist/PostLiveChecklist.d.ts +23 -0
  43. package/dist/cjs/components/post-live-checklist/PostLiveChecklist.js +1 -0
  44. package/dist/cjs/components/post-live-checklist/PostLiveChecklist.stories.d.ts +12 -0
  45. package/dist/cjs/components/post-live-checklist/index.d.ts +2 -0
  46. package/dist/cjs/components/post-live-checklist-item/PostLiveChecklistItem.d.ts +10 -0
  47. package/dist/cjs/components/post-live-checklist-item/PostLiveChecklistItem.js +1 -0
  48. package/dist/cjs/components/post-live-checklist-item/index.d.ts +1 -0
  49. package/dist/cjs/components/whats-new/WhatsNew.types.d.ts +0 -8
  50. package/dist/cjs/components/whats-new/WhatsNewPanel.js +1 -1
  51. package/dist/cjs/index.d.ts +3 -0
  52. package/dist/cjs/index.js +1 -1
  53. package/dist/esm/assets/icons/ActiveChecklistIcon.d.ts +3 -0
  54. package/dist/esm/assets/icons/ActiveChecklistIcon.js +1 -0
  55. package/dist/esm/assets/icons/CheckIndicatorIcon.d.ts +1 -0
  56. package/dist/esm/assets/icons/CheckIndicatorIcon.js +1 -0
  57. package/dist/esm/assets/icons/CompletedChecklistIcon.d.ts +3 -0
  58. package/dist/esm/assets/icons/CompletedChecklistIcon.js +1 -0
  59. package/dist/esm/assets/icons/CustomiseIcon.d.ts +7 -0
  60. package/dist/esm/assets/icons/EnableIcon.d.ts +7 -0
  61. package/dist/esm/assets/icons/GoLiveIcon.d.ts +7 -0
  62. package/dist/esm/assets/icons/InactiveChecklistIcon.d.ts +3 -0
  63. package/dist/esm/assets/icons/InactiveChecklistIcon.js +1 -0
  64. package/dist/esm/assets/icons/NudgesIcon.d.ts +7 -0
  65. package/dist/esm/assets/icons/OrderTrackingIcon.d.ts +7 -0
  66. package/dist/esm/assets/icons/ProgressBadgeIcon.d.ts +3 -0
  67. package/dist/esm/assets/icons/ShoppingIcon.d.ts +7 -0
  68. package/dist/esm/assets/icons/SmallCheckIcon.d.ts +3 -0
  69. package/dist/esm/assets/icons/SmallCheckIcon.js +1 -0
  70. package/dist/esm/assets/icons/SupportIcon.d.ts +7 -0
  71. package/dist/esm/assets/icons/TrainingIcon.d.ts +7 -0
  72. package/dist/esm/components/ProgressChecklist/MultiChecklistItem.d.ts +10 -0
  73. package/dist/esm/components/ProgressChecklist/MultiChecklistItem.js +1 -0
  74. package/dist/esm/components/ProgressChecklist/ProgressChecklist.d.ts +70 -0
  75. package/dist/esm/components/ProgressChecklist/ProgressChecklist.js +1 -0
  76. package/dist/esm/components/ProgressChecklist/ProgressChecklist.style.d.ts +30 -0
  77. package/dist/esm/components/ProgressChecklist/ProgressChecklist.style.js +133 -0
  78. package/dist/esm/components/ProgressChecklist/ProgressStepper.d.ts +15 -0
  79. package/dist/esm/components/ProgressChecklist/ProgressStepper.js +1 -0
  80. package/dist/esm/components/ProgressChecklist/SimpleChecklistItem.d.ts +19 -0
  81. package/dist/esm/components/ProgressChecklist/SimpleChecklistItem.js +1 -0
  82. package/dist/esm/components/ProgressChecklist/index.d.ts +2 -0
  83. package/dist/esm/components/QueryBuilder/helpers/MetaCustomProcessor.d.ts +1 -1
  84. package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
  85. package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
  86. package/dist/esm/components/feature-announcements/MajorUpdatePopup.js +1 -1
  87. package/dist/esm/components/feature-announcements/constants/dimensions.d.ts +25 -99
  88. package/dist/esm/components/feature-announcements/constants/dimensions.js +1 -1
  89. package/dist/esm/components/feature-announcements/styles/joyride.styles.d.ts +2 -2
  90. package/dist/esm/components/feature-announcements/styles/majorPopup.styles.d.ts +2 -18
  91. package/dist/esm/components/feature-announcements/styles/majorPopup.styles.js +1 -1
  92. package/dist/esm/components/feature-announcements/types/feature.types.d.ts +0 -36
  93. package/dist/esm/components/feature-announcements/types/props.types.d.ts +3 -25
  94. package/dist/esm/components/post-live-checklist/PostLiveChecklist.d.ts +23 -0
  95. package/dist/esm/components/post-live-checklist/PostLiveChecklist.js +1 -0
  96. package/dist/esm/components/post-live-checklist/PostLiveChecklist.stories.d.ts +12 -0
  97. package/dist/esm/components/post-live-checklist/index.d.ts +2 -0
  98. package/dist/esm/components/post-live-checklist-item/PostLiveChecklistItem.d.ts +10 -0
  99. package/dist/esm/components/post-live-checklist-item/PostLiveChecklistItem.js +1 -0
  100. package/dist/esm/components/post-live-checklist-item/index.d.ts +1 -0
  101. package/dist/esm/components/whats-new/WhatsNew.types.d.ts +0 -8
  102. package/dist/esm/components/whats-new/WhatsNewPanel.js +1 -1
  103. package/dist/esm/index.d.ts +3 -0
  104. package/dist/esm/index.js +1 -1
  105. package/package.json +1 -1
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const ActiveChecklistIcon: React.FC<React.SVGProps<SVGSVGElement>>;
3
+ export default ActiveChecklistIcon;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");const t=t=>e.jsxs("svg",Object.assign({width:"36",height:"44",viewBox:"0 0 36 44",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t,{children:[e.jsx("rect",{y:"4",width:"36",height:"36",rx:"18",fill:"#EFE6F9"}),e.jsxs("g",Object.assign({clipPath:"url(#clip0_8_5197)"},{children:[e.jsx("path",{d:"M14.9583 21.167C14.268 21.167 13.7083 21.7266 13.7083 22.417C13.7083 23.1073 14.268 23.667 14.9583 23.667C15.6487 23.667 16.2083 23.1073 16.2083 22.417C16.2083 21.7266 15.6487 21.167 14.9583 21.167Z",fill:"#4B1583"}),e.jsx("path",{d:"M20.7916 21.167C20.1013 21.167 19.5416 21.7266 19.5416 22.417C19.5416 23.1073 20.1013 23.667 20.7916 23.667C21.482 23.667 22.0416 23.1073 22.0416 22.417C22.0416 21.7266 21.482 21.167 20.7916 21.167Z",fill:"#4B1583"}),e.jsx("path",{d:"M16.2083 25.3337C15.7481 25.3337 15.375 25.7068 15.375 26.167C15.375 26.6272 15.7481 27.0003 16.2083 27.0003H19.5416C20.0019 27.0003 20.375 26.6272 20.375 26.167C20.375 25.7068 20.0019 25.3337 19.5416 25.3337H16.2083Z",fill:"#4B1583"}),e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M14.5416 14.5003C14.5416 14.0401 14.9147 13.667 15.375 13.667H20.375C20.8352 13.667 21.2083 14.0401 21.2083 14.5003C21.2083 14.9606 20.8352 15.3337 20.375 15.3337H18.7083V17.0003H22.875C25.1762 17.0003 27.0416 18.8658 27.0416 21.167V26.167C27.0416 28.4682 25.1762 30.3337 22.875 30.3337H12.875C10.5738 30.3337 8.70831 28.4682 8.70831 26.167V21.167C8.70831 18.8658 10.5738 17.0003 12.875 17.0003H17.0416V15.3337H15.375C14.9147 15.3337 14.5416 14.9606 14.5416 14.5003ZM12.875 18.667C11.4943 18.667 10.375 19.7863 10.375 21.167V26.167C10.375 27.5477 11.4943 28.667 12.875 28.667H22.875C24.2557 28.667 25.375 27.5477 25.375 26.167V21.167C25.375 19.7863 24.2557 18.667 22.875 18.667H12.875Z",fill:"#4B1583"})]})),e.jsx("defs",{children:e.jsx("clipPath",Object.assign({id:"clip0_8_5197"},{children:e.jsx("rect",{width:"20",height:"20",fill:"white",transform:"translate(7.875 12)"})}))})]}));exports.ActiveChecklistIcon=t,exports.default=t;
@@ -0,0 +1 @@
1
+ export declare const CheckIndicatorIcon: () => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");exports.CheckIndicatorIcon=()=>e.jsxs("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("rect",{x:"3",y:"3",width:"18",height:"18",rx:"9",fill:"#1A872C"}),e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M16.6819 8.06064C17.0724 8.45117 17.0724 9.08433 16.6819 9.47486L11.025 15.1317C10.6345 15.5223 10.0013 15.5223 9.6108 15.1317L7.48968 13.0106C7.09916 12.6201 7.09916 11.9869 7.48968 11.5964C7.88021 11.2059 8.51337 11.2059 8.9039 11.5964L10.3179 13.0104L15.2677 8.06064C15.6582 7.67012 16.2914 7.67012 16.6819 8.06064Z",fill:"white"})]}));
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const CompletedChecklistIcon: React.FC<React.SVGProps<SVGSVGElement>>;
3
+ export default CompletedChecklistIcon;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");const t=t=>e.jsxs("svg",Object.assign({width:"36",height:"36",viewBox:"0 0 36 36",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t,{children:[e.jsx("rect",{width:"36",height:"36",rx:"18",fill:"#1A872C"}),e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M25.1309 12.4106C25.4564 12.736 25.4564 13.2637 25.1309 13.5891L15.9643 22.7558C15.6388 23.0812 15.1112 23.0812 14.7857 22.7558L10.6191 18.5891C10.2936 18.2637 10.2936 17.736 10.6191 17.4106C10.9445 17.0851 11.4722 17.0851 11.7976 17.4106L15.375 20.988L23.9524 12.4106C24.2778 12.0851 24.8055 12.0851 25.1309 12.4106Z",fill:"white"})]}));exports.CompletedChecklistIcon=t,exports.default=t;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const CustomiseIcon: React.FC<IconProps>;
7
+ export default CustomiseIcon;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const EnableIcon: React.FC<IconProps>;
7
+ export default EnableIcon;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const GoLiveIcon: React.FC<IconProps>;
7
+ export default GoLiveIcon;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const InactiveChecklistIcon: React.FC<React.SVGProps<SVGSVGElement>>;
3
+ export default InactiveChecklistIcon;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");const t=t=>e.jsxs("svg",Object.assign({width:"36",height:"44",viewBox:"0 0 36 44",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t,{children:[e.jsx("rect",{y:"4",width:"36",height:"36",rx:"18",fill:"#E0E0E0"}),e.jsxs("g",Object.assign({clipPath:"url(#clip0_8_5196)"},{children:[e.jsx("path",{d:"M14.9583 21.167C14.268 21.167 13.7083 21.7266 13.7083 22.417C13.7083 23.1073 14.268 23.667 14.9583 23.667C15.6487 23.667 16.2083 23.1073 16.2083 22.417C16.2083 21.7266 15.6487 21.167 14.9583 21.167Z",fill:"#BDBDBD"}),e.jsx("path",{d:"M20.7916 21.167C20.1013 21.167 19.5416 21.7266 19.5416 22.417C19.5416 23.1073 20.1013 23.667 20.7916 23.667C21.482 23.667 22.0416 23.1073 22.0416 22.417C22.0416 21.7266 21.482 21.167 20.7916 21.167Z",fill:"#BDBDBD"}),e.jsx("path",{d:"M16.2083 25.3337C15.7481 25.3337 15.375 25.7068 15.375 26.167C15.375 26.6272 15.7481 27.0003 16.2083 27.0003H19.5416C20.0019 27.0003 20.375 26.6272 20.375 26.167C20.375 25.7068 20.0019 25.3337 19.5416 25.3337H16.2083Z",fill:"#BDBDBD"}),e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M14.5416 14.5003C14.5416 14.0401 14.9147 13.667 15.375 13.667H20.375C20.8352 13.667 21.2083 14.0401 21.2083 14.5003C21.2083 14.9606 20.8352 15.3337 20.375 15.3337H18.7083V17.0003H22.875C25.1762 17.0003 27.0416 18.8658 27.0416 21.167V26.167C27.0416 28.4682 25.1762 30.3337 22.875 30.3337H12.875C10.5738 30.3337 8.70831 28.4682 8.70831 26.167V21.167C8.70831 18.8658 10.5738 17.0003 12.875 17.0003H17.0416V15.3337H15.375C14.9147 15.3337 14.5416 14.9606 14.5416 14.5003ZM12.875 18.667C11.4943 18.667 10.375 19.7863 10.375 21.167V26.167C10.375 27.5477 11.4943 28.667 12.875 28.667H22.875C24.2557 28.667 25.375 27.5477 25.375 26.167V21.167C25.375 19.7863 24.2557 18.667 22.875 18.667H12.875Z",fill:"#BDBDBD"})]})),e.jsx("defs",{children:e.jsx("clipPath",Object.assign({id:"clip0_8_5196"},{children:e.jsx("rect",{width:"20",height:"20",fill:"white",transform:"translate(7.875 12)"})}))})]}));exports.InactiveChecklistIcon=t,exports.default=t;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const NudgesIcon: React.FC<IconProps>;
7
+ export default NudgesIcon;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const OrderTrackingIcon: React.FC<IconProps>;
7
+ export default OrderTrackingIcon;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const ProgressBadgeIcon: React.FC;
3
+ export default ProgressBadgeIcon;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const ShoppingIcon: React.FC<IconProps>;
7
+ export default ShoppingIcon;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const SmallCheckIcon: React.FC<React.SVGProps<SVGSVGElement>>;
3
+ export default SmallCheckIcon;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");const t=t=>e.jsx("svg",Object.assign({width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t,{children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6.91058 4.41058C7.23602 4.08514 7.76366 4.08514 8.08909 4.41058L13.0891 9.41058C13.4145 9.73602 13.4145 10.2637 13.0891 10.5891L8.08909 15.5891C7.76366 15.9145 7.23602 15.9145 6.91058 15.5891C6.58514 15.2637 6.58514 14.736 6.91058 14.4106L11.3213 9.99984L6.91058 5.58909C6.58514 5.26366 6.58514 4.73602 6.91058 4.41058Z",fill:"#616161"})}));exports.SmallCheckIcon=t,exports.default=t;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const SupportIcon: React.FC<IconProps>;
7
+ export default SupportIcon;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ bgColor?: string;
4
+ strokeColor?: string;
5
+ }
6
+ declare const TrainingIcon: React.FC<IconProps>;
7
+ export default TrainingIcon;
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ import type { MultiChecklistItemType } from './ProgressChecklist';
3
+ interface MultiChecklistItemProps {
4
+ item: MultiChecklistItemType;
5
+ children?: React.ReactNode;
6
+ isOpen?: boolean;
7
+ onToggle?: (open: boolean) => void;
8
+ }
9
+ declare const MultiChecklistItem: React.FC<MultiChecklistItemProps>;
10
+ export default MultiChecklistItem;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../accordion/Accordion.js"),i=require("./SimpleChecklistItem.js");exports.default=o=>{let{item:t,children:s,isOpen:c,onToggle:d}=o;const n="boolean"==typeof c?c:!!t.isActive,a=e.jsx(i.default,{header:t.header,subheader:t.subheader,icon:t.icon,activeIcon:t.activeIcon,completedIcon:t.completedIcon,isCompleted:t.isCompleted,isActive:t.isActive,tag:t.tag});return e.jsx(r.BikAccordion,Object.assign({header:a,headerStyles:{height:"auto",cursor:"pointer"},onToggleAccordion:d||(()=>{}),isOpen:n,skipHoverHeader:!0,showBorders:!0,borderRadius:"8px"},{children:s?e.jsx("div",Object.assign({style:{border:"none",padding:16}},{children:s})):null}))};
@@ -0,0 +1,70 @@
1
+ import React from 'react';
2
+ import { ALERT_TYPES } from '../alerts';
3
+ export interface ChecklistItemType {
4
+ id: string;
5
+ label: string;
6
+ description?: string;
7
+ completed?: boolean;
8
+ }
9
+ export interface SingleChecklistItemType {
10
+ id: string;
11
+ header: string;
12
+ subheader: string;
13
+ icon?: React.ReactNode;
14
+ activeIcon?: React.ReactNode;
15
+ completedIcon?: React.ReactNode;
16
+ isActive?: boolean;
17
+ isCompleted?: boolean;
18
+ onSetup?: () => void;
19
+ alertText?: string | React.ReactNode;
20
+ alertType?: ALERT_TYPES;
21
+ tag?: {
22
+ tagText: string | number;
23
+ variant?: 'regular' | 'circle' | 'compressed';
24
+ type?: 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
25
+ theme?: 'light' | 'dark';
26
+ };
27
+ type: 'single';
28
+ buttonType?: 'primary' | 'secondary' | 'tertiary';
29
+ buttonText?: string;
30
+ buttonDisabled?: boolean;
31
+ hideRedirectButton?: boolean;
32
+ hideSetupButton?: boolean;
33
+ }
34
+ export interface MultiChecklistItemType {
35
+ id: string;
36
+ header: string;
37
+ subheader?: string;
38
+ icon?: React.ReactNode;
39
+ activeIcon?: React.ReactNode;
40
+ completedIcon?: React.ReactNode;
41
+ isActive?: boolean;
42
+ isCompleted?: boolean;
43
+ onSetup?: () => void;
44
+ tag?: {
45
+ tagText: string | number;
46
+ variant?: 'regular' | 'circle' | 'compressed';
47
+ type?: 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
48
+ theme?: 'light' | 'dark';
49
+ };
50
+ type: 'multiple';
51
+ alertType?: ALERT_TYPES;
52
+ steps?: Array<{
53
+ id?: string;
54
+ text: string;
55
+ onClick?: () => void;
56
+ isCompleted?: boolean;
57
+ }>;
58
+ buttonType?: 'primary' | 'secondary' | 'tertiary';
59
+ }
60
+ export interface ProgressChecklistProps {
61
+ header?: string;
62
+ subheader?: string;
63
+ items?: Array<SingleChecklistItemType | MultiChecklistItemType>;
64
+ progressBarColor?: string;
65
+ headerAction?: React.ReactNode;
66
+ /** Whether to render the progress bar. Defaults to true. */
67
+ showProgressBar?: boolean;
68
+ }
69
+ declare const ProgressChecklist: React.FC<ProgressChecklistProps>;
70
+ export default ProgressChecklist;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../../constants/Theme.js"),i=require("../../assets/icons/ActiveChecklistIcon.js"),r=require("../../assets/icons/CompletedChecklistIcon.js"),l=require("../../assets/icons/InactiveChecklistIcon.js"),n=require("../../assets/icons/SmallCheckIcon.js"),c=require("../alerts/Alert.js"),o=require("../alerts/AlertHelper.js"),a=require("../button/Button.js"),d=require("../progress-bar-v2/ProgressBarV2.js"),u=require("../tag/Tag.js"),p=require("../TypographyStyle.js"),h=require("./MultiChecklistItem.js"),g=require("./ProgressChecklist.style.js"),x=require("./ProgressStepper.js");exports.default=j=>{let{header:C,subheader:v,items:y=[],progressBarColor:m,headerAction:b,showProgressBar:S=!0}=j;const[T,f]=t.useState(y);t.useEffect((()=>{f(y)}),[y]);const k=T.filter((e=>e.isCompleted)).length,I=T.length,A=I>0?k/I*100:0;return e.jsxs(g.ProgressChecklistContainer,{children:[e.jsxs(g.HeaderSection,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center"}},{children:[e.jsx(p.TitleMedium,{children:C}),b&&e.jsx("div",{children:b})]})),e.jsx(p.BodySecondary,Object.assign({color:s.COLORS.content.secondary},{children:v}))]}),S&&e.jsxs(g.ProgressBarSection,Object.assign({style:{display:"flex",alignItems:"center",gap:"16px"}},{children:[e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(d.ProgressBarV2,{progress:Math.round(A),type:d.ProgressBarType.LINE,matchParentWidth:!0,showProgress:!1,color:null!=m?m:s.COLORS.background.positive.vibrant,progressBarThickness:12})})),e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",alignItems:"center",minWidth:12}},{children:e.jsxs(p.TitleSmall,Object.assign({style:{color:s.COLORS.content.secondary,textAlign:"right"}},{children:[k," / ",I]}))}))]})),e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:T.map((t=>{var s,d,p,j,C,v,y,m;if("single"===t.type)return e.jsxs(g.SingleChecklistItem,Object.assign({isActive:t.isActive||!1},{children:[e.jsxs(g.SingleChecklistMainRow,{children:[e.jsx(g.SingleChecklistIconWrapper,{children:t.isCompleted?null!==(s=t.completedIcon)&&void 0!==s?s:e.jsx(r.CompletedChecklistIcon,{}):t.isActive?null!==(d=t.activeIcon)&&void 0!==d?d:e.jsx(i.ActiveChecklistIcon,{}):null!==(p=t.icon)&&void 0!==p?p:e.jsx(l.InactiveChecklistIcon,{})}),e.jsxs(g.SingleChecklistContent,{children:[e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:12}},{children:[e.jsx(g.SingleChecklistHeader,Object.assign({completed:!!t.isCompleted,isActive:!!t.isActive},{children:t.header})),(null===(j=t.tag)||void 0===j?void 0:j.tagText)&&e.jsx(u.Tag,{tagText:t.tag.tagText,variant:t.tag.variant,type:t.tag.type,theme:t.tag.theme})]})),e.jsx(g.SingleChecklistSubheader,{children:t.subheader})]}),t.isCompleted&&!t.hideRedirectButton&&e.jsx("div",Object.assign({onClick:t.onSetup,style:{cursor:"pointer"}},{children:e.jsx(n.SmallCheckIcon,{style:{marginLeft:"12px"}})})),!t.isCompleted&&t.isActive&&!t.hideSetupButton&&e.jsx(g.SingleChecklistActionWrapper,{children:e.jsx(a.Button,{buttonText:null!==(C=t.buttonText)&&void 0!==C?C:"Setup",buttonType:null!==(v=t.buttonType)&&void 0!==v?v:"primary",onClick:t.onSetup,disabled:null!==(y=t.buttonDisabled)&&void 0!==y&&y})})]}),t.alertText&&e.jsx(g.SingleChecklistAlertRow,{children:e.jsx(c.Alert,{text:t.alertText,type:null!==(m=t.alertType)&&void 0!==m?m:o.ALERT_TYPES.WARNING,contentPosition:o.CONTENT_POSITION.START,textColor:t.alertType===o.ALERT_TYPES.BRAND?"#4B1583":""})})]}),t.id);if("multiple"===t.type){const s=t.steps&&t.steps.length>0?t.steps.map(((e,s)=>{var i;return{id:null!==(i=e.id)&&void 0!==i?i:`${t.id}-sub-${s+1}`,text:e.text,label:e.text,onClick:e.onClick,isCompleted:!!e.isCompleted}})):[{id:`${t.id}-sub-1`,text:"Connect",label:"Connect",isCompleted:!1},{id:`${t.id}-sub-2`,text:"Configure",label:"Configure",isCompleted:!1},{id:`${t.id}-sub-3`,text:"Verify",label:"Verify",isCompleted:!1}];return e.jsx(h.default,Object.assign({item:t},{children:e.jsx(x.default,{steps:s,isStepperActive:t.isActive})}),t.id)}}))}))]})};
@@ -0,0 +1,30 @@
1
+ export declare const ProgressChecklistContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
2
+ export declare const HeaderSection: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const ProgressBarSection: import("styled-components").StyledComponent<"div", any, {}, never>;
4
+ export declare const ChecklistItemsSection: import("styled-components").StyledComponent<"div", any, {}, never>;
5
+ export declare const ChecklistItem: import("styled-components").StyledComponent<"div", any, {
6
+ completed?: boolean | undefined;
7
+ }, never>;
8
+ export declare const ChecklistCheckbox: import("styled-components").StyledComponent<"input", any, {}, never>;
9
+ export declare const ChecklistItemContent: import("styled-components").StyledComponent<"div", any, {}, never>;
10
+ export declare const ChecklistItemText: import("styled-components").StyledComponent<"p", any, {
11
+ completed?: boolean | undefined;
12
+ }, never>;
13
+ export declare const ChecklistItemDescription: import("styled-components").StyledComponent<"p", any, {
14
+ completed?: boolean | undefined;
15
+ }, never>;
16
+ export declare const SingleChecklistItem: import("styled-components").StyledComponent<"div", any, {
17
+ isActive: boolean;
18
+ }, never>;
19
+ export declare const SingleChecklistMainRow: import("styled-components").StyledComponent<"div", any, {}, never>;
20
+ export declare const SingleChecklistIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
21
+ export declare const SingleChecklistContent: import("styled-components").StyledComponent<"div", any, {}, never>;
22
+ export declare const SingleChecklistHeader: import("styled-components").StyledComponent<"div", any, {
23
+ completed?: boolean | undefined;
24
+ isActive?: boolean | undefined;
25
+ }, never>;
26
+ export declare const SingleChecklistSubheader: import("styled-components").StyledComponent<"div", any, {
27
+ isActive?: boolean | undefined;
28
+ }, never>;
29
+ export declare const SingleChecklistActionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
30
+ export declare const SingleChecklistAlertRow: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -0,0 +1,133 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(e);const o=r.default.div`
2
+ border-radius: 8px;
3
+ border: 1px solid #e0e0e0;
4
+ padding: 24px;
5
+ display: flex;
6
+ flex-direction: column;
7
+ gap: 10px;
8
+ background: ${t.COLORS.surface.standard};
9
+
10
+ .accordion__overview {
11
+ padding: 16px !important;
12
+ border-bottom: none;
13
+ }
14
+ `,l=r.default.div`
15
+ display: flex;
16
+ flex-direction: column;
17
+ gap: 8px;
18
+ `,n=r.default.div`
19
+ display: flex;
20
+ flex-direction: row;
21
+ gap: 12px;
22
+ `;r.default.div`
23
+ display: flex;
24
+ flex-direction: column;
25
+ gap: 16px;
26
+ overflow-y: auto;
27
+ flex: 1;
28
+
29
+ &::-webkit-scrollbar {
30
+ width: 6px;
31
+ }
32
+
33
+ &::-webkit-scrollbar-track {
34
+ background: transparent;
35
+ }
36
+
37
+ &::-webkit-scrollbar-thumb {
38
+ background: ${t.COLORS.stroke.primary};
39
+ border-radius: 3px;
40
+ }
41
+ `,r.default.div`
42
+ display: flex;
43
+ align-items: flex-start;
44
+ gap: 12px;
45
+ padding: 12px;
46
+ background: ${e=>e.completed?"#F0F7F4":t.COLORS.surface.standard};
47
+ border: 1px solid
48
+ ${e=>e.completed?"#D4E9E3":t.COLORS.stroke.primary};
49
+ border-radius: 6px;
50
+ cursor: pointer;
51
+ transition: all 0.2s ease;
52
+
53
+ &:hover {
54
+ background: ${e=>e.completed?"#E8F4F0":t.COLORS.background.base};
55
+ }
56
+ `,r.default.input`
57
+ width: 18px;
58
+ height: 18px;
59
+ margin-top: 2px;
60
+ cursor: pointer;
61
+ flex-shrink: 0;
62
+ `,r.default.div`
63
+ display: flex;
64
+ flex-direction: column;
65
+ gap: 4px;
66
+ flex: 1;
67
+ `,r.default.p`
68
+ margin: 0;
69
+ font-size: 14px;
70
+ font-weight: 500;
71
+ line-height: 20px;
72
+ color: ${e=>e.completed?t.COLORS.content.secondary:t.COLORS.content.primary};
73
+ text-decoration: ${e=>e.completed?"line-through":"none"};
74
+ `,r.default.p`
75
+ margin: 0;
76
+ font-size: 12px;
77
+ font-weight: 400;
78
+ line-height: 16px;
79
+ color: ${t.COLORS.content.secondary};
80
+ opacity: ${e=>e.completed?.6:1};
81
+ `;const a=r.default.div`
82
+ border-radius: 8px;
83
+ border: 1px solid
84
+ ${e=>e.isActive?t.COLORS.stroke.primary:"#E0E0E0"};
85
+ padding: 16px;
86
+ display: flex;
87
+ flex-direction: column;
88
+ gap: 12px;
89
+ background: ${t.COLORS.surface.standard};
90
+ transition: all 0.2s ease;
91
+
92
+ &:hover {
93
+ border-color: ${e=>e.isActive?t.COLORS.stroke.primary:"#D0D0D0"};
94
+ }
95
+ `,d=r.default.div`
96
+ display: flex;
97
+ align-items: center;
98
+ gap: 16px;
99
+ width: 100%;
100
+ `,p=r.default.div`
101
+ display: flex;
102
+ align-items: center;
103
+ justify-content: center;
104
+ flex-shrink: 0;
105
+ `,s=r.default.div`
106
+ display: flex;
107
+ flex-direction: column;
108
+ gap: 4px;
109
+ flex: 1;
110
+ `,c=r.default.div`
111
+ font-size: 16px;
112
+ font-weight: 600;
113
+ line-height: 24px;
114
+ color: ${e=>e.completed?t.COLORS.background.positive.vibrant:e.isActive?t.COLORS.content.primary:t.COLORS.content.placeholder} !important;
115
+ margin: 0;
116
+ display: flex;
117
+ flex-direction: row;
118
+ gap: 12px;
119
+ `,x=r.default.div`
120
+ font-size: 14px;
121
+ font-weight: 400;
122
+ line-height: 20px;
123
+ color: ${e=>e.isActive?t.COLORS.content.secondary:t.COLORS.content.placeholder};
124
+ margin: 0;
125
+ `,f=r.default.div`
126
+ display: flex;
127
+ align-items: center;
128
+ gap: 8px;
129
+ flex-shrink: 0;
130
+ `,u=r.default.div`
131
+ width: 100%;
132
+ margin-top: 8px;
133
+ `;exports.HeaderSection=l,exports.ProgressBarSection=n,exports.ProgressChecklistContainer=o,exports.SingleChecklistActionWrapper=f,exports.SingleChecklistAlertRow=u,exports.SingleChecklistContent=s,exports.SingleChecklistHeader=c,exports.SingleChecklistIconWrapper=p,exports.SingleChecklistItem=a,exports.SingleChecklistMainRow=d,exports.SingleChecklistSubheader=x;
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ interface StepItem {
3
+ id?: string;
4
+ text: string;
5
+ label?: string;
6
+ onClick?: () => void;
7
+ isCompleted?: boolean;
8
+ }
9
+ interface ProgressStepperProps {
10
+ steps?: StepItem[];
11
+ onStepClick?: (id: string) => void;
12
+ isStepperActive?: boolean;
13
+ }
14
+ declare const _default: React.NamedExoticComponent<ProgressStepperProps>;
15
+ export default _default;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../../constants/Theme.js"),l=require("../button/Button.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=n(t);const s=n=>{let{steps:s=[],onStepClick:o,isStepperActive:r}=n;var a,c;const u=s.length>0?s:[{id:"step-1",text:"Step One"},{id:"step-2",text:"Step Two"},{id:"step-3",text:"Step Three"}],[p,x]=t.useState(null!==(c=null===(a=u[0])||void 0===a?void 0:a.id)&&void 0!==c?c:null);return e.jsx("div",Object.assign({style:{paddingLeft:52}},{children:e.jsx("div",Object.assign({style:{margin:0,padding:0,display:"flex",flexDirection:"column",gap:12}},{children:u.map(((t,n)=>{var s,a,c,h,v,g,f;return e.jsxs(d.default.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(()=>{var i;const l=(0===n||(null===(i=u[n-1])||void 0===i?void 0:i.isCompleted))&&!0===r;return!0===t.isCompleted?e.jsx("div",Object.assign({style:{width:24,height:24,flex:"0 0 24px"},"aria-hidden":!0},{children:e.jsxs("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("rect",{x:"0.5",y:"0.5",width:"23",height:"23",rx:"11.5",fill:"#EFE6F9"}),e.jsx("rect",{x:"0.5",y:"0.5",width:"23",height:"23",rx:"11.5",stroke:"#4B1583"}),e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M17.8047 7.52851C18.0651 7.78886 18.0651 8.21097 17.8047 8.47132L10.4714 15.8047C10.2111 16.065 9.78894 16.065 9.5286 15.8047L6.19526 12.4713C5.93491 12.211 5.93491 11.7889 6.19526 11.5285C6.45561 11.2682 6.87772 11.2682 7.13807 11.5285L10 14.3904L16.8619 7.52851C17.1223 7.26816 17.5444 7.26816 17.8047 7.52851Z",fill:"#4B1583"})]}))})):e.jsx("div",Object.assign({style:{width:24,height:24,borderRadius:30,padding:4,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box",background:l?"#4B1583":"transparent",color:l?"#FFFFFF":"#BDBDBD",border:"1px solid "+(l?"#4B1583":"#E0E0E0"),fontSize:12,lineHeight:"12px",flex:"0 0 24px"},"aria-hidden":!0},{children:e.jsx("span",Object.assign({style:{fontSize:12,fontWeight:500}},{children:n+1}))}))})(),e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"flex-start",minWidth:0},"aria-label":`Open ${null!==(a=null!==(s=t.label)&&void 0!==s?s:t.text)&&void 0!==a?a:`step ${n+1}`}`},{children:e.jsx(l.Button,{buttonText:null!==(h=null!==(c=t.label)&&void 0!==c?c:t.text)&&void 0!==h?h:`Step ${n+1}`,buttonType:"text",buttonTextColor:t.isCompleted?i.COLORS.text.secondary:0!==n&&!0!==(null===(v=u[n-1])||void 0===v?void 0:v.isCompleted)||!r?i.COLORS.content.inactive:"#4B1583",matchParentWidth:!1,size:"small",style:{width:"fit-content",paddingLeft:0,textDecoration:"none",textDecorationLine:"none"},onClick:()=>{var e,i;x(null!==(e=t.id)&&void 0!==e?e:p),t.isCompleted||!r||0!==n&&!0!==(null===(i=u[n-1])||void 0===i?void 0:i.isCompleted)||(t.onClick?t.onClick():t.id&&(null==o||o(t.id)))}})})),!t.isCompleted&&(0===n||!0===(null===(g=u[n-1])||void 0===g?void 0:g.isCompleted))&&r&&e.jsx("div",Object.assign({style:{width:20,height:20,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},"aria-hidden":!0,onClick:e=>{var i,l;x(null!==(i=t.id)&&void 0!==i?i:p),t.isCompleted||!r||0!==n&&!0!==(null===(l=u[n-1])||void 0===l?void 0:l.isCompleted)||(t.onClick?t.onClick():t.id&&(null==o||o(t.id)))}},{children:e.jsx("svg",Object.assign({width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M5.83333 6.66667C5.3731 6.66667 5 6.29357 5 5.83333C5 5.3731 5.3731 5 5.83333 5H14.1667C14.6269 5 15 5.3731 15 5.83333V14.1667C15 14.6269 14.6269 15 14.1667 15C13.7064 15 13.3333 14.6269 13.3333 14.1667V7.84518L6.42259 14.7559C6.09715 15.0814 5.56951 15.0814 5.24408 14.7559C4.91864 14.4305 4.91864 13.9028 5.24408 13.5774L12.1548 6.66667H5.83333Z",fill:"#4B1583"})}))}))]})),n!==u.length-1&&e.jsx("div",{"aria-hidden":!0,style:{width:8,height:1,borderRadius:2,background:"#BDBDBD",transform:"rotate(90deg)",marginLeft:8}})]},null!==(f=t.id)&&void 0!==f?f:`step-${n}`)}))}))}))};var o=d.default.memo(s);exports.default=o;
@@ -0,0 +1,19 @@
1
+ import React from 'react';
2
+ interface TagProps {
3
+ tagText: string | number;
4
+ variant?: 'regular' | 'circle' | 'compressed';
5
+ type?: 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey' | 'ai';
6
+ theme?: 'light' | 'dark';
7
+ }
8
+ interface SimpleChecklistItemProps {
9
+ header: string;
10
+ subheader?: string;
11
+ icon?: React.ReactNode;
12
+ activeIcon?: React.ReactNode;
13
+ completedIcon?: React.ReactNode;
14
+ isActive?: boolean;
15
+ isCompleted?: boolean;
16
+ tag?: TagProps;
17
+ }
18
+ declare const SimpleChecklistItem: React.FC<SimpleChecklistItemProps>;
19
+ export default SimpleChecklistItem;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/ActiveChecklistIcon.js"),t=require("../../assets/icons/CompletedChecklistIcon.js"),i=require("../../assets/icons/InactiveChecklistIcon.js"),c=require("../tag/Tag.js"),l=require("./ProgressChecklist.style.js");exports.default=n=>{let{header:r,subheader:a,icon:o,activeIcon:h,completedIcon:d,isActive:j,isCompleted:g,tag:u}=n;return e.jsx("div",{children:e.jsxs(l.SingleChecklistMainRow,{children:[e.jsx(l.SingleChecklistIconWrapper,{children:g?null!=d?d:e.jsx(t.CompletedChecklistIcon,{}):j?null!=h?h:e.jsx(s.ActiveChecklistIcon,{}):null!=o?o:e.jsx(i.InactiveChecklistIcon,{})}),e.jsxs(l.SingleChecklistContent,{children:[e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:12}},{children:[e.jsx(l.SingleChecklistHeader,Object.assign({completed:g,isActive:j},{children:r})),(null==u?void 0:u.tagText)&&e.jsx(c.Tag,{tagText:u.tagText,variant:u.variant,type:u.type,theme:u.theme})]})),a&&e.jsx(l.SingleChecklistSubheader,Object.assign({isActive:j},{children:a}))]})]})})};
@@ -0,0 +1,2 @@
1
+ export { default as ProgressChecklist } from './ProgressChecklist';
2
+ export type { ChecklistItemType } from './ProgressChecklist';
@@ -36,7 +36,7 @@ export declare class MetaCustomProcessor {
36
36
  value: {
37
37
  operator: string;
38
38
  dataType: import("../types").QueryBuilderConnectorType;
39
- value?: string | number | string[] | number[] | Date | Date[] | undefined;
39
+ value?: string | number | Date | string[] | number[] | Date[] | undefined;
40
40
  };
41
41
  key: string;
42
42
  refresh?: boolean | undefined;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),o=require("react"),n=require("react-joyride");require("./constants/animations.js");var a=require("./constants/selectors.js"),r=require("./hooks/useFeatureAnnouncements.js"),i=require("./MajorUpdatePopup.js"),s=require("./MinorUpdatePopup.js"),l=require("./VideoModal.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=d(n);exports.default=d=>{let{children:c,fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:b,markFeatureAsViewedForStore:g,isFeatureApplicableToCurrentPage:m,module:h,router:y,storeId:S,onAnnouncementShown:x,onAnnouncementInteracted:C}=d;var k;const{majorUpdateFeatures:T,minorUpdateFeatures:v,isLoading:w,markFeatureAsViewed:I}=r.useFeatureAnnouncements({fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:b,markFeatureAsViewedForStore:g,isFeatureApplicableToCurrentPage:m,module:h,router:y}),[B,j]=o.useState(null),[E,F]=o.useState(null),[N,q]=o.useState(!1),[P,_]=o.useState([]),[O,U]=o.useState(!1),[W,V]=o.useState([]),[M,A]=o.useState(!1),[L,R]=o.useState(!1),[$,z]=o.useState([]),[H,Z]=o.useState(!1),[D,G]=o.useState(!1),[J,K]=o.useState(!1),[Q,X]=o.useState(""),[Y,ee]=o.useState(!1),[te,oe]=o.useState(!1),[ne,ae]=o.useState(!1),[re,ie]=o.useState(0),[se,le]=o.useState(0),[de,ue]=o.useState(new Set);o.useEffect((()=>{const e="minor-spotlight-cutout-style";let t=document.getElementById(e);return t||(t=document.createElement("style"),t.id=e,document.head.appendChild(t)),t.textContent="\n\t\t\t.react-joyride__spotlight {\n\t\t\t\ttransition: box-shadow 0.3s ease-in-out !important;\n\t\t\t\twill-change: box-shadow, transform;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__tooltip {\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__floater {\n\t\t\t\tright: 12px !important;\n\t\t\t\tleft: auto !important;\n\t\t\t}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),o.useEffect((()=>{ie((e=>e+1)),le((e=>e+1)),oe(!1),ae(!1),ue(new Set)}),[null==y?void 0:y.pathname]),o.useEffect((()=>{if(!(T.length>0)||B||w||M||Y)0!==T.length||w||G(!0);else{G(!1),Z(!1),q(!1),_([]),F(null),z([]);let e=0;const t=10,o=()=>{e++;document.querySelector('[data-testid="whats-new-button"]')?ce(T[0]):e<t?setTimeout(o,1e3):G(!0)};o()}}),[T,B,w,M,Y]),o.useEffect((()=>{var e;const t=null===(e=null==y?void 0:y.query)||void 0===e?void 0:e.featureId;if(!t||w||0===v.length)return;const o=v.find((e=>e.id===t));if(!o||!o.featureTag)return;Z(!0),R(!0);let n=0;const a=setInterval((()=>{n++;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){const e=[o];z(e),Se(o,e),clearInterval(a)}else n>=25&&(R(!1),clearInterval(a))}),200);return()=>{clearInterval(a)}}),[v,null===(k=null==y?void 0:y.query)||void 0===k?void 0:k.featureId,w]),o.useEffect((()=>{var e;if(v.length>0&&!w&&!N&&!L&&!E&&!H&&D&&!Y){let e=null,t=null,o=null,n=!1;const a=()=>{if(n||L||E||H||!D)return;const a=v.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(de.has(e.id))return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));a.length>0&&(z(a),Se(a[0],a),e&&(e.disconnect(),e=null),t&&(window.removeEventListener("scroll",t),t=null),o&&(clearTimeout(o),o=null))};return e=new MutationObserver((e=>{let t=!1;for(const o of e){if("childList"===o.type&&o.addedNodes.length>0)for(let e=0;e<o.addedNodes.length;e++){const n=o.addedNodes[e];if(n.nodeType===Node.ELEMENT_NODE){const e=n;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}N||n||L||E||H||!D||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||L||E||H||!D||a()}),200))})),t=()=>{N||n||L||E||H||!D||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||L||E||H||!D||a()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),a(),setTimeout((()=>{n||L||E||H||!D||a()}),100),setTimeout((()=>{n||L||E||H||!D||a()}),1e3),setTimeout((()=>{n||L||E||H||!D||a()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===v.length||w){(null===(e=null==y?void 0:y.query)||void 0===e?void 0:e.featureId)&&E||(q(!1),_([]),F(null),z([]),Z(!1))}}),[v,w,N,L,E,H,D,I,Y]);const ce=e=>{j(e);const o=T.findIndex((t=>t.id===e.id)),n=T.length,r=[{target:a.SELECTORS.WHATS_NEW_BUTTON,content:t.jsx(i.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>pe(e),onExplore:()=>fe(e),onPrevious:()=>be(e),onNext:()=>ge(e),setIsClosing:oe}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];V(r),U(!0),x&&S&&x({storeId:S,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo})},pe=o.useCallback((e=>{const t=e||B;t&&(A(!0),T.forEach((e=>{I(e.id)})),U(!1),j(null),V([]),G(!0),C&&S&&C({storeId:S,announcementId:t.id,announcementTitle:t.title,imageUrl:t.displayImage||t.image,videoUrl:t.productVideo,buttonClicked:"Skip",buttonName:"Skip",buttonUrl:void 0}),setTimeout((()=>{A(!1)}),500))}),[B,T,I]),fe=o.useCallback((e=>{A(!0),I(e.id),e.productVideo&&(X(e.productVideo),K(!0),ee(!0)),U(!1),j(null),V([]);T.findIndex((t=>t.id===e.id))===T.length-1&&G(!0),C&&S&&C({storeId:S,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo,buttonClicked:"Primary",buttonName:e.buttonText||"Explore",buttonUrl:e.redirectUrl||e.productVideo}),setTimeout((()=>{A(!1)}),500)}),[T,I]),be=o.useCallback((e=>{const o=e||B;if(!o)return;const n=T.findIndex((e=>e.id===o.id));if(n>0){const e=T[n-1];j(e);const o=n-1,a=T.length,r=[{target:'[data-testid="whats-new-button"]',content:t.jsx(i.default,{feature:e,currentIndex:o,totalFeatures:a,onSkip:()=>pe(e),onExplore:()=>fe(e),onPrevious:()=>be(e),onNext:()=>ge(e),setIsClosing:oe}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];V(r)}}),[B,T]),ge=o.useCallback((e=>{const o=e||B;if(!o)return;const n=T.findIndex((e=>e.id===o.id));if(n<T.length-1){const e=T[n+1];j(e);const o=n+1,a=T.length,r=[{target:'[data-testid="whats-new-button"]',content:t.jsx(i.default,{feature:e,currentIndex:o,totalFeatures:a,onSkip:()=>pe(e),onExplore:()=>fe(e),onPrevious:()=>be(e),onNext:()=>ge(e),setIsClosing:oe}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];V(r)}else A(!0),I(o.id),U(!1),j(null),V([]),G(!0),setTimeout((()=>{A(!1)}),500)}),[B,T,I]),me=()=>{if(T.length>0&&!B){document.querySelector('[data-testid="whats-new-button"]')&&ce(T[0])}};o.useEffect((()=>(window.showMajorUpdatePopup=me,()=>{delete window.showMajorUpdatePopup})),[T,B]);const he=o.useCallback((e=>{const{action:t}=e;t===n.ACTIONS.CLOSE&&(B&&(A(!0),T.forEach((e=>{I(e.id)})),G(!0),setTimeout((()=>{A(!1)}),500)),U(!1),j(null),V([]))}),[B,T,I]),ye=o.useCallback((e=>{const{action:t}=e;if(t===n.ACTIONS.CLOSE){if(E){R(!0),I(E.id);$.findIndex((e=>e.id===E.id))===$.length-1&&Z(!0),setTimeout((()=>{R(!1)}),500)}q(!1),F(null),_([])}}),[E,$,I]),Se=(o,n)=>e.__awaiter(void 0,void 0,void 0,(function*(){F(o);const e=n||$,a=e.findIndex((e=>e.id===o.id)),r=e.length,i=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,l=document.querySelector(i);if(l)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(l,120)}catch(e){}const d=[{target:i,content:t.jsx(s.default,{feature:o,currentIndex:a,totalFeatures:r,onSkip:()=>xe(o),onExplore:()=>Ce(o),onPrevious:()=>ke(o),onNext:()=>Te(o),setIsClosing:ae}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:o,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];_(d),q(!0)})),xe=o.useCallback((e=>{const t=e||E;if(t){R(!0),I(t.id),ue((e=>new Set(e).add(t.id))),q(!1),F(null),_([]);const e=$.find((e=>e.id!==t.id&&!de.has(e.id)));setTimeout((()=>{R(!1),e?Se(e,$):Z(!0)}),500)}}),[E,$,I,de]),Ce=o.useCallback((e=>{R(!0),I(e.id),ue((t=>new Set(t).add(e.id))),e.productVideo&&(X(e.productVideo),K(!0),ee(!0)),q(!1),F(null),_([]);const t=$.find((t=>t.id!==e.id&&!de.has(t.id)));setTimeout((()=>{R(!1),t&&!e.productVideo?Se(t,$):t||Z(!0)}),500)}),[$,I,de]),ke=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||E;if(!e)return;const n=$.findIndex((t=>t.id===e.id));if(n>0){const e=$[n-1];F(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,a=document.querySelector(o);if(a)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(a,120)}catch(e){}const r=n-1,i=$.length,l=[{target:o,content:t.jsx(s.default,{feature:e,currentIndex:r,totalFeatures:i,onSkip:()=>xe(e),onExplore:()=>Ce(e),onPrevious:()=>ke(e),onNext:()=>Te(e),setIsClosing:ae}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];_(l)}}))),[E,$]),Te=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||E;if(!e)return;const n=$.findIndex((t=>t.id===e.id));if(n<$.length-1){const e=$[n+1];F(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,a=document.querySelector(o);if(a)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(a,120)}catch(e){}const r=n+1,i=$.length,l=[{target:o,content:t.jsx(s.default,{feature:e,currentIndex:r,totalFeatures:i,onSkip:()=>xe(e),onExplore:()=>Ce(e),onPrevious:()=>ke(e),onNext:()=>Te(e),setIsClosing:ae}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];_(l)}else R(!0),Z(!0),I(e.id),q(!1),F(null),_([]),setTimeout((()=>{R(!1)}),500)}))),[E,$,I]);return t.jsxs(t.Fragment,{children:[c,W.length>0&&t.jsx(u.default,{steps:W,run:O,continuous:!1,showProgress:!1,showSkipButton:!1,callback:he,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:te?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${re}`),P.length>0&&t.jsx(u.default,{steps:P,run:N,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ye,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ne?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:ne?"none":"0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"},tooltip:{borderRadius:"4px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonSkip:{display:"none"},buttonClose:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`minor-joyride-${se}`),t.jsx(l.VideoModal,{isOpen:J,videoUrl:Q,onClose:()=>{K(!1),X(""),ee(!1);const e=$.find((e=>!de.has(e.id)));e?setTimeout((()=>{Se(e,$)}),300):Z(!0)}})]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),o=require("react"),n=require("react-joyride");require("./constants/animations.js");var a=require("./constants/selectors.js"),r=require("./hooks/useFeatureAnnouncements.js"),s=require("./MajorUpdatePopup.js"),i=require("./MinorUpdatePopup.js"),l=require("./VideoModal.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=d(n);exports.default=d=>{let{children:c,fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:b,markFeatureAsViewedForStore:g,isFeatureApplicableToCurrentPage:h,module:m,router:y}=d;var S;const{majorUpdateFeatures:x,minorUpdateFeatures:C,isLoading:k,markFeatureAsViewed:T}=r.useFeatureAnnouncements({fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:b,markFeatureAsViewedForStore:g,isFeatureApplicableToCurrentPage:h,module:m,router:y}),[v,w]=o.useState(null),[B,j]=o.useState(null),[I,E]=o.useState(!1),[F,N]=o.useState([]),[q,P]=o.useState(!1),[O,W]=o.useState([]),[_,M]=o.useState(!1),[V,A]=o.useState(!1),[L,R]=o.useState([]),[U,$]=o.useState(!1),[z,H]=o.useState(!1),[Z,D]=o.useState(!1),[G,J]=o.useState(""),[K,Q]=o.useState(!1),[X,Y]=o.useState(!1),[ee,te]=o.useState(!1),[oe,ne]=o.useState(0),[ae,re]=o.useState(0),[se,ie]=o.useState(new Set);o.useEffect((()=>{const e="minor-spotlight-cutout-style";let t=document.getElementById(e);return t||(t=document.createElement("style"),t.id=e,document.head.appendChild(t)),t.textContent="\n\t\t\t.react-joyride__spotlight {\n\t\t\t\ttransition: box-shadow 0.3s ease-in-out !important;\n\t\t\t\twill-change: box-shadow, transform;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__tooltip {\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),o.useEffect((()=>{ne((e=>e+1)),re((e=>e+1)),Y(!1),te(!1),ie(new Set)}),[null==y?void 0:y.pathname]),o.useEffect((()=>{if(!(x.length>0)||v||k||_||K)0!==x.length||k||H(!0);else{H(!1),$(!1),E(!1),N([]),j(null),R([]);let e=0;const t=10,o=()=>{e++;document.querySelector('[data-testid="whats-new-button"]')?le(x[0]):e<t?setTimeout(o,1e3):H(!0)};o()}}),[x,v,k,_,K]),o.useEffect((()=>{var e;const t=null===(e=null==y?void 0:y.query)||void 0===e?void 0:e.featureId;if(!t||k||0===C.length)return;const o=C.find((e=>e.id===t));if(!o||!o.featureTag)return;$(!0),A(!0);let n=0;const a=setInterval((()=>{n++;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){const e=[o];R(e),he(o,e),clearInterval(a)}else n>=25&&(A(!1),clearInterval(a))}),200);return()=>{clearInterval(a)}}),[C,null===(S=null==y?void 0:y.query)||void 0===S?void 0:S.featureId,k]),o.useEffect((()=>{var e;if(C.length>0&&!k&&!I&&!V&&!B&&!U&&z&&!K){let e=null,t=null,o=null,n=!1;const a=()=>{if(n||V||B||U||!z)return;const a=C.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(se.has(e.id))return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));a.length>0&&(R(a),he(a[0],a),e&&(e.disconnect(),e=null),t&&(window.removeEventListener("scroll",t),t=null),o&&(clearTimeout(o),o=null))};return e=new MutationObserver((e=>{let t=!1;for(const o of e){if("childList"===o.type&&o.addedNodes.length>0)for(let e=0;e<o.addedNodes.length;e++){const n=o.addedNodes[e];if(n.nodeType===Node.ELEMENT_NODE){const e=n;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}I||n||V||B||U||!z||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||V||B||U||!z||a()}),200))})),t=()=>{I||n||V||B||U||!z||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||V||B||U||!z||a()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),a(),setTimeout((()=>{n||V||B||U||!z||a()}),100),setTimeout((()=>{n||V||B||U||!z||a()}),1e3),setTimeout((()=>{n||V||B||U||!z||a()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===C.length||k){(null===(e=null==y?void 0:y.query)||void 0===e?void 0:e.featureId)&&B||(E(!1),N([]),j(null),R([]),$(!1))}}),[C,k,I,V,B,U,z,T,K]);const le=e=>{w(e);const o=x.findIndex((t=>t.id===e.id)),n=x.length,r=[{target:a.SELECTORS.WHATS_NEW_BUTTON,content:t.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];W(r),P(!0)},de=o.useCallback((e=>{(e||v)&&(M(!0),x.forEach((e=>{T(e.id)})),P(!1),w(null),W([]),H(!0),setTimeout((()=>{M(!1)}),500))}),[v,x,T]),ue=o.useCallback((e=>{M(!0),T(e.id),e.productVideo&&(J(e.productVideo),D(!0),Q(!0)),P(!1),w(null),W([]);x.findIndex((t=>t.id===e.id))===x.length-1&&H(!0),setTimeout((()=>{M(!1)}),500)}),[x,T]),ce=o.useCallback((e=>{const o=e||v;if(!o)return;const n=x.findIndex((e=>e.id===o.id));if(n>0){const e=x[n-1];w(e);const o=n-1,a=x.length,r=[{target:'[data-testid="whats-new-button"]',content:t.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:a,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];W(r)}}),[v,x]),pe=o.useCallback((e=>{const o=e||v;if(!o)return;const n=x.findIndex((e=>e.id===o.id));if(n<x.length-1){const e=x[n+1];w(e);const o=n+1,a=x.length,r=[{target:'[data-testid="whats-new-button"]',content:t.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:a,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];W(r)}else M(!0),T(o.id),P(!1),w(null),W([]),H(!0),setTimeout((()=>{M(!1)}),500)}),[v,x,T]),fe=()=>{if(x.length>0&&!v){document.querySelector('[data-testid="whats-new-button"]')&&le(x[0])}};o.useEffect((()=>(window.showMajorUpdatePopup=fe,()=>{delete window.showMajorUpdatePopup})),[x,v]);const be=o.useCallback((e=>{const{action:t}=e;t===n.ACTIONS.CLOSE&&(v&&(M(!0),x.forEach((e=>{T(e.id)})),H(!0),setTimeout((()=>{M(!1)}),500)),P(!1),w(null),W([]))}),[v,x,T]),ge=o.useCallback((e=>{const{action:t}=e;if(t===n.ACTIONS.CLOSE){if(B){A(!0),T(B.id);L.findIndex((e=>e.id===B.id))===L.length-1&&$(!0),setTimeout((()=>{A(!1)}),500)}E(!1),j(null),N([])}}),[B,L,T]),he=(o,n)=>e.__awaiter(void 0,void 0,void 0,(function*(){j(o);const e=n||L,a=e.findIndex((e=>e.id===o.id)),r=e.length,s=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,l=document.querySelector(s);if(l)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(l,120)}catch(e){}const d=[{target:s,content:t.jsx(i.default,{feature:o,currentIndex:a,totalFeatures:r,onSkip:()=>me(o),onExplore:()=>ye(o),onPrevious:()=>Se(o),onNext:()=>xe(o),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:o,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];N(d),E(!0)})),me=o.useCallback((e=>{const t=e||B;if(t){A(!0),T(t.id),ie((e=>new Set(e).add(t.id))),E(!1),j(null),N([]);const e=L.find((e=>e.id!==t.id&&!se.has(e.id)));setTimeout((()=>{A(!1),e?he(e,L):$(!0)}),500)}}),[B,L,T,se]),ye=o.useCallback((e=>{A(!0),T(e.id),ie((t=>new Set(t).add(e.id))),e.productVideo&&(J(e.productVideo),D(!0),Q(!0)),E(!1),j(null),N([]);const t=L.find((t=>t.id!==e.id&&!se.has(t.id)));setTimeout((()=>{A(!1),t&&!e.productVideo?he(t,L):t||$(!0)}),500)}),[L,T,se]),Se=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||B;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n>0){const e=L[n-1];j(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,a=document.querySelector(o);if(a)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(a,120)}catch(e){}const r=n-1,s=L.length,l=[{target:o,content:t.jsx(i.default,{feature:e,currentIndex:r,totalFeatures:s,onSkip:()=>me(e),onExplore:()=>ye(e),onPrevious:()=>Se(e),onNext:()=>xe(e),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];N(l)}}))),[B,L]),xe=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||B;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n<L.length-1){const e=L[n+1];j(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,a=document.querySelector(o);if(a)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(a,120)}catch(e){}const r=n+1,s=L.length,l=[{target:o,content:t.jsx(i.default,{feature:e,currentIndex:r,totalFeatures:s,onSkip:()=>me(e),onExplore:()=>ye(e),onPrevious:()=>Se(e),onNext:()=>xe(e),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];N(l)}else A(!0),$(!0),T(e.id),E(!1),j(null),N([]),setTimeout((()=>{A(!1)}),500)}))),[B,L,T]);return t.jsxs(t.Fragment,{children:[c,O.length>0&&t.jsx(u.default,{steps:O,run:q,continuous:!1,showProgress:!1,showSkipButton:!1,callback:be,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:X?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${oe}`),F.length>0&&t.jsx(u.default,{steps:F,run:I,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ge,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ee?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:ee?"none":"0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"},tooltip:{borderRadius:"4px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonSkip:{display:"none"},buttonClose:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`minor-joyride-${ae}`),t.jsx(l.VideoModal,{isOpen:Z,videoUrl:G,onClose:()=>{D(!1),J(""),Q(!1);const e=L.find((e=>!se.has(e.id)));e?setTimeout((()=>{he(e,L)}),300):$(!0)}})]})};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("react"),n=require("./constants/index.js"),r=require("./styles/majorPopup.styles.js");require("../../constants/Theme.js"),require("./constants/animations.js");var s=require("./utils/htmlHelpers.js"),o=require("./utils/animationHelpers.js"),a=require("./utils/elementHelpers.js");exports.default=i=>{let{feature:l,currentIndex:c,totalFeatures:u,onSkip:d,onExplore:g,onPrevious:p,onNext:y,setIsClosing:j,onSecondaryAction:b,ratio:h="16:9",padding:x}=i;const[v,f]=e.useState(!1),[B,T]=e.useState(!1),[O,k]=e.useState(""),m=e.useRef(null),[w,E]=e.useState(!1),[L,C]=e.useState(!0),M=e.useRef(null);e.useEffect((()=>{v&&T(!0)}),[v]);const P=()=>{g(),o.hideJoyrideArrow(m.current);const t=a.findWhatsNewButton();if(t&&m.current){const e=o.calculateCloseTransform(m.current,t);k(e)}else k("scale(0)");null==j||j(!0),f(!0)},U=t=>{if(t.preventDefault(),t.stopPropagation(),l.secondaryButtonUrl){l.secondaryButtonUrl.startsWith("http")?window.open(l.secondaryButtonUrl,"_blank","noopener,noreferrer"):window.location.href=l.secondaryButtonUrl}b&&b(),o.hideJoyrideArrow(m.current);const e=a.findWhatsNewButton();if(e&&m.current){const t=o.calculateCloseTransform(m.current,e);k(t)}else k("scale(0)");null==j||j(!0),f(!0)},_=r.getMajorPopupStyles(B,O,h,x||l.padding,l.primaryButtonStyle,l.secondaryButtonStyle),W=t=>{t.stopPropagation(),M.current&&(M.current.paused?(M.current.play(),E(!1),C(!1)):(M.current.pause(),E(!0),C(!0)))};return t.jsxs("div",Object.assign({ref:m,style:_.container},{children:[t.jsx("style",{children:"\n\t\t\t\t[data-popup-content] ul {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding-left: 20px;\n\t\t\t\t\tlist-style-type: disc;\n\t\t\t\t}\n\t\t\t\t[data-popup-content] ul li {\n\t\t\t\t\tmargin-bottom: 8px;\n\t\t\t\t\tcolor: rgba(255, 255, 255, 0.8);\n\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\tline-height: 16px;\n\t\t\t\t\tfont-family: Inter, sans-serif;\n\t\t\t\t}\n\t\t\t"}),t.jsxs("div",Object.assign({style:_.contentWrapper},{children:[t.jsx("div",Object.assign({style:_.imageContainer},{children:l.productVideo?t.jsxs(t.Fragment,{children:[t.jsx("video",{ref:M,src:l.productVideo,style:_.image,autoPlay:!0,muted:!0,loop:!0,playsInline:!0,onClick:W,onPlay:()=>{C(!1)},onPause:()=>{C(!0)},"aria-label":`Product video for ${l.title}`}),(w||L)&&t.jsx("div",Object.assign({style:_.videoOverlay,onClick:W,role:"button",tabIndex:0,"aria-label":w?"Play video":"Pause video",onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),M.current&&(M.current.paused?(M.current.play(),E(!1),C(!1)):(M.current.pause(),E(!0),C(!0))))}},{children:t.jsx((()=>t.jsxs("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",stroke:"currentColor",strokeWidth:"0",strokeLinecap:"round",strokeLinejoin:"round",style:_.playIcon},{children:[t.jsx("circle",{cx:"12",cy:"12",r:"10",fill:"rgba(0,0,0,0.5)",stroke:"none"}),t.jsx("polygon",{points:"10 8 16 12 10 16 10 8",fill:"#fff",stroke:"none"})]}))),{})}))]}):l.displayImage?t.jsx("img",{src:l.displayImage,alt:l.title,style:_.image,onError:t=>{l.image&&(t.target.src=l.image)}}):t.jsx("div",Object.assign({style:_.imagePlaceholder},{children:n.TEXT.FEATURE_PREVIEW_PLACEHOLDER}))})),t.jsxs("div",Object.assign({style:_.contentContainer},{children:[t.jsx("div",Object.assign({style:_.skipButtonContainer},{children:t.jsx("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),(t=>{o.hideJoyrideArrow(m.current);const e=a.findWhatsNewButton();if(e&&m.current){const t=o.calculateCloseTransform(m.current,e);k(t)}else k("scale(0)");null==j||j(!0),f(!0),o.executeAfterAnimation(t)})(d)},style:_.skipButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,_.skipButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,_.skipButton.base),"aria-label":"Skip feature announcement"},{children:"Skip"}))})),t.jsx("h3",Object.assign({style:_.title},{children:l.title})),t.jsx("div",{"data-popup-content":!0,style:_.content,dangerouslySetInnerHTML:{__html:s.decodeHTMLEntities(l.content||l.body||"")}}),t.jsxs("div",Object.assign({style:_.actionsWrapper},{children:[t.jsxs("div",Object.assign({style:_.buttonsGroup},{children:[l.redirectUrl?t.jsx("a",Object.assign({href:l.redirectUrl,target:l.redirectUrl.startsWith("http")?"_blank":"_self",rel:l.redirectUrl.startsWith("http")?"noopener noreferrer":void 0,onClick:P,style:_.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,_.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,_.exploreButton.base)},{children:l.buttonText||n.TEXT.DEFAULT_BUTTON_TEXT})):t.jsx("button",Object.assign({onClick:P,style:_.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,_.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,_.exploreButton.base)},{children:l.buttonText||n.TEXT.DEFAULT_BUTTON_TEXT})),l.secondaryButtonText&&(l.secondaryButtonUrl?t.jsx("a",Object.assign({href:l.secondaryButtonUrl,target:l.secondaryButtonUrl.startsWith("http")?"_blank":"_self",rel:l.secondaryButtonUrl.startsWith("http")?"noopener noreferrer":void 0,onClick:U,style:_.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,_.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,_.secondaryButton.base)},{children:l.secondaryButtonText})):t.jsx("button",Object.assign({onClick:U,style:_.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,_.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,_.secondaryButton.base)},{children:l.secondaryButtonText})))]})),u>1&&t.jsxs("div",Object.assign({style:_.navigationContainer},{children:[t.jsx("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),p()},disabled:0===c,style:_.navigationButton(0===c).base,onMouseEnter:t=>{0!==c&&Object.assign(t.currentTarget.style,_.navigationButton(!1).hover)},onMouseLeave:t=>{0!==c&&Object.assign(t.currentTarget.style,_.navigationButton(!1).base)}},{children:t.jsx("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:t.jsx("path",{d:"M15 18L9 12L15 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}))})),t.jsx("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),y()},disabled:c===u-1,style:_.navigationButton(c===u-1).base,onMouseEnter:t=>{c!==u-1&&Object.assign(t.currentTarget.style,_.navigationButton(!1).hover)},onMouseLeave:t=>{c!==u-1&&Object.assign(t.currentTarget.style,_.navigationButton(c===u-1).base)}},{children:t.jsx("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:t.jsx("path",{d:"M9 18L15 12L9 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}))}))]}))]}))]}))]}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("./constants/index.js"),n=require("./styles/majorPopup.styles.js");require("../../constants/Theme.js"),require("./constants/animations.js");var r=require("./utils/htmlHelpers.js"),a=require("./utils/animationHelpers.js"),i=require("./utils/elementHelpers.js");exports.default=o=>{let{feature:l,currentIndex:u,totalFeatures:c,onSkip:g,onExplore:j,onPrevious:d,onNext:b,setIsClosing:T}=o;const[y,p]=t.useState(!1),[v,x]=t.useState(!1),[O,h]=t.useState(""),E=t.useRef(null);t.useEffect((()=>{y&&x(!0)}),[y]);const m=n.getMajorPopupStyles(v,O);return e.jsxs("div",Object.assign({ref:E,style:m.container},{children:[e.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),(e=>{a.hideJoyrideArrow(E.current);const t=i.findWhatsNewButton();if(t&&E.current){const e=a.calculateCloseTransform(E.current,t);h(e)}else h("scale(0)");null==T||T(!0),p(!0),a.executeAfterAnimation(e)})(g)},style:m.skipButton.base,onMouseEnter:e=>Object.assign(e.currentTarget.style,m.skipButton.hover),onMouseLeave:e=>Object.assign(e.currentTarget.style,m.skipButton.base)},{children:s.TEXT.SKIP_BUTTON})),e.jsx("div",Object.assign({style:m.imageContainer},{children:l.displayImage?e.jsx("img",{src:l.displayImage,alt:l.title,style:m.image,onError:e=>{l.image&&(e.target.src=l.image)}}):e.jsx("div",Object.assign({style:m.imagePlaceholder},{children:s.TEXT.FEATURE_PREVIEW_PLACEHOLDER}))})),e.jsxs("div",Object.assign({style:m.contentContainer},{children:[e.jsxs("div",{children:[e.jsx("h3",Object.assign({style:m.title},{children:l.title})),e.jsx("div",{style:m.content,dangerouslySetInnerHTML:{__html:r.decodeHTMLEntities(l.content||l.body||"")}}),e.jsx("button",Object.assign({onClick:()=>{j(),a.hideJoyrideArrow(E.current);const e=i.findWhatsNewButton();if(e&&E.current){const t=a.calculateCloseTransform(E.current,e);h(t)}else h("scale(0)");null==T||T(!0),p(!0)},style:m.exploreButton.base,onMouseEnter:e=>Object.assign(e.currentTarget.style,m.exploreButton.hover),onMouseLeave:e=>Object.assign(e.currentTarget.style,m.exploreButton.base)},{children:l.buttonText||s.TEXT.DEFAULT_BUTTON_TEXT}))]}),c>1&&e.jsxs("div",Object.assign({style:m.navigationContainer},{children:[e.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),d()},disabled:0===u,style:m.navigationButton(0===u).base,onMouseEnter:e=>{0!==u&&Object.assign(e.currentTarget.style,m.navigationButton(!1).hover)},onMouseLeave:e=>{0!==u&&Object.assign(e.currentTarget.style,m.navigationButton(!1).base)}},{children:s.TEXT.NAVIGATION_PREVIOUS})),e.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),b()},disabled:u===c-1,style:m.navigationButton(u===c-1).base,onMouseEnter:e=>{u!==c-1&&Object.assign(e.currentTarget.style,m.navigationButton(!1).hover)},onMouseLeave:e=>{u!==c-1&&Object.assign(e.currentTarget.style,m.navigationButton(u===c-1).base)}},{children:s.TEXT.NAVIGATION_NEXT}))]}))]}))]}))};