@bikdotai/bik-component-library 0.0.743-quick2 → 0.0.744-beta.1

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{CheckBox as r}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";import{BodyCaption as n}from"../../../../TypographyStyle.js";import{COLORS as s}from"../../../../../constants/Theme.js";import{FreeFormContainer as c}from"./FreeFormMenu.styled.js";const m=({searchedString:m,onSelect:l,isMultiSelect:a,version:p})=>{const[f,h]=o(!1);function u(){h(!f),l(!f)}return e(i,{version:p,onClick:e=>{e.preventDefault(),u()},listItem:{label:m,value:m},leadingIcon:a?e(r,{size:"2.0"===p?"SMALL":"DEFAULT",isChecked:f,onValueChange:u}):e(t,{}),trailingIcon:e(c,{children:e(n,Object.assign({style:{color:s.content.secondary}},{children:"Freeform"}))})})};export{m as FreeFormMenu};
+import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{CheckBox as r}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";import{BodyCaption as n}from"../../../../TypographyStyle.js";import{COLORS as s}from"../../../../../constants/Theme.js";import{FreeFormContainer as c}from"./FreeFormMenu.styled.js";const m=m=>{let{searchedString:l,onSelect:a,isMultiSelect:p,version:f}=m;const[h,u]=o(!1);function d(){u(!h),a(!h)}return e(i,{version:f,onClick:e=>{e.preventDefault(),d()},listItem:{label:l,value:l},leadingIcon:p?e(r,{size:"2.0"===f?"SMALL":"DEFAULT",isChecked:h,onValueChange:d}):e(t,{}),trailingIcon:e(c,{children:e(n,Object.assign({style:{color:s.content.secondary}},{children:"Freeform"}))})})};export{m as FreeFormMenu};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js

@@ -1,13 +1,13 @@
-import{jsx as e,Fragment as o,jsxs as t}from"react/jsx-runtime";import i from"../../../../../assets/icons/chevronRight.svg.js";import{forwardRef as n,useState as s}from"react";import r from"styled-components";import{CheckBox as l}from"../../../../checkBox/CheckBox.js";import{ListItem as a}from"../../../../list-item/ListItem.js";import{Tooltip as c}from"../../../../tooltips/Tooltip.js";import{BodyCaption as d}from"../../../../TypographyStyle.js";import{DEFAULT_THEME as p,COLORS as m}from"../../../../../constants/Theme.js";import{FreeFormContainer as u}from"./FreeFormMenu.styled.js";const g=r(a)`
+import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import n from"../../../../../assets/icons/chevronRight.svg.js";import{forwardRef as i,useState as r}from"react";import s from"styled-components";import{CheckBox as l}from"../../../../checkBox/CheckBox.js";import{ListItem as a}from"../../../../list-item/ListItem.js";import{Tooltip as c}from"../../../../tooltips/Tooltip.js";import{BodyCaption as d}from"../../../../TypographyStyle.js";import{DEFAULT_THEME as p,COLORS as m}from"../../../../../constants/Theme.js";import{FreeFormContainer as u}from"./FreeFormMenu.styled.js";const g=s(a)`
 	padding: ${e=>"2.0"===e.version?"8px 12px":"14px 16px"} !important;
 	cursor: pointer;
 	margin-top: ${e=>"2.0"===e.version?"2px":"0"};
-`,v=r.div`
+`,v=s.div`
 	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
-	border-radius: ${({version:e})=>"1.0"===e?"0":"8px"};
-	padding: ${({version:e})=>"1.0"===e?"0":"4px"};
+	border-radius: ${e=>{let{version:t}=e;return"1.0"===t?"0":"8px"}};
+	padding: ${e=>{let{version:t}=e;return"1.0"===t?"0":"4px"}};
 	min-width: 148px;
-	border: ${({version:e})=>"1.0"===e?`1px solid ${p.colorsV2.stroke.primary}`:"none"};
+	border: ${e=>{let{version:t}=e;return"1.0"===t?`1px solid ${p.colorsV2.stroke.primary}`:"none"}};
 	max-height: 248px;
 	overflow-y: auto;
-`,h=n(({option:n,isMultiSelect:r,showDescription:a,onSelect:h,last:b,version:x,onDropdownItemClick:f,useDefaultCursor:j,isFocused:y=!1,dataIndex:I=-1},C)=>{var O;console.log("MenuItem options",n);const[k,w]=s(n.selected),T=(e,o)=>{if(!e.children){D(!e.selected);const t=o?Object.assign(Object.assign({},e),{parent:o}):e;null==f||f(t)}},D=e=>{n.disabled||h(Object.assign(Object.assign({},n),{selected:e}))},F=j?{cursor:"default"}:{};return e(o,{children:e(c,Object.assign({body:"",tooltipContent:n.children?e("div",Object.assign({style:{backgroundColor:p.colorsV2.surface.standard},ref:C,onMouseEnter:()=>w(!0),onMouseLeave:()=>w(!1)},{children:e(v,Object.assign({version:null!=x?x:"2.0"},{children:n.children.map(o=>{var t;return e(g,{version:x,style:"1.0"!==x&&(null!==(t=null==n?void 0:n.children)&&void 0!==t?t:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),T(o,n)},listItem:{value:o.value,label:o.label},subText:o.subText,leadingIcon:o.leadingIcon||void 0,customComponent:o.customComponent,trailingIcon:o.trailingIcon||void 0,variant:n.disabled?"inactive":o.selected?"selected":"default"},o.value)})}))})):e(o,{}),placement:"right-start",hideArrow:!0},{children:e(g,{version:x,style:b?Object.assign({borderBottom:0},F):Object.assign({},F),onClick:e=>{e.preventDefault(),T(n)},onMouseOver:()=>{n.description?a(n.label,n.description):a()},listItem:{value:n.value,label:n.label},subText:n.subText,"data-option-index":I,role:"option",id:`dropdown-option-${I}`,"aria-selected":!!n.selected,leadingIcon:r?t("div",Object.assign({style:{display:"flex",alignContent:"center",justifyContent:"center",gap:8}},{children:[e(l,{size:"2.0"===x?"SMALL":"DEFAULT",isDisabled:null!==(O=n.disabled)&&void 0!==O&&O,isChecked:!!n.selected,onValueChange:D}),e("div",Object.assign({style:{marginRight:"-4px"}},{children:n.leadingIcon}))]})):n.leadingIcon?e(o,{children:n.leadingIcon}):void 0,customComponent:n.customComponent,trailingIcon:n.isFreeForm?e(u,{children:e(d,Object.assign({style:{color:m.content.secondary}},{children:"Freeform"}))}):n.children?e(i,{width:12,height:12}):n.trailingIcon?e(o,{children:n.trailingIcon}):void 0,variant:n.disabled?"inactive":y||n.selected||!r&&k?"selected":"default"})}))})});export{h as MenuItem};
+`,h=i(((i,s)=>{let{option:a,isMultiSelect:h,showDescription:b,onSelect:x,last:f,version:j,onDropdownItemClick:y,useDefaultCursor:I,isFocused:C=!1,dataIndex:O=-1}=i;var k;const[w,T]=r(a.selected),D=(e,t)=>{if(!e.children){F(!e.selected);const o=t?Object.assign(Object.assign({},e),{parent:t}):e;null==y||y(o)}},F=e=>{a.disabled||x(Object.assign(Object.assign({},a),{selected:e}))},$=I?{cursor:"default"}:{};return e(t,{children:e(c,Object.assign({body:"",tooltipContent:a.children?e("div",Object.assign({style:{backgroundColor:p.colorsV2.surface.standard},ref:s,onMouseEnter:()=>T(!0),onMouseLeave:()=>T(!1)},{children:e(v,Object.assign({version:null!=j?j:"2.0"},{children:a.children.map((t=>{var o;return e(g,{version:j,style:"1.0"!==j&&(null!==(o=null==a?void 0:a.children)&&void 0!==o?o:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),D(t,a)},listItem:{value:t.value,label:t.label},subText:t.subText,leadingIcon:t.leadingIcon||void 0,customComponent:t.customComponent,trailingIcon:t.trailingIcon||void 0,variant:a.disabled?"inactive":t.selected?"selected":"default"},t.value)}))}))})):e(t,{}),placement:"right-start",hideArrow:!0},{children:e(g,{version:j,style:f?Object.assign({borderBottom:0},$):Object.assign({},$),onClick:e=>{e.preventDefault(),D(a)},onMouseOver:()=>{a.description?b(a.label,a.description):b()},listItem:{value:a.value,label:a.label},subText:a.subText,"data-option-index":O,role:"option",id:`dropdown-option-${O}`,"aria-selected":!!a.selected,leadingIcon:h?o("div",Object.assign({style:{display:"flex",alignContent:"center",justifyContent:"center",gap:8}},{children:[e(l,{size:"2.0"===j?"SMALL":"DEFAULT",isDisabled:null!==(k=a.disabled)&&void 0!==k&&k,isChecked:!!a.selected,onValueChange:F}),e("div",Object.assign({style:{marginRight:"-4px"}},{children:a.leadingIcon}))]})):a.leadingIcon?e(t,{children:a.leadingIcon}):void 0,customComponent:a.customComponent,trailingIcon:a.isFreeForm?e(u,{children:e(d,Object.assign({style:{color:m.content.secondary}},{children:"Freeform"}))}):a.children?e(n,{width:12,height:12}):a.trailingIcon?e(t,{children:a.trailingIcon}):void 0,variant:a.disabled?"inactive":C||a.selected||!h&&w?"selected":"default"})}))})}));export{h as MenuItem};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js

@@ -1 +1 @@
-import{jsx as e,Fragment as n,jsxs as t}from"react/jsx-runtime";import{forwardRef as o,useRef as r,useCallback as s,useEffect as i}from"react";import{MenuItem as c}from"./MenuItem.js";import{StyledGroupedLabel as l}from"./MenuList.styled.js";const u=o(({options:o,isMultiSelect:u,showDescription:a,onSelect:d,version:p,onInfiniteScroll:f,onDropdownItemClick:m,useDefaultCursor:g,focusedIndex:h=-1},b)=>{const I=r(null),v=r(null),D=s(()=>{I.current&&I.current.disconnect(),I.current=new IntersectionObserver(e=>{e[0].isIntersecting&&(null==f||f())}),v.current&&I.current.observe(v.current)},[f]);i(()=>(D(),()=>{I.current&&I.current.disconnect()}),[D,o]);const j=new Map;let w=-1;return o.forEach(e=>{if(e.options)e.options.forEach(e=>{e.disabled||(w++,j.set(e,w))});else{const n=e;n.disabled||(w++,j.set(n,w))}}),e(n,{children:o.map((n,r)=>{console.log("MenuList options llop",n);const s=r===o.length-1;if(n.options){const o=n;return t("div",Object.assign({style:{marginTop:"2.0"===p?2:0}},{children:[t(l,Object.assign({version:p},{children:[o.leadingIcon?e("span",Object.assign({style:{marginRight:8}},{children:o.leadingIcon})):null,o.label]})),o.options.map((n,t)=>{const s=j.get(n),i=s===h&&!n.disabled;return e(c,{version:p,last:t===o.options.length-1,onSelect:d,showDescription:a,onDropdownItemClick:m,isMultiSelect:u,option:n,useDefaultCursor:g,isFocused:i,dataIndex:s,ref:e=>{b&&"object"==typeof b&&b.current&&e&&e&&e&&e&&(b.current[r]=e)}},`${r}-${n.value}`)}),s?e("span",{ref:v}):null]}),r)}const i=n,f=j.get(i),I=f===h&&!i.disabled;return t("div",{children:[e(c,{version:p,last:s,onSelect:d,showDescription:a,onDropdownItemClick:m,isMultiSelect:u,option:i,useDefaultCursor:g,isFocused:I,dataIndex:f,ref:e=>{b&&"object"==typeof b&&b.current&&e&&(b.current[r]=e)}},i.value),s?e("span",{ref:v}):null]},r)})})});export{u as MenuList};
+import{jsx as e,Fragment as n,jsxs as t}from"react/jsx-runtime";import{forwardRef as r,useRef as o,useCallback as s,useEffect as i}from"react";import{MenuItem as c}from"./MenuItem.js";import{StyledGroupedLabel as l}from"./MenuList.styled.js";const u=r(((r,u)=>{let{options:a,isMultiSelect:d,showDescription:p,onSelect:f,version:m,onInfiniteScroll:g,onDropdownItemClick:h,useDefaultCursor:b,focusedIndex:I=-1}=r;const D=o(null),j=o(null),v=s((()=>{D.current&&D.current.disconnect(),D.current=new IntersectionObserver((e=>{e[0].isIntersecting&&(null==g||g())})),j.current&&D.current.observe(j.current)}),[g]);i((()=>(v(),()=>{D.current&&D.current.disconnect()})),[v,a]);const w=new Map;let S=-1;return a.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||(S++,w.set(e,S))}));else{const n=e;n.disabled||(S++,w.set(n,S))}})),e(n,{children:a.map(((n,r)=>{const o=r===a.length-1;if(n.options){const s=n;return t("div",Object.assign({style:{marginTop:"2.0"===m?2:0}},{children:[t(l,Object.assign({version:m},{children:[s.leadingIcon?e("span",Object.assign({style:{marginRight:8}},{children:s.leadingIcon})):null,s.label]})),s.options.map(((n,t)=>{const o=w.get(n),i=o===I&&!n.disabled;return e(c,{version:m,last:t===s.options.length-1,onSelect:f,showDescription:p,onDropdownItemClick:h,isMultiSelect:d,option:n,useDefaultCursor:b,isFocused:i,dataIndex:o,ref:e=>{u&&"object"==typeof u&&u.current&&e&&e&&e&&e&&(u.current[r]=e)}},`${r}-${t}`)})),o?e("span",{ref:j}):null]}),r)}const s=n,i=w.get(s),g=i===I&&!s.disabled;return t("div",{children:[e(c,{version:m,last:o,onSelect:f,showDescription:p,onDropdownItemClick:h,isMultiSelect:d,option:s,useDefaultCursor:b,isFocused:g,dataIndex:i,ref:e=>{u&&"object"==typeof u&&u.current&&e&&(u.current[r]=e)}},r),o?e("span",{ref:j}):null]},r)}))})}));export{u as MenuList};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{useState as t,useEffect as l}from"react";import{CheckBox as o}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";const c=({options:c,onSelect:n,version:r})=>{const[s,a]=t("notSelected");function d(){"partiallySelected"===s&&n("notSelected"),"selectAll"===s&&n("notSelected"),"notSelected"===s&&n("selectAll")}return l(()=>{const e=[];c.filter(e=>!e.disabled).forEach(t=>{t.options?t.options.filter(e=>!e.disabled).forEach(t=>{e.push(t.selected||!1)}):e.push(t.selected||!1)}),e.every(Boolean)?a("selectAll"):e.filter(Boolean).length>0?a("partiallySelected"):a("notSelected")},[c]),e(i,{version:r,onClick:e=>{e.preventDefault(),d()},listItem:{label:"Select All",value:"All"},leadingIcon:e("div",Object.assign({style:{width:18,height:18}},{children:e(o,{size:"2.0"===r?"SMALL":"DEFAULT",isChecked:"selectAll"===s||"partiallySelected"===s,isPartiallyChecked:"partiallySelected"===s,onValueChange:d})})),variant:"default"})};export{c as SelectAllMenu};
+import{jsx as e}from"react/jsx-runtime";import{useState as t,useEffect as l}from"react";import{CheckBox as o}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";const c=c=>{let{options:n,onSelect:r,version:s}=c;const[a,d]=t("notSelected");function p(){"partiallySelected"===a&&r("notSelected"),"selectAll"===a&&r("notSelected"),"notSelected"===a&&r("selectAll")}return l((()=>{const e=[];n.filter((e=>!e.disabled)).forEach((t=>{t.options?t.options.filter((e=>!e.disabled)).forEach((t=>{e.push(t.selected||!1)})):e.push(t.selected||!1)})),e.every(Boolean)?d("selectAll"):e.filter(Boolean).length>0?d("partiallySelected"):d("notSelected")}),[n]),e(i,{version:s,onClick:e=>{e.preventDefault(),p()},listItem:{label:"Select All",value:"All"},leadingIcon:e("div",Object.assign({style:{width:18,height:18}},{children:e(o,{size:"2.0"===s?"SMALL":"DEFAULT",isChecked:"selectAll"===a||"partiallySelected"===a,isPartiallyChecked:"partiallySelected"===a,onValueChange:p})})),variant:"default"})};export{c as SelectAllMenu};

package/dist/esm/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js

@@ -1 +1 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as n}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{BottomBarContainer as s}from"./MultiSelectDropdownBottomBar.styled.js";const l=l=>{const{onClear:i,onApply:p,list:a,buttonText:c,buttonOptions:y}=l,{primaryButtonText:u,primaryButtonType:m,secondaryButtonText:d,secondaryButtonType:f}=null!=y?y:{},b=a.reduce((t,e)=>{if(e.options){return t+e.options.filter(t=>!0===t.selected).length}return e.selected?t+1:t},0);return t(s,Object.assign({style:{justifyContent:"space-between"}},{children:[e(n,Object.assign({style:{flex:1,color:r.content.primary}},{children:b?`${b} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:f||"primary",buttonText:d||"Clear",onClick:i}),e(o,{size:"small",buttonText:u||c||"Apply",buttonType:m||"primary",onClick:()=>{p()}})]}))]}))};export{l as default};
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as n}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{BottomBarContainer as s}from"./MultiSelectDropdownBottomBar.styled.js";const l=l=>{const{onClear:i,onApply:p,list:a,buttonText:c,buttonOptions:y}=l,{primaryButtonText:u,primaryButtonType:m,secondaryButtonText:d,secondaryButtonType:f}=null!=y?y:{},b=a.reduce(((t,e)=>{if(e.options){return t+e.options.filter((t=>!0===t.selected)).length}return e.selected?t+1:t}),0);return t(s,Object.assign({style:{justifyContent:"space-between"}},{children:[e(n,Object.assign({style:{flex:1,color:r.content.primary}},{children:b?`${b} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:f||"primary",buttonText:d||"Clear",onClick:i}),e(o,{size:"small",buttonText:u||c||"Apply",buttonType:m||"primary",onClick:()=>{p()}})]}))]}))};export{l as default};

package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js

@@ -1 +1 @@
-import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{IconButton as e}from"../../../../icon-button/IconButton.js";import{Input as n}from"../../../../input/Input.js";import{InputStyleContext as i}from"../../../../input/context/InputStyleProvider.js";import{COLORS as s}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import p from"../../../../../assets/icons/search.svg.js";const a=({onSearch:a,version:m})=>{const[h,l]=t(""),[d,u]=t(!1);return o(i.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===m?.5:1}px solid ${s.stroke.primary}`,padding:""+("2.0"===m?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:o(n,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===m?"small":"default",leftIcon:{icon:()=>o(p,{width:"2.0"===m?18:24,height:"2.0"===m?18:24,color:s.content.placeholder})},rightIcon:{icon:()=>h?o(e,{onClick:()=>{u(!0),a(""),l("")},Icon:c,width:"2.0"===m?18:24,height:"2.0"===m?18:24,iconColor:s.content.placeholder}):o(r,{})},reset:d,onChangeText:o=>{u(!1),l(o),a(o)}})}))};export{a as SearchBox};
+import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{IconButton as e}from"../../../../icon-button/IconButton.js";import{Input as n}from"../../../../input/Input.js";import{InputStyleContext as i}from"../../../../input/context/InputStyleProvider.js";import{COLORS as s}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import p from"../../../../../assets/icons/search.svg.js";const a=a=>{let{onSearch:m,version:l}=a;const[h,d]=t(""),[u,f]=t(!1);return o(i.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l?.5:1}px solid ${s.stroke.primary}`,padding:""+("2.0"===l?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:o(n,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===l?"small":"default",leftIcon:{icon:()=>o(p,{width:"2.0"===l?18:24,height:"2.0"===l?18:24,color:s.content.placeholder})},rightIcon:{icon:()=>h?o(e,{onClick:()=>{f(!0),m(""),d("")},Icon:c,width:"2.0"===l?18:24,height:"2.0"===l?18:24,iconColor:s.content.placeholder}):o(r,{})},reset:u,onChangeText:o=>{f(!1),d(o),m(o)}})}))};export{a as SearchBox};

package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{ZeroState as e}from"../../../../zeroState/ZeroState.js";const i=({searchedString:i,height:r,isLoading:n,containerWidth:o})=>t("div",Object.assign({style:{height:r,display:"flex",alignItems:"center"}},{children:t(e,{isLoading:n,title:"No results found",subTitle:`Sorry we could not find any results for "${null!=i?i:""}"`,containerWidth:o})}));export{i as SearchZeroState};
+import{jsx as t}from"react/jsx-runtime";import{ZeroState as e}from"../../../../zeroState/ZeroState.js";const i=i=>{let{searchedString:r,height:n,isLoading:o,containerWidth:s}=i;return t("div",Object.assign({style:{height:n,display:"flex",alignItems:"center"}},{children:t(e,{isLoading:o,title:"No results found",subTitle:`Sorry we could not find any results for "${null!=r?r:""}"`,containerWidth:s})}))};export{i as SearchZeroState};

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.js

@@ -1 +1 @@
-function n(n,t,s){return n.map(n=>{if(n.options){const e=n.options.map(n=>!s||s(n)?Object.assign(Object.assign({},n),t):Object.assign({},n));return Object.assign(Object.assign({},n),{options:[...e]})}return!s||s(n)?Object.assign(Object.assign({},n),t):Object.assign({},n)})}function t(n,t){n.forEach(n=>{n.options?n.options.forEach(t):t(n)})}function s(n){if(n&&n.length)return n.map(n=>{var t;const s=n;return null!==(t=s.selectedLabel)&&void 0!==t?t:s.label}).join(", ")}export{s as getSelectedOptionsAsText,n as iterateOnOptions,t as iterateOnOptionsRaw};
+function n(n,t,s){return n.map((n=>{if(n.options){const e=n.options.map((n=>!s||s(n)?Object.assign(Object.assign({},n),t):Object.assign({},n)));return Object.assign(Object.assign({},n),{options:[...e]})}return!s||s(n)?Object.assign(Object.assign({},n),t):Object.assign({},n)}))}function t(n,t){n.forEach((n=>{n.options?n.options.forEach(t):t(n)}))}function s(n){if(n&&n.length)return n.map((n=>{var t;const s=n;return null!==(t=s.selectedLabel)&&void 0!==t?t:s.label})).join(", ")}export{s as getSelectedOptionsAsText,n as iterateOnOptions,t as iterateOnOptionsRaw};

package/dist/esm/components/dropdown/hooks/useDropdown.js

@@ -1 +1 @@
-import{useState as e,useRef as t,useEffect as s}from"react";import{iterateOnOptionsRaw as l,iterateOnOptions as n}from"../OpenedDropdown/utils/iterationOnOptions.js";const c=(c="1.0",o,i,a,u,r,d,p=[],f)=>{console.log("useDropdown options",o);const[v,b]=e(null!=o?o:[]),[g,O]=e([]),[j,h]=e(""),m=t(v);s(()=>{if(m.current=v,g.length&&j&&r){let e=[...g];const t=v.map(e=>{if(e.options)return e.options.map(e=>({value:e.value,selected:e.selected}));const t=e;return{value:t.value,selected:t.selected}}).flat();e=e.map(e=>{const s=t.find(t=>e.value===t.value);return s?Object.assign(Object.assign({},e),{selected:s.selected}):e}),d&&(e=e.map(e=>Object.assign(Object.assign({},e),{disabled:!p.includes(e.value)}))),O(u&&!a?[...e.sort(e=>e.selected?-1:1)]:[...e])}},[v]),s(()=>{if(o){const e=[...o];b(u&&!a?[...e.sort(e=>e.selected?-1:1)]:[...e])}},[o]);const S=e=>{const t=[];return e.forEach(e=>{if(e.options){const s=e.options.filter(e=>!0===e.selected);t.push(Object.assign(Object.assign({},e),{options:[...s]}))}else e.selected&&t.push(Object.assign({},e))}),t},w=e=>{let t=0;return e.forEach(e=>{e.options?t+=e.options.filter(e=>!0===e.selected).length:e.selected&&t++}),t},F=e=>!(!u||!f&&0!==f)&&w(e)>=f;function A(e,t){if(u){if(e.selected&&f&&F(v))return;if(g.length&&j&&r)if(e.selected){if(f&&F(v))return;let s=!1;const l=n(v,{selected:e.selected},t=>t.value===e.value&&(s=!0,!0));if(s||l.push(e),t)return[...l];b([...l]),"2.0"===c&&C(l)}else{let s=!1,l=n(v,{selected:e.selected},t=>t.value===e.value&&(s=!0,!0));if(s&&(l=l.filter(t=>t.value!==e.value)),t)return[...l];b([...l]),"2.0"===c&&C(l)}else{const s=n(v,{selected:e.selected},t=>t.value===e.value);if(t)return[...s];b([...s]),"2.0"===c&&C(s)}}else null==i||i(e)}function C(e){const t=S(null!=e?e:m.current);null==i||i([...t])}return{latestDropdownOptionsRef:m,dropdownOptions:v,search:function(e){if(h(e),O([]),e&&r){const t=[];l(v,e=>{e.selected&&!t.includes(e.value)&&t.push(e.value)}),r(e).then(e=>{if(e){const s=e.map(e=>{if(e.options){const s=e;return Object.assign(Object.assign({},s),{options:s.options.map(e=>Object.assign(Object.assign({},e),{selected:t.includes(e.value)}))})}return Object.assign(Object.assign({},e),{selected:t.includes(e.value)})});O([...s])}})}},searchedString:j,searchedOptions:g,onApplyHandler:A,selectAllHandler:function(e){if(g.length&&j&&r)!function(e){let t=[...v];e?g.forEach(e=>{let s=!1;t=t.map(t=>{const l=e;return void 0!==l.value&&l.value===t.value?(s=!0,Object.assign(Object.assign({},t),{selected:!0})):t}),s||t.push(Object.assign(Object.assign({},e),{selected:!0}))}):g.forEach(e=>{t=t.map(t=>{const s=e;return void 0!==s.value&&s.value===t.value?Object.assign(Object.assign({},t),{selected:!1}):t})}),b([...t]),"2.0"===c&&C(t)}("selectAll"===e);else if("selectAll"===e){const e=n(v,{selected:!0},e=>{var t;return j?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(j.toLowerCase()))&&!e.disabled:!e.disabled});b([...e]),"2.0"===c&&C(e)}else if("notSelected"===e){const e=n(v,{selected:!1},e=>!e.disabled);b([...e]),"2.0"===c&&C(e)}},onMultiSelectClear:function(){const e=n(v,{selected:!1});b([...e]),"2.0"===c&&C(e)},onFreeFormSelect:function(e){if(!u)return void A({label:j,value:j,isFreeForm:!0,selected:!0});const t=v.map(t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===j&&t.value===j?e:t.selected}));e&&(t.some(e=>e.label===j&&e.value===j)||t.unshift({label:j,value:j,isFreeForm:!0,selected:!0})),b([...t]),"2.0"===c&&C(t)},onMultiSelectApply:C,getSelectedOptions:S,getCurrentSelectionCount:w,isMaxSelectionsReached:F,maxSelections:f}};export{c as useDropdown};
+import{useState as e,useRef as t,useEffect as s}from"react";import{iterateOnOptionsRaw as l,iterateOnOptions as n}from"../OpenedDropdown/utils/iterationOnOptions.js";const c=function(){let c=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"1.0",i=arguments.length>1?arguments[1]:void 0,o=arguments.length>2?arguments[2]:void 0,a=arguments.length>3?arguments[3]:void 0,u=arguments.length>4?arguments[4]:void 0,r=arguments.length>5?arguments[5]:void 0,d=arguments.length>6?arguments[6]:void 0,v=arguments.length>7&&void 0!==arguments[7]?arguments[7]:[],p=arguments.length>8?arguments[8]:void 0;const[f,g]=e(null!=i?i:[]),[b,h]=e([]),[O,j]=e(""),m=t(f);s((()=>{if(m.current=f,b.length&&O&&r){let e=[...b];const t=f.map((e=>{if(e.options)return e.options.map((e=>({value:e.value,selected:e.selected})));const t=e;return{value:t.value,selected:t.selected}})).flat();e=e.map((e=>{const s=t.find((t=>e.value===t.value));return s?Object.assign(Object.assign({},e),{selected:s.selected}):e})),d&&(e=e.map((e=>Object.assign(Object.assign({},e),{disabled:!v.includes(e.value)})))),h(u&&!a?[...e.sort((e=>e.selected?-1:1))]:[...e])}}),[f]),s((()=>{if(i){const e=[...i];g(u&&!a?[...e.sort((e=>e.selected?-1:1))]:[...e])}}),[i]);const S=e=>{const t=[];return e.forEach((e=>{if(e.options){const s=e.options.filter((e=>!0===e.selected));t.push(Object.assign(Object.assign({},e),{options:[...s]}))}else e.selected&&t.push(Object.assign({},e))})),t},F=e=>{let t=0;return e.forEach((e=>{e.options?t+=e.options.filter((e=>!0===e.selected)).length:e.selected&&t++})),t},w=e=>!(!u||!p&&0!==p)&&F(e)>=p;function A(e,t){if(u){if(e.selected&&p&&w(f))return;if(b.length&&O&&r)if(e.selected){if(p&&w(f))return;let s=!1;const l=n(f,{selected:e.selected},(t=>t.value===e.value&&(s=!0,!0)));if(s||l.push(e),t)return[...l];g([...l]),"2.0"===c&&C(l)}else{let s=!1,l=n(f,{selected:e.selected},(t=>t.value===e.value&&(s=!0,!0)));if(s&&(l=l.filter((t=>t.value!==e.value))),t)return[...l];g([...l]),"2.0"===c&&C(l)}else{const s=n(f,{selected:e.selected},(t=>t.value===e.value));if(t)return[...s];g([...s]),"2.0"===c&&C(s)}}else null==o||o(e)}function C(e){const t=S(null!=e?e:m.current);null==o||o([...t])}return{latestDropdownOptionsRef:m,dropdownOptions:f,search:function(e){if(j(e),h([]),e&&r){const t=[];l(f,(e=>{e.selected&&!t.includes(e.value)&&t.push(e.value)})),r(e).then((e=>{if(e){const s=e.map((e=>{if(e.options){const s=e;return Object.assign(Object.assign({},s),{options:s.options.map((e=>Object.assign(Object.assign({},e),{selected:t.includes(e.value)})))})}return Object.assign(Object.assign({},e),{selected:t.includes(e.value)})}));h([...s])}}))}},searchedString:O,searchedOptions:b,onApplyHandler:A,selectAllHandler:function(e){if(b.length&&O&&r)!function(e){let t=[...f];e?b.forEach((e=>{let s=!1;t=t.map((t=>{const l=e;return void 0!==l.value&&l.value===t.value?(s=!0,Object.assign(Object.assign({},t),{selected:!0})):t})),s||t.push(Object.assign(Object.assign({},e),{selected:!0}))})):b.forEach((e=>{t=t.map((t=>{const s=e;return void 0!==s.value&&s.value===t.value?Object.assign(Object.assign({},t),{selected:!1}):t}))})),g([...t]),"2.0"===c&&C(t)}("selectAll"===e);else if("selectAll"===e){const e=n(f,{selected:!0},(e=>{var t;return O?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(O.toLowerCase()))&&!e.disabled:!e.disabled}));g([...e]),"2.0"===c&&C(e)}else if("notSelected"===e){const e=n(f,{selected:!1},(e=>!e.disabled));g([...e]),"2.0"===c&&C(e)}},onMultiSelectClear:function(){const e=n(f,{selected:!1});g([...e]),"2.0"===c&&C(e)},onFreeFormSelect:function(e){if(!u)return void A({label:O,value:O,isFreeForm:!0,selected:!0});const t=f.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===O&&t.value===O?e:t.selected})));e&&(t.some((e=>e.label===O&&e.value===O))||t.unshift({label:O,value:O,isFreeForm:!0,selected:!0})),g([...t]),"2.0"===c&&C(t)},onMultiSelectApply:C,getSelectedOptions:S,getCurrentSelectionCount:F,isMaxSelectionsReached:w,maxSelections:p}};export{c as useDropdown};

package/dist/esm/components/dynamic-tabs/DynamicTabs.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{useState as t,useEffect as e}from"react";import{DEFAULT_THEME as r}from"../../constants/Theme.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{BodySecondary as i}from"../TypographyStyle.js";const l=l=>{var s;const[n,a]=t(0),{tabsInfo:p,tabStyleInfo:c}=l;return e(()=>{void 0!==l.selectedTabId&&null!==l.selectedTabId&&a(l.selectedTabId)},[l.selectedTabId]),o("div",Object.assign({style:null!==(s=l.wrapperStyle)&&void 0!==s?s:{}},{children:o("div",Object.assign({style:{display:"flex",alignItems:"center",borderColor:r.colorsV2.stroke.primary,backgroundColor:"SMALL"===(null==c?void 0:c.size)?"unset":r.colorsV2.surface.standard}},{children:p.map((t,e)=>{var s,u,b,y,v,f,g,m,R;const h="CAPSULE"===c.type?null!==(u=null===(s=c.style)||void 0===s?void 0:s.borderTopLeftRadius)&&void 0!==u?u:20:0===e&&"SQUARE"===c.type?(null===(b=c.style)||void 0===b?void 0:b.borderTopLeftRadius)?c.style.borderTopLeftRadius:4:0,L="CAPSULE"===c.type?null!==(v=null===(y=c.style)||void 0===y?void 0:y.borderTopLeftRadius)&&void 0!==v?v:20:e===p.length-1&&"SQUARE"===c.type?(null===(f=c.style)||void 0===f?void 0:f.borderTopLeftRadius)?c.style.borderTopLeftRadius:4:0,x=t.id===n?r.colorsV2.content.brand:r.colorsV2.stroke.primary;return o(d,Object.assign({},null!==(g=t.tooltipProps)&&void 0!==g?g:{},{children:o("div",Object.assign({onClick:()=>{(o=>{a(o.id),o.action(o.text)})(t)},style:{cursor:"pointer",display:"flex",flex:1,width:null!==(m=l.tabWidth)&&void 0!==m?m:"110px",borderTop:`1px solid ${x}`,borderBottom:`1px solid ${x}`,borderLeft:`1px solid ${x}`,borderRight:`${e===p.length-1&&"SQUARE"===c.type||"CAPSULE"===c.type||t.id===n?1:0}px solid ${x}`,backgroundColor:t.id===n?r.colorsV2.background.brandLight:r.colorsV2.surface.standard,borderTopLeftRadius:h,borderBottomLeftRadius:h,borderTopRightRadius:L,borderBottomRightRadius:L,padding:"SMALL"===(null==c?void 0:c.size)?"2px 14px":"8px 24px",marginRight:null===(R=c.style)||void 0===R?void 0:R.marginRight,justifyContent:"space-around"}},{children:o(i,Object.assign({style:{color:t.id===n?r.colorsV2.content.brand:r.colorsV2.content.secondary}},{children:t.text}))}))}),t.id)})}))}))};export{l as DynamicTabs};
+import{jsx as o}from"react/jsx-runtime";import{useState as t,useEffect as e}from"react";import{DEFAULT_THEME as r}from"../../constants/Theme.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{BodySecondary as i}from"../TypographyStyle.js";const l=l=>{var s;const[n,a]=t(0),{tabsInfo:p,tabStyleInfo:c}=l;return e((()=>{void 0!==l.selectedTabId&&null!==l.selectedTabId&&a(l.selectedTabId)}),[l.selectedTabId]),o("div",Object.assign({style:null!==(s=l.wrapperStyle)&&void 0!==s?s:{}},{children:o("div",Object.assign({style:{display:"flex",alignItems:"center",borderColor:r.colorsV2.stroke.primary,backgroundColor:"SMALL"===(null==c?void 0:c.size)?"unset":r.colorsV2.surface.standard}},{children:p.map(((t,e)=>{var s,u,b,y,v,f,g,m,R;const h="CAPSULE"===c.type?null!==(u=null===(s=c.style)||void 0===s?void 0:s.borderTopLeftRadius)&&void 0!==u?u:20:0===e&&"SQUARE"===c.type?(null===(b=c.style)||void 0===b?void 0:b.borderTopLeftRadius)?c.style.borderTopLeftRadius:4:0,L="CAPSULE"===c.type?null!==(v=null===(y=c.style)||void 0===y?void 0:y.borderTopLeftRadius)&&void 0!==v?v:20:e===p.length-1&&"SQUARE"===c.type?(null===(f=c.style)||void 0===f?void 0:f.borderTopLeftRadius)?c.style.borderTopLeftRadius:4:0,x=t.id===n?r.colorsV2.content.brand:r.colorsV2.stroke.primary;return o(d,Object.assign({},null!==(g=t.tooltipProps)&&void 0!==g?g:{},{children:o("div",Object.assign({onClick:()=>{(o=>{a(o.id),o.action(o.text)})(t)},style:{cursor:"pointer",display:"flex",flex:1,width:null!==(m=l.tabWidth)&&void 0!==m?m:"110px",borderTop:`1px solid ${x}`,borderBottom:`1px solid ${x}`,borderLeft:`1px solid ${x}`,borderRight:`${e===p.length-1&&"SQUARE"===c.type||"CAPSULE"===c.type||t.id===n?1:0}px solid ${x}`,backgroundColor:t.id===n?r.colorsV2.background.brandLight:r.colorsV2.surface.standard,borderTopLeftRadius:h,borderBottomLeftRadius:h,borderTopRightRadius:L,borderBottomRightRadius:L,padding:"SMALL"===(null==c?void 0:c.size)?"2px 14px":"8px 24px",marginRight:null===(R=c.style)||void 0===R?void 0:R.marginRight,justifyContent:"space-around"}},{children:o(i,Object.assign({style:{color:t.id===n?r.colorsV2.content.brand:r.colorsV2.content.secondary}},{children:t.text}))}))}),t.id)}))}))}))};export{l as DynamicTabs};

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

@@ -1 +1 @@
-import{__awaiter as t}from"../../_virtual/_tslib.js";import{jsx as e,jsxs as o,Fragment as n}from"react/jsx-runtime";import{useState as r,useEffect as a,useCallback as i}from"react";import s,{ACTIONS as d}from"react-joyride";import"./constants/animations.js";import{SELECTORS as l}from"./constants/selectors.js";import{useFeatureAnnouncements as u}from"./hooks/useFeatureAnnouncements.js";import c from"./MajorUpdatePopup.js";import p from"./MinorUpdatePopup.js";import{VideoModal as f}from"./VideoModal.js";const b=({children:b,fetchVisibleFeatures:m,getStoreFeatureProgress:g,fetchFeatureById:h,markFeatureAsViewedForStore:y,isFeatureApplicableToCurrentPage:x,module:C,router:S})=>{var k;const{majorUpdateFeatures:T,minorUpdateFeatures:w,isLoading:v,markFeatureAsViewed:B}=u({fetchVisibleFeatures:m,getStoreFeatureProgress:g,fetchFeatureById:h,markFeatureAsViewedForStore:y,isFeatureApplicableToCurrentPage:x,module:C,router:S}),[I,F]=r(null),[E,j]=r(null),[N,W]=r(!1),[P,M]=r([]),[O,q]=r(!1),[V,L]=r([]),[R,_]=r(!1),[A,U]=r(!1),[$,z]=r([]),[H,Z]=r(!1),[D,G]=r(!1),[J,K]=r(!1),[Q,X]=r(""),[Y,tt]=r(!1),[et,ot]=r(!1),[nt,rt]=r(!1),[at,it]=r(0),[st,dt]=r(0),[lt,ut]=r(new Set);a(()=>{const t="minor-spotlight-cutout-style";let e=document.getElementById(t);return e||(e=document.createElement("style"),e.id=t,document.head.appendChild(e)),e.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 e=document.getElementById(t);e&&e.remove()}},[]),a(()=>{it(t=>t+1),dt(t=>t+1),ot(!1),rt(!1),ut(new Set)},[null==S?void 0:S.pathname]),a(()=>{if(!(T.length>0)||I||v||R||Y)0!==T.length||v||G(!0);else{G(!1),Z(!1),W(!1),M([]),j(null),z([]);let t=0;const e=10,o=()=>{t++;document.querySelector('[data-testid="whats-new-button"]')?ct(T[0]):t<e?setTimeout(o,1e3):G(!0)};o()}},[T,I,v,R,Y]),a(()=>{var t;const e=null===(t=null==S?void 0:S.query)||void 0===t?void 0:t.featureId;if(!e||v||0===w.length)return;const o=w.find(t=>t.id===e);if(!o||!o.featureTag)return;Z(!0),U(!0);let n=0;const r=setInterval(()=>{n++;const t=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(t)){const t=[o];z(t),xt(o,t),clearInterval(r)}else n>=25&&(U(!1),clearInterval(r))},200);return()=>{clearInterval(r)}},[w,null===(k=null==S?void 0:S.query)||void 0===k?void 0:k.featureId,v]),a(()=>{var t;if(w.length>0&&!v&&!N&&!A&&!E&&!H&&D&&!Y){let t=null,e=null,o=null,n=!1;const r=()=>{if(n||A||E||H||!D)return;const r=w.filter(t=>{if(!t.featureTag||""===t.featureTag.trim())return!1;if(lt.has(t.id))return!1;const e=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`;return null!==document.querySelector(e)});r.length>0&&(z(r),xt(r[0],r),t&&(t.disconnect(),t=null),e&&(window.removeEventListener("scroll",e),e=null),o&&(clearTimeout(o),o=null))};return t=new MutationObserver(t=>{let e=!1;for(const o of t){if("childList"===o.type&&o.addedNodes.length>0)for(let t=0;t<o.addedNodes.length;t++){const n=o.addedNodes[t];if(n.nodeType===Node.ELEMENT_NODE){const t=n;if(t.id||t.querySelector("[id]")){e=!0;break}}}if(e)break}N||n||A||E||H||!D||!e||(o&&clearTimeout(o),o=setTimeout(()=>{n||A||E||H||!D||r()},200))}),e=()=>{N||n||A||E||H||!D||(o&&clearTimeout(o),requestAnimationFrame(()=>{o=setTimeout(()=>{n||A||E||H||!D||r()},300)}))},t&&t.observe(document.body,{childList:!0,subtree:!0}),e&&window.addEventListener("scroll",e,{passive:!0}),r(),setTimeout(()=>{n||A||E||H||!D||r()},100),setTimeout(()=>{n||A||E||H||!D||r()},1e3),setTimeout(()=>{n||A||E||H||!D||r()},500),()=>{n=!0,t&&t.disconnect(),e&&window.removeEventListener("scroll",e),o&&clearTimeout(o)}}if(0===w.length||v){(null===(t=null==S?void 0:S.query)||void 0===t?void 0:t.featureId)&&E||(W(!1),M([]),j(null),z([]),Z(!1))}},[w,v,N,A,E,H,D,B,Y]);const ct=t=>{F(t);const o=T.findIndex(e=>e.id===t.id),n=T.length,r=[{target:l.WHATS_NEW_BUTTON,content:e(c,{feature:t,currentIndex:o,totalFeatures:n,onSkip:()=>pt(t),onExplore:()=>ft(t),onPrevious:()=>bt(t),onNext:()=>mt(t),setIsClosing:ot}),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"}}}];L(r),q(!0)},pt=i(t=>{(t||I)&&(_(!0),T.forEach(t=>{B(t.id)}),q(!1),F(null),L([]),G(!0),setTimeout(()=>{_(!1)},500))},[I,T,B]),ft=i(t=>{_(!0),B(t.id),t.productVideo&&(X(t.productVideo),K(!0),tt(!0)),q(!1),F(null),L([]);T.findIndex(e=>e.id===t.id)===T.length-1&&G(!0),setTimeout(()=>{_(!1)},500)},[T,B]),bt=i(t=>{const o=t||I;if(!o)return;const n=T.findIndex(t=>t.id===o.id);if(n>0){const t=T[n-1];F(t);const o=n-1,r=T.length,a=[{target:'[data-testid="whats-new-button"]',content:e(c,{feature:t,currentIndex:o,totalFeatures:r,onSkip:()=>pt(t),onExplore:()=>ft(t),onPrevious:()=>bt(t),onNext:()=>mt(t),setIsClosing:ot}),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"}}}];L(a)}},[I,T]),mt=i(t=>{const o=t||I;if(!o)return;const n=T.findIndex(t=>t.id===o.id);if(n<T.length-1){const t=T[n+1];F(t);const o=n+1,r=T.length,a=[{target:'[data-testid="whats-new-button"]',content:e(c,{feature:t,currentIndex:o,totalFeatures:r,onSkip:()=>pt(t),onExplore:()=>ft(t),onPrevious:()=>bt(t),onNext:()=>mt(t),setIsClosing:ot}),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"}}}];L(a)}else _(!0),B(o.id),q(!1),F(null),L([]),G(!0),setTimeout(()=>{_(!1)},500)},[I,T,B]),gt=()=>{if(T.length>0&&!I){document.querySelector('[data-testid="whats-new-button"]')&&ct(T[0])}};a(()=>(window.showMajorUpdatePopup=gt,()=>{delete window.showMajorUpdatePopup}),[T,I]);const ht=i(t=>{const{action:e}=t;e===d.CLOSE&&(I&&(_(!0),T.forEach(t=>{B(t.id)}),G(!0),setTimeout(()=>{_(!1)},500)),q(!1),F(null),L([]))},[I,T,B]),yt=i(t=>{const{action:e}=t;if(e===d.CLOSE){if(E){U(!0),B(E.id);$.findIndex(t=>t.id===E.id)===$.length-1&&Z(!0),setTimeout(()=>{U(!1)},500)}W(!1),j(null),M([])}},[E,$,B]),xt=(o,n)=>t(void 0,void 0,void 0,function*(){j(o);const t=n||$,r=t.findIndex(t=>t.id===o.id),a=t.length,i=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,s=document.querySelector(i);if(s)try{const{scrollToElementSmooth:t}=yield import("./utils/elementHelpers.js");yield t(s,120)}catch(t){}const d=[{target:i,content:e(p,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>Ct(o),onExplore:()=>St(o),onPrevious:()=>kt(o),onNext:()=>Tt(o),setIsClosing:rt}),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"}}}];M(d),W(!0)}),Ct=i(t=>{const e=t||E;if(e){U(!0),B(e.id),ut(t=>new Set(t).add(e.id)),W(!1),j(null),M([]);const t=$.find(t=>t.id!==e.id&&!lt.has(t.id));setTimeout(()=>{U(!1),t?xt(t,$):Z(!0)},500)}},[E,$,B,lt]),St=i(t=>{U(!0),B(t.id),ut(e=>new Set(e).add(t.id)),t.productVideo&&(X(t.productVideo),K(!0),tt(!0)),W(!1),j(null),M([]);const e=$.find(e=>e.id!==t.id&&!lt.has(e.id));setTimeout(()=>{U(!1),e&&!t.productVideo?xt(e,$):e||Z(!0)},500)},[$,B,lt]),kt=i(o=>t(void 0,void 0,void 0,function*(){const t=o||E;if(!t)return;const n=$.findIndex(e=>e.id===t.id);if(n>0){const t=$[n-1];j(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:t}=yield import("./utils/elementHelpers.js");yield t(r,120)}catch(t){}const a=n-1,i=$.length,s=[{target:o,content:e(p,{feature:t,currentIndex:a,totalFeatures:i,onSkip:()=>Ct(t),onExplore:()=>St(t),onPrevious:()=>kt(t),onNext:()=>Tt(t),setIsClosing:rt}),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"}}}];M(s)}}),[E,$]),Tt=i(o=>t(void 0,void 0,void 0,function*(){const t=o||E;if(!t)return;const n=$.findIndex(e=>e.id===t.id);if(n<$.length-1){const t=$[n+1];j(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:t}=yield import("./utils/elementHelpers.js");yield t(r,120)}catch(t){}const a=n+1,i=$.length,s=[{target:o,content:e(p,{feature:t,currentIndex:a,totalFeatures:i,onSkip:()=>Ct(t),onExplore:()=>St(t),onPrevious:()=>kt(t),onNext:()=>Tt(t),setIsClosing:rt}),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"}}}];M(s)}else U(!0),Z(!0),B(t.id),W(!1),j(null),M([]),setTimeout(()=>{U(!1)},500)}),[E,$,B]);return o(n,{children:[b,V.length>0&&e(s,{steps:V,run:O,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ht,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:et?"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-${at}`),P.length>0&&e(s,{steps:P,run:N,continuous:!1,showProgress:!1,showSkipButton:!1,callback:yt,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:nt?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:nt?"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-${st}`),e(f,{isOpen:J,videoUrl:Q,onClose:()=>{K(!1),X(""),tt(!1);const t=$.find(t=>!lt.has(t.id));t?setTimeout(()=>{xt(t,$)},300):Z(!0)}})]})};export{b as default};
+import{__awaiter as t}from"../../_virtual/_tslib.js";import{jsx as e,jsxs as o,Fragment as n}from"react/jsx-runtime";import{useState as r,useEffect as a,useCallback as i}from"react";import s,{ACTIONS as d}from"react-joyride";import"./constants/animations.js";import{SELECTORS as l}from"./constants/selectors.js";import{useFeatureAnnouncements as u}from"./hooks/useFeatureAnnouncements.js";import c from"./MajorUpdatePopup.js";import p from"./MinorUpdatePopup.js";import{VideoModal as f}from"./VideoModal.js";const b=b=>{let{children:m,fetchVisibleFeatures:g,getStoreFeatureProgress:h,fetchFeatureById:y,markFeatureAsViewedForStore:x,isFeatureApplicableToCurrentPage:C,module:S,router:k}=b;var T;const{majorUpdateFeatures:w,minorUpdateFeatures:v,isLoading:B,markFeatureAsViewed:I}=u({fetchVisibleFeatures:g,getStoreFeatureProgress:h,fetchFeatureById:y,markFeatureAsViewedForStore:x,isFeatureApplicableToCurrentPage:C,module:S,router:k}),[F,E]=r(null),[j,N]=r(null),[W,P]=r(!1),[M,O]=r([]),[q,V]=r(!1),[L,R]=r([]),[_,A]=r(!1),[U,$]=r(!1),[z,H]=r([]),[Z,D]=r(!1),[G,J]=r(!1),[K,Q]=r(!1),[X,Y]=r(""),[tt,et]=r(!1),[ot,nt]=r(!1),[rt,at]=r(!1),[it,st]=r(0),[dt,lt]=r(0),[ut,ct]=r(new Set);a((()=>{const t="minor-spotlight-cutout-style";let e=document.getElementById(t);return e||(e=document.createElement("style"),e.id=t,document.head.appendChild(e)),e.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 e=document.getElementById(t);e&&e.remove()}}),[]),a((()=>{st((t=>t+1)),lt((t=>t+1)),nt(!1),at(!1),ct(new Set)}),[null==k?void 0:k.pathname]),a((()=>{if(!(w.length>0)||F||B||_||tt)0!==w.length||B||J(!0);else{J(!1),D(!1),P(!1),O([]),N(null),H([]);let t=0;const e=10,o=()=>{t++;document.querySelector('[data-testid="whats-new-button"]')?pt(w[0]):t<e?setTimeout(o,1e3):J(!0)};o()}}),[w,F,B,_,tt]),a((()=>{var t;const e=null===(t=null==k?void 0:k.query)||void 0===t?void 0:t.featureId;if(!e||B||0===v.length)return;const o=v.find((t=>t.id===e));if(!o||!o.featureTag)return;D(!0),$(!0);let n=0;const r=setInterval((()=>{n++;const t=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(t)){const t=[o];H(t),Ct(o,t),clearInterval(r)}else n>=25&&($(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[v,null===(T=null==k?void 0:k.query)||void 0===T?void 0:T.featureId,B]),a((()=>{var t;if(v.length>0&&!B&&!W&&!U&&!j&&!Z&&G&&!tt){let t=null,e=null,o=null,n=!1;const r=()=>{if(n||U||j||Z||!G)return;const r=v.filter((t=>{if(!t.featureTag||""===t.featureTag.trim())return!1;if(ut.has(t.id))return!1;const e=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`;return null!==document.querySelector(e)}));r.length>0&&(H(r),Ct(r[0],r),t&&(t.disconnect(),t=null),e&&(window.removeEventListener("scroll",e),e=null),o&&(clearTimeout(o),o=null))};return t=new MutationObserver((t=>{let e=!1;for(const o of t){if("childList"===o.type&&o.addedNodes.length>0)for(let t=0;t<o.addedNodes.length;t++){const n=o.addedNodes[t];if(n.nodeType===Node.ELEMENT_NODE){const t=n;if(t.id||t.querySelector("[id]")){e=!0;break}}}if(e)break}W||n||U||j||Z||!G||!e||(o&&clearTimeout(o),o=setTimeout((()=>{n||U||j||Z||!G||r()}),200))})),e=()=>{W||n||U||j||Z||!G||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||U||j||Z||!G||r()}),300)})))},t&&t.observe(document.body,{childList:!0,subtree:!0}),e&&window.addEventListener("scroll",e,{passive:!0}),r(),setTimeout((()=>{n||U||j||Z||!G||r()}),100),setTimeout((()=>{n||U||j||Z||!G||r()}),1e3),setTimeout((()=>{n||U||j||Z||!G||r()}),500),()=>{n=!0,t&&t.disconnect(),e&&window.removeEventListener("scroll",e),o&&clearTimeout(o)}}if(0===v.length||B){(null===(t=null==k?void 0:k.query)||void 0===t?void 0:t.featureId)&&j||(P(!1),O([]),N(null),H([]),D(!1))}}),[v,B,W,U,j,Z,G,I,tt]);const pt=t=>{E(t);const o=w.findIndex((e=>e.id===t.id)),n=w.length,r=[{target:l.WHATS_NEW_BUTTON,content:e(c,{feature:t,currentIndex:o,totalFeatures:n,onSkip:()=>ft(t),onExplore:()=>bt(t),onPrevious:()=>mt(t),onNext:()=>gt(t),setIsClosing:nt}),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"}}}];R(r),V(!0)},ft=i((t=>{(t||F)&&(A(!0),w.forEach((t=>{I(t.id)})),V(!1),E(null),R([]),J(!0),setTimeout((()=>{A(!1)}),500))}),[F,w,I]),bt=i((t=>{A(!0),I(t.id),t.productVideo&&(Y(t.productVideo),Q(!0),et(!0)),V(!1),E(null),R([]);w.findIndex((e=>e.id===t.id))===w.length-1&&J(!0),setTimeout((()=>{A(!1)}),500)}),[w,I]),mt=i((t=>{const o=t||F;if(!o)return;const n=w.findIndex((t=>t.id===o.id));if(n>0){const t=w[n-1];E(t);const o=n-1,r=w.length,a=[{target:'[data-testid="whats-new-button"]',content:e(c,{feature:t,currentIndex:o,totalFeatures:r,onSkip:()=>ft(t),onExplore:()=>bt(t),onPrevious:()=>mt(t),onNext:()=>gt(t),setIsClosing:nt}),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"}}}];R(a)}}),[F,w]),gt=i((t=>{const o=t||F;if(!o)return;const n=w.findIndex((t=>t.id===o.id));if(n<w.length-1){const t=w[n+1];E(t);const o=n+1,r=w.length,a=[{target:'[data-testid="whats-new-button"]',content:e(c,{feature:t,currentIndex:o,totalFeatures:r,onSkip:()=>ft(t),onExplore:()=>bt(t),onPrevious:()=>mt(t),onNext:()=>gt(t),setIsClosing:nt}),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"}}}];R(a)}else A(!0),I(o.id),V(!1),E(null),R([]),J(!0),setTimeout((()=>{A(!1)}),500)}),[F,w,I]),ht=()=>{if(w.length>0&&!F){document.querySelector('[data-testid="whats-new-button"]')&&pt(w[0])}};a((()=>(window.showMajorUpdatePopup=ht,()=>{delete window.showMajorUpdatePopup})),[w,F]);const yt=i((t=>{const{action:e}=t;e===d.CLOSE&&(F&&(A(!0),w.forEach((t=>{I(t.id)})),J(!0),setTimeout((()=>{A(!1)}),500)),V(!1),E(null),R([]))}),[F,w,I]),xt=i((t=>{const{action:e}=t;if(e===d.CLOSE){if(j){$(!0),I(j.id);z.findIndex((t=>t.id===j.id))===z.length-1&&D(!0),setTimeout((()=>{$(!1)}),500)}P(!1),N(null),O([])}}),[j,z,I]),Ct=(o,n)=>t(void 0,void 0,void 0,(function*(){N(o);const t=n||z,r=t.findIndex((t=>t.id===o.id)),a=t.length,i=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,s=document.querySelector(i);if(s)try{const{scrollToElementSmooth:t}=yield import("./utils/elementHelpers.js");yield t(s,120)}catch(t){}const d=[{target:i,content:e(p,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>St(o),onExplore:()=>kt(o),onPrevious:()=>Tt(o),onNext:()=>wt(o),setIsClosing:at}),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"}}}];O(d),P(!0)})),St=i((t=>{const e=t||j;if(e){$(!0),I(e.id),ct((t=>new Set(t).add(e.id))),P(!1),N(null),O([]);const t=z.find((t=>t.id!==e.id&&!ut.has(t.id)));setTimeout((()=>{$(!1),t?Ct(t,z):D(!0)}),500)}}),[j,z,I,ut]),kt=i((t=>{$(!0),I(t.id),ct((e=>new Set(e).add(t.id))),t.productVideo&&(Y(t.productVideo),Q(!0),et(!0)),P(!1),N(null),O([]);const e=z.find((e=>e.id!==t.id&&!ut.has(e.id)));setTimeout((()=>{$(!1),e&&!t.productVideo?Ct(e,z):e||D(!0)}),500)}),[z,I,ut]),Tt=i((o=>t(void 0,void 0,void 0,(function*(){const t=o||j;if(!t)return;const n=z.findIndex((e=>e.id===t.id));if(n>0){const t=z[n-1];N(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:t}=yield import("./utils/elementHelpers.js");yield t(r,120)}catch(t){}const a=n-1,i=z.length,s=[{target:o,content:e(p,{feature:t,currentIndex:a,totalFeatures:i,onSkip:()=>St(t),onExplore:()=>kt(t),onPrevious:()=>Tt(t),onNext:()=>wt(t),setIsClosing:at}),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"}}}];O(s)}}))),[j,z]),wt=i((o=>t(void 0,void 0,void 0,(function*(){const t=o||j;if(!t)return;const n=z.findIndex((e=>e.id===t.id));if(n<z.length-1){const t=z[n+1];N(t);const o=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:t}=yield import("./utils/elementHelpers.js");yield t(r,120)}catch(t){}const a=n+1,i=z.length,s=[{target:o,content:e(p,{feature:t,currentIndex:a,totalFeatures:i,onSkip:()=>St(t),onExplore:()=>kt(t),onPrevious:()=>Tt(t),onNext:()=>wt(t),setIsClosing:at}),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"}}}];O(s)}else $(!0),D(!0),I(t.id),P(!1),N(null),O([]),setTimeout((()=>{$(!1)}),500)}))),[j,z,I]);return o(n,{children:[m,L.length>0&&e(s,{steps:L,run:q,continuous:!1,showProgress:!1,showSkipButton:!1,callback:yt,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ot?"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-${it}`),M.length>0&&e(s,{steps:M,run:W,continuous:!1,showProgress:!1,showSkipButton:!1,callback:xt,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:rt?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:rt?"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-${dt}`),e(f,{isOpen:K,videoUrl:X,onClose:()=>{Q(!1),Y(""),et(!1);const t=z.find((t=>!ut.has(t.id)));t?setTimeout((()=>{Ct(t,z)}),300):D(!0)}})]})};export{b as default};

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

@@ -1 +1 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useState as n,useRef as s,useEffect as o}from"react";import{TEXT as r}from"./constants/index.js";import{getMajorPopupStyles as i}from"./styles/majorPopup.styles.js";import"../../constants/Theme.js";import"./constants/animations.js";import{decodeHTMLEntities as a}from"./utils/htmlHelpers.js";import{hideJoyrideArrow as l,calculateCloseTransform as c,executeAfterAnimation as u}from"./utils/animationHelpers.js";import{findWhatsNewButton as g}from"./utils/elementHelpers.js";const b=({feature:b,currentIndex:p,totalFeatures:m,onSkip:d,onExplore:j,onPrevious:v,onNext:y,setIsClosing:O})=>{const[T,h]=n(!1),[E,f]=n(!1),[B,I]=n(""),x=s(null);o(()=>{T&&f(!0)},[T]);const P=i(E,B);return t("div",Object.assign({ref:x,style:P.container},{children:[e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),(t=>{l(x.current);const e=g();if(e&&x.current){const t=c(x.current,e);I(t)}else I("scale(0)");null==O||O(!0),h(!0),u(t)})(d)},style:P.skipButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,P.skipButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,P.skipButton.base)},{children:r.SKIP_BUTTON})),e("div",Object.assign({style:P.imageContainer},{children:b.displayImage?e("img",{src:b.displayImage,alt:b.title,style:P.image,onError:t=>{b.image&&(t.target.src=b.image)}}):e("div",Object.assign({style:P.imagePlaceholder},{children:r.FEATURE_PREVIEW_PLACEHOLDER}))})),t("div",Object.assign({style:P.contentContainer},{children:[t("div",{children:[e("h3",Object.assign({style:P.title},{children:b.title})),e("div",{style:P.content,dangerouslySetInnerHTML:{__html:a(b.content||b.body||"")}}),e("button",Object.assign({onClick:()=>{j(),l(x.current);const t=g();if(t&&x.current){const e=c(x.current,t);I(e)}else I("scale(0)");null==O||O(!0),h(!0)},style:P.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,P.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,P.exploreButton.base)},{children:b.buttonText||r.DEFAULT_BUTTON_TEXT}))]}),m>1&&t("div",Object.assign({style:P.navigationContainer},{children:[e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),v()},disabled:0===p,style:P.navigationButton(0===p).base,onMouseEnter:t=>{0!==p&&Object.assign(t.currentTarget.style,P.navigationButton(!1).hover)},onMouseLeave:t=>{0!==p&&Object.assign(t.currentTarget.style,P.navigationButton(!1).base)}},{children:r.NAVIGATION_PREVIOUS})),e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),y()},disabled:p===m-1,style:P.navigationButton(p===m-1).base,onMouseEnter:t=>{p!==m-1&&Object.assign(t.currentTarget.style,P.navigationButton(!1).hover)},onMouseLeave:t=>{p!==m-1&&Object.assign(t.currentTarget.style,P.navigationButton(p===m-1).base)}},{children:r.NAVIGATION_NEXT}))]}))]}))]}))};export{b as default};
+import{jsxs as t,jsx as e,Fragment as n}from"react/jsx-runtime";import{useState as r,useRef as o,useEffect as s}from"react";import{TEXT as a}from"./constants/index.js";import{getMajorPopupStyles as i}from"./styles/majorPopup.styles.js";import"../../constants/Theme.js";import"./constants/animations.js";import{decodeHTMLEntities as l}from"./utils/htmlHelpers.js";import{hideJoyrideArrow as c,calculateCloseTransform as u,executeAfterAnimation as d}from"./utils/animationHelpers.js";import{findWhatsNewButton as p}from"./utils/elementHelpers.js";const g=g=>{let{feature:y,currentIndex:b,totalFeatures:h,onSkip:v,onExplore:j,onPrevious:f,onNext:m,setIsClosing:B,onSecondaryAction:O,ratio:k="16:9",padding:T}=g;const[x,w]=r(!1),[L,E]=r(!1),[C,M]=r(""),P=o(null),[U,_]=r(!1),[W,I]=r(!0),D=o(null);s((()=>{x&&E(!0)}),[x]);const S=()=>{j(),c(P.current);const t=p();if(t&&P.current){const e=u(P.current,t);M(e)}else M("scale(0)");null==B||B(!0),w(!0)},A=t=>{if(t.preventDefault(),t.stopPropagation(),y.secondaryButtonUrl){y.secondaryButtonUrl.startsWith("http")?window.open(y.secondaryButtonUrl,"_blank","noopener,noreferrer"):window.location.href=y.secondaryButtonUrl}O&&O(),c(P.current);const e=p();if(e&&P.current){const t=u(P.current,e);M(t)}else M("scale(0)");null==B||B(!0),w(!0)},H=i(L,C,k,T||y.padding,y.primaryButtonStyle,y.secondaryButtonStyle),F=t=>{t.stopPropagation(),D.current&&(D.current.paused?(D.current.play(),_(!1),I(!1)):(D.current.pause(),_(!0),I(!0)))};return t("div",Object.assign({ref:P,style:H.container},{children:[e("style",{children:"\n\t\t\t\t[data-popup-content] ul {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding-left: 20px;\n\t\t\t\t\tlist-style-type: disc;\n\t\t\t\t}\n\t\t\t\t[data-popup-content] ul li {\n\t\t\t\t\tmargin-bottom: 8px;\n\t\t\t\t\tcolor: rgba(255, 255, 255, 0.8);\n\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\tline-height: 16px;\n\t\t\t\t\tfont-family: Inter, sans-serif;\n\t\t\t\t}\n\t\t\t"}),t("div",Object.assign({style:H.contentWrapper},{children:[e("div",Object.assign({style:H.imageContainer},{children:y.productVideo?t(n,{children:[e("video",{ref:D,src:y.productVideo,style:H.image,autoPlay:!0,muted:!0,loop:!0,playsInline:!0,onClick:F,onPlay:()=>{I(!1)},onPause:()=>{I(!0)},"aria-label":`Product video for ${y.title}`}),(U||W)&&e("div",Object.assign({style:H.videoOverlay,onClick:F,role:"button",tabIndex:0,"aria-label":U?"Play video":"Pause video",onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),D.current&&(D.current.paused?(D.current.play(),_(!1),I(!1)):(D.current.pause(),_(!0),I(!0))))}},{children:e((()=>t("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",stroke:"currentColor",strokeWidth:"0",strokeLinecap:"round",strokeLinejoin:"round",style:H.playIcon},{children:[e("circle",{cx:"12",cy:"12",r:"10",fill:"rgba(0,0,0,0.5)",stroke:"none"}),e("polygon",{points:"10 8 16 12 10 16 10 8",fill:"#fff",stroke:"none"})]}))),{})}))]}):y.displayImage?e("img",{src:y.displayImage,alt:y.title,style:H.image,onError:t=>{y.image&&(t.target.src=y.image)}}):e("div",Object.assign({style:H.imagePlaceholder},{children:a.FEATURE_PREVIEW_PLACEHOLDER}))})),t("div",Object.assign({style:H.contentContainer},{children:[e("div",Object.assign({style:H.skipButtonContainer},{children:e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),(t=>{c(P.current);const e=p();if(e&&P.current){const t=u(P.current,e);M(t)}else M("scale(0)");null==B||B(!0),w(!0),d(t)})(v)},style:H.skipButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,H.skipButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,H.skipButton.base),"aria-label":"Skip feature announcement"},{children:"Skip"}))})),e("h3",Object.assign({style:H.title},{children:y.title})),e("div",{"data-popup-content":!0,style:H.content,dangerouslySetInnerHTML:{__html:l(y.content||y.body||"")}}),t("div",Object.assign({style:H.actionsWrapper},{children:[t("div",Object.assign({style:H.buttonsGroup},{children:[y.redirectUrl?e("a",Object.assign({href:y.redirectUrl,target:y.redirectUrl.startsWith("http")?"_blank":"_self",rel:y.redirectUrl.startsWith("http")?"noopener noreferrer":void 0,onClick:S,style:H.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,H.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,H.exploreButton.base)},{children:y.buttonText||a.DEFAULT_BUTTON_TEXT})):e("button",Object.assign({onClick:S,style:H.exploreButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,H.exploreButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,H.exploreButton.base)},{children:y.buttonText||a.DEFAULT_BUTTON_TEXT})),y.secondaryButtonText&&(y.secondaryButtonUrl?e("a",Object.assign({href:y.secondaryButtonUrl,target:y.secondaryButtonUrl.startsWith("http")?"_blank":"_self",rel:y.secondaryButtonUrl.startsWith("http")?"noopener noreferrer":void 0,onClick:A,style:H.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,H.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,H.secondaryButton.base)},{children:y.secondaryButtonText})):e("button",Object.assign({onClick:A,style:H.secondaryButton.base,onMouseEnter:t=>Object.assign(t.currentTarget.style,H.secondaryButton.hover),onMouseLeave:t=>Object.assign(t.currentTarget.style,H.secondaryButton.base)},{children:y.secondaryButtonText})))]})),h>1&&t("div",Object.assign({style:H.navigationContainer},{children:[e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),f()},disabled:0===b,style:H.navigationButton(0===b).base,onMouseEnter:t=>{0!==b&&Object.assign(t.currentTarget.style,H.navigationButton(!1).hover)},onMouseLeave:t=>{0!==b&&Object.assign(t.currentTarget.style,H.navigationButton(!1).base)}},{children:e("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e("path",{d:"M15 18L9 12L15 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}))})),e("button",Object.assign({onClick:t=>{t.preventDefault(),t.stopPropagation(),m()},disabled:b===h-1,style:H.navigationButton(b===h-1).base,onMouseEnter:t=>{b!==h-1&&Object.assign(t.currentTarget.style,H.navigationButton(!1).hover)},onMouseLeave:t=>{b!==h-1&&Object.assign(t.currentTarget.style,H.navigationButton(b===h-1).base)}},{children:e("svg",Object.assign({width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e("path",{d:"M9 18L15 12L9 6",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}))}))]}))]}))]}))]}))]}))};export{g as default};

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as s,useRef as n,useEffect as r}from"react";import{TEXT as i}from"./constants/index.js";import"../../constants/Theme.js";import"./constants/animations.js";import{getMinorPopupStyles as a}from"./styles/minorPopup.styles.js";import{decodeHTMLEntities as l}from"./utils/htmlHelpers.js";import{hideJoyrideArrow as o,calculateCloseTransform as c,executeAfterAnimation as d}from"./utils/animationHelpers.js";import{findFeatureTagElement as u}from"./utils/elementHelpers.js";const m=({feature:m,currentIndex:g,totalFeatures:p,onSkip:f,onExplore:T,onPrevious:h,onNext:y,setIsClosing:j})=>{const[b,E]=s(!1),[O,v]=s(!1),[x,_]=s(""),C=n(null);r(()=>{b&&v(!0)},[b]);const I=a(O,x);return e("div",Object.assign({ref:C,style:I.container},{children:[t("div",Object.assign({style:I.imageContainer},{children:m.displayImage?e("div",Object.assign({style:I.imageWrapper},{children:[t("img",{src:m.displayImage,alt:m.title,style:I.image,onError:e=>{m.image&&(e.target.src=m.image)}}),t("div",Object.assign({style:I.badge},{children:t("span",Object.assign({style:I.badgeText},{children:i.NEW_FEATURE_BADGE}))}))]})):t("div",Object.assign({style:I.imagePlaceholder},{children:i.FEATURE_PREVIEW_PLACEHOLDER}))})),e("div",Object.assign({style:I.contentContainer},{children:[e("div",{children:[t("h3",Object.assign({style:I.title},{children:m.title})),t("div",{style:I.content,dangerouslySetInnerHTML:{__html:l(m.content||m.body||"")}})]}),e("div",Object.assign({style:I.actionsContainer},{children:[t("span",Object.assign({onClick:()=>{(e=>{if(o(C.current),C.current&&m.featureTag){const e=u(m.featureTag);if(e){const t=c(C.current,e);_(t)}else _("scale(0)")}else _("scale(0)");null==j||j(!0),E(!0),d(e)})(f)},style:I.understoodText},{children:i.UNDERSTOOD})),m.productVideo&&t("button",Object.assign({onClick:()=>{if(T(),o(C.current),C.current&&m.featureTag){const e=m.featureTag.startsWith("#")||m.featureTag.startsWith(".")||m.featureTag.startsWith("[")?m.featureTag:`#${m.featureTag}`,t=document.querySelector(e);if(t){const e=c(C.current,t);_(e)}else _("scale(0)")}else _("scale(0)");null==j||j(!0),E(!0)},style:I.exploreButton},{children:m.buttonText||i.DEFAULT_BUTTON_TEXT}))]}))]}))]}))};export{m as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as s,useRef as n,useEffect as r}from"react";import{TEXT as i}from"./constants/index.js";import"../../constants/Theme.js";import"./constants/animations.js";import{getMinorPopupStyles as a}from"./styles/minorPopup.styles.js";import{decodeHTMLEntities as l}from"./utils/htmlHelpers.js";import{hideJoyrideArrow as o,calculateCloseTransform as c,executeAfterAnimation as d}from"./utils/animationHelpers.js";import{findFeatureTagElement as u}from"./utils/elementHelpers.js";const m=m=>{let{feature:g,currentIndex:p,totalFeatures:f,onSkip:T,onExplore:h,onPrevious:y,onNext:j,setIsClosing:b}=m;const[E,O]=s(!1),[v,x]=s(!1),[_,C]=s(""),I=n(null);r((()=>{E&&x(!0)}),[E]);const W=a(v,_);return e("div",Object.assign({ref:I,style:W.container},{children:[t("div",Object.assign({style:W.imageContainer},{children:g.displayImage?e("div",Object.assign({style:W.imageWrapper},{children:[t("img",{src:g.displayImage,alt:g.title,style:W.image,onError:e=>{g.image&&(e.target.src=g.image)}}),t("div",Object.assign({style:W.badge},{children:t("span",Object.assign({style:W.badgeText},{children:i.NEW_FEATURE_BADGE}))}))]})):t("div",Object.assign({style:W.imagePlaceholder},{children:i.FEATURE_PREVIEW_PLACEHOLDER}))})),e("div",Object.assign({style:W.contentContainer},{children:[e("div",{children:[t("h3",Object.assign({style:W.title},{children:g.title})),t("div",{style:W.content,dangerouslySetInnerHTML:{__html:l(g.content||g.body||"")}})]}),e("div",Object.assign({style:W.actionsContainer},{children:[t("span",Object.assign({onClick:()=>{(e=>{if(o(I.current),I.current&&g.featureTag){const e=u(g.featureTag);if(e){const t=c(I.current,e);C(t)}else C("scale(0)")}else C("scale(0)");null==b||b(!0),O(!0),d(e)})(T)},style:W.understoodText},{children:i.UNDERSTOOD})),g.productVideo&&t("button",Object.assign({onClick:()=>{if(h(),o(I.current),I.current&&g.featureTag){const e=g.featureTag.startsWith("#")||g.featureTag.startsWith(".")||g.featureTag.startsWith("[")?g.featureTag:`#${g.featureTag}`,t=document.querySelector(e);if(t){const e=c(I.current,t);C(e)}else C("scale(0)")}else C("scale(0)");null==b||b(!0),O(!0)},style:W.exploreButton},{children:g.buttonText||i.DEFAULT_BUTTON_TEXT}))]}))]}))]}))};export{m as default};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{TEXT as o}from"./constants/index.js";import"../../constants/Theme.js";import"./constants/animations.js";import{videoModalStyles as s}from"./styles/videoModal.styles.js";import{formatVideoUrl as r,isYouTubeVideo as i}from"./utils/htmlHelpers.js";const n=({isOpen:n,videoUrl:c,onClose:l})=>{if(!n)return null;const a=r(c),d=i(c);return e("div",Object.assign({style:s.backdrop,onClick:e=>{e.target===e.currentTarget&&l()}},{children:t("div",Object.assign({style:s.container,onClick:e=>e.stopPropagation()},{children:[e("button",Object.assign({onClick:l,style:s.closeButton.base,onMouseOver:e=>Object.assign(e.currentTarget.style,s.closeButton.hover),onMouseOut:e=>Object.assign(e.currentTarget.style,s.closeButton.base)},{children:"×"})),e("div",Object.assign({style:s.videoWrapper},{children:c?d?e("iframe",{width:"100%",height:"100%",src:a,title:o.VIDEO_MODAL_TITLE,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,style:s.iframe}):t("video",Object.assign({controls:!0,autoPlay:!0,style:s.video},{children:[e("source",{src:c,type:"video/mp4"}),e("source",{src:c,type:"video/webm"}),e("source",{src:c,type:"video/ogg"}),"Your browser does not support the video tag."]})):e("div",Object.assign({style:s.noVideoMessage},{children:o.NO_VIDEO_AVAILABLE}))}))]}))}))};export{n as VideoModal};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{TEXT as o}from"./constants/index.js";import"../../constants/Theme.js";import"./constants/animations.js";import{videoModalStyles as s}from"./styles/videoModal.styles.js";import{formatVideoUrl as r,isYouTubeVideo as i}from"./utils/htmlHelpers.js";const n=n=>{let{isOpen:c,videoUrl:l,onClose:a}=n;if(!c)return null;const d=r(l),p=i(l);return e("div",Object.assign({style:s.backdrop,onClick:e=>{e.target===e.currentTarget&&a()}},{children:t("div",Object.assign({style:s.container,onClick:e=>e.stopPropagation()},{children:[e("button",Object.assign({onClick:a,style:s.closeButton.base,onMouseOver:e=>Object.assign(e.currentTarget.style,s.closeButton.hover),onMouseOut:e=>Object.assign(e.currentTarget.style,s.closeButton.base)},{children:"×"})),e("div",Object.assign({style:s.videoWrapper},{children:l?p?e("iframe",{width:"100%",height:"100%",src:d,title:o.VIDEO_MODAL_TITLE,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0,style:s.iframe}):t("video",Object.assign({controls:!0,autoPlay:!0,style:s.video},{children:[e("source",{src:l,type:"video/mp4"}),e("source",{src:l,type:"video/webm"}),e("source",{src:l,type:"video/ogg"}),"Your browser does not support the video tag."]})):e("div",Object.assign({style:s.noVideoMessage},{children:o.NO_VIDEO_AVAILABLE}))}))]}))}))};export{n as VideoModal};

package/dist/esm/components/feature-announcements/constants/dimensions.d.ts

@@ -1,16 +1,12 @@
-/**
- * Popup dimension constants
- */
 export declare const POPUP_DIMENSIONS: {
     readonly MAJOR: {
-        readonly width: 959;
-        readonly height: 274;
-        readonly imageWidth: 480;
-        readonly imageHeight: 274;
-        readonly imageInnerWidth: 464;
-        readonly imageInnerHeight: 258;
-        readonly imagePlaceholderWidth: 290;
-        readonly imagePlaceholderHeight: 258;
+        readonly height: 224;
+        readonly textAreaWidth: 398;
+        readonly imageWidth: {
+            readonly '16:9': 398;
+            readonly '1:1': 224;
+            readonly '4:3': 299;
+        };
     };
     readonly MINOR: {
         readonly width: 519;
@@ -20,20 +16,41 @@ export declare const POPUP_DIMENSIONS: {
         readonly badgeHeight: 27;
     };
 };
+export declare const TEXT_LIMITS: {
+    readonly MAJOR: {
+        readonly TITLE: {
+            readonly MAX_LINES: 2;
+        };
+        readonly CONTENT: {
+            readonly MAX_LINES: 4;
+            readonly MAX_CHARS: 360;
+            readonly CHARS_PER_LINE: 72;
+        };
+    };
+};
 /**
  * Spacing constants
  */
 export declare const SPACING: {
     readonly MAJOR: {
-        readonly contentMargin: "0 8px 0 0";
-        readonly imagePadding: "8px";
-        readonly titlePadding: "36px 0 0 0";
-        readonly buttonMarginTop: "16px";
-        readonly skipButtonTop: "10px";
-        readonly skipButtonRight: "10px";
-        readonly navigationBottom: "16px";
-        readonly navigationRight: "16px";
-        readonly navigationGap: "8px";
+        readonly containerPadding: "16px";
+        readonly contentGap: "16px";
+        readonly titleBottom: "0px";
+        readonly listGap: "8px";
+        readonly actionsTop: "16px";
+        readonly headerMarginBottom: "8px";
+        readonly contentMarginLeft: "0px";
+        readonly skipButtonContainerMargin: "8px";
+        readonly contentMargin: "0 0 0 0px";
+        readonly imagePadding: "0px";
+        readonly titlePadding: "0 0 0px 0";
+        readonly buttonMarginTop: "0px";
+        readonly skipButtonPadding: "2px 4px";
+        readonly skipButtonTop: "8px";
+        readonly skipButtonRight: "8px";
+        readonly navigationBottom: "0px";
+        readonly navigationRight: "0px";
+        readonly navigationGap: "4px";
     };
     readonly MINOR: {
         readonly imageMargin: "13px 10px 13px 10px";
@@ -43,14 +60,71 @@ export declare const SPACING: {
         readonly actionsGap: "16px";
     };
 };
-/**
- * Border radius constants
- */
 export declare const BORDER_RADIUS: {
-    readonly POPUP: "4px";
-    readonly IMAGE: "4px";
+    readonly POPUP: "8px";
+    readonly IMAGE: "6px";
     readonly BUTTON: "4px";
     readonly VIDEO_MODAL: "12px";
     readonly CLOSE_BUTTON: "50%";
     readonly SPOTLIGHT: "8px";
 };
+/**
+ * Design tokens - Colors
+ */
+export declare const DESIGN_COLORS: {
+    readonly BACKGROUND: {
+        readonly SURFACE: "#212121";
+        readonly IMAGE: "#F0F0F0";
+    };
+    readonly TEXT: {
+        readonly PRIMARY: "#FFFFFF";
+        readonly SECONDARY: "rgba(255, 255, 255, 0.8)";
+        readonly TERTIARY: "#BDBDBD";
+    };
+    readonly BUTTON: {
+        readonly PRIMARY_TEXT: "#FEC02D";
+        readonly PRIMARY_BORDER: "#FEC02D";
+    };
+    readonly ICON: {
+        readonly DISABLED: "rgba(255, 255, 255, 0.3)";
+        readonly ENABLED: "#FFFFFF";
+    };
+};
+/**
+ * Design tokens - Typography
+ */
+export declare const DESIGN_TYPOGRAPHY: {
+    readonly SKIP_BUTTON: {
+        readonly fontSize: "14px";
+        readonly fontWeight: "600";
+        readonly lineHeight: "20px";
+        readonly fontFamily: "Inter, sans-serif";
+    };
+    readonly TITLE: {
+        readonly fontSize: "14px";
+        readonly fontWeight: "600";
+        readonly lineHeight: "20px";
+        readonly fontFamily: "Inter, sans-serif";
+    };
+    readonly CONTENT: {
+        readonly fontSize: "12px";
+        readonly fontWeight: "400";
+        readonly lineHeight: "16px";
+        readonly fontFamily: "Inter, sans-serif";
+    };
+    readonly BUTTON: {
+        readonly fontSize: "14px";
+        readonly fontWeight: "600";
+        readonly lineHeight: "20px";
+        readonly fontFamily: "Inter, sans-serif";
+    };
+};
+/**
+ * Design tokens - Dimensions
+ */
+export declare const DESIGN_DIMENSIONS: {
+    readonly IMAGE_HEIGHT: 224;
+    readonly NAVIGATION_BUTTON_SIZE: 24;
+    readonly BUTTON_HEIGHT: 32;
+    readonly BUTTON_PADDING_HORIZONTAL: "12px";
+};

package/dist/esm/components/feature-announcements/constants/dimensions.js

@@ -1 +1 @@
-const i={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}},t={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"}},p={POPUP:"4px",IMAGE:"4px",BUTTON:"4px",VIDEO_MODAL:"12px",CLOSE_BUTTON:"50%",SPOTLIGHT:"8px"};export{p as BORDER_RADIUS,i as POPUP_DIMENSIONS,t as SPACING};
+const t={MAJOR:{height:224,textAreaWidth:398,imageWidth:{"16:9":398,"1:1":224,"4:3":299}},MINOR:{width:519,height:160,imageWidth:235,imageHeight:134,badgeHeight:27}},i={MAJOR:{containerPadding:"16px",contentGap:"16px",titleBottom:"0px",listGap:"8px",actionsTop:"16px",headerMarginBottom:"8px",contentMarginLeft:"0px",skipButtonContainerMargin:"8px",contentMargin:"0 0 0 0px",imagePadding:"0px",titlePadding:"0 0 0px 0",buttonMarginTop:"0px",skipButtonPadding:"2px 4px",skipButtonTop:"8px",skipButtonRight:"8px",navigationBottom:"0px",navigationRight:"0px",navigationGap:"4px"},MINOR:{imageMargin:"13px 10px 13px 10px",contentMargin:"13px 13px 13px 3px",actionsBottom:"13px",actionsRight:"10px",actionsGap:"16px"}},n={POPUP:"8px",IMAGE:"6px",BUTTON:"4px",VIDEO_MODAL:"12px",CLOSE_BUTTON:"50%",SPOTLIGHT:"8px"},p={BACKGROUND:{SURFACE:"#212121",IMAGE:"#F0F0F0"},TEXT:{PRIMARY:"#FFFFFF",SECONDARY:"rgba(255, 255, 255, 0.8)",TERTIARY:"#BDBDBD"},BUTTON:{PRIMARY_TEXT:"#FEC02D",PRIMARY_BORDER:"#FEC02D"},ICON:{DISABLED:"rgba(255, 255, 255, 0.3)",ENABLED:"#FFFFFF"}},e={SKIP_BUTTON:{fontSize:"14px",fontWeight:"600",lineHeight:"20px",fontFamily:"Inter, sans-serif"},TITLE:{fontSize:"14px",fontWeight:"600",lineHeight:"20px",fontFamily:"Inter, sans-serif"},CONTENT:{fontSize:"12px",fontWeight:"400",lineHeight:"16px",fontFamily:"Inter, sans-serif"},BUTTON:{fontSize:"14px",fontWeight:"600",lineHeight:"20px",fontFamily:"Inter, sans-serif"}},x={IMAGE_HEIGHT:224,NAVIGATION_BUTTON_SIZE:24,BUTTON_HEIGHT:32,BUTTON_PADDING_HORIZONTAL:"12px"};export{n as BORDER_RADIUS,p as DESIGN_COLORS,x as DESIGN_DIMENSIONS,e as DESIGN_TYPOGRAPHY,t as POPUP_DIMENSIONS,i as SPACING};

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 i}from"../constants/animations.js";import{QUERY_PARAMS as a,LOCAL_STORAGE_KEYS as n}from"../constants/localStorageKeys.js";const l=({fetchVisibleFeatures:l,getStoreFeatureProgress:d,fetchFeatureById:u,markFeatureAsViewedForStore:s,isFeatureApplicableToCurrentPage:c,module:f,router:p})=>{var g;const v=(()=>{const[e,r]=t(null);return o(()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(n.STORE_ID)||localStorage.getItem(n.BIK_STORE_ID)||localStorage.getItem(n.CURRENT_STORE)||localStorage.getItem(n.STORE),!e){const t=localStorage.getItem(n.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(n.QUERY_PARAM))}catch(e){}r(e)}},[]),e})(),[y,m]=t([]),[D,U]=t([]),[w,h]=t([]),[R,I]=t(!1),[S,T]=t(null),x=r(()=>e(void 0,void 0,void 0,function*(){if(v){I(!0),T(null);try{const[e,t]=yield l(f);if(e||!t)return void T("Failed to fetch features");const[r,o]=yield d(v),a=new Date,n="undefined"!=typeof window?window.location.pathname:"",u=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},s=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.some(e=>{if(e===n)return!0;const t=e.replace(/\[([^\]]+)\]/g,"[^/]+").replace(/\//g,"\\/");return new RegExp(`^${t}$`).test(n)})}return!0},p=t.filter(e=>{var t;const r=(null===(t=null==o?void 0:o.viewedFeatures)||void 0===t?void 0:t[e.id])||!1,i=e.archived||!1,a=c(e),n=u(e),l=s(e);return!r&&!i&&a&&n&&l}),g=p.filter(e=>"Major"===e.featureUpdateType),y=p.filter(e=>"Minor"===e.featureUpdateType);m(p),U(g),setTimeout(()=>{h(y)},i.MINOR_POPUP_DELAY)}catch(e){T("An unexpected error occurred")}finally{I(!1)}}}),[v,l,d,c,f]),E=r(t=>e(void 0,void 0,void 0,function*(){I(!0),T(null);try{const[e,r]=yield u(t);if(e||!r)return void T("Failed to fetch feature by ID");"Major"===r.featureUpdateType?U([r]):h([r]),m([r])}catch(e){T("An unexpected error occurred while fetching by ID")}finally{I(!1)}}),[u]),F=r(t=>e(void 0,void 0,void 0,function*(){if(!v)return;const[e]=yield s(v,t);m(e=>e.filter(e=>e.id!==t)),U(e=>e.filter(e=>e.id!==t)),h(e=>e.filter(e=>e.id!==t))}),[v,s]);return o(()=>{var e;const t=null===(e=null==p?void 0:p.query)||void 0===e?void 0:e[a.FEATURE_ID];t&&p?E(t):x()},[null==p?void 0:p.pathname,null===(g=null==p?void 0:p.query)||void 0===g?void 0:g[a.FEATURE_ID],v,x,E,p]),{features:y,majorUpdateFeatures:D,minorUpdateFeatures:w,isLoading:R,error:S,markFeatureAsViewed:F,refetch:x}};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 i}from"../constants/animations.js";import{QUERY_PARAMS as a,LOCAL_STORAGE_KEYS as n}from"../constants/localStorageKeys.js";const l=l=>{let{fetchVisibleFeatures:d,getStoreFeatureProgress:u,fetchFeatureById:s,markFeatureAsViewedForStore:c,isFeatureApplicableToCurrentPage:f,module:p,router:g}=l;var v;const y=(()=>{const[e,r]=t(null);return o((()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(n.STORE_ID)||localStorage.getItem(n.BIK_STORE_ID)||localStorage.getItem(n.CURRENT_STORE)||localStorage.getItem(n.STORE),!e){const t=localStorage.getItem(n.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(n.QUERY_PARAM))}catch(e){}r(e)}}),[]),e})(),[m,D]=t([]),[U,w]=t([]),[h,R]=t([]),[I,S]=t(!1),[T,x]=t(null),E=r((()=>e(void 0,void 0,void 0,(function*(){if(y){S(!0),x(null);try{const[e,t]=yield d(p);if(e||!t)return void x("Failed to fetch features");const[r,o]=yield u(y),a=new Date,n="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},s=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.some((e=>{if(e===n)return!0;const t=e.replace(/\[([^\]]+)\]/g,"[^/]+").replace(/\//g,"\\/");return new RegExp(`^${t}$`).test(n)}))}return!0},c=t.filter((e=>{var t;const r=(null===(t=null==o?void 0:o.viewedFeatures)||void 0===t?void 0:t[e.id])||!1,i=e.archived||!1,a=f(e),n=l(e),d=s(e);return!r&&!i&&a&&n&&d})),g=c.filter((e=>"Major"===e.featureUpdateType)),v=c.filter((e=>"Minor"===e.featureUpdateType));D(c),w(g),setTimeout((()=>{R(v)}),i.MINOR_POPUP_DELAY)}catch(e){x("An unexpected error occurred")}finally{S(!1)}}}))),[y,d,u,f,p]),F=r((t=>e(void 0,void 0,void 0,(function*(){S(!0),x(null);try{const[e,r]=yield s(t);if(e||!r)return void x("Failed to fetch feature by ID");"Major"===r.featureUpdateType?w([r]):R([r]),D([r])}catch(e){x("An unexpected error occurred while fetching by ID")}finally{S(!1)}}))),[s]),A=r((t=>e(void 0,void 0,void 0,(function*(){if(!y)return;const[e]=yield c(y,t);D((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),R((e=>e.filter((e=>e.id!==t))))}))),[y,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?F(t):E()}),[null==g?void 0:g.pathname,null===(v=null==g?void 0:g.query)||void 0===v?void 0:v[a.FEATURE_ID],y,E,F,g]),{features:m,majorUpdateFeatures:U,minorUpdateFeatures:h,isLoading:I,error:T,markFeatureAsViewed:A,refetch:E}};export{l as useFeatureAnnouncements};

package/dist/esm/components/feature-announcements/styles/joyride.styles.d.ts

@@ -27,7 +27,7 @@ export declare const minorStepStyles: {
     tooltip: {
         padding: number;
         backgroundColor: string;
-        borderRadius: "4px";
+        borderRadius: "8px";
         border: string;
         filter: string;
         boxShadow: string;
@@ -101,7 +101,7 @@ export declare const getMinorJoyrideStyles: (isClosing: boolean) => {
     tooltip: {
         padding: number;
         backgroundColor: string;
-        borderRadius: "4px";
+        borderRadius: "8px";
         border: string;
         filter: string;
         boxShadow: string;

package/dist/esm/components/feature-announcements/styles/majorPopup.styles.d.ts

@@ -1,6 +1,9 @@
 import { CSSProperties } from 'react';
-export declare const getMajorPopupStyles: (startAnimation: boolean, transform: string) => {
+import { ButtonStyle } from '../types/feature.types';
+export declare const getMajorPopupStyles: (startAnimation: boolean, transform: string, ratio?: '16:9' | '1:1' | '4:3', padding?: string, primaryButtonStyle?: ButtonStyle, secondaryButtonStyle?: ButtonStyle) => {
     container: CSSProperties;
+    headerContainer: CSSProperties;
+    contentWrapper: CSSProperties;
     skipButton: {
         base: CSSProperties;
         hover: CSSProperties;
@@ -8,16 +11,29 @@ export declare const getMajorPopupStyles: (startAnimation: boolean, transform: s
     imageContainer: CSSProperties;
     image: CSSProperties;
     imagePlaceholder: CSSProperties;
+    videoOverlay: CSSProperties;
+    playIcon: CSSProperties;
     contentContainer: CSSProperties;
+    skipButtonContainer: CSSProperties;
     title: CSSProperties;
     content: CSSProperties;
+    actionsWrapper: CSSProperties;
+    buttonsGroup: CSSProperties;
     exploreButton: {
         base: CSSProperties;
         hover: CSSProperties;
     };
+    secondaryButton: {
+        base: CSSProperties;
+        hover: CSSProperties;
+    };
     navigationContainer: CSSProperties;
     navigationButton: (disabled: boolean) => {
         base: CSSProperties;
-        hover: CSSProperties;
+        hover: {
+            backgroundColor: string;
+        } | {
+            backgroundColor?: undefined;
+        };
     };
 };

package/dist/esm/components/feature-announcements/styles/majorPopup.styles.js

@@ -1 +1 @@
-import{BASE_COLORS as t}from"../../../constants/Theme.js";import{POPUP_TRANSITION as e}from"../constants/animations.js";import{POPUP_DIMENSIONS as n,BORDER_RADIUS as i,SPACING as o}from"../constants/dimensions.js";import{Z_INDEX as a}from"../constants/zIndex.js";const r=(r,l)=>({container:{width:`${n.MAJOR.width}px`,height:`${n.MAJOR.height}px`,display:"flex",backgroundColor:t.grayscale[900],borderRadius:i.POPUP,overflow:"hidden",position:"relative",transform:r?l:"scale(1)",opacity:r?0:1,transition:e},skipButton:{base:{position:"absolute",top:o.MAJOR.skipButtonTop,right:o.MAJOR.skipButtonRight,background:"transparent",border:"none",color:t.grayscale[400],fontSize:"14px",fontWeight:"500",cursor:"pointer",zIndex:a.SKIP_BUTTON,transition:"all 0.2s"},hover:{backgroundColor:t.grayscale[100],color:t.grayscale[700]}},imageContainer:{backgroundColor:t.grayscale[900],width:`${n.MAJOR.imageWidth}px`,height:`${n.MAJOR.imageHeight}px`,position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:o.MAJOR.imagePadding},image:{width:`${n.MAJOR.imageInnerWidth}px`,height:`${n.MAJOR.imageInnerHeight}px`,objectFit:"cover"},imagePlaceholder:{color:t.grayscale[500],fontSize:"14px",textAlign:"center",width:`${n.MAJOR.imagePlaceholderWidth}px`,height:`${n.MAJOR.imagePlaceholderHeight}px`,display:"flex",alignItems:"center",justifyContent:"center"},contentContainer:{flex:1,display:"flex",margin:o.MAJOR.contentMargin,flexDirection:"column",justifyContent:"space-between",background:"transparent"},title:{fontSize:"16px",fontWeight:"600",padding:o.MAJOR.titlePadding,color:t.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 ${t.warning[500]}`,color:t.warning[500],borderRadius:i.BUTTON,fontSize:"14px",fontWeight:"600",cursor:"pointer",width:"154px",height:"32px",transition:"all 0.2s",textAlign:"center",display:"flex",alignItems:"center",justifyContent:"center",marginTop:o.MAJOR.buttonMarginTop},hover:{backgroundColor:"rgba(254, 192, 45, 0.1)"}},navigationContainer:{position:"absolute",bottom:o.MAJOR.navigationBottom,right:o.MAJOR.navigationRight,display:"flex",gap:o.MAJOR.navigationGap,alignItems:"center"},navigationButton:e=>({base:{width:"24px",height:"24px",backgroundColor:"transparent",border:"none",color:e?t.grayscale[700]:t.grayscale.white,fontSize:"20px",cursor:e?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s"},hover:{color:t.warning[500]}})});export{r as getMajorPopupStyles};
+import{BASE_COLORS as t}from"../../../constants/Theme.js";import{POPUP_TRANSITION as o}from"../constants/animations.js";import{SPACING as n,POPUP_DIMENSIONS as e,DESIGN_COLORS as i,BORDER_RADIUS as r,DESIGN_TYPOGRAPHY as a,DESIGN_DIMENSIONS as l}from"../constants/dimensions.js";const d=(t,o)=>Object.assign(Object.assign(Object.assign(Object.assign({},t),(null==o?void 0:o.textColor)&&{color:o.textColor}),(null==o?void 0:o.backgroundColor)&&{backgroundColor:o.backgroundColor}),(null==o?void 0:o.borderColor)&&{borderColor:o.borderColor}),g=function(g,s){let c=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"16:9",T=arguments.length>3&&void 0!==arguments[3]?arguments[3]:n.MAJOR.containerPadding,p=arguments.length>4?arguments[4]:void 0,f=arguments.length>5?arguments[5]:void 0;const h=function(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"16:9";return e.MAJOR.imageWidth[t]||e.MAJOR.imageWidth["16:9"]}(c),u=parseInt(T,10)||16,O=l.IMAGE_HEIGHT+2*u;return{container:{width:`${u+h+parseInt(n.MAJOR.contentGap,10)+e.MAJOR.textAreaWidth+u}px`,height:"auto",minHeight:`${O}px`,display:"flex",flexDirection:"column",backgroundColor:i.BACKGROUND.SURFACE,borderRadius:r.BUTTON,overflow:"hidden",position:"relative",padding:T,transform:g?s:"scale(1)",opacity:g?0:1,transition:o,boxSizing:"border-box"},headerContainer:{width:"100%",display:"flex",justifyContent:"flex-end",marginBottom:n.MAJOR.headerMarginBottom,position:"relative"},contentWrapper:{display:"flex",flex:1,gap:n.MAJOR.contentGap},skipButton:{base:{background:"transparent",border:"none",color:i.TEXT.TERTIARY,fontSize:a.SKIP_BUTTON.fontSize,fontWeight:a.SKIP_BUTTON.fontWeight,cursor:"pointer",transition:"all 0.2s",padding:n.MAJOR.skipButtonPadding,borderRadius:r.BUTTON,fontFamily:a.SKIP_BUTTON.fontFamily,lineHeight:a.SKIP_BUTTON.lineHeight},hover:{backgroundColor:"rgba(255, 255, 255, 0.1)",color:i.TEXT.PRIMARY}},imageContainer:{backgroundColor:i.BACKGROUND.IMAGE,width:`${h}px`,height:`${l.IMAGE_HEIGHT}px`,position:"relative",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:r.BUTTON,overflow:"hidden",flexShrink:0},image:{width:"100%",height:"100%",objectFit:"cover"},imagePlaceholder:{color:t.grayscale[500],fontSize:"14px",textAlign:"center",width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:t.grayscale[800]},videoOverlay:{position:"absolute",top:0,left:0,width:"100%",height:"100%",backgroundColor:"rgba(0,0,0,0.4)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",zIndex:10,transition:"opacity 0.2s"},playIcon:{width:"84px",height:"84px",color:"#060606ff"},contentContainer:{flex:1,display:"flex",marginLeft:n.MAJOR.contentMarginLeft,flexDirection:"column",justifyContent:"flex-start",background:"transparent",maxWidth:`${e.MAJOR.textAreaWidth}px`,gap:n.MAJOR.listGap},skipButtonContainer:{width:"100%",display:"flex",justifyContent:"flex-end",marginBottom:n.MAJOR.skipButtonContainerMargin},title:{fontSize:a.TITLE.fontSize,fontWeight:a.TITLE.fontWeight,marginBottom:n.MAJOR.titleBottom,padding:0,color:i.TEXT.PRIMARY,lineHeight:a.TITLE.lineHeight,textAlign:"left",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden",fontFamily:a.TITLE.fontFamily},content:{fontSize:a.CONTENT.fontSize,lineHeight:a.CONTENT.lineHeight,color:i.TEXT.SECONDARY,textAlign:"left",marginBottom:"auto",fontFamily:a.CONTENT.fontFamily,fontWeight:a.CONTENT.fontWeight},actionsWrapper:{display:"flex",alignItems:"center",justifyContent:"space-between",marginTop:n.MAJOR.actionsTop,gap:"8px",flexWrap:"nowrap"},buttonsGroup:{display:"flex",alignItems:"center",gap:n.MAJOR.listGap},exploreButton:{base:d({backgroundColor:"transparent",border:`1px solid ${i.BUTTON.PRIMARY_BORDER}`,color:i.BUTTON.PRIMARY_TEXT,borderRadius:r.BUTTON,fontSize:a.BUTTON.fontSize,fontWeight:a.BUTTON.fontWeight,cursor:"pointer",padding:`0 ${l.BUTTON_PADDING_HORIZONTAL}`,height:`${l.BUTTON_HEIGHT}px`,transition:"all 0.2s",textAlign:"center",minWidth:"auto",textDecoration:"none",display:"inline-flex",alignItems:"center",justifyContent:"center",fontFamily:a.BUTTON.fontFamily,lineHeight:a.BUTTON.lineHeight},p),hover:{backgroundColor:(null==p?void 0:p.backgroundColor)?`${p.backgroundColor}cc`:"rgba(254, 192, 45, 0.1)"}},secondaryButton:{base:d({backgroundColor:"transparent",color:i.BUTTON.PRIMARY_TEXT,borderRadius:r.BUTTON,fontSize:a.BUTTON.fontSize,fontWeight:a.BUTTON.fontWeight,cursor:"pointer",padding:`0 ${l.BUTTON_PADDING_HORIZONTAL}`,height:`${l.BUTTON_HEIGHT}px`,transition:"all 0.2s",textAlign:"center",minWidth:"auto",textDecoration:"none",display:"inline-flex",alignItems:"center",justifyContent:"center",fontFamily:a.BUTTON.fontFamily,lineHeight:a.BUTTON.lineHeight},f),hover:{backgroundColor:(null==f?void 0:f.backgroundColor)?`${f.backgroundColor}cc`:"rgba(254, 192, 45, 0.1)"}},navigationContainer:{display:"flex",gap:n.MAJOR.navigationGap,alignItems:"center"},navigationButton:t=>({base:{width:`${l.NAVIGATION_BUTTON_SIZE}px`,height:`${l.NAVIGATION_BUTTON_SIZE}px`,backgroundColor:"transparent",border:"none",color:t?i.ICON.DISABLED:i.ICON.ENABLED,fontSize:"16px",cursor:t?"not-allowed":"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"all 0.2s",borderRadius:r.BUTTON,padding:0},hover:t?{}:{backgroundColor:"rgba(255, 255, 255, 0.1)"}})}};export{g as getMajorPopupStyles};

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

@@ -5,6 +5,14 @@ export interface FirestoreTimestamp {
     seconds: number;
     nanoseconds?: number;
 }
+/**
+ * Button styling configuration
+ */
+export interface ButtonStyle {
+    textColor?: string;
+    backgroundColor?: string;
+    borderColor?: string;
+}
 /**
  * Feature announcement data model
  */
@@ -27,6 +35,11 @@ export interface FeatureAnnouncement {
     archived?: boolean;
     createdAt: FirestoreTimestamp;
     expirationDate?: FirestoreTimestamp | string | Date;
+    primaryButtonStyle?: ButtonStyle;
+    secondaryButtonText?: string;
+    secondaryButtonUrl?: string;
+    secondaryButtonStyle?: ButtonStyle;
+    padding?: string;
 }
 /**
  * Store feature progress tracking