@bikdotai/bik-component-library 0.0.721-beta.30 → 0.0.721-beta.32

package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("../../node_modules/react/jsx-runtime.js"),o=require("react"),n=require("react-joyride");require("./constants/animations.js");var r=require("./constants/selectors.js"),a=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:g,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:h,module:m,router:x}=d;var y;const{majorUpdateFeatures:S,minorUpdateFeatures:C,isLoading:k,markFeatureAsViewed:T}=a.useFeatureAnnouncements({fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:g,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:h,module:m,router:x}),[v,w]=o.useState(null),[j,E]=o.useState(null),[F,B]=o.useState(!1),[I,N]=o.useState([]),[q,P]=o.useState(!1),[M,R]=o.useState([]),[O,_]=o.useState(!1),[W,A]=o.useState(!1),[L,U]=o.useState([]),[V,$]=o.useState(!1),[z,H]=o.useState(!1),[J,Z]=o.useState(!1),[D,Q]=o.useState(""),[G,K]=o.useState(!1),[X,Y]=o.useState(!1),[ee,te]=o.useState(!1),[oe,ne]=o.useState(0),[re,ae]=o.useState(0);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((()=>{console.log("📋 joyrideSteps changed:",{length:I.length,runJoyride:F})}),[I,F]),o.useEffect((()=>{console.log("🎯 currentMinorFeature changed:",{id:(null==j?void 0:j.id)||"null"})}),[j]),o.useEffect((()=>{ne((e=>e+1)),ae((e=>e+1)),Y(!1),te(!1)}),[null==x?void 0:x.pathname]),o.useEffect((()=>{if(!(S.length>0)||v||k||O||G)0!==S.length||k||H(!0);else{H(!1),$(!1),B(!1),N([]),E(null),U([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?se(S[0]):setTimeout(e,1e3)};e()}}),[S,v,k,O,G]),o.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),A(!0);let n=0;const r=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),ge(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),A(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[C,null===(y=null==x?void 0:x.query)||void 0===y?void 0:y.featureId,k]),o.useEffect((()=>{var e;if(console.log("🔍 Main minor effect check:",{minorUpdateFeaturesCount:C.length,isLoading:k,runJoyride:F,isProcessingMinorUpdate:W,currentMinorFeature:(null==j?void 0:j.id)||"null",minorFeaturesSkipped:V,showMinorUpdates:z,blockPopups:G}),C.length>0&&!k&&!F&&!W&&!j&&!V&&z&&!G){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||W||j||V||!z)return;const r=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)}));r.length>0&&(console.log("🎉 Found available features:",r.length),U(r),ge(r[0],r),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}F||n||W||j||V||!z||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||W||j||V||!z||r()}),200))})),t=()=>{F||n||W||j||V||!z||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||W||j||V||!z||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||W||j||V||!z||r()}),100),setTimeout((()=>{n||W||j||V||!z||r()}),1e3),setTimeout((()=>{n||W||j||V||!z||r()}),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),N([]),E(null),U([]),$(!1))}}),[C,k,F,W,j,V,z,T,G]);const se=e=>{w(e);const o=S.findIndex((t=>t.id===e.id)),n=S.length,a=[{target:r.SELECTORS.WHATS_NEW_BUTTON,content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>ie(e),onExplore:()=>le(e),onPrevious:()=>de(e),onNext:()=>ue(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"}}}];R(a),P(!0)},ie=o.useCallback((e=>{(e||v)&&(_(!0),S.forEach((e=>{T(e.id)})),P(!1),w(null),R([]),H(!0),setTimeout((()=>{_(!1)}),500))}),[v,S,T]),le=o.useCallback((e=>{_(!0),T(e.id),e.productVideo&&(Q(e.productVideo),Z(!0),K(!0)),P(!1),w(null),R([]);S.findIndex((t=>t.id===e.id))===S.length-1&&H(!0),setTimeout((()=>{_(!1)}),500)}),[S,T]),de=o.useCallback((e=>{const o=e||v;if(!o)return;const n=S.findIndex((e=>e.id===o.id));if(n>0){const e=S[n-1];w(e);const o=n-1,r=S.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>ie(e),onExplore:()=>le(e),onPrevious:()=>de(e),onNext:()=>ue(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"}}}];R(a)}}),[v,S]),ue=o.useCallback((e=>{const o=e||v;if(!o)return;const n=S.findIndex((e=>e.id===o.id));if(n<S.length-1){const e=S[n+1];w(e);const o=n+1,r=S.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>ie(e),onExplore:()=>le(e),onPrevious:()=>de(e),onNext:()=>ue(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"}}}];R(a)}else _(!0),T(o.id),P(!1),w(null),R([]),H(!0),setTimeout((()=>{_(!1)}),500)}),[v,S,T]),ce=()=>{if(S.length>0&&!v){document.querySelector('[data-testid="whats-new-button"]')&&se(S[0])}};o.useEffect((()=>(window.showMajorUpdatePopup=ce,()=>{delete window.showMajorUpdatePopup})),[S,v]);const pe=o.useCallback((e=>{const{action:t}=e;t===n.ACTIONS.CLOSE&&(v&&(_(!0),S.forEach((e=>{T(e.id)})),H(!0),setTimeout((()=>{_(!1)}),500)),P(!1),w(null),R([]))}),[v,S,T]),fe=o.useCallback((e=>{const{action:t,type:o,status:r,lifecycle:a,index:s}=e;if(console.log("🔔 Minor Callback:",{action:t,type:o,status:r,lifecycle:a,index:s,hasSteps:I.length,runJoyride:F}),t===n.ACTIONS.CLOSE){if(console.log("❌ CLOSE ACTION - Clearing joyride"),j){A(!0),T(j.id);L.findIndex((e=>e.id===j.id))===L.length-1&&$(!0),setTimeout((()=>{A(!1)}),500)}B(!1),E(null),N([])}}),[j,L,T]),ge=(o,n)=>e.__awaiter(void 0,void 0,void 0,(function*(){E(o);const e=n||L,r=e.findIndex((e=>e.id===o.id)),a=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){console.warn("Scroll to element failed:",e)}const d=[{target:s,content:t.jsxRuntimeExports.jsx(i.default,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>be(o),onExplore:()=>he(o),onPrevious:()=>me(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"}}}];console.log("✅ Setting joyride:",{currentIndex:r,totalFeatures:a,hasFeatures:e.length,target:s}),N(d),B(!0)})),be=o.useCallback((e=>{const t=e||j;if(t){A(!0),T(t.id),B(!1),E(null),N([]);L.findIndex((e=>e.id===t.id))===L.length-1&&$(!0),setTimeout((()=>{A(!1)}),500)}}),[j,L,T]),he=o.useCallback((e=>{A(!0),T(e.id),e.productVideo&&(Q(e.productVideo),Z(!0),K(!0)),B(!1),E(null),N([]);L.findIndex((t=>t.id===e.id))===L.length-1&&$(!0),setTimeout((()=>{A(!1)}),500)}),[L,T]),me=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||j;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n>0){const e=L[n-1];E(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const a=n-1,s=L.length,l=[{target:o,content:t.jsxRuntimeExports.jsx(i.default,{feature:e,currentIndex:a,totalFeatures:s,onSkip:()=>be(e),onExplore:()=>he(e),onPrevious:()=>me(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)}}))),[j,L]),xe=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||j;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n<L.length-1){const e=L[n+1];E(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const a=n+1,s=L.length,l=[{target:o,content:t.jsxRuntimeExports.jsx(i.default,{feature:e,currentIndex:a,totalFeatures:s,onSkip:()=>be(e),onExplore:()=>he(e),onPrevious:()=>me(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),B(!1),E(null),N([]),setTimeout((()=>{A(!1)}),500)}))),[j,L,T]);return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[c,M.length>0&&t.jsxRuntimeExports.jsx(u.default,{steps:M,run:q,continuous:!1,showProgress:!1,showSkipButton:!1,callback:pe,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,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}`),I.length>0&&t.jsxRuntimeExports.jsx(u.default,{steps:I,run:F,continuous:!1,showProgress:!1,showSkipButton:!1,callback:fe,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-${re}`),t.jsxRuntimeExports.jsx(l.VideoModal,{isOpen:J,videoUrl:D,onClose:()=>{Z(!1),Q(""),K(!1)}})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("../../node_modules/react/jsx-runtime.js"),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 u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=u(n);exports.default=u=>{let{children:c,fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:g,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:m,module:h,router:x}=u;var y;const{majorUpdateFeatures:S,minorUpdateFeatures:C,legacyFeatures:k,isLoading:T,markFeatureAsViewed:w}=r.useFeatureAnnouncements({fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:g,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:m,module:h,router:x});o.useEffect((()=>{k.length>0&&("manifest"===h?console.warn(`FeatureAnnouncements: Unexpected legacy features in Manifest module: ${k.length}`):console.info(`FeatureAnnouncements: ${k.length} legacy feature(s) available for WhatsNew panel (BIK)`))}),[k,h]);const[v,j]=o.useState(null),[E,F]=o.useState(null),[B,I]=o.useState(!1),[N,q]=o.useState([]),[P,M]=o.useState(!1),[R,A]=o.useState([]),[O,W]=o.useState(!1),[_,L]=o.useState(!1),[U,V]=o.useState([]),[$,z]=o.useState(!1),[H,J]=o.useState(!1),[Z,D]=o.useState(!1),[K,Q]=o.useState(""),[G,X]=o.useState(!1),[Y,ee]=o.useState(!1),[te,oe]=o.useState(!1),[ne,ae]=o.useState(0),[re,se]=o.useState(0),[ie,le]=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((()=>{console.log("📋 joyrideSteps changed:",{length:N.length,runJoyride:B})}),[N,B]),o.useEffect((()=>{console.log("🎯 currentMinorFeature changed:",{id:(null==E?void 0:E.id)||"null"})}),[E]),o.useEffect((()=>{ae((e=>e+1)),se((e=>e+1)),ee(!1),oe(!1),le(new Set)}),[null==x?void 0:x.pathname]),o.useEffect((()=>{if(!(S.length>0)||v||T||O||G)0!==S.length||T||J(!0);else{J(!1),z(!1),I(!1),q([]),F(null),V([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?ue(S[0]):setTimeout(e,1e3)};e()}}),[S,v,T,O,G]),o.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:T,minorUpdateFeaturesCount:C.length}),!t||T||0===C.length)return;const o=C.find((e=>e.id===t));if(!o||!o.updates||!o.featureTag)return void console.warn("FeatureAnnouncements: Test mode feature missing required fields (updates/featureTag)");z(!0),L(!0);let n=0;const a=setInterval((()=>{if(n++,!o.featureTag)return;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),he(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===(y=null==x?void 0:x.query)||void 0===y?void 0:y.featureId,T]),o.useEffect((()=>{var e;if(console.log("🔍 Main minor effect check:",{minorUpdateFeaturesCount:C.length,isLoading:T,runJoyride:B,isProcessingMinorUpdate:_,currentMinorFeature:(null==E?void 0:E.id)||"null",minorFeaturesSkipped:$,showMinorUpdates:H,blockPopups:G}),C.length>0&&!T&&!B&&!_&&!E&&!$&&H&&!G){let e=null,t=null,o=null,n=!1;const a=()=>{if(n||_||E||$||!H)return;const a=C.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(ie.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&&(console.log("🎉 Found available features:",a.length),V(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}B||n||_||E||$||!H||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||_||E||$||!H||a()}),200))})),t=()=>{B||n||_||E||$||!H||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||_||E||$||!H||a()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),a(),setTimeout((()=>{n||_||E||$||!H||a()}),100),setTimeout((()=>{n||_||E||$||!H||a()}),1e3),setTimeout((()=>{n||_||E||$||!H||a()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===C.length||T){(null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId)&&E?console.log("🚫 Skipping joyride clear - test mode with active feature"):(console.log("🗑️ Clearing joyride - no features or loading"),I(!1),q([]),F(null),V([]),z(!1))}}),[C,T,B,_,E,$,H,w,G]);const ue=e=>{j(e);const o=S.findIndex((t=>t.id===e.id)),n=S.length,r=[{target:a.SELECTORS.WHATS_NEW_BUTTON,content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>de(e),onExplore:()=>ce(e),onPrevious:()=>pe(e),onNext:()=>fe(e),setIsClosing:ee}),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"}}}];A(r),M(!0)},de=o.useCallback((e=>{(e||v)&&(W(!0),S.forEach((e=>{w(e.id)})),M(!1),j(null),A([]),J(!0),setTimeout((()=>{W(!1)}),500))}),[v,S,w]),ce=o.useCallback((e=>{W(!0),w(e.id),e.productVideo&&(Q(e.productVideo),D(!0),X(!0)),M(!1),j(null),A([]);S.findIndex((t=>t.id===e.id))===S.length-1&&J(!0),setTimeout((()=>{W(!1)}),500)}),[S,w]),pe=o.useCallback((e=>{const o=e||v;if(!o)return;const n=S.findIndex((e=>e.id===o.id));if(n>0){const e=S[n-1];j(e);const o=n-1,a=S.length,r=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:a,onSkip:()=>de(e),onExplore:()=>ce(e),onPrevious:()=>pe(e),onNext:()=>fe(e),setIsClosing:ee}),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"}}}];A(r)}}),[v,S]),fe=o.useCallback((e=>{const o=e||v;if(!o)return;const n=S.findIndex((e=>e.id===o.id));if(n<S.length-1){const e=S[n+1];j(e);const o=n+1,a=S.length,r=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:a,onSkip:()=>de(e),onExplore:()=>ce(e),onPrevious:()=>pe(e),onNext:()=>fe(e),setIsClosing:ee}),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"}}}];A(r)}else W(!0),w(o.id),M(!1),j(null),A([]),J(!0),setTimeout((()=>{W(!1)}),500)}),[v,S,w]),ge=()=>{if(S.length>0&&!v){document.querySelector('[data-testid="whats-new-button"]')&&ue(S[0])}};o.useEffect((()=>(window.showMajorUpdatePopup=ge,()=>{delete window.showMajorUpdatePopup})),[S,v]);const be=o.useCallback((e=>{const{action:t}=e;t===n.ACTIONS.CLOSE&&(v&&(W(!0),S.forEach((e=>{w(e.id)})),J(!0),setTimeout((()=>{W(!1)}),500)),M(!1),j(null),A([]))}),[v,S,w]),me=o.useCallback((e=>{const{action:t,type:o,status:a,lifecycle:r,index:s}=e;if(console.log("🔔 Minor Callback:",{action:t,type:o,status:a,lifecycle:r,index:s,hasSteps:N.length,runJoyride:B}),t===n.ACTIONS.CLOSE){if(console.log("❌ CLOSE ACTION - Clearing joyride"),E){L(!0),w(E.id);U.findIndex((e=>e.id===E.id))===U.length-1&&z(!0),setTimeout((()=>{L(!1)}),500)}I(!1),F(null),q([])}}),[E,U,w]),he=(o,n)=>e.__awaiter(void 0,void 0,void 0,(function*(){if(F(o),!o.featureTag)return void console.warn("FeatureAnnouncements: Cannot show minor joyride without featureTag");const e=n||U,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){console.warn("Scroll to element failed:",e)}const u=[{target:s,content:t.jsxRuntimeExports.jsx(i.default,{feature:o,currentIndex:a,totalFeatures:r,onSkip:()=>xe(o),onExplore:()=>ye(o),onPrevious:()=>Se(o),onNext:()=>Ce(o),setIsClosing:oe}),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"}}}];console.log("✅ Setting joyride:",{currentIndex:a,totalFeatures:r,hasFeatures:e.length,target:s}),q(u),I(!0)})),xe=o.useCallback((e=>{const t=e||E;if(t){L(!0),w(t.id),le((e=>new Set(e).add(t.id))),I(!1),F(null),q([]);const e=U.find((e=>e.id!==t.id&&!ie.has(e.id)));setTimeout((()=>{L(!1),e?he(e,U):z(!0)}),500)}}),[E,U,w,ie]),ye=o.useCallback((e=>{L(!0),w(e.id),le((t=>new Set(t).add(e.id))),e.productVideo&&(Q(e.productVideo),D(!0),X(!0)),I(!1),F(null),q([]);const t=U.find((t=>t.id!==e.id&&!ie.has(t.id)));setTimeout((()=>{L(!1),t&&!e.productVideo?he(t,U):t||z(!0)}),500)}),[U,w,ie]),Se=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||E;if(!e)return;const n=U.findIndex((t=>t.id===e.id));if(n>0){const e=U[n-1];if(F(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Previous feature missing featureTag");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){console.warn("Scroll to previous element failed:",e)}const r=n-1,s=U.length,l=[{target:o,content:t.jsxRuntimeExports.jsx(i.default,{feature:e,currentIndex:r,totalFeatures:s,onSkip:()=>xe(e),onExplore:()=>ye(e),onPrevious:()=>Se(e),onNext:()=>Ce(e),setIsClosing:oe}),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"}}}];q(l)}}))),[E,U]),Ce=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||E;if(!e)return;const n=U.findIndex((t=>t.id===e.id));if(n<U.length-1){const e=U[n+1];if(F(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Next feature missing featureTag");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){console.warn("Scroll to next element failed:",e)}const r=n+1,s=U.length,l=[{target:o,content:t.jsxRuntimeExports.jsx(i.default,{feature:e,currentIndex:r,totalFeatures:s,onSkip:()=>xe(e),onExplore:()=>ye(e),onPrevious:()=>Se(e),onNext:()=>Ce(e),setIsClosing:oe}),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"}}}];q(l)}else L(!0),z(!0),w(e.id),I(!1),F(null),q([]),setTimeout((()=>{L(!1)}),500)}))),[E,U,w]);return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[c,R.length>0&&t.jsxRuntimeExports.jsx(d.default,{steps:R,run:P,continuous:!1,showProgress:!1,showSkipButton:!1,callback:be,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:Y?"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-${ne}`),N.length>0&&t.jsxRuntimeExports.jsx(d.default,{steps:N,run:B,continuous:!1,showProgress:!1,showSkipButton:!1,callback:me,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:te?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:te?"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-${re}`),t.jsxRuntimeExports.jsx(l.VideoModal,{isOpen:Z,videoUrl:K,onClose:()=>{D(!1),Q(""),X(!1);const e=U.find((e=>!ie.has(e.id)));e?setTimeout((()=>{he(e,U)}),300):z(!0)}})]})};

package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts

@@ -6,6 +6,7 @@ export declare const useFeatureAnnouncements: ({ fetchVisibleFeatures, getStoreF
     features: FeatureAnnouncement[];
     majorUpdateFeatures: FeatureAnnouncement[];
     minorUpdateFeatures: FeatureAnnouncement[];
+    legacyFeatures: FeatureAnnouncement[];
     isLoading: boolean;
     error: string | null;
     markFeatureAsViewed: (featureId: string) => Promise<void>;

package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.js

@@ -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}};
+"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=n=>{let{fetchVisibleFeatures:o,getStoreFeatureProgress:i,fetchFeatureById:l,markFeatureAsViewedForStore:u,isFeatureApplicableToCurrentPage:s,module:c,router:d}=n;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})(),[g,A]=t.useState([]),[S,_]=t.useState([]),[m,v]=t.useState([]),[y,E]=t.useState([]),[F,w]=t.useState(!1),[R,h]=t.useState(null),D=t.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){if(p){w(!0),h(null);try{const[e,t]=yield o(c);if(e||!t)return console.error("FeatureAnnouncements: Failed to fetch features",e),void h("Failed to fetch features");const[a,n]=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},g=t.filter((e=>{var t;return!((null===(t=null==n?void 0:n.viewedFeatures)||void 0===t?void 0:t[e.id])||!1)&&s(e)&&d(e)&&f(e)})),S=g.filter((e=>!e.updates)),m=g.filter((e=>e.updates)),y=m.filter((e=>"Major"===e.updates)),F=m.filter((e=>"Minor"===e.updates)),w=F.filter((e=>!e.featureTag));w.length>0&&console.warn("FeatureAnnouncements: Found Minor features without featureTag:",w.map((e=>e.id))),console.info("FeatureAnnouncements: Categorized features:",{legacy:S.length,major:y.length,minor:F.length}),A(m),E(S),_(y),setTimeout((()=>{v(F)}),r.ANIMATION_TIMING.MINOR_POPUP_DELAY)}catch(e){console.error("FeatureAnnouncements: Unexpected error in fetchFeatures",e),h("An unexpected error occurred")}finally{w(!1)}}}))),[p,o,i,s,c]),T=t.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){w(!0),h(null);try{const[e,r]=yield l(t);if(e||!r)return void h("Failed to fetch feature by ID");r.updates?"Major"===r.updates?(_([r]),A([r])):"Minor"===r.updates&&(v([r]),A([r])):E([r])}catch(e){h("An unexpected error occurred while fetching by ID")}finally{w(!1)}}))),[l]),O=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),A((e=>e.filter((e=>e.id!==t)))),_((e=>e.filter((e=>e.id!==t)))),v((e=>e.filter((e=>e.id!==t))))):(A((e=>e.filter((e=>e.id!==t)))),_((e=>e.filter((e=>e.id!==t)))),v((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):D()}),[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,D,T,d]),{features:g,majorUpdateFeatures:S,minorUpdateFeatures:m,legacyFeatures:y,isLoading:F,error:R,markFeatureAsViewed:O,refetch:D}};

package/dist/cjs/components/feature-announcements/types/feature.types.d.ts

@@ -7,6 +7,16 @@ export interface FirestoreTimestamp {
 }
 /**
  * Feature announcement data model
+ *
+ * LEGACY FEATURES (BIK only):
+ * - No `updates` field
+ * - Displayed in WhatsNew panel with HTML rendering
+ * - No popups
+ *
+ * POPUP FEATURES:
+ * - Have `updates: 'Major' | 'Minor'`
+ * - Major: No featureTag, anchored to WhatsNew button, requires pageUrls
+ * - Minor: Requires featureTag, anchored to UI elements
  */
 export interface FeatureAnnouncement {
     id: string;
@@ -15,14 +25,16 @@ export interface FeatureAnnouncement {
     content: string;
     buttonText: string;
     displayImage: string;
-    featureTag: string;
-    featureUpdateType: 'Major' | 'Minor';
+    /** Element selector - required for Minor popups, not used for Major */
+    featureTag?: string;
+    featureUpdateType?: 'Major' | 'Minor';
     image: string;
     module: string[];
     pageUrls: string[];
     productVideo: string;
     redirectUrl: string;
-    updates: string;
+    /** Distinguishes popup features ('Major'/'Minor') from legacy features (undefined/empty) */
+    updates?: 'Major' | 'Minor';
     visibility: boolean;
     createdAt: FirestoreTimestamp;
     expirationDate?: FirestoreTimestamp | string | Date;

package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js

@@ -1 +1 @@
-import{__awaiter as e}from"../../_virtual/_tslib.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import{useState as o,useEffect as n,useCallback as r}from"react";import a,{ACTIONS as i}from"react-joyride";import"./constants/animations.js";import{SELECTORS as s}from"./constants/selectors.js";import{useFeatureAnnouncements as l}from"./hooks/useFeatureAnnouncements.js";import d from"./MajorUpdatePopup.js";import u from"./MinorUpdatePopup.js";import{VideoModal as c}from"./VideoModal.js";const p=p=>{let{children:f,fetchVisibleFeatures:g,getStoreFeatureProgress:m,fetchFeatureById:b,markFeatureAsViewedForStore:h,isFeatureApplicableToCurrentPage:y,module:x,router:C}=p;var S;const{majorUpdateFeatures:k,minorUpdateFeatures:T,isLoading:w,markFeatureAsViewed:v}=l({fetchVisibleFeatures:g,getStoreFeatureProgress:m,fetchFeatureById:b,markFeatureAsViewedForStore:h,isFeatureApplicableToCurrentPage:y,module:x,router:C}),[j,B]=o(null),[F,I]=o(null),[E,N]=o(!1),[M,P]=o([]),[W,O]=o(!1),[q,L]=o([]),[U,A]=o(!1),[V,_]=o(!1),[R,$]=o([]),[z,H]=o(!1),[J,Z]=o(!1),[D,Q]=o(!1),[G,K]=o(""),[X,Y]=o(!1),[ee,te]=o(!1),[oe,ne]=o(!1),[re,ae]=o(0),[ie,se]=o(0);n((()=>{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()}}),[]),n((()=>{console.log("📋 joyrideSteps changed:",{length:M.length,runJoyride:E})}),[M,E]),n((()=>{console.log("🎯 currentMinorFeature changed:",{id:(null==F?void 0:F.id)||"null"})}),[F]),n((()=>{ae((e=>e+1)),se((e=>e+1)),te(!1),ne(!1)}),[null==C?void 0:C.pathname]),n((()=>{if(!(k.length>0)||j||w||U||X)0!==k.length||w||Z(!0);else{Z(!1),H(!1),N(!1),P([]),I(null),$([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?le(k[0]):setTimeout(e,1e3)};e()}}),[k,j,w,U,X]),n((()=>{var e;const t=null===(e=null==C?void 0:C.query)||void 0===e?void 0:e.featureId;if(console.log("🧪 Test mode effect triggered:",{featureIdFromQuery:t,isLoading:w,minorUpdateFeaturesCount:T.length}),!t||w||0===T.length)return;const o=T.find((e=>e.id===t));if(!o||!o.featureTag)return;H(!0),_(!0);let n=0;const r=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];$(e),be(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),_(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[T,null===(S=null==C?void 0:C.query)||void 0===S?void 0:S.featureId,w]),n((()=>{var e;if(console.log("🔍 Main minor effect check:",{minorUpdateFeaturesCount:T.length,isLoading:w,runJoyride:E,isProcessingMinorUpdate:V,currentMinorFeature:(null==F?void 0:F.id)||"null",minorFeaturesSkipped:z,showMinorUpdates:J,blockPopups:X}),T.length>0&&!w&&!E&&!V&&!F&&!z&&J&&!X){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||V||F||z||!J)return;const r=T.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)}));r.length>0&&(console.log("🎉 Found available features:",r.length),$(r),be(r[0],r),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||V||F||z||!J||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||V||F||z||!J||r()}),200))})),t=()=>{E||n||V||F||z||!J||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||V||F||z||!J||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||V||F||z||!J||r()}),100),setTimeout((()=>{n||V||F||z||!J||r()}),1e3),setTimeout((()=>{n||V||F||z||!J||r()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===T.length||w){(null===(e=null==C?void 0:C.query)||void 0===e?void 0:e.featureId)&&F?console.log("🚫 Skipping joyride clear - test mode with active feature"):(console.log("🗑️ Clearing joyride - no features or loading"),N(!1),P([]),I(null),$([]),H(!1))}}),[T,w,E,V,F,z,J,v,X]);const le=e=>{B(e);const o=k.findIndex((t=>t.id===e.id)),n=k.length,r=[{target:s.WHATS_NEW_BUTTON,content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:te}),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"}}}];L(r),O(!0)},de=r((e=>{(e||j)&&(A(!0),k.forEach((e=>{v(e.id)})),O(!1),B(null),L([]),Z(!0),setTimeout((()=>{A(!1)}),500))}),[j,k,v]),ue=r((e=>{A(!0),v(e.id),e.productVideo&&(K(e.productVideo),Q(!0),Y(!0)),O(!1),B(null),L([]);k.findIndex((t=>t.id===e.id))===k.length-1&&Z(!0),setTimeout((()=>{A(!1)}),500)}),[k,v]),ce=r((e=>{const o=e||j;if(!o)return;const n=k.findIndex((e=>e.id===o.id));if(n>0){const e=k[n-1];B(e);const o=n-1,r=k.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:te}),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"}}}];L(a)}}),[j,k]),pe=r((e=>{const o=e||j;if(!o)return;const n=k.findIndex((e=>e.id===o.id));if(n<k.length-1){const e=k[n+1];B(e);const o=n+1,r=k.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:te}),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"}}}];L(a)}else A(!0),v(o.id),O(!1),B(null),L([]),Z(!0),setTimeout((()=>{A(!1)}),500)}),[j,k,v]),fe=()=>{if(k.length>0&&!j){document.querySelector('[data-testid="whats-new-button"]')&&le(k[0])}};n((()=>(window.showMajorUpdatePopup=fe,()=>{delete window.showMajorUpdatePopup})),[k,j]);const ge=r((e=>{const{action:t}=e;t===i.CLOSE&&(j&&(A(!0),k.forEach((e=>{v(e.id)})),Z(!0),setTimeout((()=>{A(!1)}),500)),O(!1),B(null),L([]))}),[j,k,v]),me=r((e=>{const{action:t,type:o,status:n,lifecycle:r,index:a}=e;if(console.log("🔔 Minor Callback:",{action:t,type:o,status:n,lifecycle:r,index:a,hasSteps:M.length,runJoyride:E}),t===i.CLOSE){if(console.log("❌ CLOSE ACTION - Clearing joyride"),F){_(!0),v(F.id);R.findIndex((e=>e.id===F.id))===R.length-1&&H(!0),setTimeout((()=>{_(!1)}),500)}N(!1),I(null),P([])}}),[F,R,v]),be=(o,n)=>e(void 0,void 0,void 0,(function*(){I(o);const e=n||R,r=e.findIndex((e=>e.id===o.id)),a=e.length,i=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,s=document.querySelector(i);if(s)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(s,120)}catch(e){console.warn("Scroll to element failed:",e)}const l=[{target:i,content:t.jsx(u,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>he(o),onExplore:()=>ye(o),onPrevious:()=>xe(o),onNext:()=>Ce(o),setIsClosing:ne}),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"}}}];console.log("✅ Setting joyride:",{currentIndex:r,totalFeatures:a,hasFeatures:e.length,target:i}),P(l),N(!0)})),he=r((e=>{const t=e||F;if(t){_(!0),v(t.id),N(!1),I(null),P([]);R.findIndex((e=>e.id===t.id))===R.length-1&&H(!0),setTimeout((()=>{_(!1)}),500)}}),[F,R,v]),ye=r((e=>{_(!0),v(e.id),e.productVideo&&(K(e.productVideo),Q(!0),Y(!0)),N(!1),I(null),P([]);R.findIndex((t=>t.id===e.id))===R.length-1&&H(!0),setTimeout((()=>{_(!1)}),500)}),[R,v]),xe=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||F;if(!e)return;const n=R.findIndex((t=>t.id===e.id));if(n>0){const e=R[n-1];I(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const a=n-1,i=R.length,s=[{target:o,content:t.jsx(u,{feature:e,currentIndex:a,totalFeatures:i,onSkip:()=>he(e),onExplore:()=>ye(e),onPrevious:()=>xe(e),onNext:()=>Ce(e),setIsClosing:ne}),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"}}}];P(s)}}))),[F,R]),Ce=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||F;if(!e)return;const n=R.findIndex((t=>t.id===e.id));if(n<R.length-1){const e=R[n+1];I(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const a=n+1,i=R.length,s=[{target:o,content:t.jsx(u,{feature:e,currentIndex:a,totalFeatures:i,onSkip:()=>he(e),onExplore:()=>ye(e),onPrevious:()=>xe(e),onNext:()=>Ce(e),setIsClosing:ne}),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"}}}];P(s)}else _(!0),H(!0),v(e.id),N(!1),I(null),P([]),setTimeout((()=>{_(!1)}),500)}))),[F,R,v]);return t.jsxs(t.Fragment,{children:[f,q.length>0&&t.jsx(a,{steps:q,run:W,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ge,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ee?"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}`),M.length>0&&t.jsx(a,{steps:M,run:E,continuous:!1,showProgress:!1,showSkipButton:!1,callback:me,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:oe?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:oe?"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-${ie}`),t.jsx(c,{isOpen:D,videoUrl:G,onClose:()=>{Q(!1),K(""),Y(!1)}})]})};export{p as default};
+import{__awaiter as e}from"../../_virtual/_tslib.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import{useEffect as o,useState as n,useCallback as r}from"react";import a,{ACTIONS as i}from"react-joyride";import"./constants/animations.js";import{SELECTORS as s}from"./constants/selectors.js";import{useFeatureAnnouncements as l}from"./hooks/useFeatureAnnouncements.js";import d from"./MajorUpdatePopup.js";import u from"./MinorUpdatePopup.js";import{VideoModal as c}from"./VideoModal.js";const p=p=>{let{children:f,fetchVisibleFeatures:g,getStoreFeatureProgress:m,fetchFeatureById:h,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:y,module:x,router:T}=p;var S;const{majorUpdateFeatures:C,minorUpdateFeatures:w,legacyFeatures:k,isLoading:v,markFeatureAsViewed:F}=l({fetchVisibleFeatures:g,getStoreFeatureProgress:m,fetchFeatureById:h,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:y,module:x,router:T});o((()=>{k.length>0&&("manifest"===x?console.warn(`FeatureAnnouncements: Unexpected legacy features in Manifest module: ${k.length}`):console.info(`FeatureAnnouncements: ${k.length} legacy feature(s) available for WhatsNew panel (BIK)`))}),[k,x]);const[j,B]=n(null),[I,E]=n(null),[N,M]=n(!1),[P,W]=n([]),[A,O]=n(!1),[q,U]=n([]),[L,V]=n(!1),[$,_]=n(!1),[R,z]=n([]),[H,J]=n(!1),[Z,D]=n(!1),[K,Q]=n(!1),[G,X]=n(""),[Y,ee]=n(!1),[te,oe]=n(!1),[ne,re]=n(!1),[ae,ie]=n(0),[se,le]=n(0),[de,ue]=n(new Set);o((()=>{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((()=>{console.log("📋 joyrideSteps changed:",{length:P.length,runJoyride:N})}),[P,N]),o((()=>{console.log("🎯 currentMinorFeature changed:",{id:(null==I?void 0:I.id)||"null"})}),[I]),o((()=>{ie((e=>e+1)),le((e=>e+1)),oe(!1),re(!1),ue(new Set)}),[null==T?void 0:T.pathname]),o((()=>{if(!(C.length>0)||j||v||L||Y)0!==C.length||v||D(!0);else{D(!1),J(!1),M(!1),W([]),E(null),z([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?ce(C[0]):setTimeout(e,1e3)};e()}}),[C,j,v,L,Y]),o((()=>{var e;const t=null===(e=null==T?void 0:T.query)||void 0===e?void 0:e.featureId;if(console.log("🧪 Test mode effect triggered:",{featureIdFromQuery:t,isLoading:v,minorUpdateFeaturesCount:w.length}),!t||v||0===w.length)return;const o=w.find((e=>e.id===t));if(!o||!o.updates||!o.featureTag)return void console.warn("FeatureAnnouncements: Test mode feature missing required fields (updates/featureTag)");J(!0),_(!0);let n=0;const r=setInterval((()=>{if(n++,!o.featureTag)return;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];z(e),xe(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),_(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[w,null===(S=null==T?void 0:T.query)||void 0===S?void 0:S.featureId,v]),o((()=>{var e;if(console.log("🔍 Main minor effect check:",{minorUpdateFeaturesCount:w.length,isLoading:v,runJoyride:N,isProcessingMinorUpdate:$,currentMinorFeature:(null==I?void 0:I.id)||"null",minorFeaturesSkipped:H,showMinorUpdates:Z,blockPopups:Y}),w.length>0&&!v&&!N&&!$&&!I&&!H&&Z&&!Y){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||$||I||H||!Z)return;const r=w.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)}));r.length>0&&(console.log("🎉 Found available features:",r.length),z(r),xe(r[0],r),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||$||I||H||!Z||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||$||I||H||!Z||r()}),200))})),t=()=>{N||n||$||I||H||!Z||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||$||I||H||!Z||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||$||I||H||!Z||r()}),100),setTimeout((()=>{n||$||I||H||!Z||r()}),1e3),setTimeout((()=>{n||$||I||H||!Z||r()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===w.length||v){(null===(e=null==T?void 0:T.query)||void 0===e?void 0:e.featureId)&&I?console.log("🚫 Skipping joyride clear - test mode with active feature"):(console.log("🗑️ Clearing joyride - no features or loading"),M(!1),W([]),E(null),z([]),J(!1))}}),[w,v,N,$,I,H,Z,F,Y]);const ce=e=>{B(e);const o=C.findIndex((t=>t.id===e.id)),n=C.length,r=[{target:s.WHATS_NEW_BUTTON,content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>pe(e),onExplore:()=>fe(e),onPrevious:()=>ge(e),onNext:()=>me(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"}}}];U(r),O(!0)},pe=r((e=>{(e||j)&&(V(!0),C.forEach((e=>{F(e.id)})),O(!1),B(null),U([]),D(!0),setTimeout((()=>{V(!1)}),500))}),[j,C,F]),fe=r((e=>{V(!0),F(e.id),e.productVideo&&(X(e.productVideo),Q(!0),ee(!0)),O(!1),B(null),U([]);C.findIndex((t=>t.id===e.id))===C.length-1&&D(!0),setTimeout((()=>{V(!1)}),500)}),[C,F]),ge=r((e=>{const o=e||j;if(!o)return;const n=C.findIndex((e=>e.id===o.id));if(n>0){const e=C[n-1];B(e);const o=n-1,r=C.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>pe(e),onExplore:()=>fe(e),onPrevious:()=>ge(e),onNext:()=>me(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"}}}];U(a)}}),[j,C]),me=r((e=>{const o=e||j;if(!o)return;const n=C.findIndex((e=>e.id===o.id));if(n<C.length-1){const e=C[n+1];B(e);const o=n+1,r=C.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>pe(e),onExplore:()=>fe(e),onPrevious:()=>ge(e),onNext:()=>me(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"}}}];U(a)}else V(!0),F(o.id),O(!1),B(null),U([]),D(!0),setTimeout((()=>{V(!1)}),500)}),[j,C,F]),he=()=>{if(C.length>0&&!j){document.querySelector('[data-testid="whats-new-button"]')&&ce(C[0])}};o((()=>(window.showMajorUpdatePopup=he,()=>{delete window.showMajorUpdatePopup})),[C,j]);const be=r((e=>{const{action:t}=e;t===i.CLOSE&&(j&&(V(!0),C.forEach((e=>{F(e.id)})),D(!0),setTimeout((()=>{V(!1)}),500)),O(!1),B(null),U([]))}),[j,C,F]),ye=r((e=>{const{action:t,type:o,status:n,lifecycle:r,index:a}=e;if(console.log("🔔 Minor Callback:",{action:t,type:o,status:n,lifecycle:r,index:a,hasSteps:P.length,runJoyride:N}),t===i.CLOSE){if(console.log("❌ CLOSE ACTION - Clearing joyride"),I){_(!0),F(I.id);R.findIndex((e=>e.id===I.id))===R.length-1&&J(!0),setTimeout((()=>{_(!1)}),500)}M(!1),E(null),W([])}}),[I,R,F]),xe=(o,n)=>e(void 0,void 0,void 0,(function*(){if(E(o),!o.featureTag)return void console.warn("FeatureAnnouncements: Cannot show minor joyride without featureTag");const e=n||R,r=e.findIndex((e=>e.id===o.id)),a=e.length,i=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,s=document.querySelector(i);if(s)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(s,120)}catch(e){console.warn("Scroll to element failed:",e)}const l=[{target:i,content:t.jsx(u,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>Te(o),onExplore:()=>Se(o),onPrevious:()=>Ce(o),onNext:()=>we(o),setIsClosing:re}),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"}}}];console.log("✅ Setting joyride:",{currentIndex:r,totalFeatures:a,hasFeatures:e.length,target:i}),W(l),M(!0)})),Te=r((e=>{const t=e||I;if(t){_(!0),F(t.id),ue((e=>new Set(e).add(t.id))),M(!1),E(null),W([]);const e=R.find((e=>e.id!==t.id&&!de.has(e.id)));setTimeout((()=>{_(!1),e?xe(e,R):J(!0)}),500)}}),[I,R,F,de]),Se=r((e=>{_(!0),F(e.id),ue((t=>new Set(t).add(e.id))),e.productVideo&&(X(e.productVideo),Q(!0),ee(!0)),M(!1),E(null),W([]);const t=R.find((t=>t.id!==e.id&&!de.has(t.id)));setTimeout((()=>{_(!1),t&&!e.productVideo?xe(t,R):t||J(!0)}),500)}),[R,F,de]),Ce=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||I;if(!e)return;const n=R.findIndex((t=>t.id===e.id));if(n>0){const e=R[n-1];if(E(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Previous feature missing featureTag");const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const a=n-1,i=R.length,s=[{target:o,content:t.jsx(u,{feature:e,currentIndex:a,totalFeatures:i,onSkip:()=>Te(e),onExplore:()=>Se(e),onPrevious:()=>Ce(e),onNext:()=>we(e),setIsClosing:re}),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"}}}];W(s)}}))),[I,R]),we=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||I;if(!e)return;const n=R.findIndex((t=>t.id===e.id));if(n<R.length-1){const e=R[n+1];if(E(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Next feature missing featureTag");const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const a=n+1,i=R.length,s=[{target:o,content:t.jsx(u,{feature:e,currentIndex:a,totalFeatures:i,onSkip:()=>Te(e),onExplore:()=>Se(e),onPrevious:()=>Ce(e),onNext:()=>we(e),setIsClosing:re}),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"}}}];W(s)}else _(!0),J(!0),F(e.id),M(!1),E(null),W([]),setTimeout((()=>{_(!1)}),500)}))),[I,R,F]);return t.jsxs(t.Fragment,{children:[f,q.length>0&&t.jsx(a,{steps:q,run:A,continuous:!1,showProgress:!1,showSkipButton:!1,callback:be,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,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-${ae}`),P.length>0&&t.jsx(a,{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(c,{isOpen:K,videoUrl:G,onClose:()=>{Q(!1),X(""),ee(!1);const e=R.find((e=>!de.has(e.id)));e?setTimeout((()=>{xe(e,R)}),300):J(!0)}})]})};export{p as default};

package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts

@@ -6,6 +6,7 @@ export declare const useFeatureAnnouncements: ({ fetchVisibleFeatures, getStoreF
     features: FeatureAnnouncement[];
     majorUpdateFeatures: FeatureAnnouncement[];
     minorUpdateFeatures: FeatureAnnouncement[];
+    legacyFeatures: FeatureAnnouncement[];
     isLoading: boolean;
     error: string | null;
     markFeatureAsViewed: (featureId: string) => Promise<void>;

package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.js

@@ -1 +1 @@
-import{__awaiter as e}from"../../../_virtual/_tslib.js";import{useState as t,useCallback as r,useEffect as o}from"react";import{ANIMATION_TIMING as a}from"../constants/animations.js";import{QUERY_PARAMS as n,LOCAL_STORAGE_KEYS as i}from"../constants/localStorageKeys.js";const l=l=>{let{fetchVisibleFeatures:s,getStoreFeatureProgress:u,fetchFeatureById:d,markFeatureAsViewedForStore:c,isFeatureApplicableToCurrentPage:f,module:p,router:m}=l;var g;const y=(()=>{const[e,r]=t(null);return o((()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(i.STORE_ID)||localStorage.getItem(i.BIK_STORE_ID)||localStorage.getItem(i.CURRENT_STORE)||localStorage.getItem(i.STORE),!e){const t=localStorage.getItem(i.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(i.QUERY_PARAM))}catch(e){console.error("FeatureAnnouncements: Failed to get store ID",e)}r(e)}}),[]),e})(),[v,F]=t([]),[D,w]=t([]),[U,h]=t([]),[A,I]=t(!1),[R,S]=t(null),T=r((()=>e(void 0,void 0,void 0,(function*(){if(y){I(!0),S(null);try{const[e,t]=yield s(p);if(e||!t)return console.error("FeatureAnnouncements: Failed to fetch features",e),void S("Failed to fetch features");const[r,o]=yield u(y);r&&console.warn("FeatureAnnouncements: Progress fetch failed, treating all features as new",r);const n=new Date,i="undefined"!=typeof window?window.location.pathname:"",l=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()))&&n<t},d=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(i)}return!0},c=t.filter((e=>{var t;return!((null===(t=null==o?void 0:o.viewedFeatures)||void 0===t?void 0:t[e.id])||!1)&&f(e)&&l(e)&&d(e)})),m=c.filter((e=>"Major"===e.featureUpdateType)),g=c.filter((e=>"Minor"===e.featureUpdateType));F(c),w(m),setTimeout((()=>{h(g)}),a.MINOR_POPUP_DELAY)}catch(e){console.error("FeatureAnnouncements: Unexpected error in fetchFeatures",e),S("An unexpected error occurred")}finally{I(!1)}}}))),[y,s,u,f,p]),x=r((t=>e(void 0,void 0,void 0,(function*(){I(!0),S(null);try{const[e,r]=yield d(t);if(e||!r)return void S("Failed to fetch feature by ID");"Major"===r.featureUpdateType?w([r]):h([r]),F([r])}catch(e){S("An unexpected error occurred while fetching by ID")}finally{I(!1)}}))),[d]),E=r((t=>e(void 0,void 0,void 0,(function*(){if(!y)return;const[e]=yield c(y,t);e?(console.warn("FeatureAnnouncements: Failed to mark feature as viewed, removing from local state anyway",e),F((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),h((e=>e.filter((e=>e.id!==t))))):(F((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),h((e=>e.filter((e=>e.id!==t)))))}))),[y,c]);return o((()=>{var e;const t=null===(e=null==m?void 0:m.query)||void 0===e?void 0:e[n.FEATURE_ID];t&&m?x(t):T()}),[null==m?void 0:m.pathname,null===(g=null==m?void 0:m.query)||void 0===g?void 0:g[n.FEATURE_ID],y,T,x,m]),{features:v,majorUpdateFeatures:D,minorUpdateFeatures:U,isLoading:A,error:R,markFeatureAsViewed:E,refetch:T}};export{l as useFeatureAnnouncements};
+import{__awaiter as e}from"../../../_virtual/_tslib.js";import{useState as t,useCallback as r,useEffect as o}from"react";import{ANIMATION_TIMING as n}from"../constants/animations.js";import{QUERY_PARAMS as a,LOCAL_STORAGE_KEYS as i}from"../constants/localStorageKeys.js";const l=l=>{let{fetchVisibleFeatures:s,getStoreFeatureProgress:u,fetchFeatureById:d,markFeatureAsViewedForStore:c,isFeatureApplicableToCurrentPage:f,module:p,router:g}=l;var m;const v=(()=>{const[e,r]=t(null);return o((()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(i.STORE_ID)||localStorage.getItem(i.BIK_STORE_ID)||localStorage.getItem(i.CURRENT_STORE)||localStorage.getItem(i.STORE),!e){const t=localStorage.getItem(i.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(i.QUERY_PARAM))}catch(e){console.error("FeatureAnnouncements: Failed to get store ID",e)}r(e)}}),[]),e})(),[y,F]=t([]),[h,w]=t([]),[D,A]=t([]),[U,I]=t([]),[R,S]=t(!1),[x,T]=t(null),E=r((()=>e(void 0,void 0,void 0,(function*(){if(v){S(!0),T(null);try{const[e,t]=yield s(p);if(e||!t)return console.error("FeatureAnnouncements: Failed to fetch features",e),void T("Failed to fetch features");const[r,o]=yield u(v);r&&console.warn("FeatureAnnouncements: Progress fetch failed, treating all features as new",r);const a=new Date,i="undefined"!=typeof window?window.location.pathname:"",l=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()))&&a<t},d=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(i)}return!0},c=t.filter((e=>{var t;return!((null===(t=null==o?void 0:o.viewedFeatures)||void 0===t?void 0:t[e.id])||!1)&&f(e)&&l(e)&&d(e)})),g=c.filter((e=>!e.updates)),m=c.filter((e=>e.updates)),y=m.filter((e=>"Major"===e.updates)),h=m.filter((e=>"Minor"===e.updates)),D=h.filter((e=>!e.featureTag));D.length>0&&console.warn("FeatureAnnouncements: Found Minor features without featureTag:",D.map((e=>e.id))),console.info("FeatureAnnouncements: Categorized features:",{legacy:g.length,major:y.length,minor:h.length}),F(m),I(g),w(y),setTimeout((()=>{A(h)}),n.MINOR_POPUP_DELAY)}catch(e){console.error("FeatureAnnouncements: Unexpected error in fetchFeatures",e),T("An unexpected error occurred")}finally{S(!1)}}}))),[v,s,u,f,p]),_=r((t=>e(void 0,void 0,void 0,(function*(){S(!0),T(null);try{const[e,r]=yield d(t);if(e||!r)return void T("Failed to fetch feature by ID");r.updates?"Major"===r.updates?(w([r]),F([r])):"Minor"===r.updates&&(A([r]),F([r])):I([r])}catch(e){T("An unexpected error occurred while fetching by ID")}finally{S(!1)}}))),[d]),j=r((t=>e(void 0,void 0,void 0,(function*(){if(!v)return;const[e]=yield c(v,t);e?(console.warn("FeatureAnnouncements: Failed to mark feature as viewed, removing from local state anyway",e),F((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),A((e=>e.filter((e=>e.id!==t))))):(F((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),A((e=>e.filter((e=>e.id!==t)))))}))),[v,c]);return o((()=>{var e;const t=null===(e=null==g?void 0:g.query)||void 0===e?void 0:e[a.FEATURE_ID];t&&g?_(t):E()}),[null==g?void 0:g.pathname,null===(m=null==g?void 0:g.query)||void 0===m?void 0:m[a.FEATURE_ID],v,E,_,g]),{features:y,majorUpdateFeatures:h,minorUpdateFeatures:D,legacyFeatures:U,isLoading:R,error:x,markFeatureAsViewed:j,refetch:E}};export{l as useFeatureAnnouncements};

package/dist/esm/components/feature-announcements/types/feature.types.d.ts

@@ -7,6 +7,16 @@ export interface FirestoreTimestamp {
 }
 /**
  * Feature announcement data model
+ *
+ * LEGACY FEATURES (BIK only):
+ * - No `updates` field
+ * - Displayed in WhatsNew panel with HTML rendering
+ * - No popups
+ *
+ * POPUP FEATURES:
+ * - Have `updates: 'Major' | 'Minor'`
+ * - Major: No featureTag, anchored to WhatsNew button, requires pageUrls
+ * - Minor: Requires featureTag, anchored to UI elements
  */
 export interface FeatureAnnouncement {
     id: string;
@@ -15,14 +25,16 @@ export interface FeatureAnnouncement {
     content: string;
     buttonText: string;
     displayImage: string;
-    featureTag: string;
-    featureUpdateType: 'Major' | 'Minor';
+    /** Element selector - required for Minor popups, not used for Major */
+    featureTag?: string;
+    featureUpdateType?: 'Major' | 'Minor';
     image: string;
     module: string[];
     pageUrls: string[];
     productVideo: string;
     redirectUrl: string;
-    updates: string;
+    /** Distinguishes popup features ('Major'/'Minor') from legacy features (undefined/empty) */
+    updates?: 'Major' | 'Minor';
     visibility: boolean;
     createdAt: FirestoreTimestamp;
     expirationDate?: FirestoreTimestamp | string | Date;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.721-beta.30",
+	"version": "0.0.721-beta.32",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",