@bikdotai/bik-component-library 0.0.721-beta.20 → 0.0.721-beta.21

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 (101) hide show
  1. package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
  2. package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.d.ts +1 -11
  3. package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
  4. package/dist/cjs/components/feature-announcements/MajorUpdatePopup.d.ts +1 -11
  5. package/dist/cjs/components/feature-announcements/MajorUpdatePopup.js +1 -1
  6. package/dist/cjs/components/feature-announcements/MinorUpdatePopup.d.ts +1 -11
  7. package/dist/cjs/components/feature-announcements/MinorUpdatePopup.js +1 -1
  8. package/dist/cjs/components/feature-announcements/VideoModal.d.ts +1 -6
  9. package/dist/cjs/components/feature-announcements/VideoModal.js +1 -1
  10. package/dist/cjs/components/feature-announcements/constants/animations.d.ts +27 -0
  11. package/dist/cjs/components/feature-announcements/constants/animations.js +1 -0
  12. package/dist/cjs/components/feature-announcements/constants/dimensions.d.ts +56 -0
  13. package/dist/cjs/components/feature-announcements/constants/dimensions.js +1 -0
  14. package/dist/cjs/components/feature-announcements/constants/index.d.ts +19 -0
  15. package/dist/cjs/components/feature-announcements/constants/index.js +1 -0
  16. package/dist/cjs/components/feature-announcements/constants/localStorageKeys.d.ts +18 -0
  17. package/dist/cjs/components/feature-announcements/constants/localStorageKeys.js +1 -0
  18. package/dist/cjs/components/feature-announcements/constants/selectors.d.ts +21 -0
  19. package/dist/cjs/components/feature-announcements/constants/selectors.js +1 -0
  20. package/dist/cjs/components/feature-announcements/constants/zIndex.d.ts +10 -0
  21. package/dist/cjs/components/feature-announcements/constants/zIndex.js +1 -0
  22. package/dist/cjs/components/feature-announcements/hooks/index.d.ts +1 -0
  23. package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts +13 -0
  24. package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.js +1 -0
  25. package/dist/cjs/components/feature-announcements/index.d.ts +3 -2
  26. package/dist/cjs/components/feature-announcements/styles/index.d.ts +4 -0
  27. package/dist/cjs/components/feature-announcements/styles/joyride.styles.d.ts +120 -0
  28. package/dist/cjs/components/feature-announcements/styles/joyride.styles.js +1 -0
  29. package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.d.ts +23 -0
  30. package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.js +1 -0
  31. package/dist/cjs/components/feature-announcements/styles/minorPopup.styles.d.ts +16 -0
  32. package/dist/cjs/components/feature-announcements/styles/minorPopup.styles.js +1 -0
  33. package/dist/cjs/components/feature-announcements/styles/videoModal.styles.d.ts +13 -0
  34. package/dist/cjs/components/feature-announcements/styles/videoModal.styles.js +1 -0
  35. package/dist/cjs/components/feature-announcements/types/feature.types.d.ts +40 -0
  36. package/dist/cjs/components/feature-announcements/types/index.d.ts +4 -0
  37. package/dist/cjs/components/feature-announcements/types/props.types.d.ts +43 -0
  38. package/dist/cjs/components/feature-announcements/types/repository.types.d.ts +11 -0
  39. package/dist/cjs/components/feature-announcements/types/router.types.d.ts +7 -0
  40. package/dist/cjs/components/feature-announcements/useFeatureAnnouncements.d.ts +3 -14
  41. package/dist/cjs/components/feature-announcements/utils/animationHelpers.d.ts +18 -0
  42. package/dist/cjs/components/feature-announcements/utils/animationHelpers.js +1 -0
  43. package/dist/cjs/components/feature-announcements/utils/elementHelpers.d.ts +17 -0
  44. package/dist/cjs/components/feature-announcements/utils/elementHelpers.js +1 -0
  45. package/dist/cjs/components/feature-announcements/utils/htmlHelpers.d.ts +18 -0
  46. package/dist/cjs/components/feature-announcements/utils/htmlHelpers.js +1 -0
  47. package/dist/cjs/components/feature-announcements/utils/index.d.ts +3 -0
  48. package/dist/cjs/index.js +1 -1
  49. package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
  50. package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.d.ts +1 -11
  51. package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
  52. package/dist/esm/components/feature-announcements/MajorUpdatePopup.d.ts +1 -11
  53. package/dist/esm/components/feature-announcements/MajorUpdatePopup.js +1 -1
  54. package/dist/esm/components/feature-announcements/MinorUpdatePopup.d.ts +1 -11
  55. package/dist/esm/components/feature-announcements/MinorUpdatePopup.js +1 -1
  56. package/dist/esm/components/feature-announcements/VideoModal.d.ts +1 -6
  57. package/dist/esm/components/feature-announcements/VideoModal.js +1 -1
  58. package/dist/esm/components/feature-announcements/constants/animations.d.ts +27 -0
  59. package/dist/esm/components/feature-announcements/constants/animations.js +1 -0
  60. package/dist/esm/components/feature-announcements/constants/dimensions.d.ts +56 -0
  61. package/dist/esm/components/feature-announcements/constants/dimensions.js +1 -0
  62. package/dist/esm/components/feature-announcements/constants/index.d.ts +19 -0
  63. package/dist/esm/components/feature-announcements/constants/index.js +1 -0
  64. package/dist/esm/components/feature-announcements/constants/localStorageKeys.d.ts +18 -0
  65. package/dist/esm/components/feature-announcements/constants/localStorageKeys.js +1 -0
  66. package/dist/esm/components/feature-announcements/constants/selectors.d.ts +21 -0
  67. package/dist/esm/components/feature-announcements/constants/selectors.js +1 -0
  68. package/dist/esm/components/feature-announcements/constants/zIndex.d.ts +10 -0
  69. package/dist/esm/components/feature-announcements/constants/zIndex.js +1 -0
  70. package/dist/esm/components/feature-announcements/hooks/index.d.ts +1 -0
  71. package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts +13 -0
  72. package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.js +1 -0
  73. package/dist/esm/components/feature-announcements/index.d.ts +3 -2
  74. package/dist/esm/components/feature-announcements/styles/index.d.ts +4 -0
  75. package/dist/esm/components/feature-announcements/styles/joyride.styles.d.ts +120 -0
  76. package/dist/esm/components/feature-announcements/styles/joyride.styles.js +1 -0
  77. package/dist/esm/components/feature-announcements/styles/majorPopup.styles.d.ts +23 -0
  78. package/dist/esm/components/feature-announcements/styles/majorPopup.styles.js +1 -0
  79. package/dist/esm/components/feature-announcements/styles/minorPopup.styles.d.ts +16 -0
  80. package/dist/esm/components/feature-announcements/styles/minorPopup.styles.js +1 -0
  81. package/dist/esm/components/feature-announcements/styles/videoModal.styles.d.ts +13 -0
  82. package/dist/esm/components/feature-announcements/styles/videoModal.styles.js +1 -0
  83. package/dist/esm/components/feature-announcements/types/feature.types.d.ts +40 -0
  84. package/dist/esm/components/feature-announcements/types/index.d.ts +4 -0
  85. package/dist/esm/components/feature-announcements/types/props.types.d.ts +43 -0
  86. package/dist/esm/components/feature-announcements/types/repository.types.d.ts +11 -0
  87. package/dist/esm/components/feature-announcements/types/router.types.d.ts +7 -0
  88. package/dist/esm/components/feature-announcements/useFeatureAnnouncements.d.ts +3 -14
  89. package/dist/esm/components/feature-announcements/utils/animationHelpers.d.ts +18 -0
  90. package/dist/esm/components/feature-announcements/utils/animationHelpers.js +1 -0
  91. package/dist/esm/components/feature-announcements/utils/elementHelpers.d.ts +17 -0
  92. package/dist/esm/components/feature-announcements/utils/elementHelpers.js +1 -0
  93. package/dist/esm/components/feature-announcements/utils/htmlHelpers.d.ts +18 -0
  94. package/dist/esm/components/feature-announcements/utils/htmlHelpers.js +1 -0
  95. package/dist/esm/components/feature-announcements/utils/index.d.ts +3 -0
  96. package/dist/esm/index.js +1 -1
  97. package/package.json +1 -1
  98. package/dist/cjs/components/feature-announcements/FeatureAnnouncement.types.d.ts +0 -27
  99. package/dist/cjs/components/feature-announcements/useFeatureAnnouncements.js +0 -1
  100. package/dist/esm/components/feature-announcements/FeatureAnnouncement.types.d.ts +0 -27
  101. package/dist/esm/components/feature-announcements/useFeatureAnnouncements.js +0 -1
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -1,14 +1,4 @@
1
1
  import React from 'react';
2
- import { FeatureAnnouncementRepoInjected, RouterProps } from './useFeatureAnnouncements';
3
- interface FeatureAnnouncementProviderProps {
4
- children: React.ReactNode;
5
- fetchVisibleFeatures: FeatureAnnouncementRepoInjected['fetchVisibleFeatures'];
6
- getStoreFeatureProgress: FeatureAnnouncementRepoInjected['getStoreFeatureProgress'];
7
- fetchFeatureById: FeatureAnnouncementRepoInjected['fetchFeatureById'];
8
- markFeatureAsViewedForStore: FeatureAnnouncementRepoInjected['markFeatureAsViewedForStore'];
9
- isFeatureApplicableToCurrentPage: FeatureAnnouncementRepoInjected['isFeatureApplicableToCurrentPage'];
10
- module?: string;
11
- router?: RouterProps;
12
- }
2
+ import { FeatureAnnouncementProviderProps } from './types';
13
3
  declare const FeatureAnnouncementProvider: React.FC<FeatureAnnouncementProviderProps>;
14
4
  export default FeatureAnnouncementProvider;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),o=require("react-joyride"),n=require("./MajorUpdatePopup.js"),a=require("./MinorUpdatePopup.js"),r=require("./useFeatureAnnouncements.js"),s=require("./VideoModal.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(o);const u="#007bff";exports.default=i=>{let{children:d,fetchVisibleFeatures:c,getStoreFeatureProgress:p,fetchFeatureById:f,markFeatureAsViewedForStore:g,isFeatureApplicableToCurrentPage:b,module:h,router:x}=i;var m;const{majorUpdateFeatures:y,minorUpdateFeatures:C,isLoading:k,markFeatureAsViewed:S}=r.useFeatureAnnouncements({fetchVisibleFeatures:c,getStoreFeatureProgress:p,fetchFeatureById:f,markFeatureAsViewedForStore:g,isFeatureApplicableToCurrentPage:b,module:h,router:x}),[T,w]=t.useState(null),[j,v]=t.useState(null),[E,B]=t.useState(!1),[F,I]=t.useState([]),[N,M]=t.useState(!1),[R,P]=t.useState([]),[q,O]=t.useState(!1),[W,L]=t.useState(!1),[A,U]=t.useState([]),[V,$]=t.useState(!1),[_,z]=t.useState(!1),[J,D]=t.useState(!1),[Q,G]=t.useState(""),[H,K]=t.useState(!1),[X,Y]=t.useState(!1),[Z,ee]=t.useState(!1);t.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}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),t.useEffect((()=>{console.log("📋 joyrideSteps changed:",{length:F.length,runJoyride:E})}),[F,E]),t.useEffect((()=>{console.log("🎯 currentMinorFeature changed:",{id:(null==j?void 0:j.id)||"null"})}),[j]),t.useEffect((()=>{if(!(y.length>0)||T||k||q||H)0!==y.length||k||z(!0);else{z(!1),$(!1),B(!1),I([]),v(null),U([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?te(y[0]):setTimeout(e,1e3)};e()}}),[y,T,k,q,H]),t.useEffect((()=>{var e;const t=null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId;if(console.log("🧪 Test mode effect triggered:",{featureIdFromQuery:t,isLoading:k,minorUpdateFeaturesCount:C.length}),!t||k||0===C.length)return;const o=C.find((e=>e.id===t));if(!o||!o.featureTag)return;$(!0),L(!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)){console.log("✨ Test mode: Element found, showing joyride");const e=[o];U(e),ue(o,e),clearInterval(a)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),L(!1),clearInterval(a))}),200);return()=>{clearInterval(a)}}),[C,null===(m=null==x?void 0:x.query)||void 0===m?void 0:m.featureId,k]),t.useEffect((()=>{var e;if(console.log("🔍 Main minor effect check:",{minorUpdateFeaturesCount:C.length,isLoading:k,runJoyride:E,isProcessingMinorUpdate:W,currentMinorFeature:(null==j?void 0:j.id)||"null",minorFeaturesSkipped:V,showMinorUpdates:_,blockPopups:H}),C.length>0&&!k&&!E&&!W&&!j&&!V&&_&&!H){let e=null,t=null,o=null,n=!1;const a=()=>{if(n||W||j||V||!_)return;const a=C.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())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&&(console.log("🎉 Found available features:",a.length),U(a),ue(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}E||n||W||j||V||!_||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||W||j||V||!_||a()}),200))})),t=()=>{E||n||W||j||V||!_||(o&&clearTimeout(o),o=setTimeout((()=>{n||W||j||V||!_||a()}),300))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),a(),setTimeout((()=>{n||W||j||V||!_||a()}),100),setTimeout((()=>{n||W||j||V||!_||a()}),1e3),setTimeout((()=>{n||W||j||V||!_||a()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===C.length||k){(null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId)&&j?console.log("🚫 Skipping joyride clear - test mode with active feature"):(console.log("🗑️ Clearing joyride - no features or loading"),B(!1),I([]),v(null),U([]),$(!1))}}),[C,k,E,W,j,V,_,S,H]);const te=t=>{w(t);const o=y.findIndex((e=>e.id===t.id)),a=y.length,r=[{target:'[data-testid="whats-new-button"]',content:e.jsxRuntimeExports.jsx(n.default,{feature:t,currentIndex:o,totalFeatures:a,onSkip:()=>oe(t),onExplore:()=>ne(t),onPrevious:()=>ae(t),onNext:()=>re(t),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,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"}}}];P(r),M(!0)},oe=t.useCallback((e=>{(e||T)&&(O(!0),y.forEach((e=>{S(e.id)})),M(!1),w(null),P([]),z(!0),setTimeout((()=>{O(!1)}),500))}),[T,y,S]),ne=t.useCallback((e=>{O(!0),S(e.id),e.productVideo&&(G(e.productVideo),D(!0),K(!0)),M(!1),w(null),P([]);y.findIndex((t=>t.id===e.id))===y.length-1&&z(!0),setTimeout((()=>{O(!1)}),500)}),[y,S]),ae=t.useCallback((t=>{const o=t||T;if(!o)return;const a=y.findIndex((e=>e.id===o.id));if(a>0){const t=y[a-1];w(t);const o=a-1,r=y.length,s=[{target:'[data-testid="whats-new-button"]',content:e.jsxRuntimeExports.jsx(n.default,{feature:t,currentIndex:o,totalFeatures:r,onSkip:()=>oe(t),onExplore:()=>ne(t),onPrevious:()=>ae(t),onNext:()=>re(t),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,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"}}}];P(s)}}),[T,y]),re=t.useCallback((t=>{const o=t||T;if(!o)return;const a=y.findIndex((e=>e.id===o.id));if(a<y.length-1){const t=y[a+1];w(t);const o=a+1,r=y.length,s=[{target:'[data-testid="whats-new-button"]',content:e.jsxRuntimeExports.jsx(n.default,{feature:t,currentIndex:o,totalFeatures:r,onSkip:()=>oe(t),onExplore:()=>ne(t),onPrevious:()=>ae(t),onNext:()=>re(t),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,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"}}}];P(s)}else O(!0),S(o.id),M(!1),w(null),P([]),z(!0),setTimeout((()=>{O(!1)}),500)}),[T,y,S]),se=()=>{if(y.length>0&&!T){document.querySelector('[data-testid="whats-new-button"]')&&te(y[0])}};t.useEffect((()=>(window.showMajorUpdatePopup=se,()=>{delete window.showMajorUpdatePopup})),[y,T]);const ie=t.useCallback((e=>{const{action:t}=e;t===o.ACTIONS.CLOSE&&(T&&(O(!0),y.forEach((e=>{S(e.id)})),z(!0),setTimeout((()=>{O(!1)}),500)),M(!1),w(null),P([]))}),[T,y,S]),le=t.useCallback((e=>{const{action:t,type:n,status:a,lifecycle:r,index:s}=e;console.log("🔔 Minor Callback:",{action:t,type:n,status:a,lifecycle:r,index:s,hasSteps:F.length,runJoyride:E}),t===o.ACTIONS.CLOSE&&(console.log("❌ CLOSE ACTION - Clearing joyride"),j&&(L(!0),$(!0),C.forEach((e=>{S(e.id)})),setTimeout((()=>{L(!1)}),500)),B(!1),v(null),I([]))}),[j,C,S]),ue=(t,o)=>{v(t);const n=o||A,r=n.findIndex((e=>e.id===t.id)),s=n.length,i=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,l=[{target:i,content:e.jsxRuntimeExports.jsx(a.default,{feature:t,currentIndex:r,totalFeatures:s,onSkip:()=>de(t),onExplore:()=>ce(t),onPrevious:()=>pe(t),onNext:()=>fe(t),setIsClosing:ee}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,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"}}}];console.log("✅ Setting joyride:",{currentIndex:r,totalFeatures:s,hasFeatures:n.length,target:i}),I(l),B(!0)},de=t.useCallback((e=>{(e||j)&&(L(!0),$(!0),C.forEach((e=>{S(e.id)})),B(!1),v(null),I([]),setTimeout((()=>{L(!1)}),500))}),[j,C,S]),ce=t.useCallback((e=>{L(!0),$(!0),S(e.id),e.productVideo&&(G(e.productVideo),D(!0),K(!0)),B(!1),v(null),I([]),setTimeout((()=>{L(!1)}),500)}),[S]),pe=t.useCallback((t=>{const o=t||j;if(!o)return;const n=A.findIndex((e=>e.id===o.id));if(n>0){const t=A[n-1];v(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=n-1,s=A.length,i=[{target:o,content:e.jsxRuntimeExports.jsx(a.default,{feature:t,currentIndex:r,totalFeatures:s,onSkip:()=>de(t),onExplore:()=>ce(t),onPrevious:()=>pe(t),onNext:()=>fe(t),setIsClosing:ee}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,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"}}}];I(i)}}),[j,A]),fe=t.useCallback((t=>{const o=t||j;if(!o)return;const n=A.findIndex((e=>e.id===o.id));if(n<A.length-1){const t=A[n+1];v(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=n+1,s=A.length,i=[{target:o,content:e.jsxRuntimeExports.jsx(a.default,{feature:t,currentIndex:r,totalFeatures:s,onSkip:()=>de(t),onExplore:()=>ce(t),onPrevious:()=>pe(t),onNext:()=>fe(t),setIsClosing:ee}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,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"}}}];I(i)}else L(!0),$(!0),S(o.id),B(!1),v(null),I([]),setTimeout((()=>{L(!1)}),500)}),[j,A,S]);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[d,R.length>0&&e.jsxRuntimeExports.jsx(l.default,{steps:R,run:N,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ie,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:u,zIndex:1e4,width:"auto",arrowColor:X?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"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"}}),F.length>0&&e.jsxRuntimeExports.jsx(l.default,{steps:F,run:E,continuous:!1,showProgress:!1,showSkipButton:!1,callback:le,disableOverlayClose:!0,disableCloseOnEsc:!1,styles:{options:{primaryColor:u,zIndex:1e4,width:"auto",arrowColor:Z?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:Z?"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"}}),e.jsxRuntimeExports.jsx(s.VideoModal,{isOpen:J,videoUrl:Q,onClose:()=>{D(!1),G(""),K(!1)}})]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),o=require("react-joyride");require("./constants/animations.js");var s=require("./constants/selectors.js"),n=require("./hooks/useFeatureAnnouncements.js"),r=require("./MajorUpdatePopup.js"),a=require("./MinorUpdatePopup.js");require("../../constants/Theme.js");var i=require("./styles/joyride.styles.js"),l=require("./VideoModal.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=u(o);exports.default=u=>{let{children:c,fetchVisibleFeatures:f,getStoreFeatureProgress:g,fetchFeatureById:p,markFeatureAsViewedForStore:h,isFeatureApplicableToCurrentPage:m,module:x,router:S}=u;var y;const{majorUpdateFeatures:T,minorUpdateFeatures:b,isLoading:j,markFeatureAsViewed:C}=n.useFeatureAnnouncements({fetchVisibleFeatures:f,getStoreFeatureProgress:g,fetchFeatureById:p,markFeatureAsViewedForStore:h,isFeatureApplicableToCurrentPage:m,module:x,router:S}),[E,k]=t.useState(null),[v,F]=t.useState(null),[w,I]=t.useState(!1),[B,M]=t.useState([]),[q,N]=t.useState(!1),[P,O]=t.useState([]),[W,L]=t.useState(!1),[A,R]=t.useState(!1),[U,V]=t.useState([]),[_,J]=t.useState(!1),[$,D]=t.useState(!1),[H,Q]=t.useState(!1),[z,G]=t.useState(""),[K,X]=t.useState(!1),[Y,Z]=t.useState(!1),[ee,te]=t.useState(!1);t.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}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),t.useEffect((()=>{console.log("📋 joyrideSteps changed:",{length:B.length,runJoyride:w})}),[B,w]),t.useEffect((()=>{console.log("🎯 currentMinorFeature changed:",{id:(null==v?void 0:v.id)||"null"})}),[v]),t.useEffect((()=>{if(!(T.length>0)||E||j||W||K)0!==T.length||j||D(!0);else{D(!1),J(!1),I(!1),M([]),F(null),V([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?oe(T[0]):setTimeout(e,1e3)};e()}}),[T,E,j,W,K]),t.useEffect((()=>{var e;const t=null===(e=null==S?void 0:S.query)||void 0===e?void 0:e.featureId;if(console.log("🧪 Test mode effect triggered:",{featureIdFromQuery:t,isLoading:j,minorUpdateFeaturesCount:b.length}),!t||j||0===b.length)return;const o=b.find((e=>e.id===t));if(!o||!o.featureTag)return;J(!0),R(!0);let s=0;const n=setInterval((()=>{s++;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){console.log("✨ Test mode: Element found, showing joyride");const e=[o];V(e),de(o,e),clearInterval(n)}else s>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),R(!1),clearInterval(n))}),200);return()=>{clearInterval(n)}}),[b,null===(y=null==S?void 0:S.query)||void 0===y?void 0:y.featureId,j]),t.useEffect((()=>{var e;if(console.log("🔍 Main minor effect check:",{minorUpdateFeaturesCount:b.length,isLoading:j,runJoyride:w,isProcessingMinorUpdate:A,currentMinorFeature:(null==v?void 0:v.id)||"null",minorFeaturesSkipped:_,showMinorUpdates:$,blockPopups:K}),b.length>0&&!j&&!w&&!A&&!v&&!_&&$&&!K){let e=null,t=null,o=null,s=!1;const n=()=>{if(s||A||v||_||!$)return;const n=b.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));n.length>0&&(console.log("🎉 Found available features:",n.length),V(n),de(n[0],n),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 s=o.addedNodes[e];if(s.nodeType===Node.ELEMENT_NODE){const e=s;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}w||s||A||v||_||!$||!t||(o&&clearTimeout(o),o=setTimeout((()=>{s||A||v||_||!$||n()}),200))})),t=()=>{w||s||A||v||_||!$||(o&&clearTimeout(o),o=setTimeout((()=>{s||A||v||_||!$||n()}),300))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),n(),setTimeout((()=>{s||A||v||_||!$||n()}),100),setTimeout((()=>{s||A||v||_||!$||n()}),1e3),setTimeout((()=>{s||A||v||_||!$||n()}),500),()=>{s=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===b.length||j){(null===(e=null==S?void 0:S.query)||void 0===e?void 0:e.featureId)&&v?console.log("🚫 Skipping joyride clear - test mode with active feature"):(console.log("🗑️ Clearing joyride - no features or loading"),I(!1),M([]),F(null),V([]),J(!1))}}),[b,j,w,A,v,_,$,C,K]);const oe=t=>{k(t);const o=T.findIndex((e=>e.id===t.id)),n=T.length,a=[{target:s.SELECTORS.WHATS_NEW_BUTTON,content:e.jsxRuntimeExports.jsx(r.default,{feature:t,currentIndex:o,totalFeatures:n,onSkip:()=>se(t),onExplore:()=>ne(t),onPrevious:()=>re(t),onNext:()=>ae(t),setIsClosing:Z}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMajor:!0},styles:i.getMajorJoyrideStyles(Y)}];O(a),N(!0)},se=t.useCallback((e=>{(e||E)&&(L(!0),T.forEach((e=>{C(e.id)})),N(!1),k(null),O([]),D(!0),setTimeout((()=>{L(!1)}),500))}),[E,T,C]),ne=t.useCallback((e=>{L(!0),C(e.id),e.productVideo&&(G(e.productVideo),Q(!0),X(!0)),N(!1),k(null),O([]);T.findIndex((t=>t.id===e.id))===T.length-1&&D(!0),setTimeout((()=>{L(!1)}),500)}),[T,C]),re=t.useCallback((t=>{const o=t||E;if(!o)return;const s=T.findIndex((e=>e.id===o.id));if(s>0){const t=T[s-1];k(t);const o=s-1,n=T.length,a=[{target:'[data-testid="whats-new-button"]',content:e.jsxRuntimeExports.jsx(r.default,{feature:t,currentIndex:o,totalFeatures:n,onSkip:()=>se(t),onExplore:()=>ne(t),onPrevious:()=>re(t),onNext:()=>ae(t),setIsClosing:Z}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMajor:!0},styles:i.majorStepStyles}];O(a)}}),[E,T]),ae=t.useCallback((t=>{const o=t||E;if(!o)return;const s=T.findIndex((e=>e.id===o.id));if(s<T.length-1){const t=T[s+1];k(t);const o=s+1,n=T.length,a=[{target:'[data-testid="whats-new-button"]',content:e.jsxRuntimeExports.jsx(r.default,{feature:t,currentIndex:o,totalFeatures:n,onSkip:()=>se(t),onExplore:()=>ne(t),onPrevious:()=>re(t),onNext:()=>ae(t),setIsClosing:Z}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMajor:!0},styles:i.majorStepStyles}];O(a)}else L(!0),C(o.id),N(!1),k(null),O([]),D(!0),setTimeout((()=>{L(!1)}),500)}),[E,T,C]),ie=()=>{if(T.length>0&&!E){document.querySelector('[data-testid="whats-new-button"]')&&oe(T[0])}};t.useEffect((()=>(window.showMajorUpdatePopup=ie,()=>{delete window.showMajorUpdatePopup})),[T,E]);const le=t.useCallback((e=>{const{action:t}=e;t===o.ACTIONS.CLOSE&&(E&&(L(!0),T.forEach((e=>{C(e.id)})),D(!0),setTimeout((()=>{L(!1)}),500)),N(!1),k(null),O([]))}),[E,T,C]),ue=t.useCallback((e=>{const{action:t,type:s,status:n,lifecycle:r,index:a}=e;console.log("🔔 Minor Callback:",{action:t,type:s,status:n,lifecycle:r,index:a,hasSteps:B.length,runJoyride:w}),t===o.ACTIONS.CLOSE&&(console.log("❌ CLOSE ACTION - Clearing joyride"),v&&(R(!0),J(!0),b.forEach((e=>{C(e.id)})),setTimeout((()=>{R(!1)}),500)),I(!1),F(null),M([]))}),[v,b,C]),de=(t,o)=>{F(t);const s=o||U,n=s.findIndex((e=>e.id===t.id)),r=s.length,l=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,u=[{target:l,content:e.jsxRuntimeExports.jsx(a.default,{feature:t,currentIndex:n,totalFeatures:r,onSkip:()=>ce(t),onExplore:()=>fe(t),onPrevious:()=>ge(t),onNext:()=>pe(t),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMinor:!0},styles:i.getMinorJoyrideStyles(ee)}];console.log("✅ Setting joyride:",{currentIndex:n,totalFeatures:r,hasFeatures:s.length,target:l}),M(u),I(!0)},ce=t.useCallback((e=>{(e||v)&&(R(!0),J(!0),b.forEach((e=>{C(e.id)})),I(!1),F(null),M([]),setTimeout((()=>{R(!1)}),500))}),[v,b,C]),fe=t.useCallback((e=>{R(!0),J(!0),C(e.id),e.productVideo&&(G(e.productVideo),Q(!0),X(!0)),I(!1),F(null),M([]),setTimeout((()=>{R(!1)}),500)}),[C]),ge=t.useCallback((t=>{const o=t||v;if(!o)return;const s=U.findIndex((e=>e.id===o.id));if(s>0){const t=U[s-1];F(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,n=s-1,r=U.length,l=[{target:o,content:e.jsxRuntimeExports.jsx(a.default,{feature:t,currentIndex:n,totalFeatures:r,onSkip:()=>ce(t),onExplore:()=>fe(t),onPrevious:()=>ge(t),onNext:()=>pe(t),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMinor:!0},styles:i.minorStepStyles}];M(l)}}),[v,U]),pe=t.useCallback((t=>{const o=t||v;if(!o)return;const s=U.findIndex((e=>e.id===o.id));if(s<U.length-1){const t=U[s+1];F(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,n=s+1,r=U.length,l=[{target:o,content:e.jsxRuntimeExports.jsx(a.default,{feature:t,currentIndex:n,totalFeatures:r,onSkip:()=>ce(t),onExplore:()=>fe(t),onPrevious:()=>ge(t),onNext:()=>pe(t),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMinor:!0},styles:i.minorStepStyles}];M(l)}else R(!0),J(!0),C(o.id),I(!1),F(null),M([]),setTimeout((()=>{R(!1)}),500)}),[v,U,C]);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[c,P.length>0&&e.jsxRuntimeExports.jsx(d.default,{steps:P,run:q,continuous:!1,showProgress:!1,showSkipButton:!1,callback:le,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:i.getMajorJoyrideStyles(Y),locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}}),B.length>0&&e.jsxRuntimeExports.jsx(d.default,{steps:B,run:w,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ue,disableOverlayClose:!0,disableCloseOnEsc:!1,styles:i.getMinorJoyrideStyles(ee),locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}}),e.jsxRuntimeExports.jsx(l.VideoModal,{isOpen:H,videoUrl:z,onClose:()=>{Q(!1),G(""),X(!1)}})]})};
@@ -1,14 +1,4 @@
1
1
  import React from 'react';
2
- import { FeatureAnnouncement } from './FeatureAnnouncement.types';
3
- interface MajorUpdatePopupProps {
4
- feature: FeatureAnnouncement;
5
- currentIndex: number;
6
- totalFeatures: number;
7
- onSkip: () => void;
8
- onExplore: () => void;
9
- onPrevious: () => void;
10
- onNext: () => void;
11
- setIsClosing?: (isClosing: boolean) => void;
12
- }
2
+ import { MajorUpdatePopupProps } from './types';
13
3
  declare const MajorUpdatePopup: React.FC<MajorUpdatePopupProps>;
14
4
  export default MajorUpdatePopup;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react");const n=e=>{if(!e)return"";const t=document.createElement("textarea");return t.innerHTML=e,t.value};exports.default=r=>{let{feature:o,currentIndex:s,totalFeatures:i,onSkip:l,onExplore:a,onPrevious:c,onNext:u,setIsClosing:p}=r;const[x,d]=t.useState(!1),[g,f]=t.useState(!1),[h,y]=t.useState(""),j=t.useRef(null);t.useEffect((()=>{x&&f(!0)}),[x]);const b=e=>{if(j.current){const e=j.current.closest('[class*="react-joyride__tooltip"]');if(e){const t=e.querySelector('[class*="react-joyride__arrow"]');t&&(t.style.display="none",t.style.visibility="hidden",t.style.opacity="0")}}let t=null;if(t=document.querySelector('[data-testid="whats-new-button"]'),t||(t=document.querySelector(".main-icon-class")),!t){const e=document.querySelector('svg[viewBox="0 0 32 32"]');if(e){e.querySelector('clipPath[id*="clip"]')&&(t=e.closest('[data-testid="whats-new-button"]')||e.parentElement)}}if(console.log("What's New button found:",!!t,t),t&&j.current){const e=j.current.getBoundingClientRect(),n=t.getBoundingClientRect();console.log("Popup rect:",e),console.log("Target rect:",n);const r=n.left+n.width/2-(e.left+e.width/2),o=n.top+n.height/2-(e.top+e.height/2);console.log("Translation:",{translateX:r,translateY:o}),y(`translate(${r}px, ${o}px) scale(0)`)}else y("scale(0)");null==p||p(!0),d(!0),setTimeout((()=>{e()}),1150)};return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:e.jsxRuntimeExports.jsxs("div",Object.assign({ref:j,style:{width:"959px",height:"274px",display:"flex",backgroundColor:"#212121",borderRadius:"4px",overflow:"hidden",position:"relative",transform:g?h:"scale(1)",opacity:g?0:1,transition:"transform 1s cubic-bezier(0.4, 0, 0.2, 1), opacity 1s cubic-bezier(0.4, 0, 0.2, 1)"}},{children:[e.jsxRuntimeExports.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),b(l)},style:{position:"absolute",top:"10px",right:"10px",background:"transparent",border:"none",color:"#BDBDBD",fontSize:"14px",fontWeight:"500",cursor:"pointer",zIndex:10,transition:"all 0.2s"},onMouseEnter:e=>{e.currentTarget.style.backgroundColor="#f3f4f6",e.currentTarget.style.color="#374151"},onMouseLeave:e=>{e.currentTarget.style.backgroundColor="transparent",e.currentTarget.style.color="#6b7280"}},{children:"Skip"})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{backgroundColor:"#212121",width:"480px",height:"274px",position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:"8px"}},{children:o.displayImage?e.jsxRuntimeExports.jsx("img",{src:o.displayImage,alt:o.title,style:{width:"464px",height:"258px",objectFit:"cover"},onError:e=>{o.image&&(e.target.src=o.image)}}):e.jsxRuntimeExports.jsx("div",Object.assign({style:{color:"#9ca3af",fontSize:"14px",textAlign:"center",width:"290px",height:"258px",display:"flex",alignItems:"center",justifyContent:"center"}},{children:"Feature Preview"}))})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{flex:1,display:"flex",margin:"0 8px 0 0",flexDirection:"column",justifyContent:"space-between",background:"transparent"}},{children:[e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsx("h3",Object.assign({style:{fontSize:"16px",fontWeight:"600",padding:"36px 0 0 0",color:"#fff",lineHeight:"1.25",textAlign:"left"}},{children:o.title})),e.jsxRuntimeExports.jsx("div",{style:{fontSize:"14px",lineHeight:"1.5",color:"rgba(255, 255, 255, 0.8)",textAlign:"left"},dangerouslySetInnerHTML:{__html:n(o.content||o.body||"")}}),e.jsxRuntimeExports.jsx("div",{children:e.jsxRuntimeExports.jsx("button",Object.assign({onClick:()=>{b(a)},style:{backgroundColor:"transparent",border:"1px solid #FEC02D",color:"#FEC02D",borderRadius:"4px",fontSize:"14px",fontWeight:"600",cursor:"pointer",width:"154px",height:"32px",transition:"all 0.2s",textAlign:"center",display:"flex",alignItems:"center",justifyContent:"center",marginTop:"16px"},onMouseEnter:e=>{e.currentTarget.style.backgroundColor="rgba(254, 192, 45, 0.1)"},onMouseLeave:e=>{e.currentTarget.style.backgroundColor="transparent"}},{children:o.buttonText||"Explore the feature"}))})]}),i>1&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"absolute",bottom:"16px",right:"16px",display:"flex",gap:"8px",alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),b(c)},disabled:0===s,style:{width:"24px",height:"24px",backgroundColor:"transparent",border:"none",color:0===s?"#666":"#fff",fontSize:"20px",cursor:0===s?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s"},onMouseEnter:e=>{0!==s&&(e.currentTarget.style.color="#FEC02D")},onMouseLeave:e=>{0!==s&&(e.currentTarget.style.color="#fff")}},{children:"‹"})),e.jsxRuntimeExports.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),b(u)},disabled:s===i-1,style:{width:"24px",height:"24px",backgroundColor:"transparent",border:"none",color:s===i-1?"#666":"#fff",fontSize:"20px",cursor:s===i-1?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s"},onMouseEnter:e=>{s!==i-1&&(e.currentTarget.style.color="#FEC02D")},onMouseLeave:e=>{s!==i-1&&(e.currentTarget.style.color="#fff")}},{children:"›"}))]}))]}))]}))})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),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"),i=require("./utils/animationHelpers.js"),o=require("./utils/elementHelpers.js");exports.default=a=>{let{feature:u,currentIndex:l,totalFeatures:c,onSkip:j,onExplore:x,onPrevious:g,onNext:p,setIsClosing:d}=a;const[E,b]=t.useState(!1),[T,m]=t.useState(!1),[v,y]=t.useState(""),O=t.useRef(null);t.useEffect((()=>{E&&m(!0)}),[E]);const h=e=>{i.hideJoyrideArrow(O.current);const t=o.findWhatsNewButton();if(t&&O.current){const e=i.calculateCloseTransform(O.current,t);y(e)}else y("scale(0)");null==d||d(!0),b(!0),i.executeAfterAnimation(e)},R=n.getMajorPopupStyles(T,v);return e.jsxRuntimeExports.jsxs("div",Object.assign({ref:O,style:R.container},{children:[e.jsxRuntimeExports.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),h(j)},style:R.skipButton.base,onMouseEnter:e=>Object.assign(e.currentTarget.style,R.skipButton.hover),onMouseLeave:e=>Object.assign(e.currentTarget.style,R.skipButton.base)},{children:s.TEXT.SKIP_BUTTON})),e.jsxRuntimeExports.jsx("div",Object.assign({style:R.imageContainer},{children:u.displayImage?e.jsxRuntimeExports.jsx("img",{src:u.displayImage,alt:u.title,style:R.image,onError:e=>{u.image&&(e.target.src=u.image)}}):e.jsxRuntimeExports.jsx("div",Object.assign({style:R.imagePlaceholder},{children:s.TEXT.FEATURE_PREVIEW_PLACEHOLDER}))})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:R.contentContainer},{children:[e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsx("h3",Object.assign({style:R.title},{children:u.title})),e.jsxRuntimeExports.jsx("div",{style:R.content,dangerouslySetInnerHTML:{__html:r.decodeHTMLEntities(u.content||u.body||"")}}),e.jsxRuntimeExports.jsx("button",Object.assign({onClick:()=>{h(x)},style:R.exploreButton.base,onMouseEnter:e=>Object.assign(e.currentTarget.style,R.exploreButton.hover),onMouseLeave:e=>Object.assign(e.currentTarget.style,R.exploreButton.base)},{children:u.buttonText||s.TEXT.DEFAULT_BUTTON_TEXT}))]}),c>1&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:R.navigationContainer},{children:[e.jsxRuntimeExports.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),h(g)},disabled:0===l,style:R.navigationButton(0===l).base,onMouseEnter:e=>{0!==l&&Object.assign(e.currentTarget.style,R.navigationButton(!1).hover)},onMouseLeave:e=>{0!==l&&Object.assign(e.currentTarget.style,R.navigationButton(!1).base)}},{children:s.TEXT.NAVIGATION_PREVIOUS})),e.jsxRuntimeExports.jsx("button",Object.assign({onClick:e=>{e.preventDefault(),e.stopPropagation(),h(p)},disabled:l===c-1,style:R.navigationButton(l===c-1).base,onMouseEnter:e=>{l!==c-1&&Object.assign(e.currentTarget.style,R.navigationButton(!1).hover)},onMouseLeave:e=>{l!==c-1&&Object.assign(e.currentTarget.style,R.navigationButton(l===c-1).base)}},{children:s.TEXT.NAVIGATION_NEXT}))]}))]}))]}))};
@@ -1,14 +1,4 @@
1
1
  import React from 'react';
2
- import { FeatureAnnouncement } from './FeatureAnnouncement.types';
3
- interface MinorUpdatePopupProps {
4
- feature: FeatureAnnouncement;
5
- currentIndex: number;
6
- totalFeatures: number;
7
- onSkip: () => void;
8
- onExplore: () => void;
9
- onPrevious: () => void;
10
- onNext: () => void;
11
- setIsClosing?: (isClosing: boolean) => void;
12
- }
2
+ import { MinorUpdatePopupProps } from './types';
13
3
  declare const MinorUpdatePopup: React.FC<MinorUpdatePopupProps>;
14
4
  export default MinorUpdatePopup;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react");const i=e=>{if(!e)return"";const t=document.createElement("textarea");return t.innerHTML=e,t.value};exports.default=s=>{let{feature:r,currentIndex:n,totalFeatures:o,onSkip:l,onExplore:a,onPrevious:x,onNext:p,setIsClosing:c}=s;const[d,u]=t.useState(!1),[f,g]=t.useState(!1),[h,j]=t.useState(""),b=t.useRef(null);t.useEffect((()=>{d&&g(!0)}),[d]);const m=e=>{if(b.current){const e=b.current.closest('[class*="react-joyride__tooltip"]');if(e){const t=e.querySelector('[class*="react-joyride__arrow"]');t&&(t.style.display="none",t.style.visibility="hidden",t.style.opacity="0")}}if(b.current&&r.featureTag){const e=r.featureTag.startsWith("#")||r.featureTag.startsWith(".")||r.featureTag.startsWith("[")?r.featureTag:`#${r.featureTag}`,t=document.querySelector(e);if(t){const e=b.current.getBoundingClientRect(),i=t.getBoundingClientRect(),s=i.left+i.width/2-(e.left+e.width/2),r=i.top+i.height/2-(e.top+e.height/2);j(`translate(${s}px, ${r}px) scale(0)`)}else j("scale(0)")}else j("scale(0)");null==c||c(!0),u(!0),setTimeout((()=>{e()}),1150)};return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:e.jsxRuntimeExports.jsxs("div",Object.assign({ref:b,style:{width:"519px",height:"160px",display:"flex",backgroundColor:"#ffffff",borderRadius:"4px",overflow:"hidden",position:"relative",boxShadow:"0 20px 25px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.04)",transform:f?h:"scale(1)",opacity:f?0:1,transition:"transform 1s cubic-bezier(0.4, 0, 0.2, 1), opacity 1s cubic-bezier(0.4, 0, 0.2, 1)"}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{backgroundColor:"#f9fafb",borderRadius:"4px",position:"relative",display:"flex",alignItems:"center",justifyContent:"center",margin:"13px 10px 13px 10px",width:"235px",minWidth:"235px",maxWidth:"235px",height:"134px"}},{children:r.displayImage?e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"relative",width:"235px",height:"134px"}},{children:[e.jsxRuntimeExports.jsx("img",{src:r.displayImage,alt:r.title,style:{width:"235px",height:"134px",objectFit:"cover",borderRadius:"4px",display:"block"},onError:e=>{r.image&&(e.target.src=r.image)}}),e.jsxRuntimeExports.jsx("div",Object.assign({style:{position:"absolute",top:"0px",left:"0px",right:"0px",height:"27px",backgroundColor:"rgba(0, 0, 0, 0.26)",borderRadius:"4px 4px 4px 4px",display:"flex",alignItems:"center",justifyContent:"center",zIndex:10}},{children:e.jsxRuntimeExports.jsx("span",Object.assign({style:{color:"#ffffff",fontWeight:"600",fontSize:"14px"}},{children:"New feature"}))}))]})):e.jsxRuntimeExports.jsx("div",Object.assign({style:{color:"#9ca3af",fontSize:"14px",textAlign:"center",width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"#f3f4f6",borderRadius:"4px"}},{children:"Feature Preview"}))})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{flex:1,display:"flex",margin:"13px 13px 13px 3px",flexDirection:"column",justifyContent:"space-between",background:"transparent"}},{children:[e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsx("h3",Object.assign({style:{fontSize:"16px",fontWeight:"600",padding:"0 0 0 0",color:"#212121",lineHeight:"1.25",textAlign:"left"}},{children:r.title})),e.jsxRuntimeExports.jsx("div",{style:{fontSize:"12px",fontWeight:"400",lineHeight:"1.2",color:"#616161",textAlign:"left",maxHeight:"48px",overflow:"hidden",display:"-webkit-box",WebkitLineClamp:3,WebkitBoxOrient:"vertical"},dangerouslySetInnerHTML:{__html:i(r.content||r.body||"")}})]}),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"absolute",bottom:"13px",right:"10px",display:"flex",gap:"16px",alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx("span",Object.assign({onClick:()=>m(l),style:{color:"#4B1583",fontSize:"14px",fontWeight:"500",cursor:"pointer",transition:"all 0.2s"}},{children:"Understood"})),r.productVideo&&e.jsxRuntimeExports.jsx("button",Object.assign({onClick:()=>{m(a)},style:{backgroundColor:"#4B1583",border:"none",color:"#ffffff",borderRadius:"4px",fontSize:"14px",fontWeight:"600",cursor:"pointer",width:"154px",height:"32px",transition:"all 0.2s",textAlign:"center",display:"flex",alignItems:"center",justifyContent:"center"}},{children:r.buttonText||"Explore the feature"}))]}))]}))]}))})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),s=require("react"),t=require("./constants/index.js");require("../../constants/Theme.js"),require("./constants/animations.js");var n=require("./styles/minorPopup.styles.js"),r=require("./utils/htmlHelpers.js"),i=require("./utils/animationHelpers.js"),o=require("./utils/elementHelpers.js");exports.default=l=>{let{feature:a,currentIndex:u,totalFeatures:c,onSkip:x,onExplore:j,onPrevious:d,onNext:E,setIsClosing:m}=l;const[p,g]=s.useState(!1),[T,y]=s.useState(!1),[R,h]=s.useState(""),b=s.useRef(null);s.useEffect((()=>{p&&y(!0)}),[p]);const O=e=>{if(i.hideJoyrideArrow(b.current),b.current&&a.featureTag){const e=o.findFeatureTagElement(a.featureTag);if(e){const s=i.calculateCloseTransform(b.current,e);h(s)}else h("scale(0)")}else h("scale(0)");null==m||m(!0),g(!0),i.executeAfterAnimation(e)},f=n.getMinorPopupStyles(T,R);return e.jsxRuntimeExports.jsxs("div",Object.assign({ref:b,style:f.container},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:f.imageContainer},{children:a.displayImage?e.jsxRuntimeExports.jsxs("div",Object.assign({style:f.imageWrapper},{children:[e.jsxRuntimeExports.jsx("img",{src:a.displayImage,alt:a.title,style:f.image,onError:e=>{a.image&&(e.target.src=a.image)}}),e.jsxRuntimeExports.jsx("div",Object.assign({style:f.badge},{children:e.jsxRuntimeExports.jsx("span",Object.assign({style:f.badgeText},{children:t.TEXT.NEW_FEATURE_BADGE}))}))]})):e.jsxRuntimeExports.jsx("div",Object.assign({style:f.imagePlaceholder},{children:t.TEXT.FEATURE_PREVIEW_PLACEHOLDER}))})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:f.contentContainer},{children:[e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsx("h3",Object.assign({style:f.title},{children:a.title})),e.jsxRuntimeExports.jsx("div",{style:f.content,dangerouslySetInnerHTML:{__html:r.decodeHTMLEntities(a.content||a.body||"")}})]}),e.jsxRuntimeExports.jsxs("div",Object.assign({style:f.actionsContainer},{children:[e.jsxRuntimeExports.jsx("span",Object.assign({onClick:()=>{O(x)},style:f.understoodText},{children:t.TEXT.UNDERSTOOD})),a.productVideo&&e.jsxRuntimeExports.jsx("button",Object.assign({onClick:()=>{O(j)},style:f.exploreButton},{children:a.buttonText||t.TEXT.DEFAULT_BUTTON_TEXT}))]}))]}))]}))};
@@ -1,8 +1,3 @@
1
1
  import React from 'react';
2
- interface VideoModalProps {
3
- isOpen: boolean;
4
- videoUrl: string;
5
- onClose: () => void;
6
- }
2
+ import { VideoModalProps } from './types';
7
3
  export declare const VideoModal: React.FC<VideoModalProps>;
8
- export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js");exports.VideoModal=t=>{let{isOpen:o,videoUrl:r,onClose:i}=t;if(!o)return null;const s=r.includes("youtube.com")||r.includes("youtu.be")?r.replace("watch?v=","embed/").replace("youtu.be/","youtube.com/embed/"):r,n=r.includes("youtube.com")||r.includes("youtu.be");return e.jsxRuntimeExports.jsx("div",Object.assign({style:{position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(0, 0, 0, 0.9)",zIndex:2e3,display:"flex",justifyContent:"center",alignItems:"center",padding:"20px"},onClick:e=>{e.target===e.currentTarget&&i()}},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"relative",width:"90vw",height:"90vh",maxWidth:"1200px",maxHeight:"800px",backgroundColor:"black",borderRadius:"12px",overflow:"hidden",boxShadow:"0 25px 50px rgba(0, 0, 0, 0.8)"},onClick:e=>e.stopPropagation()},{children:[e.jsxRuntimeExports.jsx("button",Object.assign({onClick:i,style:{position:"absolute",top:"20px",right:"20px",background:"rgba(0, 0, 0, 0.7)",border:"none",color:"white",fontSize:"24px",width:"40px",height:"40px",borderRadius:"50%",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",zIndex:10,transition:"background-color 0.2s"},onMouseOver:e=>{e.currentTarget.style.backgroundColor="rgba(0, 0, 0, 0.9)"},onMouseOut:e=>{e.currentTarget.style.backgroundColor="rgba(0, 0, 0, 0.7)"}},{children:"×"})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center"}},{children:r?n?e.jsxRuntimeExports.jsx("iframe",{width:"100%",height:"100%",src:s,title:"Product Video",frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,style:{borderRadius:"12px"}}):e.jsxRuntimeExports.jsxs("video",Object.assign({controls:!0,autoPlay:!0,style:{width:"100%",height:"100%",objectFit:"contain",borderRadius:"12px"}},{children:[e.jsxRuntimeExports.jsx("source",{src:r,type:"video/mp4"}),e.jsxRuntimeExports.jsx("source",{src:r,type:"video/webm"}),e.jsxRuntimeExports.jsx("source",{src:r,type:"video/ogg"}),"Your browser does not support the video tag."]})):e.jsxRuntimeExports.jsx("div",Object.assign({style:{color:"white",fontSize:"18px",textAlign:"center"}},{children:"No video available"}))}))]}))}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),s=require("./constants/index.js");require("../../constants/Theme.js"),require("./constants/animations.js");var t=require("./styles/videoModal.styles.js"),o=require("./utils/htmlHelpers.js");exports.VideoModal=r=>{let{isOpen:i,videoUrl:l,onClose:n}=r;if(!i)return null;const a=o.formatVideoUrl(l),d=o.isYouTubeVideo(l);return e.jsxRuntimeExports.jsx("div",Object.assign({style:t.videoModalStyles.backdrop,onClick:e=>{e.target===e.currentTarget&&n()}},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({style:t.videoModalStyles.container,onClick:e=>e.stopPropagation()},{children:[e.jsxRuntimeExports.jsx("button",Object.assign({onClick:n,style:t.videoModalStyles.closeButton.base,onMouseOver:e=>Object.assign(e.currentTarget.style,t.videoModalStyles.closeButton.hover),onMouseOut:e=>Object.assign(e.currentTarget.style,t.videoModalStyles.closeButton.base)},{children:"×"})),e.jsxRuntimeExports.jsx("div",Object.assign({style:t.videoModalStyles.videoWrapper},{children:l?d?e.jsxRuntimeExports.jsx("iframe",{width:"100%",height:"100%",src:a,title:s.TEXT.VIDEO_MODAL_TITLE,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,style:t.videoModalStyles.iframe}):e.jsxRuntimeExports.jsxs("video",Object.assign({controls:!0,autoPlay:!0,style:t.videoModalStyles.video},{children:[e.jsxRuntimeExports.jsx("source",{src:l,type:"video/mp4"}),e.jsxRuntimeExports.jsx("source",{src:l,type:"video/webm"}),e.jsxRuntimeExports.jsx("source",{src:l,type:"video/ogg"}),"Your browser does not support the video tag."]})):e.jsxRuntimeExports.jsx("div",Object.assign({style:t.videoModalStyles.noVideoMessage},{children:s.TEXT.NO_VIDEO_AVAILABLE}))}))]}))}))};
@@ -0,0 +1,27 @@
1
+ /**
2
+ * Animation timing constants
3
+ */
4
+ export declare const ANIMATION_TIMING: {
5
+ readonly CLOSE_DURATION: 1150;
6
+ readonly PROCESSING_DELAY: 500;
7
+ readonly MINOR_POPUP_DELAY: 2000;
8
+ readonly TRANSITION_DURATION: "1s";
9
+ };
10
+ /**
11
+ * Animation easing functions
12
+ */
13
+ export declare const ANIMATION_EASING: {
14
+ readonly STANDARD: "cubic-bezier(0.4, 0, 0.2, 1)";
15
+ };
16
+ /**
17
+ * Element check configuration
18
+ */
19
+ export declare const ELEMENT_CHECK_CONFIG: {
20
+ readonly MAX_ATTEMPTS: 25;
21
+ readonly RETRY_INTERVAL_MS: 200;
22
+ readonly SCROLL_DEBOUNCE_MS: 300;
23
+ };
24
+ /**
25
+ * Combined transition string
26
+ */
27
+ export declare const POPUP_TRANSITION: string;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});const N={CLOSE_DURATION:1150,PROCESSING_DELAY:500,MINOR_POPUP_DELAY:2e3,TRANSITION_DURATION:"1s"},A={STANDARD:"cubic-bezier(0.4, 0, 0.2, 1)"},I=`transform ${N.TRANSITION_DURATION} ${A.STANDARD}, opacity ${N.TRANSITION_DURATION} ${A.STANDARD}`;exports.ANIMATION_EASING=A,exports.ANIMATION_TIMING=N,exports.POPUP_TRANSITION=I;
@@ -0,0 +1,56 @@
1
+ /**
2
+ * Popup dimension constants
3
+ */
4
+ export declare const POPUP_DIMENSIONS: {
5
+ readonly MAJOR: {
6
+ readonly width: 959;
7
+ readonly height: 274;
8
+ readonly imageWidth: 480;
9
+ readonly imageHeight: 274;
10
+ readonly imageInnerWidth: 464;
11
+ readonly imageInnerHeight: 258;
12
+ readonly imagePlaceholderWidth: 290;
13
+ readonly imagePlaceholderHeight: 258;
14
+ };
15
+ readonly MINOR: {
16
+ readonly width: 519;
17
+ readonly height: 160;
18
+ readonly imageWidth: 235;
19
+ readonly imageHeight: 134;
20
+ readonly badgeHeight: 27;
21
+ };
22
+ };
23
+ /**
24
+ * Spacing constants
25
+ */
26
+ export declare const SPACING: {
27
+ readonly MAJOR: {
28
+ readonly contentMargin: "0 8px 0 0";
29
+ readonly imagePadding: "8px";
30
+ readonly titlePadding: "36px 0 0 0";
31
+ readonly buttonMarginTop: "16px";
32
+ readonly skipButtonTop: "10px";
33
+ readonly skipButtonRight: "10px";
34
+ readonly navigationBottom: "16px";
35
+ readonly navigationRight: "16px";
36
+ readonly navigationGap: "8px";
37
+ };
38
+ readonly MINOR: {
39
+ readonly imageMargin: "13px 10px 13px 10px";
40
+ readonly contentMargin: "13px 13px 13px 3px";
41
+ readonly actionsBottom: "13px";
42
+ readonly actionsRight: "10px";
43
+ readonly actionsGap: "16px";
44
+ };
45
+ };
46
+ /**
47
+ * Border radius constants
48
+ */
49
+ export declare const BORDER_RADIUS: {
50
+ readonly POPUP: "4px";
51
+ readonly IMAGE: "4px";
52
+ readonly BUTTON: "4px";
53
+ readonly VIDEO_MODAL: "12px";
54
+ readonly CLOSE_BUTTON: "50%";
55
+ readonly SPOTLIGHT: "8px";
56
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.BORDER_RADIUS={POPUP:"4px",IMAGE:"4px",BUTTON:"4px",VIDEO_MODAL:"12px",CLOSE_BUTTON:"50%",SPOTLIGHT:"8px"},exports.POPUP_DIMENSIONS={MAJOR:{width:959,height:274,imageWidth:480,imageHeight:274,imageInnerWidth:464,imageInnerHeight:258,imagePlaceholderWidth:290,imagePlaceholderHeight:258},MINOR:{width:519,height:160,imageWidth:235,imageHeight:134,badgeHeight:27}},exports.SPACING={MAJOR:{contentMargin:"0 8px 0 0",imagePadding:"8px",titlePadding:"36px 0 0 0",buttonMarginTop:"16px",skipButtonTop:"10px",skipButtonRight:"10px",navigationBottom:"16px",navigationRight:"16px",navigationGap:"8px"},MINOR:{imageMargin:"13px 10px 13px 10px",contentMargin:"13px 13px 13px 3px",actionsBottom:"13px",actionsRight:"10px",actionsGap:"16px"}};
@@ -0,0 +1,19 @@
1
+ export * from './animations';
2
+ export * from './dimensions';
3
+ export * from './selectors';
4
+ export * from './zIndex';
5
+ export * from './localStorageKeys';
6
+ /**
7
+ * Text constants
8
+ */
9
+ export declare const TEXT: {
10
+ readonly DEFAULT_BUTTON_TEXT: "Explore the feature";
11
+ readonly SKIP_BUTTON: "Skip";
12
+ readonly UNDERSTOOD: "Understood";
13
+ readonly NEW_FEATURE_BADGE: "New feature";
14
+ readonly FEATURE_PREVIEW_PLACEHOLDER: "Feature Preview";
15
+ readonly NO_VIDEO_AVAILABLE: "No video available";
16
+ readonly VIDEO_MODAL_TITLE: "Product Video";
17
+ readonly NAVIGATION_PREVIOUS: "‹";
18
+ readonly NAVIGATION_NEXT: "›";
19
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./animations.js");exports.ANIMATION_EASING=e.ANIMATION_EASING,exports.ANIMATION_TIMING=e.ANIMATION_TIMING,exports.POPUP_TRANSITION=e.POPUP_TRANSITION,exports.TEXT={DEFAULT_BUTTON_TEXT:"Explore the feature",SKIP_BUTTON:"Skip",UNDERSTOOD:"Understood",NEW_FEATURE_BADGE:"New feature",FEATURE_PREVIEW_PLACEHOLDER:"Feature Preview",NO_VIDEO_AVAILABLE:"No video available",VIDEO_MODAL_TITLE:"Product Video",NAVIGATION_PREVIOUS:"‹",NAVIGATION_NEXT:"›"};
@@ -0,0 +1,18 @@
1
+ /**
2
+ * Local storage keys for feature announcements
3
+ */
4
+ export declare const LOCAL_STORAGE_KEYS: {
5
+ readonly STORE_ID: "storeId";
6
+ readonly BIK_STORE_ID: "Bik/StoreId";
7
+ readonly CURRENT_STORE: "currentStore";
8
+ readonly STORE: "store";
9
+ readonly CURRENT_USER: "Bik/CurrentUser";
10
+ readonly QUERY_PARAM: "storeId";
11
+ };
12
+ /**
13
+ * URL query parameters
14
+ */
15
+ export declare const QUERY_PARAMS: {
16
+ readonly FEATURE_ID: "featureId";
17
+ readonly STORE_ID: "storeId";
18
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.LOCAL_STORAGE_KEYS={STORE_ID:"storeId",BIK_STORE_ID:"Bik/StoreId",CURRENT_STORE:"currentStore",STORE:"store",CURRENT_USER:"Bik/CurrentUser",QUERY_PARAM:"storeId"},exports.QUERY_PARAMS={FEATURE_ID:"featureId",STORE_ID:"storeId"};
@@ -0,0 +1,21 @@
1
+ /**
2
+ * CSS selectors for feature announcements
3
+ */
4
+ export declare const SELECTORS: {
5
+ readonly WHATS_NEW_BUTTON: "[data-testid=\"whats-new-button\"]";
6
+ readonly MAIN_ICON_CLASS: ".main-icon-class";
7
+ readonly SVG_VIEWBOX: "svg[viewBox=\"0 0 32 32\"]";
8
+ readonly CLIPPATH_PATTERN: "clipPath[id*=\"clip\"]";
9
+ readonly JOYRIDE_TOOLTIP: "[class*=\"react-joyride__tooltip\"]";
10
+ readonly JOYRIDE_ARROW: "[class*=\"react-joyride__arrow\"]";
11
+ readonly JOYRIDE_SPOTLIGHT: ".react-joyride__spotlight";
12
+ };
13
+ /**
14
+ * Data test IDs
15
+ */
16
+ export declare const TEST_IDS: {
17
+ readonly WHATS_NEW_BUTTON: "whats-new-button";
18
+ readonly MAJOR_POPUP: "major-update-popup";
19
+ readonly MINOR_POPUP: "minor-update-popup";
20
+ readonly VIDEO_MODAL: "video-modal";
21
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.SELECTORS={WHATS_NEW_BUTTON:'[data-testid="whats-new-button"]',MAIN_ICON_CLASS:".main-icon-class",SVG_VIEWBOX:'svg[viewBox="0 0 32 32"]',CLIPPATH_PATTERN:'clipPath[id*="clip"]',JOYRIDE_TOOLTIP:'[class*="react-joyride__tooltip"]',JOYRIDE_ARROW:'[class*="react-joyride__arrow"]',JOYRIDE_SPOTLIGHT:".react-joyride__spotlight"};
@@ -0,0 +1,10 @@
1
+ /**
2
+ * Z-index constants
3
+ */
4
+ export declare const Z_INDEX: {
5
+ readonly JOYRIDE: 10000;
6
+ readonly VIDEO_MODAL: 2000;
7
+ readonly SKIP_BUTTON: 10;
8
+ readonly IMAGE_BADGE: 10;
9
+ readonly CLOSE_BUTTON: 10;
10
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.Z_INDEX={JOYRIDE:1e4,VIDEO_MODAL:2e3,SKIP_BUTTON:10,IMAGE_BADGE:10,CLOSE_BUTTON:10};
@@ -0,0 +1 @@
1
+ export { useFeatureAnnouncements } from './useFeatureAnnouncements';
@@ -0,0 +1,13 @@
1
+ import { FeatureAnnouncement, FeatureAnnouncementRepository, RouterProps } from '../types';
2
+ export declare const useFeatureAnnouncements: ({ fetchVisibleFeatures, getStoreFeatureProgress, fetchFeatureById, markFeatureAsViewedForStore, isFeatureApplicableToCurrentPage, module, router, }: FeatureAnnouncementRepository & {
3
+ module?: string | undefined;
4
+ router?: RouterProps | undefined;
5
+ }) => {
6
+ features: FeatureAnnouncement[];
7
+ majorUpdateFeatures: FeatureAnnouncement[];
8
+ minorUpdateFeatures: FeatureAnnouncement[];
9
+ isLoading: boolean;
10
+ error: string | null;
11
+ markFeatureAsViewed: (featureId: string) => Promise<void>;
12
+ refetch: () => Promise<void>;
13
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react"),r=require("../constants/animations.js"),a=require("../constants/localStorageKeys.js");exports.useFeatureAnnouncements=o=>{let{fetchVisibleFeatures:n,getStoreFeatureProgress:i,fetchFeatureById:l,markFeatureAsViewedForStore:u,isFeatureApplicableToCurrentPage:s,module:c,router:d}=o;var f;const p=(()=>{const[e,r]=t.useState(null);return t.useEffect((()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(a.LOCAL_STORAGE_KEYS.STORE_ID)||localStorage.getItem(a.LOCAL_STORAGE_KEYS.BIK_STORE_ID)||localStorage.getItem(a.LOCAL_STORAGE_KEYS.CURRENT_STORE)||localStorage.getItem(a.LOCAL_STORAGE_KEYS.STORE),!e){const t=localStorage.getItem(a.LOCAL_STORAGE_KEYS.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(a.LOCAL_STORAGE_KEYS.QUERY_PARAM))}catch(e){console.error("FeatureAnnouncements: Failed to get store ID",e)}r(e)}}),[]),e})(),[A,S]=t.useState([]),[_,g]=t.useState([]),[v,y]=t.useState([]),[E,m]=t.useState(!1),[R,w]=t.useState(null),F=t.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){if(p){m(!0),w(null);try{const[e,t]=yield n(c);if(e||!t)return console.error("FeatureAnnouncements: Failed to fetch features",e),void w("Failed to fetch features");const[a,o]=yield i(p);a&&console.warn("FeatureAnnouncements: Progress fetch failed, treating all features as new",a);const l=new Date,u="undefined"!=typeof window?window.location.pathname:"",d=e=>{if(!e.expirationDate)return!0;let t;return"object"==typeof e.expirationDate&&null!==e.expirationDate&&("seconds"in e.expirationDate||"nanoseconds"in e.expirationDate)?t=new Date(1e3*e.expirationDate.seconds):"string"==typeof e.expirationDate?t=new Date(e.expirationDate):e.expirationDate instanceof Date&&(t=e.expirationDate),!(!t||isNaN(t.getTime()))&&l<t},f=e=>{if("Major"===e.featureUpdateType){let t=[];return Array.isArray(e.pageUrls)?t=e.pageUrls:"object"==typeof e.pageUrls&&null!==e.pageUrls&&"length"in e.pageUrls&&(t=Array.from(e.pageUrls)),t.includes(u)}return!0},A=t.filter((e=>{var t;return!((null===(t=null==o?void 0:o.viewedFeatures)||void 0===t?void 0:t[e.id])||!1)&&s(e)&&d(e)&&f(e)})),_=A.filter((e=>"Major"===e.featureUpdateType)),v=A.filter((e=>"Minor"===e.featureUpdateType));S(A),g(_),setTimeout((()=>{y(v)}),r.ANIMATION_TIMING.MINOR_POPUP_DELAY)}catch(e){console.error("FeatureAnnouncements: Unexpected error in fetchFeatures",e),w("An unexpected error occurred")}finally{m(!1)}}}))),[p,n,i,s,c]),T=t.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){m(!0),w(null);try{const[e,r]=yield l(t);if(e||!r)return void w("Failed to fetch feature by ID");"Major"===r.featureUpdateType?g([r]):y([r]),S([r])}catch(e){w("An unexpected error occurred while fetching by ID")}finally{m(!1)}}))),[l]),U=t.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){if(!p)return;const[e]=yield u(p,t);e?(console.warn("FeatureAnnouncements: Failed to mark feature as viewed, removing from local state anyway",e),S((e=>e.filter((e=>e.id!==t)))),g((e=>e.filter((e=>e.id!==t)))),y((e=>e.filter((e=>e.id!==t))))):(S((e=>e.filter((e=>e.id!==t)))),g((e=>e.filter((e=>e.id!==t)))),y((e=>e.filter((e=>e.id!==t)))))}))),[p,u]);return t.useEffect((()=>{var e;const t=null===(e=null==d?void 0:d.query)||void 0===e?void 0:e[a.QUERY_PARAMS.FEATURE_ID];t&&d?T(t):F()}),[null==d?void 0:d.pathname,null===(f=null==d?void 0:d.query)||void 0===f?void 0:f[a.QUERY_PARAMS.FEATURE_ID],p,F,T,d]),{features:A,majorUpdateFeatures:_,minorUpdateFeatures:v,isLoading:E,error:R,markFeatureAsViewed:U,refetch:F}};
@@ -2,5 +2,6 @@ export { default as FeatureAnnouncementProvider } from './FeatureAnnouncementPro
2
2
  export { default as MajorUpdatePopup } from './MajorUpdatePopup';
3
3
  export { default as MinorUpdatePopup } from './MinorUpdatePopup';
4
4
  export { VideoModal } from './VideoModal';
5
- export * from './useFeatureAnnouncements';
6
- export * from './FeatureAnnouncement.types';
5
+ export { useFeatureAnnouncements } from './hooks/useFeatureAnnouncements';
6
+ export * from './types';
7
+ export { TEXT, ANIMATION_TIMING, POPUP_DIMENSIONS } from './constants';
@@ -0,0 +1,4 @@
1
+ export * from './majorPopup.styles';
2
+ export * from './minorPopup.styles';
3
+ export * from './videoModal.styles';
4
+ export * from './joyride.styles';
@@ -0,0 +1,120 @@
1
+ export declare const majorStepStyles: {
2
+ tooltip: {
3
+ padding: number;
4
+ backgroundColor: string;
5
+ borderRadius: string;
6
+ border: string;
7
+ filter: string;
8
+ boxShadow: string;
9
+ };
10
+ tooltipContent: {
11
+ padding: number;
12
+ };
13
+ buttonNext: {
14
+ display: string;
15
+ };
16
+ buttonBack: {
17
+ display: string;
18
+ };
19
+ buttonClose: {
20
+ display: string;
21
+ };
22
+ buttonSkip: {
23
+ display: string;
24
+ };
25
+ };
26
+ export declare const minorStepStyles: {
27
+ tooltip: {
28
+ padding: number;
29
+ backgroundColor: string;
30
+ borderRadius: "4px";
31
+ border: string;
32
+ filter: string;
33
+ boxShadow: string;
34
+ };
35
+ tooltipContent: {
36
+ padding: number;
37
+ };
38
+ buttonNext: {
39
+ display: string;
40
+ };
41
+ buttonBack: {
42
+ display: string;
43
+ };
44
+ buttonClose: {
45
+ display: string;
46
+ };
47
+ buttonSkip: {
48
+ display: string;
49
+ };
50
+ };
51
+ export declare const getMajorJoyrideStyles: (isClosing: boolean) => {
52
+ options: {
53
+ arrowColor: string;
54
+ backgroundColor: string;
55
+ overlayColor: string;
56
+ primaryColor: string;
57
+ textColor: string;
58
+ zIndex: 10000;
59
+ };
60
+ tooltip: {
61
+ padding: number;
62
+ backgroundColor: string;
63
+ borderRadius: string;
64
+ border: string;
65
+ filter: string;
66
+ boxShadow: string;
67
+ };
68
+ tooltipContent: {
69
+ padding: number;
70
+ };
71
+ buttonNext: {
72
+ display: string;
73
+ };
74
+ buttonBack: {
75
+ display: string;
76
+ };
77
+ buttonClose: {
78
+ display: string;
79
+ };
80
+ buttonSkip: {
81
+ display: string;
82
+ };
83
+ };
84
+ export declare const getMinorJoyrideStyles: (isClosing: boolean) => {
85
+ options: {
86
+ arrowColor: string;
87
+ backgroundColor: string;
88
+ overlayColor: string;
89
+ primaryColor: string;
90
+ textColor: string;
91
+ zIndex: 10000;
92
+ };
93
+ spotlight: {
94
+ boxShadow: string;
95
+ borderRadius: "8px";
96
+ };
97
+ tooltip: {
98
+ padding: number;
99
+ backgroundColor: string;
100
+ borderRadius: "4px";
101
+ border: string;
102
+ filter: string;
103
+ boxShadow: string;
104
+ };
105
+ tooltipContent: {
106
+ padding: number;
107
+ };
108
+ buttonNext: {
109
+ display: string;
110
+ };
111
+ buttonBack: {
112
+ display: string;
113
+ };
114
+ buttonClose: {
115
+ display: string;
116
+ };
117
+ buttonSkip: {
118
+ display: string;
119
+ };
120
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("../../../constants/Theme.js");require("../constants/animations.js");var n=require("../constants/dimensions.js"),t=require("../constants/zIndex.js");const e={tooltip:{padding:0,backgroundColor:"transparent",borderRadius:n.BORDER_RADIUS.POPUP,border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}};exports.getMajorJoyrideStyles=n=>({options:{arrowColor:n?"transparent":o.BASE_COLORS.grayscale[900],backgroundColor:"transparent",overlayColor:"transparent",primaryColor:"#007bff",textColor:o.BASE_COLORS.grayscale.white,zIndex:t.Z_INDEX.JOYRIDE},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"}}),exports.getMinorJoyrideStyles=e=>({options:{arrowColor:e?"transparent":o.BASE_COLORS.grayscale.white,backgroundColor:"transparent",overlayColor:"transparent",primaryColor:"#007bff",textColor:o.BASE_COLORS.grayscale[900],zIndex:t.Z_INDEX.JOYRIDE},spotlight:{boxShadow:"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)",borderRadius:n.BORDER_RADIUS.SPOTLIGHT},tooltip:{padding:0,backgroundColor:"transparent",borderRadius:n.BORDER_RADIUS.POPUP,border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}),exports.majorStepStyles={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"}},exports.minorStepStyles=e;
@@ -0,0 +1,23 @@
1
+ import { CSSProperties } from 'react';
2
+ export declare const getMajorPopupStyles: (startAnimation: boolean, transform: string) => {
3
+ container: CSSProperties;
4
+ skipButton: {
5
+ base: CSSProperties;
6
+ hover: CSSProperties;
7
+ };
8
+ imageContainer: CSSProperties;
9
+ image: CSSProperties;
10
+ imagePlaceholder: CSSProperties;
11
+ contentContainer: CSSProperties;
12
+ title: CSSProperties;
13
+ content: CSSProperties;
14
+ exploreButton: {
15
+ base: CSSProperties;
16
+ hover: CSSProperties;
17
+ };
18
+ navigationContainer: CSSProperties;
19
+ navigationButton: (disabled: boolean) => {
20
+ base: CSSProperties;
21
+ hover: CSSProperties;
22
+ };
23
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../constants/Theme.js"),t=require("../constants/animations.js"),n=require("../constants/dimensions.js"),i=require("../constants/zIndex.js");exports.getMajorPopupStyles=(o,r)=>({container:{width:`${n.POPUP_DIMENSIONS.MAJOR.width}px`,height:`${n.POPUP_DIMENSIONS.MAJOR.height}px`,display:"flex",backgroundColor:e.BASE_COLORS.grayscale[900],borderRadius:n.BORDER_RADIUS.POPUP,overflow:"hidden",position:"relative",transform:o?r:"scale(1)",opacity:o?0:1,transition:t.POPUP_TRANSITION},skipButton:{base:{position:"absolute",top:n.SPACING.MAJOR.skipButtonTop,right:n.SPACING.MAJOR.skipButtonRight,background:"transparent",border:"none",color:e.BASE_COLORS.grayscale[400],fontSize:"14px",fontWeight:"500",cursor:"pointer",zIndex:i.Z_INDEX.SKIP_BUTTON,transition:"all 0.2s"},hover:{backgroundColor:e.BASE_COLORS.grayscale[100],color:e.BASE_COLORS.grayscale[700]}},imageContainer:{backgroundColor:e.BASE_COLORS.grayscale[900],width:`${n.POPUP_DIMENSIONS.MAJOR.imageWidth}px`,height:`${n.POPUP_DIMENSIONS.MAJOR.imageHeight}px`,position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:n.SPACING.MAJOR.imagePadding},image:{width:`${n.POPUP_DIMENSIONS.MAJOR.imageInnerWidth}px`,height:`${n.POPUP_DIMENSIONS.MAJOR.imageInnerHeight}px`,objectFit:"cover"},imagePlaceholder:{color:e.BASE_COLORS.grayscale[500],fontSize:"14px",textAlign:"center",width:`${n.POPUP_DIMENSIONS.MAJOR.imagePlaceholderWidth}px`,height:`${n.POPUP_DIMENSIONS.MAJOR.imagePlaceholderHeight}px`,display:"flex",alignItems:"center",justifyContent:"center"},contentContainer:{flex:1,display:"flex",margin:n.SPACING.MAJOR.contentMargin,flexDirection:"column",justifyContent:"space-between",background:"transparent"},title:{fontSize:"16px",fontWeight:"600",padding:n.SPACING.MAJOR.titlePadding,color:e.BASE_COLORS.grayscale.white,lineHeight:"1.25",textAlign:"left"},content:{fontSize:"14px",lineHeight:"1.5",color:"rgba(255, 255, 255, 0.8)",textAlign:"left"},exploreButton:{base:{backgroundColor:"transparent",border:`1px solid ${e.BASE_COLORS.warning[500]}`,color:e.BASE_COLORS.warning[500],borderRadius:n.BORDER_RADIUS.BUTTON,fontSize:"14px",fontWeight:"600",cursor:"pointer",width:"154px",height:"32px",transition:"all 0.2s",textAlign:"center",display:"flex",alignItems:"center",justifyContent:"center",marginTop:n.SPACING.MAJOR.buttonMarginTop},hover:{backgroundColor:"rgba(254, 192, 45, 0.1)"}},navigationContainer:{position:"absolute",bottom:n.SPACING.MAJOR.navigationBottom,right:n.SPACING.MAJOR.navigationRight,display:"flex",gap:n.SPACING.MAJOR.navigationGap,alignItems:"center"},navigationButton:t=>({base:{width:"24px",height:"24px",backgroundColor:"transparent",border:"none",color:t?e.BASE_COLORS.grayscale[700]:e.BASE_COLORS.grayscale.white,fontSize:"20px",cursor:t?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s"},hover:{color:e.BASE_COLORS.warning[500]}})});
@@ -0,0 +1,16 @@
1
+ import { CSSProperties } from 'react';
2
+ export declare const getMinorPopupStyles: (startAnimation: boolean, transform: string) => {
3
+ container: CSSProperties;
4
+ imageContainer: CSSProperties;
5
+ imageWrapper: CSSProperties;
6
+ image: CSSProperties;
7
+ badge: CSSProperties;
8
+ badgeText: CSSProperties;
9
+ imagePlaceholder: CSSProperties;
10
+ contentContainer: CSSProperties;
11
+ title: CSSProperties;
12
+ content: CSSProperties;
13
+ actionsContainer: CSSProperties;
14
+ understoodText: CSSProperties;
15
+ exploreButton: CSSProperties;
16
+ };