npm - @bikdotai/bik-component-library - Versions diffs - 0.0.861-beta.0 → 0.0.861 - Mend

@bikdotai/bik-component-library 0.0.861-beta.0 → 0.0.861

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (93) hide show

package/dist/cjs/components/dropdown/Common.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Common.styled.js","sources":["../../../../src/components/dropdown/Common.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const OverLapAbs = styled.div<{\n\tdisabled?: boolean;\n\tallowEvents?: boolean;\n\tisChildLoading?: boolean;\n}>`\n\tposition: \n\t// if allowEvents is true, then position is relative, else position is absolute\n\t\t${(props) =>\n\t\tprops?.allowEvents \|\| props?.isChildLoading ? 'relative' : 'absolute'};\n\tleft: 0px;\n\ttop: 0px;\n\twidth: 100%;\n\theight: 100%;\n\tz-index: 2;\n\tcursor: ${(props) => (props?.disabled ? 'not-allowed' : 'pointer')};\n`;\n\nexport const OpenDropdownContainer = styled.div`\n\tmargin-top: ~~4px~~;\n\tmargin-bottom: 8px;\n~~\tclip-path: inset(0px -20px -20px -20px);\n~~`;\n\nexport const LoadingContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tpadding: 6px 8px;\n\tbackground: ${COLORS.surface.hovered};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nexport const ChipInputWrapper = styled.div<{ error?: boolean }>`\n\twidth: 360px;\n\theight: 100%;\n\tpadding: 8px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tborder-radius: 4px;\n\tborder: ${(props) =>\n\t\tprops.error\n\t\t\t? `1px solid ${COLORS.stroke.negative.vibrant}`\n\t\t\t: `1px solid ${COLORS.stroke.primary}`};\n\t.chips-container {\n\t\tdisplay: flex;\n\t\tgap: 8px;\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t}\n`;\n"],"names":["OverLapAbs","styled","props","OpenDropdownContainer","COLORS","ChipInputWrapper"],"mappings":"0NAGaA,EAAaC,EAAAA,QAAO;AAAA;AAAA;AAAA,IAO5BC,GACHA,GAAO,aAAeA,GAAO,eAAiB,WAAa,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAM3DA,GAAWA,GAAO,SAAW,cAAgB,SAAU;AAAA,EAGtDC,EAAwBF,EAAAA,QAAO;AAAA;AAAA;AAAA~~;AAAA~~,~~EAMZA~~,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKxBG,EAAAA,OAAO,QAAQ,OAAO;AAAA,qBAChBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA,EAInC,MAAMC,EAAmBJ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAQ3BC,GACVA,EAAM,MACH,aAAaE,EAAAA,OAAO,OAAO,SAAS,OAAO,GAC3C,aAAaA,EAAAA,OAAO,OAAO,OAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
1	+ {"version":3,"file":"Common.styled.js","sources":["../../../../src/components/dropdown/Common.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const OverLapAbs = styled.div<{\n\tdisabled?: boolean;\n\tallowEvents?: boolean;\n\tisChildLoading?: boolean;\n}>`\n\tposition: \n\t// if allowEvents is true, then position is relative, else position is absolute\n\t\t${(props) =>\n\t\tprops?.allowEvents \|\| props?.isChildLoading ? 'relative' : 'absolute'};\n\tleft: 0px;\n\ttop: 0px;\n\twidth: 100%;\n\theight: 100%;\n\tz-index: 2;\n\tcursor: ${(props) => (props?.disabled ? 'not-allowed' : 'pointer')};\n`;\n\nexport const OpenDropdownContainer = styled.div`\n\tmargin-top: 8px;\n\tmargin-bottom: 8px;\n`;\n\nexport const LoadingContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tpadding: 6px 8px;\n\tbackground: ${COLORS.surface.hovered};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nexport const ChipInputWrapper = styled.div<{ error?: boolean }>`\n\twidth: 360px;\n\theight: 100%;\n\tpadding: 8px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tborder-radius: 4px;\n\tborder: ${(props) =>\n\t\tprops.error\n\t\t\t? `1px solid ${COLORS.stroke.negative.vibrant}`\n\t\t\t: `1px solid ${COLORS.stroke.primary}`};\n\t.chips-container {\n\t\tdisplay: flex;\n\t\tgap: 8px;\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t}\n`;\n"],"names":["OverLapAbs","styled","props","OpenDropdownContainer","COLORS","ChipInputWrapper"],"mappings":"0NAGaA,EAAaC,EAAAA,QAAO;AAAA;AAAA;AAAA,IAO5BC,GACHA,GAAO,aAAeA,GAAO,eAAiB,WAAa,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAM3DA,GAAWA,GAAO,SAAW,cAAgB,SAAU;AAAA,EAGtDC,EAAwBF,EAAAA,QAAO;AAAA;AAAA;AAAA,EAKZA,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKxBG,EAAAA,OAAO,QAAQ,OAAO;AAAA,qBAChBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA,EAInC,MAAMC,EAAmBJ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAQ3BC,GACVA,EAAM,MACH,aAAaE,EAAAA,OAAO,OAAO,SAAS,OAAO,GAC3C,aAAaA,EAAAA,OAAO,OAAO,OAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/dropdown/Dropdown.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),c=require("react"),n=require("../../constants/Theme.js"),_=require("../../assets/icons/chevronDown.svg.js"),G=require("../input/context/InputStyleProvider.js"),J=require("./ChipInput.js"),K=require("./DropdownPopover/index.js"),Q=require("./OpenedDropdown/utils/iterationOnOptions.js"),X=require("../input/Input.js");function I(){}const L=({placeHolder:l,size:j,onSelect:q,defaultOptions:d,disabled:s,solidDisabled:a,noErrorHint:W,placeHolderHeight:v,showPlaceholderWhenSelected:b=!1,inputStyle:k={},inputType:C="default",onDeleteChip:E,truncatedText:M,showLeadingIconInPlaceholder:T=!1,showTrailingIconPlaceholder:w=!1,showLabelsOnMoreHover:p=!1,value:u,showSelected:O=!1,onDropdownVisbilityChange:A,...e})=>{const[h,F]=c.useState(!1),[m,y]=c.useState(!1),r=j??"default",V=c.useRef(),[o,f]=c.useState(d??[]);function z(t){Array.isArray(t)?f([...t]):f([t]),q?.(t)}c.useEffect(()=>{const t=[];e?.options?.forEach(x=>{x.options?x.options.forEach(S=>{S.selected&&t.push({...S,label:S.label})}):x.selected&&t.push(x)}),f([...t])},[e.options]),c.useEffect(()=>{d&&f([...d])},[d]);const B=Q.getSelectedOptionsAsText(o),N=b?l:B??l??"Select an option",g=e.buttonWidth,R=g??e.width??"100%",U=e.dropdownWidth??R;return i.jsx(i.Fragment,{children:i.jsx(G.InputStyleContext.Provider,{value:{InputWrapper:{height:v||(r==="x-small"?24:r==="small"?32:48),width:R,...g?{maxWidth:g}:{},zIndex:1,cursor:"pointer",padding:r==="x-small"?"4px 8px":"6px 8px",backgroundColor:s&&a?n.COLORS.background.base:e.version==="3.0"?h||m?n.COLORS.surface.hovered:n.COLORS.surface.standard:O&&u!==void 0?n.BASE_COLORS.positive[100]:m&&!h?n.COLORS.background.inactive:n.COLORS.surface.standard,transition:"background-color 0.3s ease",...k},input:{minHeight:"100%",maxWidth:"100%",color:s&&a?n.COLORS.content.secondary:O&&u!==void 0?n.COLORS.content.positive:"inherit"}},children:i.jsx("div",{onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),style:e.width?{width:e.width}:void 0,children:i.jsxs(K.DropdownPopover,{"data-test":e["data-test"],ref:V,onSelect:z,disabled:s,...e,onDropdownVisbilityChange:t=>{F(t),A?.(t)},width:U,children:[C=="default"&&i.jsx(X.Input,{version:e.version,noErrorHint:W,state:s?"disabled":"none",solidDisabled:a,value:u===void 0?N:u,errorMessage:e.error,variant:r,placeholder:l??"Select an option",onChangeText:I,leftIcon:T&&o[0]?.leadingIcon?{icon:()=>i.jsx(i.Fragment,{children:o[0]?.leadingIcon})}:void 0,rightIcon:{icon:()=>i.jsxs("div",{style:{display:"flex"},children:[w&&o[0]?.trailingIcon,i.jsx(_.default,{style:{transform:h?"rotate(180deg)":"rotate(0deg)"},onClick:I,width:r==="x-small"?16:r==="small"?20:24,height:r==="x-small"?16:r==="small"?20:24,color:O?n.COLORS.content.positive:n.COLORS.content.primary})]})},truncateText:M??!0}),C=="chip"&&i.jsx(J.default,{placeholder:l??"Select options",placeholderColor:s&&a?n.COLORS.content.secondary:void 0,chips:o,onDeleteChip:t=>{E?.(t)},errorMessage:e.error,isDropdownOpened:h,sizeToUse:r,containerStyle:{width:e.width??"100%",cursor:"pointer",...s&&a?{backgroundColor:n.COLORS.background.base,pointerEvents:"none"}:{}},showLabelsOnMoreHover:p})]})})})})};L.displayName="Dropdown";exports.Dropdown=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("react"),s=require("../../constants/Theme.js"),U=require("../../assets/icons/chevronDown.svg.js"),_=require("../input/context/InputStyleProvider.js"),G=require("./ChipInput.js"),J=require("./DropdownPopover/index.js"),K=require("./OpenedDropdown/utils/iterationOnOptions.js"),Q=require("../input/Input.js");function I(){}const R=({placeHolder:c,size:j,onSelect:b,defaultOptions:l,disabled:v,noErrorHint:q,placeHolderHeight:S,showPlaceholderWhenSelected:L=!1,inputStyle:W={},inputType:O="default",onDeleteChip:E,truncatedText:M,showLeadingIconInPlaceholder:T=!1,showTrailingIconPlaceholder:w=!1,showLabelsOnMoreHover:k=!1,value:o,showSelected:f=!1,onDropdownVisbilityChange:A,...e})=>{const[d,F]=r.useState(!1),[m,y]=r.useState(!1),n=j??"default",V=r.useRef(),[a,u]=r.useState(l??[]);function p(t){Array.isArray(t)?u([...t]):u([t]),b?.(t)}r.useEffect(()=>{const t=[];e?.options?.forEach(h=>{h.options?h.options.forEach(g=>{g.selected&&t.push({...g,label:g.label})}):h.selected&&t.push(h)}),u([...t])},[e.options]),r.useEffect(()=>{l&&u([...l])},[l]);const z=K.getSelectedOptionsAsText(a),B=L?c:z??c??"Select an option",x=e.buttonWidth,C=x??e.width??"100%",N=e.dropdownWidth??C;return i.jsx(i.Fragment,{children:i.jsx(_.InputStyleContext.Provider,{value:{InputWrapper:{height:S||(n==="x-small"?24:n==="small"?32:48),width:C,...x?{maxWidth:x}:{},zIndex:1,cursor:"pointer",padding:n==="x-small"?"4px 8px":"6px 8px",backgroundColor:e.version==="3.0"?d||m?s.COLORS.surface.hovered:s.COLORS.surface.standard:f&&o!==void 0?s.BASE_COLORS.positive[100]:m&&!d?s.COLORS.background.inactive:s.COLORS.surface.standard,transition:"background-color 0.3s ease",...W},input:{minHeight:"100%",maxWidth:"100%",color:f&&o!==void 0?s.COLORS.content.positive:"inherit"}},children:i.jsx("div",{onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),style:e.width?{width:e.width}:void 0,children:i.jsxs(J.DropdownPopover,{"data-test":e["data-test"],ref:V,onSelect:p,disabled:v,...e,onDropdownVisbilityChange:t=>{F(t),A?.(t)},width:N,children:[O=="default"&&i.jsx(Q.Input,{version:e.version,noErrorHint:q,state:v?"disabled":"none",value:o===void 0?B:o,errorMessage:e.error,variant:n,placeholder:c??"Select an option",onChangeText:I,leftIcon:T&&a[0]?.leadingIcon?{icon:()=>i.jsx(i.Fragment,{children:a[0]?.leadingIcon})}:void 0,rightIcon:{icon:()=>i.jsxs("div",{style:{display:"flex"},children:[w&&a[0]?.trailingIcon,i.jsx(U.default,{style:{transform:d?"rotate(180deg)":"rotate(0deg)"},onClick:I,width:n==="x-small"?16:n==="small"?20:24,height:n==="x-small"?16:n==="small"?20:24,color:f?s.COLORS.content.positive:s.COLORS.content.primary})]})},truncateText:M??!0}),O=="chip"&&i.jsx(G.default,{placeholder:c??"Select options",chips:a,onDeleteChip:t=>{E?.(t)},errorMessage:e.error,isDropdownOpened:d,sizeToUse:n,containerStyle:{width:e.width??"100%",cursor:"pointer"},showLabelsOnMoreHover:k})]})})})})};R.displayName="Dropdown";exports.Dropdown=R;
 //# sourceMappingURL=Dropdown.js.map

package/dist/cjs/components/dropdown/Dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dropdown.js","sources":["../../../../src/components/dropdown/Dropdown.tsx"],"sourcesContent":["import React, { Ref, useEffect, useRef, useState } from 'react';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\nimport DownIcon from '../../assets/icons/chevronDown.svg';\nimport { Input } from '../input';\nimport { InputStyleContext } from '../input/context/InputStyleProvider';\nimport ChipInput from './ChipInput';\nimport { DropdownPopover } from './DropdownPopover';\nimport { getSelectedOptionsAsText } from './OpenedDropdown/utils/iterationOnOptions';\nimport {\n\tDropdownOption,\n\tGroupedOption,\n\tOpenDropdownProps,\n\tSingleOption,\n} from './type';\n\nexport type DropdownProps = OpenDropdownProps & {\n\tplaceHolder?: string;\n\tsize?: 'default' \| 'small' \| 'x-small';\n\tdisabled?: boolean;\n\t/** When disabled, render a solid grey box (background.base) with secondary text and no opacity wash. /\n\tsolidDisabled?: boolean;\n\tnoErrorHint?: boolean;\n\tbuttonWidth?: string;\n\tplaceHolderHeight?: string;\n\tshowPlaceholderWhenSelected?: boolean;\n\tinputStyle?: React.CSSProperties;\n\tinputType?: 'chip' \| 'default';\n\tonDeleteChip?: (chip: SingleOption) => void;\n\ttruncatedText?: boolean;\n\t'data-test'?: string;\n\tshowLeadingIconInPlaceholder?: boolean;\n\tshowTrailingIconPlaceholder?: boolean;\n\tshowLabelsOnMoreHover?: boolean;\n\tbackgroundColor?: string;\n\tvalue?: string;\n\tshowSelected?: boolean;\n\t/* Fired when the dropdown opens/closes. Runs alongside internal open state. /\n\tonDropdownVisbilityChange?: (isOpen: boolean) => void;\n};\n\nfunction noop() {\n\t/* empty */\n}\n\nexport const Dropdown: React.FC<DropdownProps> = ({\n\tplaceHolder,\n\tsize,\n\tonSelect,\n\tdefaultOptions,\n\tdisabled,\n\tsolidDisabled,\n\tnoErrorHint,\n\tplaceHolderHeight,\n\tshowPlaceholderWhenSelected = false,\n\tinputStyle = {},\n\tinputType = 'default',\n\tonDeleteChip,\n\ttruncatedText,\n\tshowLeadingIconInPlaceholder = false,\n\tshowTrailingIconPlaceholder = false,\n\tshowLabelsOnMoreHover = false,\n\tvalue,\n\tshowSelected = false,\n\tonDropdownVisbilityChange,\n\t...openDropdownProps\n}) => {\n\tconst [isDropdownOpened, setDropdownOpenFlag] = useState(false);\n\tconst [isHovering, setIsHovering] = useState(false);\n\tconst sizeToUse = size ?? 'default';\n\tconst dropdownVisibilityRef = useRef<{\n\t\topenDropdown: boolean;\n\t}>();\n\tconst [selectedOption, setSelectedOption] = useState<DropdownOption[]>(\n\t\tdefaultOptions ?? [],\n\t);\n\tfunction handleSelection(option: DropdownOption \| DropdownOption[]) {\n\t\tif (Array.isArray(option)) {\n\t\t\tsetSelectedOption([...option]);\n\t\t} else {\n\t\t\tsetSelectedOption([...[option]]);\n\t\t}\n\t\tonSelect?.(option);\n\t}\n\n\tuseEffect(() => {\n\t\tconst flatSelectedOption: SingleOption[] = [];\n\t\topenDropdownProps?.options?.forEach((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t(option as GroupedOption).options.forEach((op) => {\n\t\t\t\t\tif (op.selected) {\n\t\t\t\t\t\tflatSelectedOption.push({\n\t\t\t\t\t\t\t...op,\n\t\t\t\t\t\t\tlabel: op.label,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tif ((option as SingleOption).selected) {\n\t\t\t\t\tflatSelectedOption.push(option as SingleOption);\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\n\t\tsetSelectedOption([...flatSelectedOption]);\n\t}, [openDropdownProps.options]);\n\n\tuseEffect(() => {\n\t\tif (defaultOptions) {\n\t\t\tsetSelectedOption([...defaultOptions]);\n\t\t}\n\t}, [defaultOptions]);\n\n\tconst textVal = getSelectedOptionsAsText(selectedOption);\n\tconst displayText = showPlaceholderWhenSelected\n\t\t? placeHolder\n\t\t: textVal ?? placeHolder ?? 'Select an option';\n\n\tconst configuredMaxWidth = openDropdownProps.buttonWidth;\n\n\t// Shared width for the input wrapper and dropdown popover\n\tconst inputWidth = configuredMaxWidth ?? openDropdownProps.width ?? '100%';\n\n\t// Width passed to dropdown popover — matches input box width\n\tconst dropdownWidth = openDropdownProps.dropdownWidth ?? inputWidth;\n\n\treturn (\n\t\t<>\n\t\t\t<InputStyleContext.Provider\n\t\t\t\tvalue={{\n\t\t\t\t\tInputWrapper: {\n\t\t\t\t\t\theight: placeHolderHeight\n\t\t\t\t\t\t\t? placeHolderHeight\n\t\t\t\t\t\t\t: sizeToUse === 'x-small'\n\t\t\t\t\t\t\t? 24\n\t\t\t\t\t\t\t: sizeToUse === 'small'\n\t\t\t\t\t\t\t? 32\n\t\t\t\t\t\t\t: 48,\n\t\t\t\t\t\twidth: inputWidth,\n\t\t\t\t\t\t...(configuredMaxWidth ? { maxWidth: configuredMaxWidth } : {}),\n\t\t\t\t\t\tzIndex: 1,\n\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\tpadding: sizeToUse === 'x-small' ? '4px 8px' : '6px 8px',\n\t\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\t\tdisabled && solidDisabled\n\t\t\t\t\t\t\t\t? COLORS.background.base\n\t\t\t\t\t\t\t\t: openDropdownProps.version === '3.0'\n\t\t\t\t\t\t\t\t? isDropdownOpened \|\| isHovering\n\t\t\t\t\t\t\t\t\t? COLORS.surface.hovered\n\t\t\t\t\t\t\t\t\t: COLORS.surface.standard\n\t\t\t\t\t\t\t\t: showSelected && value !== undefined\n\t\t\t\t\t\t\t\t? BASE_COLORS.positive['100']\n\t\t\t\t\t\t\t\t: // The hover wrapper also contains the popover, so while the\n\t\t\t\t\t\t\t\t// dropdown is open, hovering an option would grey the input\n\t\t\t\t\t\t\t\t// — only show hover feedback while closed.\n\t\t\t\t\t\t\t\tisHovering && !isDropdownOpened\n\t\t\t\t\t\t\t\t? COLORS.background.inactive\n\t\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\ttransition: 'background-color 0.3s ease',\n\t\t\t\t\t\t...inputStyle,\n\t\t\t\t\t},\n\t\t\t\t\tinput: {\n\t\t\t\t\t\tminHeight: '100%',\n\t\t\t\t\t\tmaxWidth: '100%',\n\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\tdisabled && solidDisabled\n\t\t\t\t\t\t\t\t? COLORS.content.secondary\n\t\t\t\t\t\t\t\t: showSelected && value !== undefined\n\t\t\t\t\t\t\t\t? COLORS.content.positive\n\t\t\t\t\t\t\t\t: 'inherit',\n\t\t\t\t\t},\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tonMouseEnter={() => setIsHovering(true)}\n\t\t\t\t\tonMouseLeave={() => setIsHovering(false)}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\topenDropdownProps.width\n\t\t\t\t\t\t\t? { width: openDropdownProps.width }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\tdata-test={openDropdownProps['data-test']}\n\t\t\t\t\t\tref={\n\t\t\t\t\t\t\tdropdownVisibilityRef as Ref<{\n\t\t\t\t\t\t\t\topenDropdown: boolean;\n\t\t\t\t\t\t\t}>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={handleSelection}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t{...openDropdownProps}\n\t\t\t\t\t\tonDropdownVisbilityChange={(isOpen) => {\n\t\t\t\t\t\t\t// Keep the internal open flag (carat/open styling) AND forward\n\t\t\t\t\t\t\t// to a consumer-provided handler so callers can react to open state.\n\t\t\t\t\t\t\tsetDropdownOpenFlag(isOpen);\n\t\t\t\t\t\t\tonDropdownVisbilityChange?.(isOpen);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\twidth={dropdownWidth}\n\t\t\t\t\t>\n\t\t\t\t\t\t{inputType == 'default' && (\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\tversion={openDropdownProps.version}\n\t\t\t\t\t\t\t\tnoErrorHint={noErrorHint}\n\t\t\t\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\t\t\t\tsolidDisabled={solidDisabled}\n\t\t\t\t\t\t\t\tvalue={value === undefined ? displayText : value}\n\t\t\t\t\t\t\t\terrorMessage={openDropdownProps.error}\n\t\t\t\t\t\t\t\tvariant={sizeToUse}\n\t\t\t\t\t\t\t\tplaceholder={placeHolder ?? 'Select an option'}\n\t\t\t\t\t\t\t\tonChangeText={noop}\n\t\t\t\t\t\t\t\tleftIcon={\n\t\t\t\t\t\t\t\t\tshowLeadingIconInPlaceholder && selectedOption[0]?.leadingIcon\n\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\ticon: () => <>{selectedOption[0]?.leadingIcon}</>,\n\t\t\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\trightIcon={{\n\t\t\t\t\t\t\t\t\ticon: () => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{showTrailingIconPlaceholder &&\n\t\t\t\t\t\t\t\t\t\t\t\t(selectedOption[0] as SingleOption)?.trailingIcon}\n\t\t\t\t\t\t\t\t\t\t\t<DownIcon\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\ttransform: isDropdownOpened\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'rotate(180deg)'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'rotate(0deg)',\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={noop}\n\t\t\t\t\t\t\t\t\t\t\t\twidth={\n\t\t\t\t\t\t\t\t\t\t\t\t\tsizeToUse === 'x-small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 16\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: sizeToUse === 'small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 20\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 24\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\theight={\n\t\t\t\t\t\t\t\t\t\t\t\t\tsizeToUse === 'x-small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 16\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: sizeToUse === 'small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 20\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 24\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowSelected\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? COLORS.content.positive\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: COLORS.content.primary\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\ttruncateText={truncatedText ?? true}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{inputType == 'chip' && (\n\t\t\t\t\t\t\t<ChipInput\n\t\t\t\t\t\t\t\tplaceholder={placeHolder ?? 'Select options'}\n\t\t\t\t\t\t\t\tplaceholderColor={\n\t\t\t\t\t\t\t\t\tdisabled && solidDisabled ? COLORS.content.secondary : undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tchips={selectedOption as SingleOption[]}\n\t\t\t\t\t\t\t\tonDeleteChip={(chip) => {\n\t\t\t\t\t\t\t\t\tonDeleteChip?.(chip);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\terrorMessage={openDropdownProps.error}\n\t\t\t\t\t\t\t\tisDropdownOpened={isDropdownOpened}\n\t\t\t\t\t\t\t\tsizeToUse={sizeToUse}\n\t\t\t\t\t\t\t\tcontainerStyle={{\n\t\t\t\t\t\t\t\t\twidth: openDropdownProps.width ?? '100%',\n\t\t\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t\t\t\t...(disabled && solidDisabled\n\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: COLORS.background.base,\n\t\t\t\t\t\t\t\t\t\t\t\tpointerEvents: 'none',\n\t\t\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tshowLabelsOnMoreHover={showLabelsOnMoreHover}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownPopover>\n\t\t\t\t</div>\n\t\t\t</InputStyleContext.Provider>\n\t\t</>\n\t);\n};\n\nDropdown.displayName = 'Dropdown';\n"],"names":["noop","Dropdown","placeHolder","size","onSelect","defaultOptions","disabled","solidDisabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover","value","showSelected","onDropdownVisbilityChange","openDropdownProps","isDropdownOpened","setDropdownOpenFlag","useState","isHovering","setIsHovering","sizeToUse","dropdownVisibilityRef","useRef","selectedOption","setSelectedOption","handleSelection","option","useEffect","flatSelectedOption","op","textVal","getSelectedOptionsAsText","displayText","configuredMaxWidth","inputWidth","dropdownWidth","jsx","Fragment","InputStyleContext","COLORS","BASE_COLORS","jsxs","DropdownPopover","isOpen","Input","DownIcon","ChipInput","chip"],"mappings":"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"}
1	+ {"version":3,"file":"Dropdown.js","sources":["../../../../src/components/dropdown/Dropdown.tsx"],"sourcesContent":["import React, { Ref, useEffect, useRef, useState } from 'react';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\nimport DownIcon from '../../assets/icons/chevronDown.svg';\nimport { Input } from '../input';\nimport { InputStyleContext } from '../input/context/InputStyleProvider';\nimport ChipInput from './ChipInput';\nimport { DropdownPopover } from './DropdownPopover';\nimport { getSelectedOptionsAsText } from './OpenedDropdown/utils/iterationOnOptions';\nimport {\n\tDropdownOption,\n\tGroupedOption,\n\tOpenDropdownProps,\n\tSingleOption,\n} from './type';\n\nexport type DropdownProps = OpenDropdownProps & {\n\tplaceHolder?: string;\n\tsize?: 'default' \| 'small' \| 'x-small';\n\tdisabled?: boolean;\n\tnoErrorHint?: boolean;\n\tbuttonWidth?: string;\n\tplaceHolderHeight?: string;\n\tshowPlaceholderWhenSelected?: boolean;\n\tinputStyle?: React.CSSProperties;\n\tinputType?: 'chip' \| 'default';\n\tonDeleteChip?: (chip: SingleOption) => void;\n\ttruncatedText?: boolean;\n\t'data-test'?: string;\n\tshowLeadingIconInPlaceholder?: boolean;\n\tshowTrailingIconPlaceholder?: boolean;\n\tshowLabelsOnMoreHover?: boolean;\n\tbackgroundColor?: string;\n\tvalue?: string;\n\tshowSelected?: boolean;\n\t/** Fired when the dropdown opens/closes. Runs alongside internal open state. /\n\tonDropdownVisbilityChange?: (isOpen: boolean) => void;\n};\n\nfunction noop() {\n\t/* empty */\n}\n\nexport const Dropdown: React.FC<DropdownProps> = ({\n\tplaceHolder,\n\tsize,\n\tonSelect,\n\tdefaultOptions,\n\tdisabled,\n\tnoErrorHint,\n\tplaceHolderHeight,\n\tshowPlaceholderWhenSelected = false,\n\tinputStyle = {},\n\tinputType = 'default',\n\tonDeleteChip,\n\ttruncatedText,\n\tshowLeadingIconInPlaceholder = false,\n\tshowTrailingIconPlaceholder = false,\n\tshowLabelsOnMoreHover = false,\n\tvalue,\n\tshowSelected = false,\n\tonDropdownVisbilityChange,\n\t...openDropdownProps\n}) => {\n\tconst [isDropdownOpened, setDropdownOpenFlag] = useState(false);\n\tconst [isHovering, setIsHovering] = useState(false);\n\tconst sizeToUse = size ?? 'default';\n\tconst dropdownVisibilityRef = useRef<{\n\t\topenDropdown: boolean;\n\t}>();\n\tconst [selectedOption, setSelectedOption] = useState<DropdownOption[]>(\n\t\tdefaultOptions ?? [],\n\t);\n\tfunction handleSelection(option: DropdownOption \| DropdownOption[]) {\n\t\tif (Array.isArray(option)) {\n\t\t\tsetSelectedOption([...option]);\n\t\t} else {\n\t\t\tsetSelectedOption([...[option]]);\n\t\t}\n\t\tonSelect?.(option);\n\t}\n\n\tuseEffect(() => {\n\t\tconst flatSelectedOption: SingleOption[] = [];\n\t\topenDropdownProps?.options?.forEach((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t(option as GroupedOption).options.forEach((op) => {\n\t\t\t\t\tif (op.selected) {\n\t\t\t\t\t\tflatSelectedOption.push({\n\t\t\t\t\t\t\t...op,\n\t\t\t\t\t\t\tlabel: op.label,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tif ((option as SingleOption).selected) {\n\t\t\t\t\tflatSelectedOption.push(option as SingleOption);\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\n\t\tsetSelectedOption([...flatSelectedOption]);\n\t}, [openDropdownProps.options]);\n\n\tuseEffect(() => {\n\t\tif (defaultOptions) {\n\t\t\tsetSelectedOption([...defaultOptions]);\n\t\t}\n\t}, [defaultOptions]);\n\n\tconst textVal = getSelectedOptionsAsText(selectedOption);\n\tconst displayText = showPlaceholderWhenSelected\n\t\t? placeHolder\n\t\t: textVal ?? placeHolder ?? 'Select an option';\n\n\tconst configuredMaxWidth = openDropdownProps.buttonWidth;\n\n\t// Shared width for the input wrapper and dropdown popover\n\tconst inputWidth = configuredMaxWidth ?? openDropdownProps.width ?? '100%';\n\n\t// Width passed to dropdown popover — matches input box width\n\tconst dropdownWidth = openDropdownProps.dropdownWidth ?? inputWidth;\n\n\treturn (\n\t\t<>\n\t\t\t<InputStyleContext.Provider\n\t\t\t\tvalue={{\n\t\t\t\t\tInputWrapper: {\n\t\t\t\t\t\theight: placeHolderHeight\n\t\t\t\t\t\t\t? placeHolderHeight\n\t\t\t\t\t\t\t: sizeToUse === 'x-small'\n\t\t\t\t\t\t\t? 24\n\t\t\t\t\t\t\t: sizeToUse === 'small'\n\t\t\t\t\t\t\t? 32\n\t\t\t\t\t\t\t: 48,\n\t\t\t\t\t\twidth: inputWidth,\n\t\t\t\t\t\t...(configuredMaxWidth ? { maxWidth: configuredMaxWidth } : {}),\n\t\t\t\t\t\tzIndex: 1,\n\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\tpadding: sizeToUse === 'x-small' ? '4px 8px' : '6px 8px',\n\t\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\t\topenDropdownProps.version === '3.0'\n\t\t\t\t\t\t\t\t? isDropdownOpened \|\| isHovering\n\t\t\t\t\t\t\t\t\t? COLORS.surface.hovered\n\t\t\t\t\t\t\t\t\t: COLORS.surface.standard\n\t\t\t\t\t\t\t\t: showSelected && value !== undefined\n\t\t\t\t\t\t\t\t? BASE_COLORS.positive['100']\n\t\t\t\t\t\t\t\t: // The hover wrapper also contains the popover, so while the\n\t\t\t\t\t\t\t\t// dropdown is open, hovering an option would grey the input\n\t\t\t\t\t\t\t\t// — only show hover feedback while closed.\n\t\t\t\t\t\t\t\tisHovering && !isDropdownOpened\n\t\t\t\t\t\t\t\t? COLORS.background.inactive\n\t\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\ttransition: 'background-color 0.3s ease',\n\t\t\t\t\t\t...inputStyle,\n\t\t\t\t\t},\n\t\t\t\t\tinput: {\n\t\t\t\t\t\tminHeight: '100%',\n\t\t\t\t\t\tmaxWidth: '100%',\n\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\tshowSelected && value !== undefined\n\t\t\t\t\t\t\t\t? COLORS.content.positive\n\t\t\t\t\t\t\t\t: 'inherit',\n\t\t\t\t\t},\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tonMouseEnter={() => setIsHovering(true)}\n\t\t\t\t\tonMouseLeave={() => setIsHovering(false)}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\topenDropdownProps.width\n\t\t\t\t\t\t\t? { width: openDropdownProps.width }\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\tdata-test={openDropdownProps['data-test']}\n\t\t\t\t\t\tref={\n\t\t\t\t\t\t\tdropdownVisibilityRef as Ref<{\n\t\t\t\t\t\t\t\topenDropdown: boolean;\n\t\t\t\t\t\t\t}>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={handleSelection}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t{...openDropdownProps}\n\t\t\t\t\t\tonDropdownVisbilityChange={(isOpen) => {\n\t\t\t\t\t\t\t// Keep the internal open flag (carat/open styling) AND forward\n\t\t\t\t\t\t\t// to a consumer-provided handler so callers can react to open state.\n\t\t\t\t\t\t\tsetDropdownOpenFlag(isOpen);\n\t\t\t\t\t\t\tonDropdownVisbilityChange?.(isOpen);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\twidth={dropdownWidth}\n\t\t\t\t\t>\n\t\t\t\t\t\t{inputType == 'default' && (\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\tversion={openDropdownProps.version}\n\t\t\t\t\t\t\t\tnoErrorHint={noErrorHint}\n\t\t\t\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\t\t\t\tvalue={value === undefined ? displayText : value}\n\t\t\t\t\t\t\t\terrorMessage={openDropdownProps.error}\n\t\t\t\t\t\t\t\tvariant={sizeToUse}\n\t\t\t\t\t\t\t\tplaceholder={placeHolder ?? 'Select an option'}\n\t\t\t\t\t\t\t\tonChangeText={noop}\n\t\t\t\t\t\t\t\tleftIcon={\n\t\t\t\t\t\t\t\t\tshowLeadingIconInPlaceholder && selectedOption[0]?.leadingIcon\n\t\t\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\t\t\ticon: () => <>{selectedOption[0]?.leadingIcon}</>,\n\t\t\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\trightIcon={{\n\t\t\t\t\t\t\t\t\ticon: () => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{showTrailingIconPlaceholder &&\n\t\t\t\t\t\t\t\t\t\t\t\t(selectedOption[0] as SingleOption)?.trailingIcon}\n\t\t\t\t\t\t\t\t\t\t\t<DownIcon\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\ttransform: isDropdownOpened\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'rotate(180deg)'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'rotate(0deg)',\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={noop}\n\t\t\t\t\t\t\t\t\t\t\t\twidth={\n\t\t\t\t\t\t\t\t\t\t\t\t\tsizeToUse === 'x-small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 16\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: sizeToUse === 'small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 20\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 24\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\theight={\n\t\t\t\t\t\t\t\t\t\t\t\t\tsizeToUse === 'x-small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 16\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: sizeToUse === 'small'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 20\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 24\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowSelected\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? COLORS.content.positive\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: COLORS.content.primary\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\ttruncateText={truncatedText ?? true}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{inputType == 'chip' && (\n\t\t\t\t\t\t\t<ChipInput\n\t\t\t\t\t\t\t\tplaceholder={placeHolder ?? 'Select options'}\n\t\t\t\t\t\t\t\tchips={selectedOption as SingleOption[]}\n\t\t\t\t\t\t\t\tonDeleteChip={(chip) => {\n\t\t\t\t\t\t\t\t\tonDeleteChip?.(chip);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\terrorMessage={openDropdownProps.error}\n\t\t\t\t\t\t\t\tisDropdownOpened={isDropdownOpened}\n\t\t\t\t\t\t\t\tsizeToUse={sizeToUse}\n\t\t\t\t\t\t\t\tcontainerStyle={{\n\t\t\t\t\t\t\t\t\twidth: openDropdownProps.width ?? '100%',\n\t\t\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tshowLabelsOnMoreHover={showLabelsOnMoreHover}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownPopover>\n\t\t\t\t</div>\n\t\t\t</InputStyleContext.Provider>\n\t\t</>\n\t);\n};\n\nDropdown.displayName = 'Dropdown';\n"],"names":["noop","Dropdown","placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover","value","showSelected","onDropdownVisbilityChange","openDropdownProps","isDropdownOpened","setDropdownOpenFlag","useState","isHovering","setIsHovering","sizeToUse","dropdownVisibilityRef","useRef","selectedOption","setSelectedOption","handleSelection","option","useEffect","flatSelectedOption","op","textVal","getSelectedOptionsAsText","displayText","configuredMaxWidth","inputWidth","dropdownWidth","jsx","Fragment","InputStyleContext","COLORS","BASE_COLORS","jsxs","DropdownPopover","isOpen","Input","DownIcon","ChipInput","chip"],"mappings":"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"}

package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),Ke=require("../../../../assets/icons/errorInfo.svg.js"),Ve=require("../../../../assets/icons/refresh-purple.svg.js"),o=require("react"),$e=require("../../../zeroState/ZeroState.js"),Ne=require("../../../../hooks/useOutside.js"),R=require("../../../../constants/Theme.js"),_e=require("../../hooks/useDropdown.js"),ze=require("./description/Description.js"),Ge=require("./menu/FreeFormMenu.js"),Je=require("./menu/MenuList.js"),Qe=require("./menu/SelectAllMenu.js"),Xe=require("./multiSelect/MultiSelectDropdownBottomBar.js"),ne=require("./OpennedDropdown.styled.js"),Ye=require("./searchbox/SearchBox.js"),et=require("./searchbox/SearchZeroState.js"),$={height:304,width:290},tt=({options:q,isSearchable:g,searchPlaceholder:se,staticMenuHeight:N,isMultiSelect:l,maxSelections:C,width:F,allowFreeForm:_,height:oe,onClose:z,onSelect:re,onSearch:d,version:i,skipSorting:ue,headerRef:ce,hideSelectAll:le,primaryButtonText:ie,onInfiniteScroll:ae,onMultiSelectClear:de,onDropdownItemClick:E,buttonOptions:fe,isSearchLoading:he,isOptionsLoading:pe,optionsErrorState:w,disableSearchOptions:ge,disableSearchedOptionExcept:we,useDefaultCursor:ye,containerStyle:Oe={},zeroState:A=void 0,isDraggable:y=!1,onOptionsReorder:O,hideClearButton:xe=!1,showCheckboxForCustomElement:Se=!1,checkboxActiveColor:B,brandSelectedRow:W})=>{const v=o.useCallback(e=>{if(!y||!l)return e;const t=[],n=[];return e.forEach(u=>{u.options?n.push(u):u.selected?t.push(u):n.push(u)}),[...t,...n]},[y,l]),[j,G]=o.useState(()=>v(q)),J=o.useRef(j),Q=o.useRef(!1),H=o.useRef(O);o.useEffect(()=>{G(v(q))},[q,v]),o.useEffect(()=>{J.current=j},[j]),o.useEffect(()=>{H.current=O},[O]),o.useEffect(()=>()=>{Q.current&&H.current&&H.current(J.current)},[]);const me=o.useCallback(e=>{G(e),i==="2.0"?O?.(e):Q.current=!0},[O,i]),be=y?j:q,{dropdownOptions:f,search:Le,searchedString:s,searchedOptions:x,searchError:Te,retrySearch:Re,onApplyHandler:M,selectAllHandler:qe,onMultiSelectClear:Ce,onFreeFormSelect:Ee,onMultiSelectApply:je,latestDropdownOptionsRef:ke,getSelectedOptions:De,getCurrentSelectionCount:Ie}=_e.useDropdown(i,be,re,ue||y,l,d,ge,we,C),[Fe,Z]=o.useState(F??$.width),[h,U]=o.useState(null),[k,X]=o.useState(-1),S=o.useRef(null),Y=o.useRef([]),P=o.useRef(null);Ne.useOutside(S,()=>{if(U(null),l&&i==="2.0"){const e=De(ke.current);z?.(e)}else z?.(f)},[ce,Y]),o.useEffect(()=>{const e=setTimeout(()=>{S.current&&S.current.focus({preventScroll:!0})},0);return()=>clearTimeout(e)},[]);const Ae=e=>{const t=[];return e.forEach(n=>{if(n.options)n.options.forEach(r=>{r.disabled||t.push(r)});else{const u=n;u.disabled||t.push(u)}}),t};o.useEffect(()=>{const e=n=>{const r=Ae(s&&d?x:f);if(r.length!==0){if(n.key==="ArrowDown")n.preventDefault(),X(a=>{const L=a<r.length-1?a+1:0;return setTimeout(()=>{const T=P.current?.querySelector(`[data-option-index="${L}"]`);T&&T.scrollIntoView({block:"nearest",behavior:"smooth"})},0),L});else if(n.key==="ArrowUp")n.preventDefault(),X(a=>{const L=a>0?a-1:r.length-1;return setTimeout(()=>{const T=P.current?.querySelector(`[data-option-index="${L}"]`);T&&T.scrollIntoView({block:"nearest",behavior:"smooth"})},0),L});else if(n.key==="Enter"&&k>=0){n.preventDefault();const a=r[k];a&&(M({...a,selected:!a.selected}),E&&E(a))}}},t=S.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}},[k,s,x,f,d,M,E]);const p=oe??$.height,D=typeof p=="number"?g&&l?p-96:g&&!l||!g&&l?p-48:p:p;function Be(e,t){U(e&&t?{title:e,description:t}:null)}o.useEffect(()=>{const e=F??$.width;if(h===null)Z(e);else if(typeof e=="number")Z(e*2);else if(typeof e=="string"&&e.endsWith("px")){const t=parseInt(e.replace("px",""))*2;Z(t)}},[h]);const I=[],K=(e=>{if(!l||!C&&C!==0)return e;const n=Ie(f)>=C;return n?e.map(u=>{if(u.options)return{...u,options:u.options.map(r=>({...r,disabled:r.disabled||!r.selected&&n}))};{const r=u;return{...r,disabled:r.disabled||!r.selected&&n}}}):e})((s&&d?x:f).map(e=>{if(s&&!d)if(e.options){const t={...e};return t.options=t.options.filter(n=>n.label?.toLowerCase().includes(s.toLowerCase())?(I.push(!s||n.label===s),!0):!1),t.options.length>0?t:null}else return e.label?.toLowerCase().includes(s.toLowerCase())||e.searchKey?.toLowerCase().includes(s.toLowerCase())?(I.push(!s||e.label===s),e):null;return e}).filter(e=>e!==null)),V=!!g&&s&&K.length===0,m=!s&&!!pe,b=!s&&!!w&&!m,We=!s&&!K.length&&!m&&!b,ee=m||b||We,ve=A?.title||"No results found",He=A?.subTitle||"Please try again later or contact us at support@bik.ai if you require further assistance.",Me=w?.title||"Failed to load options",Ze=w?.subTitle||"Something went wrong while fetching the list. Please try again",Ue={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:R.COLORS.background.inverseLight,customIconColor:R.COLORS.background.inverseLight,LeadingIcon:Ve.default},te={IconHolderStyle:{background:R.COLORS.background.negative.light},Icon:c.jsx(Ke.default,{color:R.COLORS.content.negative,width:24,height:24}),...w};te.actionButton={...Ue,...w?.actionButton??{}};const Pe=m?void 0:b?te:A;return c.jsxs(ne.OpennedDropdownContainer,{version:i,ref:S,tabIndex:-1,style:{width:Fe,...Oe,outline:"none"},children:[c.jsxs("div",{style:{width:h?"50%":"100%",display:"flex",flexDirection:"column",background:"white"},children:[!!g&&c.jsx(Ye.SearchBox,{onSearch:Le,version:i,placeholder:se}),ee?c.jsx("div",{style:{height:N?D:p,display:"flex",background:R.COLORS.background.base},children:c.jsx($e.ZeroState,{...Pe??{},isLoading:m,title:b?Me:ve,subTitle:b?Ze:He})}):c.jsxs(ne.MenuListContainer,{minHeight:N?D:void 0,maxHeight:D,ref:P,children:[!!l&&!V&&!le&&c.jsx(Qe.SelectAllMenu,{version:i,options:s&&d?x:f,onSelect:qe,checkboxActiveColor:B,brandSelectedRow:W}),!_&&V&&c.jsx(et.SearchZeroState,{isLoading:he,errorMessage:Te,onRetry:Re,height:D,searchedString:s,containerWidth:F,version:i}),_&&(V||!!I.length&&I.every(e=>e===!1))&&c.jsx(Ge.FreeFormMenu,{version:i,isMultiSelect:l,onSelect:Ee,searchedString:s,checkboxActiveColor:B,brandSelectedRow:W}),c.jsx(Je.MenuList,{onInfiniteScroll:ae,onDropdownItemClick:E,version:i,onSelect:M,showDescription:Be,isMultiSelect:l,options:K,useDefaultCursor:ye,ref:Y,focusedIndex:k,isDraggable:y,onOptionsReorder:me,showCheckboxForCustomElement:Se,checkboxActiveColor:B,brandSelectedRow:W})]}),!!l&&!ee&&i!=="2.0"&&c.jsx(Xe.default,{onClear:()=>{Ce(),de?.()},onApply:je,list:s&&d?x:f,buttonText:ie,buttonOptions:fe,hideClearButton:xe})]}),!!h&&c.jsx(ze.Description,{title:h.title,description:h.description,version:i})]})};exports.OpenedDropdown=tt;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),Ue=require("../../../../assets/icons/errorInfo.svg.js"),Pe=require("../../../../assets/icons/refresh-purple.svg.js"),r=require("react"),Ke=require("../../../zeroState/ZeroState.js"),Ve=require("../../../../hooks/useOutside.js"),R=require("../../../../constants/Theme.js"),$e=require("../../hooks/useDropdown.js"),Ne=require("./description/Description.js"),_e=require("./menu/FreeFormMenu.js"),ze=require("./menu/MenuList.js"),Ge=require("./menu/SelectAllMenu.js"),Je=require("./multiSelect/MultiSelectDropdownBottomBar.js"),te=require("./OpennedDropdown.styled.js"),Qe=require("./searchbox/SearchBox.js"),Xe=require("./searchbox/SearchZeroState.js"),V={height:304,width:290},Ye=({options:q,isSearchable:g,isMultiSelect:i,maxSelections:C,width:I,allowFreeForm:$,height:ne,onClose:N,onSelect:se,onSearch:d,version:l,skipSorting:re,headerRef:oe,hideSelectAll:ue,primaryButtonText:ce,onInfiniteScroll:ie,onMultiSelectClear:le,onDropdownItemClick:E,buttonOptions:ae,isSearchLoading:de,isOptionsLoading:fe,optionsErrorState:w,disableSearchOptions:he,disableSearchedOptionExcept:pe,useDefaultCursor:ge,containerStyle:we={},zeroState:F=void 0,isDraggable:y=!1,onOptionsReorder:O,hideClearButton:ye=!1,showCheckboxForCustomElement:Oe=!1,checkboxActiveColor:A,brandSelectedRow:B})=>{const W=r.useCallback(e=>{if(!y||!i)return e;const t=[],n=[];return e.forEach(u=>{u.options?n.push(u):u.selected?t.push(u):n.push(u)}),[...t,...n]},[y,i]),[j,_]=r.useState(()=>W(q)),z=r.useRef(j),G=r.useRef(!1),H=r.useRef(O);r.useEffect(()=>{_(W(q))},[q,W]),r.useEffect(()=>{z.current=j},[j]),r.useEffect(()=>{H.current=O},[O]),r.useEffect(()=>()=>{G.current&&H.current&&H.current(z.current)},[]);const xe=r.useCallback(e=>{_(e),l==="2.0"?O?.(e):G.current=!0},[O,l]),Se=y?j:q,{dropdownOptions:f,search:me,searchedString:s,searchedOptions:x,searchError:be,retrySearch:Le,onApplyHandler:M,selectAllHandler:Te,onMultiSelectClear:Re,onFreeFormSelect:qe,onMultiSelectApply:Ce,latestDropdownOptionsRef:Ee,getSelectedOptions:je,getCurrentSelectionCount:ke}=$e.useDropdown(l,Se,se,re||y,i,d,he,pe,C),[De,v]=r.useState(I??V.width),[p,Z]=r.useState(null),[k,J]=r.useState(-1),S=r.useRef(null),Q=r.useRef([]),U=r.useRef(null);Ve.useOutside(S,()=>{if(Z(null),i&&l==="2.0"){const e=je(Ee.current);N?.(e)}else N?.(f)},[oe,Q]),r.useEffect(()=>{const e=setTimeout(()=>{S.current&&S.current.focus({preventScroll:!0})},0);return()=>clearTimeout(e)},[]);const Ie=e=>{const t=[];return e.forEach(n=>{if(n.options)n.options.forEach(o=>{o.disabled||t.push(o)});else{const u=n;u.disabled||t.push(u)}}),t};r.useEffect(()=>{const e=n=>{const o=Ie(s&&d?x:f);if(o.length!==0){if(n.key==="ArrowDown")n.preventDefault(),J(a=>{const L=a<o.length-1?a+1:0;return setTimeout(()=>{const T=U.current?.querySelector(`[data-option-index="${L}"]`);T&&T.scrollIntoView({block:"nearest",behavior:"smooth"})},0),L});else if(n.key==="ArrowUp")n.preventDefault(),J(a=>{const L=a>0?a-1:o.length-1;return setTimeout(()=>{const T=U.current?.querySelector(`[data-option-index="${L}"]`);T&&T.scrollIntoView({block:"nearest",behavior:"smooth"})},0),L});else if(n.key==="Enter"&&k>=0){n.preventDefault();const a=o[k];a&&(M({...a,selected:!a.selected}),E&&E(a))}}},t=S.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}},[k,s,x,f,d,M,E]);const h=ne??V.height,X=typeof h=="number"?g&&i?h-96:g&&!i||!g&&i?h-48:h:h;function Fe(e,t){Z(e&&t?{title:e,description:t}:null)}r.useEffect(()=>{const e=I??V.width;if(p===null)v(e);else if(typeof e=="number")v(e*2);else if(typeof e=="string"&&e.endsWith("px")){const t=parseInt(e.replace("px",""))*2;v(t)}},[p]);const D=[],P=(e=>{if(!i||!C&&C!==0)return e;const n=ke(f)>=C;return n?e.map(u=>{if(u.options)return{...u,options:u.options.map(o=>({...o,disabled:o.disabled||!o.selected&&n}))};{const o=u;return{...o,disabled:o.disabled||!o.selected&&n}}}):e})((s&&d?x:f).map(e=>{if(s&&!d)if(e.options){const t={...e};return t.options=t.options.filter(n=>n.label?.toLowerCase().includes(s.toLowerCase())?(D.push(!s||n.label===s),!0):!1),t.options.length>0?t:null}else return e.label?.toLowerCase().includes(s.toLowerCase())||e.searchKey?.toLowerCase().includes(s.toLowerCase())?(D.push(!s||e.label===s),e):null;return e}).filter(e=>e!==null)),K=!!g&&s&&P.length===0,m=!s&&!!fe,b=!s&&!!w&&!m,Ae=!s&&!P.length&&!m&&!b,Y=m||b||Ae,Be=F?.title||"No results found",We=F?.subTitle||"Please try again later or contact us at support@bik.ai if you require further assistance.",He=w?.title||"Failed to load options",Me=w?.subTitle||"Something went wrong while fetching the list. Please try again",ve={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:R.COLORS.background.inverseLight,customIconColor:R.COLORS.background.inverseLight,LeadingIcon:Pe.default},ee={IconHolderStyle:{background:R.COLORS.background.negative.light},Icon:c.jsx(Ue.default,{color:R.COLORS.content.negative,width:24,height:24}),...w};ee.actionButton={...ve,...w?.actionButton??{}};const Ze=m?void 0:b?ee:F;return c.jsxs(te.OpennedDropdownContainer,{version:l,ref:S,tabIndex:-1,style:{width:De,...we,outline:"none"},children:[c.jsxs("div",{style:{width:p?"50%":"100%",display:"flex",flexDirection:"column",background:"white"},children:[!!g&&c.jsx(Qe.SearchBox,{onSearch:me,version:l}),Y?c.jsx("div",{style:{height:h,display:"flex",background:R.COLORS.background.base},children:c.jsx(Ke.ZeroState,{...Ze??{},isLoading:m,title:b?He:Be,subTitle:b?Me:We})}):c.jsxs(te.MenuListContainer,{minHeight:h,maxHeight:X,ref:U,children:[!!i&&!K&&!ue&&c.jsx(Ge.SelectAllMenu,{version:l,options:s&&d?x:f,onSelect:Te,checkboxActiveColor:A,brandSelectedRow:B}),!$&&K&&c.jsx(Xe.SearchZeroState,{isLoading:de,errorMessage:be,onRetry:Le,height:X,searchedString:s,containerWidth:I,version:l}),$&&(K||!!D.length&&D.every(e=>e===!1))&&c.jsx(_e.FreeFormMenu,{version:l,isMultiSelect:i,onSelect:qe,searchedString:s,checkboxActiveColor:A,brandSelectedRow:B}),c.jsx(ze.MenuList,{onInfiniteScroll:ie,onDropdownItemClick:E,version:l,onSelect:M,showDescription:Fe,isMultiSelect:i,options:P,useDefaultCursor:ge,ref:Q,focusedIndex:k,isDraggable:y,onOptionsReorder:xe,showCheckboxForCustomElement:Oe,checkboxActiveColor:A,brandSelectedRow:B})]}),!!i&&!Y&&l!=="2.0"&&c.jsx(Je.default,{onClear:()=>{Re(),le?.()},onApply:Ce,list:s&&d?x:f,buttonText:ce,buttonOptions:ae,hideClearButton:ye})]}),!!p&&c.jsx(Ne.Description,{title:p.title,description:p.description,version:l})]})};exports.OpenedDropdown=Ye;
 //# sourceMappingURL=OpennedDropdown.js.map

package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OpennedDropdown.js","sources":["../../../../../../src/components/dropdown/OpenedDropdown/components/OpennedDropdown.tsx"],"sourcesContent":["import ErrorInfoIcon from '@src/assets/icons/errorInfo.svg';\nimport RetryIcon from '@src/assets/icons/refresh-purple.svg';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { ZeroState } from '@src/components/zeroState/ZeroState';\nimport { useOutside } from '@src/hooks/useOutside';\nimport { COLORS } from '@src/constants/Theme';\nimport { useDropdown } from '../../hooks/useDropdown';\nimport {\n\tDropdownOption,\n\tGroupedOption,\n\tMultiSelectOption,\n\tOpenDropdownProps,\n\tSingleOption,\n} from '../../type';\nimport { Description } from './description/Description';\nimport { FreeFormMenu } from './menu/FreeFormMenu';\nimport { MenuList } from './menu/MenuList';\nimport { SelectAllMenu } from './menu/SelectAllMenu';\nimport MultiSelectDropdownBottomBar from './multiSelect/MultiSelectDropdownBottomBar';\nimport {\n\tMenuListContainer,\n\tOpennedDropdownContainer,\n} from './OpennedDropdown.styled';\nimport { SearchBox } from './searchbox/SearchBox';\nimport { SearchZeroState } from './searchbox/SearchZeroState';\n\n/** CONSTANTS /\nconst defaults = {\n\theight: 304,\n\twidth: 290,\n};\n\nexport const OpenedDropdown: React.FC<OpenDropdownProps> = ({\n\toptions,\n\tisSearchable,\n\tsearchPlaceholder,\n\tstaticMenuHeight,\n\tisMultiSelect,\n\tmaxSelections,\n\twidth,\n\tallowFreeForm,\n\theight,\n\tonClose,\n\tonSelect,\n\tonSearch,\n\tversion,\n\tskipSorting,\n\theaderRef,\n\thideSelectAll,\n\tprimaryButtonText,\n\tonInfiniteScroll,\n\tonMultiSelectClear: onMultiSelectClearProp,\n\tonDropdownItemClick,\n\tbuttonOptions,\n\tisSearchLoading,\n\tisOptionsLoading,\n\toptionsErrorState,\n\tdisableSearchOptions,\n\tdisableSearchedOptionExcept,\n\tuseDefaultCursor,\n\tcontainerStyle = {},\n\tzeroState = undefined,\n\tisDraggable = false,\n\tonOptionsReorder,\n\thideClearButton = false,\n\tshowCheckboxForCustomElement = false,\n\tcheckboxActiveColor,\n\tbrandSelectedRow,\n}) => {\n\t// Sort options with selected at top, unselected at bottom, maintaining order within groups\n\tconst sortOptionsWithSelectedOnTop = useCallback(\n\t\t(opts: DropdownOption[]): DropdownOption[] => {\n\t\t\tif (!isDraggable \|\| !isMultiSelect) return opts;\n\n\t\t\tconst selected: DropdownOption[] = [];\n\t\t\tconst unselected: DropdownOption[] = [];\n\n\t\t\topts.forEach((option) => {\n\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t// Handle grouped options - maintain grouping\n\t\t\t\t\tunselected.push(option);\n\t\t\t\t} else {\n\t\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\t\tif (singleOption.selected) {\n\t\t\t\t\t\tselected.push(option);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tunselected.push(option);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\n\t\t\treturn [...selected, ...unselected];\n\t\t},\n\t\t[isDraggable, isMultiSelect],\n\t);\n\n\tconst [localOptions, setLocalOptions] = useState<DropdownOption[]>(() =>\n\t\tsortOptionsWithSelectedOnTop(options),\n\t);\n\tconst localOptionsRef = useRef<DropdownOption[]>(localOptions);\n\tconst hasReorderedRef = useRef(false);\n\tconst onOptionsReorderRef = useRef(onOptionsReorder);\n\n\tuseEffect(() => {\n\t\tsetLocalOptions(sortOptionsWithSelectedOnTop(options));\n\t}, [options, sortOptionsWithSelectedOnTop]);\n\n\tuseEffect(() => {\n\t\tlocalOptionsRef.current = localOptions;\n\t}, [localOptions]);\n\n\tuseEffect(() => {\n\t\tonOptionsReorderRef.current = onOptionsReorder;\n\t}, [onOptionsReorder]);\n\n\t// Fire onOptionsReorder on unmount (dropdown close from Apply or click-outside)\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tif (hasReorderedRef.current && onOptionsReorderRef.current) {\n\t\t\t\tonOptionsReorderRef.current(localOptionsRef.current);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\tconst handleOptionsReorder = useCallback(\n\t\t(reorderedOptions: DropdownOption[]) => {\n\t\t\tsetLocalOptions(reorderedOptions);\n\t\t\t// For version 2.0 (no Apply button), apply reorder immediately\n\t\t\tif (version === '2.0') {\n\t\t\t\tonOptionsReorder?.(reorderedOptions);\n\t\t\t} else {\n\t\t\t\t// For version 1.0, defer until Apply/close (handled by unmount cleanup)\n\t\t\t\thasReorderedRef.current = true;\n\t\t\t}\n\t\t},\n\t\t[onOptionsReorder, version],\n\t);\n\n\tconst optionsToUse = isDraggable ? localOptions : options;\n\tconst {\n\t\tdropdownOptions,\n\t\tsearch,\n\t\tsearchedString,\n\t\tsearchedOptions,\n\t\tsearchError,\n\t\tretrySearch,\n\t\tonApplyHandler,\n\t\tselectAllHandler,\n\t\tonMultiSelectClear,\n\t\tonFreeFormSelect,\n\t\tonMultiSelectApply,\n\t\tlatestDropdownOptionsRef,\n\t\tgetSelectedOptions,\n\t\tgetCurrentSelectionCount,\n\t} = useDropdown(\n\t\tversion,\n\t\toptionsToUse,\n\t\tonSelect,\n\t\tskipSorting \|\| isDraggable,\n\t\tisMultiSelect,\n\t\tonSearch,\n\t\tdisableSearchOptions,\n\t\tdisableSearchedOptionExcept,\n\t\tmaxSelections,\n\t);\n\tconst [widthState, setWidthState] = useState(width ?? defaults.width);\n\tconst [descriptionInfo, setDescription] = useState<{\n\t\ttitle: string;\n\t\tdescription: string;\n\t} \| null>(null);\n\tconst [focusedIndex, setFocusedIndex] = useState<number>(-1);\n\tconst ref = useRef<HTMLDivElement>(null);\n\tconst childRefs = useRef([]);\n\tconst menuListRef = useRef<HTMLDivElement>(null);\n\tuseOutside(\n\t\tref,\n\t\t() => {\n\t\t\tsetDescription(null);\n\t\t\tif (isMultiSelect && version === '2.0') {\n\t\t\t\tconst optionsToSend = getSelectedOptions(\n\t\t\t\t\tlatestDropdownOptionsRef.current,\n\t\t\t\t);\n\t\t\t\tonClose?.(optionsToSend);\n\t\t\t} else {\n\t\t\t\tonClose?.(dropdownOptions);\n\t\t\t}\n\t\t},\n\t\t[headerRef, childRefs],\n\t);\n\n\t// Auto-focus dropdown when it opens for keyboard navigation while preventing scroll to maintain popper positioning\n\tuseEffect(() => {\n\t\tconst timer = setTimeout(() => {\n\t\t\tif (ref.current) {\n\t\t\t\tref.current.focus({ preventScroll: true });\n\t\t\t}\n\t\t}, 0);\n\t\treturn () => clearTimeout(timer);\n\t}, []);\n\n\t// Get flattened selectable options\n\tconst getFlattenedOptions = (opts: DropdownOption[]): SingleOption[] => {\n\t\tconst flattened: SingleOption[] = [];\n\t\topts.forEach((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\tconst groupedOption = option as GroupedOption;\n\t\t\t\tgroupedOption.options.forEach((nestedOption) => {\n\t\t\t\t\tif (!nestedOption.disabled) {\n\t\t\t\t\t\tflattened.push(nestedOption);\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\tif (!singleOption.disabled) {\n\t\t\t\t\tflattened.push(singleOption);\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t\treturn flattened;\n\t};\n\n\t/* Keyboard navigation handler /\n\tuseEffect(() => {\n\t\tconst handleKeyDown = (e: KeyboardEvent) => {\n\t\t\tconst currentOptions =\n\t\t\t\tsearchedString && onSearch ? searchedOptions : dropdownOptions;\n\t\t\tconst flattenedOptions = getFlattenedOptions(currentOptions);\n\n\t\t\tif (flattenedOptions.length === 0) return;\n\n\t\t\tif (e.key === 'ArrowDown') {\n\t\t\t\te.preventDefault();\n\t\t\t\tsetFocusedIndex((prev) => {\n\t\t\t\t\tconst newIndex = prev < flattenedOptions.length - 1 ? prev + 1 : 0;\n\t\t\t\t\t// Scroll to the focused item\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tconst focusedElement = menuListRef.current?.querySelector(\n\t\t\t\t\t\t\t`[data-option-index=\"${newIndex}\"]`,\n\t\t\t\t\t\t) as HTMLElement;\n\t\t\t\t\t\tif (focusedElement) {\n\t\t\t\t\t\t\tfocusedElement.scrollIntoView({\n\t\t\t\t\t\t\t\tblock: 'nearest',\n\t\t\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t}, 0);\n\t\t\t\t\treturn newIndex;\n\t\t\t\t});\n\t\t\t} else if (e.key === 'ArrowUp') {\n\t\t\t\te.preventDefault();\n\t\t\t\tsetFocusedIndex((prev) => {\n\t\t\t\t\tconst newIndex = prev > 0 ? prev - 1 : flattenedOptions.length - 1;\n\t\t\t\t\t// Scroll to the focused item\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tconst focusedElement = menuListRef.current?.querySelector(\n\t\t\t\t\t\t\t`[data-option-index=\"${newIndex}\"]`,\n\t\t\t\t\t\t) as HTMLElement;\n\t\t\t\t\t\tif (focusedElement) {\n\t\t\t\t\t\t\tfocusedElement.scrollIntoView({\n\t\t\t\t\t\t\t\tblock: 'nearest',\n\t\t\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t}, 0);\n\t\t\t\t\treturn newIndex;\n\t\t\t\t});\n\t\t\t} else if (e.key === 'Enter' && focusedIndex >= 0) {\n\t\t\t\te.preventDefault();\n\t\t\t\tconst focusedOption = flattenedOptions[focusedIndex];\n\t\t\t\tif (focusedOption) {\n\t\t\t\t\t// onApplyHandler handles the selection state and calls onSelect internally\n\t\t\t\t\tonApplyHandler({\n\t\t\t\t\t\t...focusedOption,\n\t\t\t\t\t\tselected: !focusedOption.selected,\n\t\t\t\t\t});\n\t\t\t\t\t// Also trigger onDropdownItemClick if provided\n\t\t\t\t\tif (onDropdownItemClick) {\n\t\t\t\t\t\tonDropdownItemClick(focusedOption);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\tconst dropdownElement = ref.current;\n\t\tif (dropdownElement) {\n\t\t\tdropdownElement.addEventListener('keydown', handleKeyDown);\n\t\t\treturn () => {\n\t\t\t\tdropdownElement.removeEventListener('keydown', handleKeyDown);\n\t\t\t};\n\t\t}\n\t}, [\n\t\tfocusedIndex,\n\t\tsearchedString,\n\t\tsearchedOptions,\n\t\tdropdownOptions,\n\t\tonSearch,\n\t\tonApplyHandler,\n\t\tonDropdownItemClick,\n\t]);\n\n\t// LOCAL CONSTANTS\n\tconst heightToUse = height ?? defaults.height;\n\tconst menuListMaxHeight =\n\t\ttypeof heightToUse === 'number'\n\t\t\t? isSearchable && isMultiSelect\n\t\t\t\t? heightToUse - 96\n\t\t\t\t: (isSearchable && !isMultiSelect) \|\| (!isSearchable && isMultiSelect)\n\t\t\t\t? heightToUse - 48\n\t\t\t\t: heightToUse\n\t\t\t: heightToUse;\n\n\tfunction showDescription(title?: string, description?: string) {\n\t\tif (title && description) {\n\t\t\tsetDescription({\n\t\t\t\ttitle,\n\t\t\t\tdescription,\n\t\t\t});\n\t\t} else {\n\t\t\tsetDescription(null);\n\t\t}\n\t}\n\n\tuseEffect(() => {\n\t\tconst widthToUse = width ?? defaults.width;\n\t\tif (descriptionInfo === null) {\n\t\t\tsetWidthState(widthToUse);\n\t\t} else if (typeof widthToUse === 'number') {\n\t\t\tsetWidthState(widthToUse 2);\n\t\t} else if (typeof widthToUse === 'string') {\n\t\t\tif (widthToUse.endsWith('px')) {\n\t\t\t\tconst newWidth = parseInt(widthToUse.replace('px', '')) * 2;\n\t\t\t\tsetWidthState(newWidth);\n\t\t\t}\n\t\t}\n\t}, [descriptionInfo]);\n\n\t/*\n\t This is to show the search result in a stateless way\n\t */\n\n\tconst exactMatchFound: boolean[] = [];\n\n\tconst processOptionsWithMaxSelections = (\n\t\toptionsToProcess: DropdownOption[],\n\t) => {\n\t\tif (!isMultiSelect \|\| (!maxSelections && maxSelections !== 0)) {\n\t\t\treturn optionsToProcess;\n\t\t}\n\n\t\t// Count from the full options list (not the filtered subset) so selections\n\t\t// hidden by a search query are still included in the limit check.\n\t\tconst currentSelectionCount = getCurrentSelectionCount(dropdownOptions);\n\t\tconst maxSelectionsReached = currentSelectionCount >= maxSelections;\n\n\t\tif (!maxSelectionsReached) {\n\t\t\treturn optionsToProcess;\n\t\t}\n\n\t\t// Disable unselected options when max selections is reached\n\t\treturn optionsToProcess.map((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\treturn {\n\t\t\t\t\t...option,\n\t\t\t\t\toptions: (option as GroupedOption).options.map((nestedOption) => ({\n\t\t\t\t\t\t...nestedOption,\n\t\t\t\t\t\tdisabled:\n\t\t\t\t\t\t\tnestedOption.disabled \|\|\n\t\t\t\t\t\t\t(!nestedOption.selected && maxSelectionsReached),\n\t\t\t\t\t})),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\treturn {\n\t\t\t\t\t...singleOption,\n\t\t\t\t\tdisabled:\n\t\t\t\t\t\tsingleOption.disabled \|\|\n\t\t\t\t\t\t(!singleOption.selected && maxSelectionsReached),\n\t\t\t\t};\n\t\t\t}\n\t\t});\n\t};\n\n\tconst optionsToShow = processOptionsWithMaxSelections(\n\t\t(searchedString && onSearch ? searchedOptions : dropdownOptions)\n\t\t\t.map((option) => {\n\t\t\t\tif (searchedString && !onSearch) {\n\t\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t\tconst groupedOption = { ...option } as GroupedOption;\n\t\t\t\t\t\tgroupedOption.options = groupedOption.options.filter((op) => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\top.label?.toLowerCase().includes(searchedString.toLowerCase())\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\texactMatchFound.push(\n\t\t\t\t\t\t\t\t\t!searchedString \|\| op.label === searchedString,\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t});\n\n\t\t\t\t\t\treturn groupedOption.options.length > 0 ? groupedOption : null;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\toption.label\n\t\t\t\t\t\t\t\t?.toLowerCase()\n\t\t\t\t\t\t\t\t.includes(searchedString.toLowerCase()) \|\|\n\t\t\t\t\t\t\t(option as SingleOption \| MultiSelectOption).searchKey\n\t\t\t\t\t\t\t\t?.toLowerCase()\n\t\t\t\t\t\t\t\t.includes(searchedString.toLowerCase())\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\texactMatchFound.push(\n\t\t\t\t\t\t\t\t!searchedString \|\| option.label === searchedString,\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\treturn option;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn option;\n\t\t\t})\n\t\t\t.filter((option) => option !== null) as DropdownOption[],\n\t);\n\n\tconst noResultForSearch =\n\t\t!!isSearchable && searchedString && optionsToShow.length === 0;\n\tconst showLoadingState = !searchedString && !!isOptionsLoading;\n\tconst showErrorState =\n\t\t!searchedString && !!optionsErrorState && !showLoadingState;\n\tconst showEmptyState =\n\t\t!searchedString &&\n\t\t!optionsToShow.length &&\n\t\t!showLoadingState &&\n\t\t!showErrorState;\n\tconst showTopLevelZeroState =\n\t\tshowLoadingState \|\| showErrorState \|\| showEmptyState;\n\n\tconst emptyStateTitle = zeroState?.title \|\| 'No results found';\n\tconst emptyStateSubTitle =\n\t\tzeroState?.subTitle \|\|\n\t\t`Please try again later or contact us at support@bik.ai if you require further assistance.`;\n\tconst errorStateTitle = optionsErrorState?.title \|\| 'Failed to load options';\n\tconst errorStateSubTitle =\n\t\toptionsErrorState?.subTitle \|\|\n\t\t'Something went wrong while fetching the list. Please try again';\n\tconst defaultErrorActionButton = {\n\t\tbuttonText: 'Try again',\n\t\tbuttonType: 'text' as const,\n\t\tsize: 'small' as const,\n\t\tbuttonTextColor: COLORS.background.inverseLight,\n\t\tcustomIconColor: COLORS.background.inverseLight,\n\t\tLeadingIcon: RetryIcon,\n\t};\n\n\tconst mergedErrorState = {\n\t\tIconHolderStyle: {\n\t\t\tbackground: COLORS.background.negative.light,\n\t\t},\n\t\tIcon: (\n\t\t\t<ErrorInfoIcon color={COLORS.content.negative} width={24} height={24} />\n\t\t),\n\t\t...optionsErrorState,\n\t};\n\tmergedErrorState.actionButton = {\n\t\t...defaultErrorActionButton,\n\t\t...(optionsErrorState?.actionButton ?? {}),\n\t};\n\tconst zeroStateProps = showLoadingState\n\t\t? undefined\n\t\t: showErrorState\n\t\t? mergedErrorState\n\t\t: zeroState;\n\n\treturn (\n\t\t<OpennedDropdownContainer\n\t\t\tversion={version}\n\t\t\tref={ref}\n\t\t\ttabIndex={-1}\n\t\t\tstyle={{\n\t\t\t\t// maxWidth: descriptionInfo ? 800 : 400,\n\t\t\t\twidth: widthState,\n\t\t\t\t...containerStyle,\n\t\t\t\toutline: 'none',\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: descriptionInfo ? '50%' : '100%',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tbackground: 'white',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!!isSearchable && (\n\t\t\t\t\t<SearchBox\n\t\t\t\t\t\tonSearch={search}\n\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\tplaceholder={searchPlaceholder}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{showTopLevelZeroState ? (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\theight: staticMenuHeight ? menuListMaxHeight : heightToUse,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tbackground: COLORS.background.base,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ZeroState\n\t\t\t\t\t\t\t{...(zeroStateProps ?? {})}\n\t\t\t\t\t\t\tisLoading={showLoadingState}\n\t\t\t\t\t\t\ttitle={showErrorState ? errorStateTitle : emptyStateTitle}\n\t\t\t\t\t\t\tsubTitle={\n\t\t\t\t\t\t\t\tshowErrorState ? errorStateSubTitle : emptyStateSubTitle\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<MenuListContainer\n\t\t\t\t\t\tminHeight={staticMenuHeight ? menuListMaxHeight : undefined}\n\t\t\t\t\t\tmaxHeight={menuListMaxHeight}\n\t\t\t\t\t\tref={menuListRef}\n\t\t\t\t\t>\n\t\t\t\t\t\t{!!isMultiSelect && !noResultForSearch && !hideSelectAll && (\n\t\t\t\t\t\t\t<SelectAllMenu\n\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\toptions={\n\t\t\t\t\t\t\t\t\tsearchedString && onSearch ? searchedOptions : dropdownOptions\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonSelect={selectAllHandler}\n\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{!allowFreeForm && noResultForSearch && (\n\t\t\t\t\t\t\t<SearchZeroState\n\t\t\t\t\t\t\t\tisLoading={isSearchLoading}\n\t\t\t\t\t\t\t\terrorMessage={searchError}\n\t\t\t\t\t\t\t\tonRetry={retrySearch}\n\t\t\t\t\t\t\t\theight={menuListMaxHeight as number}\n\t\t\t\t\t\t\t\tsearchedString={searchedString}\n\t\t\t\t\t\t\t\tcontainerWidth={width}\n\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{allowFreeForm &&\n\t\t\t\t\t\t\t(noResultForSearch \|\|\n\t\t\t\t\t\t\t\t(!!exactMatchFound.length &&\n\t\t\t\t\t\t\t\t\texactMatchFound.every((val) => val === false))) && (\n\t\t\t\t\t\t\t\t<FreeFormMenu\n\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\t\tonSelect={onFreeFormSelect}\n\t\t\t\t\t\t\t\t\tsearchedString={searchedString}\n\t\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<MenuList\n\t\t\t\t\t\t\tonInfiniteScroll={onInfiniteScroll}\n\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\tonSelect={onApplyHandler}\n\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\toptions={optionsToShow}\n\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\tref={childRefs}\n\t\t\t\t\t\t\tfocusedIndex={focusedIndex}\n\t\t\t\t\t\t\tisDraggable={isDraggable}\n\t\t\t\t\t\t\tonOptionsReorder={handleOptionsReorder}\n\t\t\t\t\t\t\tshowCheckboxForCustomElement={showCheckboxForCustomElement}\n\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MenuListContainer>\n\t\t\t\t)}\n\t\t\t\t{!!isMultiSelect && !showTopLevelZeroState && version !== '2.0' && (\n\t\t\t\t\t<MultiSelectDropdownBottomBar\n\t\t\t\t\t\tonClear={() => {\n\t\t\t\t\t\t\tonMultiSelectClear();\n\t\t\t\t\t\t\tonMultiSelectClearProp?.();\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonApply={onMultiSelectApply}\n\t\t\t\t\t\tlist={\n\t\t\t\t\t\t\tsearchedString && onSearch ? searchedOptions : dropdownOptions\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbuttonText={primaryButtonText}\n\t\t\t\t\t\tbuttonOptions={buttonOptions}\n\t\t\t\t\t\thideClearButton={hideClearButton}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t{!!descriptionInfo && (\n\t\t\t\t<Description\n\t\t\t\t\ttitle={descriptionInfo.title}\n\t\t\t\t\tdescription={descriptionInfo.description}\n\t\t\t\t\tversion={version}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</OpennedDropdownContainer>\n\t);\n};\n"],"names":["defaults","OpenedDropdown","options","isSearchable","searchPlaceholder","staticMenuHeight","isMultiSelect","maxSelections","width","allowFreeForm","height","onClose","onSelect","onSearch","version","skipSorting","headerRef","hideSelectAll","primaryButtonText","onInfiniteScroll","onMultiSelectClearProp","onDropdownItemClick","buttonOptions","isSearchLoading","isOptionsLoading","optionsErrorState","disableSearchOptions","disableSearchedOptionExcept","useDefaultCursor","containerStyle","zeroState","isDraggable","onOptionsReorder","hideClearButton","showCheckboxForCustomElement","checkboxActiveColor","brandSelectedRow","sortOptionsWithSelectedOnTop","useCallback","opts","selected","unselected","option","localOptions","setLocalOptions","useState","localOptionsRef","useRef","hasReorderedRef","onOptionsReorderRef","useEffect","handleOptionsReorder","reorderedOptions","optionsToUse","dropdownOptions","search","searchedString","searchedOptions","searchError","retrySearch","onApplyHandler","selectAllHandler","onMultiSelectClear","onFreeFormSelect","onMultiSelectApply","latestDropdownOptionsRef","getSelectedOptions","getCurrentSelectionCount","useDropdown","widthState","setWidthState","descriptionInfo","setDescription","focusedIndex","setFocusedIndex","ref","childRefs","menuListRef","useOutside","optionsToSend","timer","getFlattenedOptions","flattened","nestedOption","singleOption","handleKeyDown","e","flattenedOptions","prev","newIndex","focusedElement","focusedOption","dropdownElement","heightToUse","menuListMaxHeight","showDescription","title","description","widthToUse","newWidth","exactMatchFound","optionsToShow","optionsToProcess","maxSelectionsReached","groupedOption","op","noResultForSearch","showLoadingState","showErrorState","showEmptyState","showTopLevelZeroState","emptyStateTitle","emptyStateSubTitle","errorStateTitle","errorStateSubTitle","defaultErrorActionButton","COLORS","RetryIcon","mergedErrorState","jsx","ErrorInfoIcon","zeroStateProps","jsxs","OpennedDropdownContainer","SearchBox","ZeroState","MenuListContainer","SelectAllMenu","SearchZeroState","val","FreeFormMenu","MenuList","MultiSelectDropdownBottomBar","Description"],"mappings":"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"}
1	+ {"version":3,"file":"OpennedDropdown.js","sources":["../../../../../../src/components/dropdown/OpenedDropdown/components/OpennedDropdown.tsx"],"sourcesContent":["import ErrorInfoIcon from '@src/assets/icons/errorInfo.svg';\nimport RetryIcon from '@src/assets/icons/refresh-purple.svg';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { ZeroState } from '@src/components/zeroState/ZeroState';\nimport { useOutside } from '@src/hooks/useOutside';\nimport { COLORS } from '@src/constants/Theme';\nimport { useDropdown } from '../../hooks/useDropdown';\nimport {\n\tDropdownOption,\n\tGroupedOption,\n\tMultiSelectOption,\n\tOpenDropdownProps,\n\tSingleOption,\n} from '../../type';\nimport { Description } from './description/Description';\nimport { FreeFormMenu } from './menu/FreeFormMenu';\nimport { MenuList } from './menu/MenuList';\nimport { SelectAllMenu } from './menu/SelectAllMenu';\nimport MultiSelectDropdownBottomBar from './multiSelect/MultiSelectDropdownBottomBar';\nimport {\n\tMenuListContainer,\n\tOpennedDropdownContainer,\n} from './OpennedDropdown.styled';\nimport { SearchBox } from './searchbox/SearchBox';\nimport { SearchZeroState } from './searchbox/SearchZeroState';\n\n/** CONSTANTS /\nconst defaults = {\n\theight: 304,\n\twidth: 290,\n};\n\nexport const OpenedDropdown: React.FC<OpenDropdownProps> = ({\n\toptions,\n\tisSearchable,\n\tisMultiSelect,\n\tmaxSelections,\n\twidth,\n\tallowFreeForm,\n\theight,\n\tonClose,\n\tonSelect,\n\tonSearch,\n\tversion,\n\tskipSorting,\n\theaderRef,\n\thideSelectAll,\n\tprimaryButtonText,\n\tonInfiniteScroll,\n\tonMultiSelectClear: onMultiSelectClearProp,\n\tonDropdownItemClick,\n\tbuttonOptions,\n\tisSearchLoading,\n\tisOptionsLoading,\n\toptionsErrorState,\n\tdisableSearchOptions,\n\tdisableSearchedOptionExcept,\n\tuseDefaultCursor,\n\tcontainerStyle = {},\n\tzeroState = undefined,\n\tisDraggable = false,\n\tonOptionsReorder,\n\thideClearButton = false,\n\tshowCheckboxForCustomElement = false,\n\tcheckboxActiveColor,\n\tbrandSelectedRow,\n}) => {\n\t// Sort options with selected at top, unselected at bottom, maintaining order within groups\n\tconst sortOptionsWithSelectedOnTop = useCallback(\n\t\t(opts: DropdownOption[]): DropdownOption[] => {\n\t\t\tif (!isDraggable \|\| !isMultiSelect) return opts;\n\n\t\t\tconst selected: DropdownOption[] = [];\n\t\t\tconst unselected: DropdownOption[] = [];\n\n\t\t\topts.forEach((option) => {\n\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t// Handle grouped options - maintain grouping\n\t\t\t\t\tunselected.push(option);\n\t\t\t\t} else {\n\t\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\t\tif (singleOption.selected) {\n\t\t\t\t\t\tselected.push(option);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tunselected.push(option);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\n\t\t\treturn [...selected, ...unselected];\n\t\t},\n\t\t[isDraggable, isMultiSelect],\n\t);\n\n\tconst [localOptions, setLocalOptions] = useState<DropdownOption[]>(() =>\n\t\tsortOptionsWithSelectedOnTop(options),\n\t);\n\tconst localOptionsRef = useRef<DropdownOption[]>(localOptions);\n\tconst hasReorderedRef = useRef(false);\n\tconst onOptionsReorderRef = useRef(onOptionsReorder);\n\n\tuseEffect(() => {\n\t\tsetLocalOptions(sortOptionsWithSelectedOnTop(options));\n\t}, [options, sortOptionsWithSelectedOnTop]);\n\n\tuseEffect(() => {\n\t\tlocalOptionsRef.current = localOptions;\n\t}, [localOptions]);\n\n\tuseEffect(() => {\n\t\tonOptionsReorderRef.current = onOptionsReorder;\n\t}, [onOptionsReorder]);\n\n\t// Fire onOptionsReorder on unmount (dropdown close from Apply or click-outside)\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tif (hasReorderedRef.current && onOptionsReorderRef.current) {\n\t\t\t\tonOptionsReorderRef.current(localOptionsRef.current);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\tconst handleOptionsReorder = useCallback(\n\t\t(reorderedOptions: DropdownOption[]) => {\n\t\t\tsetLocalOptions(reorderedOptions);\n\t\t\t// For version 2.0 (no Apply button), apply reorder immediately\n\t\t\tif (version === '2.0') {\n\t\t\t\tonOptionsReorder?.(reorderedOptions);\n\t\t\t} else {\n\t\t\t\t// For version 1.0, defer until Apply/close (handled by unmount cleanup)\n\t\t\t\thasReorderedRef.current = true;\n\t\t\t}\n\t\t},\n\t\t[onOptionsReorder, version],\n\t);\n\n\tconst optionsToUse = isDraggable ? localOptions : options;\n\tconst {\n\t\tdropdownOptions,\n\t\tsearch,\n\t\tsearchedString,\n\t\tsearchedOptions,\n\t\tsearchError,\n\t\tretrySearch,\n\t\tonApplyHandler,\n\t\tselectAllHandler,\n\t\tonMultiSelectClear,\n\t\tonFreeFormSelect,\n\t\tonMultiSelectApply,\n\t\tlatestDropdownOptionsRef,\n\t\tgetSelectedOptions,\n\t\tgetCurrentSelectionCount,\n\t} = useDropdown(\n\t\tversion,\n\t\toptionsToUse,\n\t\tonSelect,\n\t\tskipSorting \|\| isDraggable,\n\t\tisMultiSelect,\n\t\tonSearch,\n\t\tdisableSearchOptions,\n\t\tdisableSearchedOptionExcept,\n\t\tmaxSelections,\n\t);\n\tconst [widthState, setWidthState] = useState(width ?? defaults.width);\n\tconst [descriptionInfo, setDescription] = useState<{\n\t\ttitle: string;\n\t\tdescription: string;\n\t} \| null>(null);\n\tconst [focusedIndex, setFocusedIndex] = useState<number>(-1);\n\tconst ref = useRef<HTMLDivElement>(null);\n\tconst childRefs = useRef([]);\n\tconst menuListRef = useRef<HTMLDivElement>(null);\n\tuseOutside(\n\t\tref,\n\t\t() => {\n\t\t\tsetDescription(null);\n\t\t\tif (isMultiSelect && version === '2.0') {\n\t\t\t\tconst optionsToSend = getSelectedOptions(\n\t\t\t\t\tlatestDropdownOptionsRef.current,\n\t\t\t\t);\n\t\t\t\tonClose?.(optionsToSend);\n\t\t\t} else {\n\t\t\t\tonClose?.(dropdownOptions);\n\t\t\t}\n\t\t},\n\t\t[headerRef, childRefs],\n\t);\n\n\t// Auto-focus dropdown when it opens for keyboard navigation while preventing scroll to maintain popper positioning\n\tuseEffect(() => {\n\t\tconst timer = setTimeout(() => {\n\t\t\tif (ref.current) {\n\t\t\t\tref.current.focus({ preventScroll: true });\n\t\t\t}\n\t\t}, 0);\n\t\treturn () => clearTimeout(timer);\n\t}, []);\n\n\t// Get flattened selectable options\n\tconst getFlattenedOptions = (opts: DropdownOption[]): SingleOption[] => {\n\t\tconst flattened: SingleOption[] = [];\n\t\topts.forEach((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\tconst groupedOption = option as GroupedOption;\n\t\t\t\tgroupedOption.options.forEach((nestedOption) => {\n\t\t\t\t\tif (!nestedOption.disabled) {\n\t\t\t\t\t\tflattened.push(nestedOption);\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\tif (!singleOption.disabled) {\n\t\t\t\t\tflattened.push(singleOption);\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t\treturn flattened;\n\t};\n\n\t/* Keyboard navigation handler /\n\tuseEffect(() => {\n\t\tconst handleKeyDown = (e: KeyboardEvent) => {\n\t\t\tconst currentOptions =\n\t\t\t\tsearchedString && onSearch ? searchedOptions : dropdownOptions;\n\t\t\tconst flattenedOptions = getFlattenedOptions(currentOptions);\n\n\t\t\tif (flattenedOptions.length === 0) return;\n\n\t\t\tif (e.key === 'ArrowDown') {\n\t\t\t\te.preventDefault();\n\t\t\t\tsetFocusedIndex((prev) => {\n\t\t\t\t\tconst newIndex = prev < flattenedOptions.length - 1 ? prev + 1 : 0;\n\t\t\t\t\t// Scroll to the focused item\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tconst focusedElement = menuListRef.current?.querySelector(\n\t\t\t\t\t\t\t`[data-option-index=\"${newIndex}\"]`,\n\t\t\t\t\t\t) as HTMLElement;\n\t\t\t\t\t\tif (focusedElement) {\n\t\t\t\t\t\t\tfocusedElement.scrollIntoView({\n\t\t\t\t\t\t\t\tblock: 'nearest',\n\t\t\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t}, 0);\n\t\t\t\t\treturn newIndex;\n\t\t\t\t});\n\t\t\t} else if (e.key === 'ArrowUp') {\n\t\t\t\te.preventDefault();\n\t\t\t\tsetFocusedIndex((prev) => {\n\t\t\t\t\tconst newIndex = prev > 0 ? prev - 1 : flattenedOptions.length - 1;\n\t\t\t\t\t// Scroll to the focused item\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tconst focusedElement = menuListRef.current?.querySelector(\n\t\t\t\t\t\t\t`[data-option-index=\"${newIndex}\"]`,\n\t\t\t\t\t\t) as HTMLElement;\n\t\t\t\t\t\tif (focusedElement) {\n\t\t\t\t\t\t\tfocusedElement.scrollIntoView({\n\t\t\t\t\t\t\t\tblock: 'nearest',\n\t\t\t\t\t\t\t\tbehavior: 'smooth',\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t}, 0);\n\t\t\t\t\treturn newIndex;\n\t\t\t\t});\n\t\t\t} else if (e.key === 'Enter' && focusedIndex >= 0) {\n\t\t\t\te.preventDefault();\n\t\t\t\tconst focusedOption = flattenedOptions[focusedIndex];\n\t\t\t\tif (focusedOption) {\n\t\t\t\t\t// onApplyHandler handles the selection state and calls onSelect internally\n\t\t\t\t\tonApplyHandler({\n\t\t\t\t\t\t...focusedOption,\n\t\t\t\t\t\tselected: !focusedOption.selected,\n\t\t\t\t\t});\n\t\t\t\t\t// Also trigger onDropdownItemClick if provided\n\t\t\t\t\tif (onDropdownItemClick) {\n\t\t\t\t\t\tonDropdownItemClick(focusedOption);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\n\t\tconst dropdownElement = ref.current;\n\t\tif (dropdownElement) {\n\t\t\tdropdownElement.addEventListener('keydown', handleKeyDown);\n\t\t\treturn () => {\n\t\t\t\tdropdownElement.removeEventListener('keydown', handleKeyDown);\n\t\t\t};\n\t\t}\n\t}, [\n\t\tfocusedIndex,\n\t\tsearchedString,\n\t\tsearchedOptions,\n\t\tdropdownOptions,\n\t\tonSearch,\n\t\tonApplyHandler,\n\t\tonDropdownItemClick,\n\t]);\n\n\t// LOCAL CONSTANTS\n\tconst heightToUse = height ?? defaults.height;\n\tconst menuListMaxHeight =\n\t\ttypeof heightToUse === 'number'\n\t\t\t? isSearchable && isMultiSelect\n\t\t\t\t? heightToUse - 96\n\t\t\t\t: (isSearchable && !isMultiSelect) \|\| (!isSearchable && isMultiSelect)\n\t\t\t\t? heightToUse - 48\n\t\t\t\t: heightToUse\n\t\t\t: heightToUse;\n\n\tfunction showDescription(title?: string, description?: string) {\n\t\tif (title && description) {\n\t\t\tsetDescription({\n\t\t\t\ttitle,\n\t\t\t\tdescription,\n\t\t\t});\n\t\t} else {\n\t\t\tsetDescription(null);\n\t\t}\n\t}\n\n\tuseEffect(() => {\n\t\tconst widthToUse = width ?? defaults.width;\n\t\tif (descriptionInfo === null) {\n\t\t\tsetWidthState(widthToUse);\n\t\t} else if (typeof widthToUse === 'number') {\n\t\t\tsetWidthState(widthToUse 2);\n\t\t} else if (typeof widthToUse === 'string') {\n\t\t\tif (widthToUse.endsWith('px')) {\n\t\t\t\tconst newWidth = parseInt(widthToUse.replace('px', '')) * 2;\n\t\t\t\tsetWidthState(newWidth);\n\t\t\t}\n\t\t}\n\t}, [descriptionInfo]);\n\n\t/*\n\t This is to show the search result in a stateless way\n\t */\n\n\tconst exactMatchFound: boolean[] = [];\n\n\tconst processOptionsWithMaxSelections = (\n\t\toptionsToProcess: DropdownOption[],\n\t) => {\n\t\tif (!isMultiSelect \|\| (!maxSelections && maxSelections !== 0)) {\n\t\t\treturn optionsToProcess;\n\t\t}\n\n\t\t// Count from the full options list (not the filtered subset) so selections\n\t\t// hidden by a search query are still included in the limit check.\n\t\tconst currentSelectionCount = getCurrentSelectionCount(dropdownOptions);\n\t\tconst maxSelectionsReached = currentSelectionCount >= maxSelections;\n\n\t\tif (!maxSelectionsReached) {\n\t\t\treturn optionsToProcess;\n\t\t}\n\n\t\t// Disable unselected options when max selections is reached\n\t\treturn optionsToProcess.map((option) => {\n\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\treturn {\n\t\t\t\t\t...option,\n\t\t\t\t\toptions: (option as GroupedOption).options.map((nestedOption) => ({\n\t\t\t\t\t\t...nestedOption,\n\t\t\t\t\t\tdisabled:\n\t\t\t\t\t\t\tnestedOption.disabled \|\|\n\t\t\t\t\t\t\t(!nestedOption.selected && maxSelectionsReached),\n\t\t\t\t\t})),\n\t\t\t\t};\n\t\t\t} else {\n\t\t\t\tconst singleOption = option as SingleOption;\n\t\t\t\treturn {\n\t\t\t\t\t...singleOption,\n\t\t\t\t\tdisabled:\n\t\t\t\t\t\tsingleOption.disabled \|\|\n\t\t\t\t\t\t(!singleOption.selected && maxSelectionsReached),\n\t\t\t\t};\n\t\t\t}\n\t\t});\n\t};\n\n\tconst optionsToShow = processOptionsWithMaxSelections(\n\t\t(searchedString && onSearch ? searchedOptions : dropdownOptions)\n\t\t\t.map((option) => {\n\t\t\t\tif (searchedString && !onSearch) {\n\t\t\t\t\tif ((option as GroupedOption).options) {\n\t\t\t\t\t\tconst groupedOption = { ...option } as GroupedOption;\n\t\t\t\t\t\tgroupedOption.options = groupedOption.options.filter((op) => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\top.label?.toLowerCase().includes(searchedString.toLowerCase())\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\texactMatchFound.push(\n\t\t\t\t\t\t\t\t\t!searchedString \|\| op.label === searchedString,\n\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t});\n\n\t\t\t\t\t\treturn groupedOption.options.length > 0 ? groupedOption : null;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\toption.label\n\t\t\t\t\t\t\t\t?.toLowerCase()\n\t\t\t\t\t\t\t\t.includes(searchedString.toLowerCase()) \|\|\n\t\t\t\t\t\t\t(option as SingleOption \| MultiSelectOption).searchKey\n\t\t\t\t\t\t\t\t?.toLowerCase()\n\t\t\t\t\t\t\t\t.includes(searchedString.toLowerCase())\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\texactMatchFound.push(\n\t\t\t\t\t\t\t\t!searchedString \|\| option.label === searchedString,\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\treturn option;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\treturn option;\n\t\t\t})\n\t\t\t.filter((option) => option !== null) as DropdownOption[],\n\t);\n\n\tconst noResultForSearch =\n\t\t!!isSearchable && searchedString && optionsToShow.length === 0;\n\tconst showLoadingState = !searchedString && !!isOptionsLoading;\n\tconst showErrorState =\n\t\t!searchedString && !!optionsErrorState && !showLoadingState;\n\tconst showEmptyState =\n\t\t!searchedString &&\n\t\t!optionsToShow.length &&\n\t\t!showLoadingState &&\n\t\t!showErrorState;\n\tconst showTopLevelZeroState =\n\t\tshowLoadingState \|\| showErrorState \|\| showEmptyState;\n\n\tconst emptyStateTitle = zeroState?.title \|\| 'No results found';\n\tconst emptyStateSubTitle =\n\t\tzeroState?.subTitle \|\|\n\t\t`Please try again later or contact us at support@bik.ai if you require further assistance.`;\n\tconst errorStateTitle = optionsErrorState?.title \|\| 'Failed to load options';\n\tconst errorStateSubTitle =\n\t\toptionsErrorState?.subTitle \|\|\n\t\t'Something went wrong while fetching the list. Please try again';\n\tconst defaultErrorActionButton = {\n\t\tbuttonText: 'Try again',\n\t\tbuttonType: 'text' as const,\n\t\tsize: 'small' as const,\n\t\tbuttonTextColor: COLORS.background.inverseLight,\n\t\tcustomIconColor: COLORS.background.inverseLight,\n\t\tLeadingIcon: RetryIcon,\n\t};\n\n\tconst mergedErrorState = {\n\t\tIconHolderStyle: {\n\t\t\tbackground: COLORS.background.negative.light,\n\t\t},\n\t\tIcon: (\n\t\t\t<ErrorInfoIcon color={COLORS.content.negative} width={24} height={24} />\n\t\t),\n\t\t...optionsErrorState,\n\t};\n\tmergedErrorState.actionButton = {\n\t\t...defaultErrorActionButton,\n\t\t...(optionsErrorState?.actionButton ?? {}),\n\t};\n\tconst zeroStateProps = showLoadingState\n\t\t? undefined\n\t\t: showErrorState\n\t\t? mergedErrorState\n\t\t: zeroState;\n\n\treturn (\n\t\t<OpennedDropdownContainer\n\t\t\tversion={version}\n\t\t\tref={ref}\n\t\t\ttabIndex={-1}\n\t\t\tstyle={{\n\t\t\t\t// maxWidth: descriptionInfo ? 800 : 400,\n\t\t\t\twidth: widthState,\n\t\t\t\t...containerStyle,\n\t\t\t\toutline: 'none',\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: descriptionInfo ? '50%' : '100%',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tbackground: 'white',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!!isSearchable && <SearchBox onSearch={search} version={version} />}\n\n\t\t\t\t{showTopLevelZeroState ? (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\theight: heightToUse,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tbackground: COLORS.background.base,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ZeroState\n\t\t\t\t\t\t\t{...(zeroStateProps ?? {})}\n\t\t\t\t\t\t\tisLoading={showLoadingState}\n\t\t\t\t\t\t\ttitle={showErrorState ? errorStateTitle : emptyStateTitle}\n\t\t\t\t\t\t\tsubTitle={\n\t\t\t\t\t\t\t\tshowErrorState ? errorStateSubTitle : emptyStateSubTitle\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<MenuListContainer\n\t\t\t\t\t\tminHeight={heightToUse}\n\t\t\t\t\t\tmaxHeight={menuListMaxHeight}\n\t\t\t\t\t\tref={menuListRef}\n\t\t\t\t\t>\n\t\t\t\t\t\t{!!isMultiSelect && !noResultForSearch && !hideSelectAll && (\n\t\t\t\t\t\t\t<SelectAllMenu\n\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\toptions={\n\t\t\t\t\t\t\t\t\tsearchedString && onSearch ? searchedOptions : dropdownOptions\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonSelect={selectAllHandler}\n\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{!allowFreeForm && noResultForSearch && (\n\t\t\t\t\t\t\t<SearchZeroState\n\t\t\t\t\t\t\t\tisLoading={isSearchLoading}\n\t\t\t\t\t\t\t\terrorMessage={searchError}\n\t\t\t\t\t\t\t\tonRetry={retrySearch}\n\t\t\t\t\t\t\t\theight={menuListMaxHeight as number}\n\t\t\t\t\t\t\t\tsearchedString={searchedString}\n\t\t\t\t\t\t\t\tcontainerWidth={width}\n\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{allowFreeForm &&\n\t\t\t\t\t\t\t(noResultForSearch \|\|\n\t\t\t\t\t\t\t\t(!!exactMatchFound.length &&\n\t\t\t\t\t\t\t\t\texactMatchFound.every((val) => val === false))) && (\n\t\t\t\t\t\t\t\t<FreeFormMenu\n\t\t\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\t\t\tonSelect={onFreeFormSelect}\n\t\t\t\t\t\t\t\t\tsearchedString={searchedString}\n\t\t\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<MenuList\n\t\t\t\t\t\t\tonInfiniteScroll={onInfiniteScroll}\n\t\t\t\t\t\t\tonDropdownItemClick={onDropdownItemClick}\n\t\t\t\t\t\t\tversion={version}\n\t\t\t\t\t\t\tonSelect={onApplyHandler}\n\t\t\t\t\t\t\tshowDescription={showDescription}\n\t\t\t\t\t\t\tisMultiSelect={isMultiSelect}\n\t\t\t\t\t\t\toptions={optionsToShow}\n\t\t\t\t\t\t\tuseDefaultCursor={useDefaultCursor}\n\t\t\t\t\t\t\tref={childRefs}\n\t\t\t\t\t\t\tfocusedIndex={focusedIndex}\n\t\t\t\t\t\t\tisDraggable={isDraggable}\n\t\t\t\t\t\t\tonOptionsReorder={handleOptionsReorder}\n\t\t\t\t\t\t\tshowCheckboxForCustomElement={showCheckboxForCustomElement}\n\t\t\t\t\t\t\tcheckboxActiveColor={checkboxActiveColor}\n\t\t\t\t\t\t\tbrandSelectedRow={brandSelectedRow}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MenuListContainer>\n\t\t\t\t)}\n\t\t\t\t{!!isMultiSelect && !showTopLevelZeroState && version !== '2.0' && (\n\t\t\t\t\t<MultiSelectDropdownBottomBar\n\t\t\t\t\t\tonClear={() => {\n\t\t\t\t\t\t\tonMultiSelectClear();\n\t\t\t\t\t\t\tonMultiSelectClearProp?.();\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonApply={onMultiSelectApply}\n\t\t\t\t\t\tlist={\n\t\t\t\t\t\t\tsearchedString && onSearch ? searchedOptions : dropdownOptions\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbuttonText={primaryButtonText}\n\t\t\t\t\t\tbuttonOptions={buttonOptions}\n\t\t\t\t\t\thideClearButton={hideClearButton}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t{!!descriptionInfo && (\n\t\t\t\t<Description\n\t\t\t\t\ttitle={descriptionInfo.title}\n\t\t\t\t\tdescription={descriptionInfo.description}\n\t\t\t\t\tversion={version}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</OpennedDropdownContainer>\n\t);\n};\n"],"names":["defaults","OpenedDropdown","options","isSearchable","isMultiSelect","maxSelections","width","allowFreeForm","height","onClose","onSelect","onSearch","version","skipSorting","headerRef","hideSelectAll","primaryButtonText","onInfiniteScroll","onMultiSelectClearProp","onDropdownItemClick","buttonOptions","isSearchLoading","isOptionsLoading","optionsErrorState","disableSearchOptions","disableSearchedOptionExcept","useDefaultCursor","containerStyle","zeroState","isDraggable","onOptionsReorder","hideClearButton","showCheckboxForCustomElement","checkboxActiveColor","brandSelectedRow","sortOptionsWithSelectedOnTop","useCallback","opts","selected","unselected","option","localOptions","setLocalOptions","useState","localOptionsRef","useRef","hasReorderedRef","onOptionsReorderRef","useEffect","handleOptionsReorder","reorderedOptions","optionsToUse","dropdownOptions","search","searchedString","searchedOptions","searchError","retrySearch","onApplyHandler","selectAllHandler","onMultiSelectClear","onFreeFormSelect","onMultiSelectApply","latestDropdownOptionsRef","getSelectedOptions","getCurrentSelectionCount","useDropdown","widthState","setWidthState","descriptionInfo","setDescription","focusedIndex","setFocusedIndex","ref","childRefs","menuListRef","useOutside","optionsToSend","timer","getFlattenedOptions","flattened","nestedOption","singleOption","handleKeyDown","e","flattenedOptions","prev","newIndex","focusedElement","focusedOption","dropdownElement","heightToUse","menuListMaxHeight","showDescription","title","description","widthToUse","newWidth","exactMatchFound","optionsToShow","optionsToProcess","maxSelectionsReached","groupedOption","op","noResultForSearch","showLoadingState","showErrorState","showEmptyState","showTopLevelZeroState","emptyStateTitle","emptyStateSubTitle","errorStateTitle","errorStateSubTitle","defaultErrorActionButton","COLORS","RetryIcon","mergedErrorState","jsx","ErrorInfoIcon","zeroStateProps","jsxs","OpennedDropdownContainer","SearchBox","ZeroState","MenuListContainer","SelectAllMenu","SearchZeroState","val","FreeFormMenu","MenuList","MultiSelectDropdownBottomBar","Description"],"mappings":"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"}

package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js CHANGED Viewed

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),t=require("../../../../constants/Theme.js"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=r(o),n=i.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),o=require("../../../../constants/Theme.js"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=i(r),n=t.default.div`
 	border-radius: ${e=>e.version==="2.0"?8:4}px;
 	border: ${e=>e.version==="2.0"||e.version==="3.0"?0:1}px
-		solid ${t.COLORS.stroke.primary};
+		solid ${o.COLORS.stroke.primary};
 	box-shadow: ${e=>e.version==="3.0"?"0px 2px 8px 0px rgba(0, 0, 0, 0.12)":"none"};
 	max-height: 480px;
 	overflow: hidden;
@@ -9,19 +9,18 @@
 	flex-direction: row;
 	position: relative;
 	padding: ${e=>e.version==="2.0"?4:0}px;
-	background-color: ${t.COLORS.surface.standard};
-`;i.default.div`
+	background-color: ${o.COLORS.surface.standard};
+`;t.default.div`
 	padding: 14px 16px 14px 18px;
 	flex-direction: row;
 	align-items: center;
 	border-bottom-width: 1px;
 	border-bottom-style: solid;
-	border-bottom-color: ${t.COLORS.stroke.primary};
+	border-bottom-color: ${o.COLORS.stroke.primary};
 	width: 100%;
 	height: 100%;
-`;const d=i.default.div`
+`;const d=t.default.div`
 	max-height: ${e=>typeof e.maxHeight=="number"?`${e.maxHeight}px`:e.maxHeight};
-	${e=>e.minHeight!=null?`min-height: ${typeof e.minHeight=="number"?`${e.minHeight}px`:e.minHeight};`:""}
 	overflow-y: auto;
 	position: relative;
 	&::-webkit-scrollbar-thumb {

package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OpennedDropdown.styled.js","sources":["../../../../../../src/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const OpennedDropdownContainer = styled.div<{\n\tversion?: '1.0' \| '2.0' \| '3.0';\n}>`\n\tborder-radius: ${(props) => (props.version === '2.0' ? 8 : 4)}px;\n\tborder: ${(props) =>\n\t\t\tprops.version === '2.0' \|\| props.version === '3.0' ? 0 : 1}px\n\t\tsolid ${COLORS.stroke.primary};\n\tbox-shadow: ${(props) =>\n\t\tprops.version === '3.0' ? '0px 2px 8px 0px rgba(0, 0, 0, 0.12)' : 'none'};\n\tmax-height: 480px;\n\toverflow: hidden;\n\tdisplay: flex;\n\tflex-direction: row;\n\tposition: relative;\n\tpadding: ${(props) => (props.version === '2.0' ? 4 : 0)}px;\n\tbackground-color: ${COLORS.surface.standard};\n`;\n\nexport const ItemContainer = styled.div`\n\tpadding: 14px 16px 14px 18px;\n\tflex-direction: row;\n\talign-items: center;\n\tborder-bottom-width: 1px;\n\tborder-bottom-style: solid;\n\tborder-bottom-color: ${COLORS.stroke.primary};\n\twidth: 100%;\n\theight: 100%;\n`;\n\nexport const MenuListContainer = styled.div<{\n\tmaxHeight: number \| string;\n\tminHeight?: number \| string;\n}>`\n\tmax-height: ${(props) =>\n\t\ttypeof props.maxHeight === 'number'\n\t\t\t? `${props.maxHeight}px`\n\t\t\t: props.maxHeight};\n\t${(props) =>\n\t\tprops.minHeight != null\n\t\t\t? `min-height: ${\n\t\t\t\t\ttypeof props.minHeight === 'number'\n\t\t\t\t\t\t? `${props.minHeight}px`\n\t\t\t\t\t\t: props.minHeight\n\t\t\t };`\n\t\t\t: ''}\n\toverflow-y: auto;\n\tposition: relative;\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: #e0e0e0;\n\t\tborder-radius: 8px;\n\t}\n\t&::-webkit-scrollbar {\n\t\theight: 5px;\n\t\tdisplay: block;\n\t\twidth: 8px;\n\t}\n\t&::-webkit-scrollbar-thumb:horizontal {\n\t\twidth: 8px;\n\t}\n`;\n"],"names":["OpennedDropdownContainer","styled","props","COLORS","MenuListContainer"],"mappings":"gOAGaA,EAA2BC,EAAAA,QAAO;AAAA,kBAG5BC,GAAWA,EAAM,UAAY,MAAQ,EAAI,CAAE;AAAA,WAClDA,GACTA,EAAM,UAAY,OAASA,EAAM,UAAY,MAAQ,EAAI,CAAC;AAAA,UACnDC,EAAAA,OAAO,OAAO,OAAO;AAAA,eACfD,GACdA,EAAM,UAAY,MAAQ,sCAAwC,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAM7DA,GAAWA,EAAM,UAAY,MAAQ,EAAI,CAAE;AAAA,qBACnCC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,EAGfF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMZE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA,EAKtC,MAAMC,EAAoBH,EAAAA,QAAO;AAAA,eAIxBC,GACd,OAAOA,EAAM,WAAc,SACxB,GAAGA,EAAM,SAAS,KAClBA,EAAM,SAAS;AAAA~~,GAChBA,GACFA,EAAM,WAAa,KAChB,eACA,OAAOA,EAAM,WAAc,SACxB,GAAGA,EAAM,SAAS,KAClBA,EAAM,SACT,IACA,EAAE~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA~~;AAAA~~"}
1	+ {"version":3,"file":"OpennedDropdown.styled.js","sources":["../../../../../../src/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const OpennedDropdownContainer = styled.div<{\n\tversion?: '1.0' \| '2.0' \| '3.0';\n}>`\n\tborder-radius: ${(props) => (props.version === '2.0' ? 8 : 4)}px;\n\tborder: ${(props) =>\n\t\t\tprops.version === '2.0' \|\| props.version === '3.0' ? 0 : 1}px\n\t\tsolid ${COLORS.stroke.primary};\n\tbox-shadow: ${(props) =>\n\t\tprops.version === '3.0' ? '0px 2px 8px 0px rgba(0, 0, 0, 0.12)' : 'none'};\n\tmax-height: 480px;\n\toverflow: hidden;\n\tdisplay: flex;\n\tflex-direction: row;\n\tposition: relative;\n\tpadding: ${(props) => (props.version === '2.0' ? 4 : 0)}px;\n\tbackground-color: ${COLORS.surface.standard};\n`;\n\nexport const ItemContainer = styled.div`\n\tpadding: 14px 16px 14px 18px;\n\tflex-direction: row;\n\talign-items: center;\n\tborder-bottom-width: 1px;\n\tborder-bottom-style: solid;\n\tborder-bottom-color: ${COLORS.stroke.primary};\n\twidth: 100%;\n\theight: 100%;\n`;\n\nexport const MenuListContainer = styled.div<{\n\tmaxHeight: number \| string;\n\tminHeight: number \| string;\n}>`\n\tmax-height: ${(props) =>\n\t\ttypeof props.maxHeight === 'number'\n\t\t\t? `${props.maxHeight}px`\n\t\t\t: props.maxHeight};\n\toverflow-y: auto;\n\tposition: relative;\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: #e0e0e0;\n\t\tborder-radius: 8px;\n\t}\n\t&::-webkit-scrollbar {\n\t\theight: 5px;\n\t\tdisplay: block;\n\t\twidth: 8px;\n\t}\n\t&::-webkit-scrollbar-thumb:horizontal {\n\t\twidth: 8px;\n\t}\n`;\n"],"names":["OpennedDropdownContainer","styled","props","COLORS","MenuListContainer"],"mappings":"gOAGaA,EAA2BC,EAAAA,QAAO;AAAA,kBAG5BC,GAAWA,EAAM,UAAY,MAAQ,EAAI,CAAE;AAAA,WAClDA,GACTA,EAAM,UAAY,OAASA,EAAM,UAAY,MAAQ,EAAI,CAAC;AAAA,UACnDC,EAAAA,OAAO,OAAO,OAAO;AAAA,eACfD,GACdA,EAAM,UAAY,MAAQ,sCAAwC,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAM7DA,GAAWA,EAAM,UAAY,MAAQ,EAAI,CAAE;AAAA,qBACnCC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,EAGfF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMZE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA,EAKtC,MAAMC,EAAoBH,EAAAA,QAAO;AAAA,eAIxBC,GACd,OAAOA,EAAM,WAAc,SACxB,GAAGA,EAAM,SAAS,KAClBA,EAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js CHANGED Viewed

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

package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchBox.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { IconButton } from '@src/components/icon-button';\nimport { Input } from '@src/components/input';\nimport { InputStyleContext } from '@src/components/input/context/InputStyleProvider';\nimport { COLORS } from '@src/constants/Theme';\nimport CrossIcon from '../../../../../assets/icons/cross.svg';\nimport SearchIcon from '../../../../../assets/icons/search.svg';\n\nexport const SearchBox: React.FC<{\n\tonSearch: (searchString: string) => void;\n\tversion?: '1.0' \| '2.0' \| '3.0';\n~~\tplaceholder?: string;\n~~}> = ({ onSearch, version, ~~placeholder = 'Search'~~ }) => {\n\tconst [val, setVal] = useState('');\n\tconst [reset, setReset] = useState(false);\n\n\treturn (\n\t\t<InputStyleContext.Provider\n\t\t\tvalue={{\n\t\t\t\tInputWrapper: {\n\t\t\t\t\tborderRadius: 0,\n\t\t\t\t\tborder: 0,\n\t\t\t\t\tborderBottom: `${\n\t\t\t\t\t\tversion === '2.0' \|\| version === '3.0' ? 0.5 : 1\n\t\t\t\t\t}px solid ${COLORS.stroke.primary}`,\n\t\t\t\t\tpadding: `${\n\t\t\t\t\t\tversion === '2.0' \|\| version === '3.0' ? '6px 8px' : '14px 16px'\n\t\t\t\t\t}`,\n\t\t\t\t},\n\t\t\t\tIconHolder: {\n\t\t\t\t\tmarginLeft: 0,\n\t\t\t\t},\n\t\t\t\tinput: {\n\t\t\t\t\tmarginLeft: 4,\n\t\t\t\t\tminHeight: '100%',\n\t\t\t\t},\n\t\t\t}}\n\t\t>\n\t\t\t<Input\n\t\t\t\tnoKeyDownChange\n\t\t\t\tskipFocus={true}\n\t\t\t\tplaceholder~~={placeholder}~~\n\t\t\t\tvariant={version === '2.0' \|\| version === '3.0' ? 'small' : 'default'}\n\t\t\t\tleftIcon={{\n\t\t\t\t\ticon: () => (\n\t\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\t\twidth={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\theight={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t/>\n\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t\trightIcon={{\n\t\t\t\t\ticon: () =>\n\t\t\t\t\t\t!val ? (\n\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tsetReset(true);\n\t\t\t\t\t\t\t\t\tonSearch('');\n\t\t\t\t\t\t\t\t\tsetVal('');\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tIcon={CrossIcon}\n\t\t\t\t\t\t\t\twidth={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\t\theight={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\t\~~ticonPadding={0}\n\t\t\t\t\t\t\t\~~ticonColor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t\treset={reset}\n\t\t\t\tonChangeText={(text) => {\n\t\t\t\t\tsetReset(false);\n\t\t\t\t\tsetVal(text);\n\t\t\t\t\tonSearch(text);\n\t\t\t\t}}\n\t\t\t/>\n\t\t</InputStyleContext.Provider>\n\t);\n};\n"],"names":["SearchBox","onSearch","version","~~placeholder","~~val","setVal","useState","reset","setReset","jsx","InputStyleContext","COLORS","Input","SearchIcon","IconButton","CrossIcon","text"],"mappings":"4bAQaA,~~EAIR~~,CAAC,CAAE,SAAAC,EAAU,QAAAC,~~EAAS~~,~~YAAAC~~,~~EAAc,YAAe,CACvD,~~KAAM,CAACC,EAAKC,CAAM,EAAIC,EAAAA,SAAS,EAAE,EAC3B,CAACC,EAAOC,CAAQ,EAAIF,EAAAA,SAAS,EAAK,EAExC,OACCG,EAAAA,IAACC,EAAAA,kBAAkB,SAAlB,CACA,MAAO,CACN,aAAc,CACb,aAAc,EACd,OAAQ,EACR,aAAc,~~GACbR~~,IAAY,OAASA,IAAY,MAAQ,GAAM,CAChD,~~YAAYS~~,EAAAA,OAAO,OAAO,OAAO,GACjC,QAAS,~~GACRT~~,IAAY,OAASA,IAAY,MAAQ,UAAY,WACtD,EAAA,EAED,WAAY,CACX,WAAY,CAAA,EAEb,MAAO,CACN,WAAY,EACZ,UAAW,MAAA,CACZ,EAGD,~~SAAAO~~,EAAAA,IAACG,EAAAA,MAAA,CACA,gBAAe,GACf,UAAW,GACX,~~YAAAT~~,~~EACA~~,~~QAASD~~,IAAY,OAASA,IAAY,MAAQ,QAAU,UAC5D,SAAU,CACT,KAAM,~~IACLO~~,EAAAA,IAACI,EAAAA,QAAA,CACA,~~MAAOX~~,IAAY,OAASA,IAAY,MAAQ,GAAK,GACrD,OAAQA,IAAY,OAASA,IAAY,MAAQ,GAAK,GACtD,~~MAAOS~~,EAAAA,OAAO,QAAQ,WAAA,CAAA,CACvB,EAGF,UAAW,CACV,KAAM,IACJP,EAGAK,EAAAA,IAACK,EAAAA,WAAA,CACA,QAAS,IAAM,CACdN,EAAS,EAAI,~~EACbP~~,EAAS,EAAE,~~EACXI~~,EAAO,EAAE,CACV,EACA,KAAMU,EAAAA,QACN,~~MAAOb~~,IAAY,OAASA,IAAY,MAAQ,GAAK,GACrD,OAAQA,IAAY,OAASA,IAAY,MAAQ,GAAK,GACtD,~~YAAa~~,~~EACb,UAAWS,~~EAAAA,OAAO,QAAQ,WAAA,CAAA,~~qBAZzB~~,~~CAaF~~,EAGH,MAAAJ,EACA,aAAeS,GAAS,CACvBR,EAAS,EAAK,EACdH,EAAOW,CAAI,~~EACXf~~,~~EAASe~~,CAAI,CACd,CAAA,CAAA,CACD,CAAA,CAGH"}
1	+ {"version":3,"file":"SearchBox.js","sources":["../../../../../../../src/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { IconButton } from '@src/components/icon-button';\nimport { Input } from '@src/components/input';\nimport { InputStyleContext } from '@src/components/input/context/InputStyleProvider';\nimport { COLORS } from '@src/constants/Theme';\nimport CrossIcon from '../../../../../assets/icons/cross.svg';\nimport SearchIcon from '../../../../../assets/icons/search.svg';\n\nexport const SearchBox: React.FC<{\n\tonSearch: (searchString: string) => void;\n\tversion?: '1.0' \| '2.0' \| '3.0';\n}> = ({ onSearch, version }) => {\n\tconst [val, setVal] = useState('');\n\tconst [reset, setReset] = useState(false);\n\n\treturn (\n\t\t<InputStyleContext.Provider\n\t\t\tvalue={{\n\t\t\t\tInputWrapper: {\n\t\t\t\t\tborderRadius: 0,\n\t\t\t\t\tborder: 0,\n\t\t\t\t\tborderBottom: `${\n\t\t\t\t\t\tversion === '2.0' \|\| version === '3.0' ? 0.5 : 1\n\t\t\t\t\t}px solid ${COLORS.stroke.primary}`,\n\t\t\t\t\tpadding: `${\n\t\t\t\t\t\tversion === '2.0' \|\| version === '3.0' ? '6px 8px' : '14px 16px'\n\t\t\t\t\t}`,\n\t\t\t\t},\n\t\t\t\tIconHolder: {\n\t\t\t\t\tmarginLeft: 0,\n\t\t\t\t},\n\t\t\t\tinput: {\n\t\t\t\t\tmarginLeft: 4,\n\t\t\t\t\tminHeight: '100%',\n\t\t\t\t},\n\t\t\t}}\n\t\t>\n\t\t\t<Input\n\t\t\t\tnoKeyDownChange\n\t\t\t\tskipFocus={true}\n\t\t\t\tplaceholder=\"Search\"\n\t\t\t\tvariant={version === '2.0' \|\| version === '3.0' ? 'small' : 'default'}\n\t\t\t\tleftIcon={{\n\t\t\t\t\ticon: () => (\n\t\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\t\twidth={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\theight={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t/>\n\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t\trightIcon={{\n\t\t\t\t\ticon: () =>\n\t\t\t\t\t\t!val ? (\n\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tsetReset(true);\n\t\t\t\t\t\t\t\t\tonSearch('');\n\t\t\t\t\t\t\t\t\tsetVal('');\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tIcon={CrossIcon}\n\t\t\t\t\t\t\t\twidth={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\t\theight={version === '2.0' \|\| version === '3.0' ? 18 : 24}\n\t\t\t\t\t\t\t\ticonColor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t\treset={reset}\n\t\t\t\tonChangeText={(text) => {\n\t\t\t\t\tsetReset(false);\n\t\t\t\t\tsetVal(text);\n\t\t\t\t\tonSearch(text);\n\t\t\t\t}}\n\t\t\t/>\n\t\t</InputStyleContext.Provider>\n\t);\n};\n"],"names":["SearchBox","onSearch","version","val","setVal","useState","reset","setReset","jsx","InputStyleContext","COLORS","Input","SearchIcon","IconButton","CrossIcon","text"],"mappings":"4bAQaA,EAGR,CAAC,CAAE,SAAAC,EAAU,QAAAC,KAAc,CAC/B,KAAM,CAACC,EAAKC,CAAM,EAAIC,EAAAA,SAAS,EAAE,EAC3B,CAACC,EAAOC,CAAQ,EAAIF,EAAAA,SAAS,EAAK,EAExC,OACCG,EAAAA,IAACC,EAAAA,kBAAkB,SAAlB,CACA,MAAO,CACN,aAAc,CACb,aAAc,EACd,OAAQ,EACR,aAAc,GACbP,IAAY,OAASA,IAAY,MAAQ,GAAM,CAChD,YAAYQ,EAAAA,OAAO,OAAO,OAAO,GACjC,QAAS,GACRR,IAAY,OAASA,IAAY,MAAQ,UAAY,WACtD,EAAA,EAED,WAAY,CACX,WAAY,CAAA,EAEb,MAAO,CACN,WAAY,EACZ,UAAW,MAAA,CACZ,EAGD,SAAAM,EAAAA,IAACG,EAAAA,MAAA,CACA,gBAAe,GACf,UAAW,GACX,YAAY,SACZ,QAAST,IAAY,OAASA,IAAY,MAAQ,QAAU,UAC5D,SAAU,CACT,KAAM,IACLM,EAAAA,IAACI,EAAAA,QAAA,CACA,MAAOV,IAAY,OAASA,IAAY,MAAQ,GAAK,GACrD,OAAQA,IAAY,OAASA,IAAY,MAAQ,GAAK,GACtD,MAAOQ,EAAAA,OAAO,QAAQ,WAAA,CAAA,CACvB,EAGF,UAAW,CACV,KAAM,IACJP,EAGAK,EAAAA,IAACK,EAAAA,WAAA,CACA,QAAS,IAAM,CACdN,EAAS,EAAI,EACbN,EAAS,EAAE,EACXG,EAAO,EAAE,CACV,EACA,KAAMU,EAAAA,QACN,MAAOZ,IAAY,OAASA,IAAY,MAAQ,GAAK,GACrD,OAAQA,IAAY,OAASA,IAAY,MAAQ,GAAK,GACtD,UAAWQ,EAAAA,OAAO,QAAQ,WAAA,CAAA,qBAXzB,CAYF,EAGH,MAAAJ,EACA,aAAeS,GAAS,CACvBR,EAAS,EAAK,EACdH,EAAOW,CAAI,EACXd,EAASc,CAAI,CACd,CAAA,CAAA,CACD,CAAA,CAGH"}

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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("react/jsx-runtime"),s=require("react"),ne=require("react-joyride"),te=require("./MajorUpdatePopup.js"),oe=require("./MinorUpdatePopup.js"),Be=require("./VideoModal.js"),je=require("./hooks/useFeatureAnnouncements.js"),Ee=require("./constants/selectors.js"),Ue=F=>F&&typeof F=="object"&&"default"in F?F:{default:F},ce=Ue(ne),Ne=({children:F,fetchVisibleFeatures:pe,getStoreFeatureProgress:fe,fetchFeatureById:be,markFeatureAsViewedForStore:ge,isFeatureApplicableToCurrentPage:he,module:me,router:P,storeId:U,onAnnouncementShown:ae,onAnnouncementInteracted:J})=>{const{majorUpdateFeatures:i,minorUpdateFeatures:I,isLoading:w,markFeatureAsViewed:p}=je.useFeatureAnnouncements({fetchVisibleFeatures:pe,getStoreFeatureProgress:fe,fetchFeatureById:be,markFeatureAsViewedForStore:ge,isFeatureApplicableToCurrentPage:he,module:me,router:P}),[b,v]=s.useState(null),[d,k]=s.useState(null),[q,B]=s.useState(!1),[se,C]=s.useState([]),[ye,W]=s.useState(!1),[re,j]=s.useState([]),[ie,T]=s.useState(!1),[m,y]=s.useState(!1),[u,V]=s.useState([]),[x,M]=s.useState(!1),[S,E]=s.useState(!1),[xe,A]=s.useState(!1),[Se,$]=s.useState(""),[L,z]=s.useState(!1),[ke,_]=s.useState(!1),[le,R]=s.useState(!1),[Ce,we]=s.useState(0),[Te,Me]=s.useState(0),[N,K]=s.useState(new Set);s.useEffect(()=>{const e="minor-spotlight-cutout-style";let o=document.getElementById(e);return o||(o=document.createElement("style"),o.id=e,document.head.appendChild(o)),o.textContent=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const S=require("react/jsx-runtime"),i=require("react"),se=require("react-joyride"),ae=require("./MajorUpdatePopup.js"),ie=require("./MinorUpdatePopup.js"),Ie=require("./VideoModal.js"),Ee=require("./hooks/useFeatureAnnouncements.js"),Ne=require("./constants/selectors.js"),Pe=N=>N&&typeof N=="object"&&"default"in N?N:{default:N},fe=Pe(se),Ve=({children:N,fetchVisibleFeatures:me,getStoreFeatureProgress:be,fetchFeatureById:ge,markFeatureAsViewedForStore:ye,isFeatureApplicableToCurrentPage:he,module:Se,router:W,storeId:m,onAnnouncementShown:R,onAnnouncementInteracted:g})=>{const{majorUpdateFeatures:r,minorUpdateFeatures:P,isLoading:B,markFeatureAsViewed:c}=Ee.useFeatureAnnouncements({fetchVisibleFeatures:me,getStoreFeatureProgress:be,fetchFeatureById:ge,markFeatureAsViewedForStore:ye,isFeatureApplicableToCurrentPage:he,module:Se,router:W}),[y,F]=i.useState(null),[p,x]=i.useState(null),[O,v]=i.useState(!1),[re,k]=i.useState([]),[xe,V]=i.useState(!1),[le,j]=i.useState([]),[de,C]=i.useState(!1),[T,h]=i.useState(!1),[l,A]=i.useState([]),[w,U]=i.useState(!1),[M,I]=i.useState(!1),[ke,J]=i.useState(!1),[Ce,L]=i.useState(""),[$,_]=i.useState(!1),[Te,z]=i.useState(!1),[ue,K]=i.useState(!1),[we,Me]=i.useState(0),[Ue,Be]=i.useState(0),[E,Q]=i.useState(new Set);i.useEffect(()=>{const e="minor-spotlight-cutout-style";let o=document.getElementById(e);return o||(o=document.createElement("style"),o.id=e,document.head.appendChild(o)),o.textContent=`
 			.react-joyride__spotlight {
 				transition: box-shadow 0.3s ease-in-out !important;
 				will-change: box-shadow, transform;
@@ -12,5 +12,5 @@
 				right: 12px !important;
 				left: auto !important;
 			}
-		`,()=>{const n=document.getElementById(e);n&&n.remove()}},[]),s.useEffect(()=>{we(e=>e+1),Me(e=>e+1),_(!1),R(!1),K(new Set)},[P?.pathname]),s.useEffect(()=>{if(i.length>0&&!b&&!w&&!ie&&!L){E(!1),M(!1),B(!1),C([]),k(null),V([]);let e=0;const o=10,n=()=>{e++,document.querySelector('[data-testid="whats-new-button"]')?de(i[0]):e<o?setTimeout(n,1e3):E(!0)};n()}else i.length===0&&!w&&E(!0)},[i,b,w,ie,L]),s.useEffect(()=>{const e=P?.query?.featureId;if(!e||w||I.length===0)return;const o=I.find(r=>r.id===e);if(!o||!o.featureTag)return;M(!0),y(!0);let n=0;const t=25,a=setInterval(()=>{n++;const r=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(r)){const c=[o];V(c),O(o,c),clearInterval(a)}else n>=t&&(y(!1),clearInterval(a))},200);return()=>{clearInterval(a)}},[I,P?.query?.featureId,w]),s.useEffect(()=>{if(I.length>0&&!w&&!q&&!m&&!d&&!x&&S&&!L){let e=null,o=null,n=null,t=!1;const a=()=>{if(t||m||d||x||!S)return;const r=I.filter(l=>{if(!l.featureTag||l.featureTag.trim()===""||N.has(l.id))return!1;const c=l.featureTag.startsWith("#")||l.featureTag.startsWith(".")||l.featureTag.startsWith("[")?l.featureTag:`#${l.featureTag}`;return document.querySelector(c)!==null});r.length>0&&(V(r),O(r[0],r),e&&(e.disconnect(),e=null),o&&(window.removeEventListener("scroll",o),o=null),n&&(clearTimeout(n),n=null))};return e=new MutationObserver(r=>{let l=!1;for(const c of r){if(c.type==="childList"&&c.addedNodes.length>0)for(let f=0;f<c.addedNodes.length;f++){const g=c.addedNodes[f];if(g.nodeType===Node.ELEMENT_NODE){const ue=g;if(ue.id||ue.querySelector("[id]")){l=!0;break}}}if(l)break}!q&&!t&&!m&&!d&&!x&&S&&l&&(n&&clearTimeout(n),n=setTimeout(()=>{!t&&!m&&!d&&!x&&S&&a()},200))}),o=()=>{!q&&!t&&!m&&!d&&!x&&S&&(n&&clearTimeout(n),requestAnimationFrame(()=>{n=setTimeout(()=>{!t&&!m&&!d&&!x&&S&&a()},300)}))},e&&e.observe(document.body,{childList:!0,subtree:!0}),o&&window.addEventListener("scroll",o,{passive:!0}),a(),setTimeout(()=>{!t&&!m&&!d&&!x&&S&&a()},100),setTimeout(()=>{!t&&!m&&!d&&!x&&S&&a()},1e3),setTimeout(()=>{!t&&!m&&!d&&!x&&S&&a()},500),()=>{t=!0,e&&e.disconnect(),o&&window.removeEventListener("scroll",o),n&&clearTimeout(n)}}else(I.length===0||w)&&(P?.query?.featureId&&d||(B(!1),C([]),k(null),V([]),M(!1)))},[I,w,q,m,d,x,S,p,L]);const de=e=>{v(e);const o=i.findIndex(a=>a.id===e.id),n=i.length,t=[{target:Ee.SELECTORS.WHATS_NEW_BUTTON,content:h.jsx(te.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>Q(e),onExplore:a=>D(e,a),onPrevious:()=>Z(e),onNext:()=>H(e),setIsClosing:_}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];j(t),W(!0),ae&&U&&ae({storeId:U,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo})},Q=s.useCallback(async e=>{const o=e||b;o&&(T(!0),await Promise.all(i.map(n=>p(n.id))),W(!1),v(null),j([]),E(!0),J&&U&&J({storeId:U,announcementId:o.id,announcementTitle:o.title,imageUrl:o.displayImage||o.image,videoUrl:o.productVideo,buttonClicked:"Skip",buttonName:"Skip",buttonUrl:void 0}),setTimeout(()=>{T(!1)},500))},[b,i,p]),D=s.useCallback(async(e,o)=>{T(!0),await p(e.id);const n=o??e.primaryButton?.action;if(n==="Play Video"&&e.productVideo&&($(e.productVideo),A(!0),z(!0)),n==="Open link"){const r=e.primaryButton?.redirectionUrl||e.redirectUrl;r&&!r.startsWith("http")&&(window.location.href=r)}W(!1),v(null),j([]),i.findIndex(r=>r.id===e.id)===i.length-1&&E(!0),J&&U&&J({storeId:U,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo,buttonClicked:"Primary",buttonName:e.buttonText||"Explore",buttonUrl:e.redirectUrl||e.productVideo}),setTimeout(()=>{T(!1)},500)},[i,p]),Z=s.useCallback(e=>{const o=e||b;if(!o)return;const n=i.findIndex(t=>t.id===o.id);if(n>0){const t=i[n-1];v(t);const a=n-1,r=i.length,l=[{target:'[data-testid="whats-new-button"]',content:h.jsx(te.default,{feature:t,currentIndex:a,totalFeatures:r,onSkip:()=>Q(t),onExplore:c=>D(t,c),onPrevious:()=>Z(t),onNext:()=>H(t),setIsClosing:_}),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"}}}];j(l)}},[b,i]),H=s.useCallback(e=>{const o=e||b;if(!o)return;const n=i.findIndex(t=>t.id===o.id);if(n<i.length-1){const t=i[n+1];v(t);const a=n+1,r=i.length,l=[{target:'[data-testid="whats-new-button"]',content:h.jsx(te.default,{feature:t,currentIndex:a,totalFeatures:r,onSkip:()=>Q(t),onExplore:c=>D(t,c),onPrevious:()=>Z(t),onNext:()=>H(t),setIsClosing:_}),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"}}}];j(l)}else T(!0),p(o.id),W(!1),v(null),j([]),E(!0),setTimeout(()=>{T(!1)},500)},[b,i,p]),Fe=()=>{i.length>0&&!b&&document.querySelector('[data-testid="whats-new-button"]')&&de(i[0])};s.useEffect(()=>(window.showMajorUpdatePopup=Fe,()=>{delete window.showMajorUpdatePopup}),[i,b]);const Ie=s.useCallback(e=>{const{action:o}=e;o===ne.ACTIONS.CLOSE&&(b&&(T(!0),i.forEach(n=>{p(n.id)}),E(!0),setTimeout(()=>{T(!1)},500)),W(!1),v(null),j([]))},[b,i,p]),ve=s.useCallback(e=>{const{action:o}=e;o===ne.ACTIONS.CLOSE&&(d&&(y(!0),p(d.id),u.findIndex(a=>a.id===d.id)===u.length-1&&M(!0),setTimeout(()=>{y(!1)},500)),B(!1),k(null),C([]))},[d,u,p]),O=async(e,o)=>{k(e);const n=o||u,t=n.findIndex(f=>f.id===e.id),a=n.length,r=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,l=document.querySelector(r);if(l)try{const{scrollToElementSmooth:f}=await Promise.resolve().then(()=>require("./utils/elementHelpers.js"));await f(l,120)}catch{}const c=[{target:r,content:h.jsx(oe.default,{feature:e,currentIndex:t,totalFeatures:a,onSkip:()=>X(e),onExplore:f=>G(e,f),onPrevious:()=>Y(e),onNext:()=>ee(e),setIsClosing:R}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];C(c),B(!0)},X=s.useCallback(async e=>{const o=e||d;if(o){y(!0),await p(o.id),K(t=>new Set(t).add(o.id)),B(!1),k(null),C([]);const n=u.find(t=>t.id!==o.id&&!N.has(t.id));setTimeout(()=>{y(!1),n?O(n,u):M(!0)},500)}},[d,u,p,N]),G=s.useCallback(async(e,o)=>{y(!0),await p(e.id),K(a=>new Set(a).add(e.id));const n=o??e.primaryButton?.action;if(n==="Play Video"&&e.productVideo&&($(e.productVideo),A(!0),z(!0)),n==="Open link"){const a=e.primaryButton?.redirectionUrl||e.redirectUrl;a&&!a.startsWith("http")&&(window.location.href=a)}B(!1),k(null),C([]);const t=u.find(a=>a.id!==e.id&&!N.has(a.id));setTimeout(()=>{y(!1),t&&n!=="Play Video"?O(t,u):t||M(!0)},500)},[u,p,N]),Y=s.useCallback(async e=>{const o=e||d;if(!o)return;const n=u.findIndex(t=>t.id===o.id);if(n>0){const t=u[n-1];k(t);const a=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=document.querySelector(a);if(r)try{const{scrollToElementSmooth:g}=await Promise.resolve().then(()=>require("./utils/elementHelpers.js"));await g(r,120)}catch{}const l=n-1,c=u.length,f=[{target:a,content:h.jsx(oe.default,{feature:t,currentIndex:l,totalFeatures:c,onSkip:()=>X(t),onExplore:g=>G(t,g),onPrevious:()=>Y(t),onNext:()=>ee(t),setIsClosing:R}),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"}}}];C(f)}},[d,u]),ee=s.useCallback(async e=>{const o=e||d;if(!o)return;const n=u.findIndex(t=>t.id===o.id);if(n<u.length-1){const t=u[n+1];k(t);const a=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,r=document.querySelector(a);if(r)try{const{scrollToElementSmooth:g}=await Promise.resolve().then(()=>require("./utils/elementHelpers.js"));await g(r,120)}catch{}const l=n+1,c=u.length,f=[{target:a,content:h.jsx(oe.default,{feature:t,currentIndex:l,totalFeatures:c,onSkip:()=>X(t),onExplore:g=>G(t,g),onPrevious:()=>Y(t),onNext:()=>ee(t),setIsClosing:R}),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"}}}];C(f)}else y(!0),M(!0),p(o.id),B(!1),k(null),C([]),setTimeout(()=>{y(!1)},500)},[d,u,p]);return h.jsxs(h.Fragment,{children:[F,re.length>0&&h.jsx(ce.default,{steps:re,run:ye,continuous:!1,showProgress:!1,showSkipButton:!1,callback:Ie,disableOverlayClose:!1,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ke?"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-${Ce}`),se.length>0&&h.jsx(ce.default,{steps:se,run:q,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ve,disableOverlayClose:!1,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:le?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:le?"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-${Te}`),h.jsx(Be.VideoModal,{isOpen:xe,videoUrl:Se,onClose:()=>{A(!1),$(""),z(!1);const e=u.find(o=>!N.has(o.id));e?setTimeout(()=>{O(e,u)},300):M(!0)}})]})};exports.default=Ne;
+		`,()=>{const n=document.getElementById(e);n&&n.remove()}},[]),i.useEffect(()=>{Me(e=>e+1),Be(e=>e+1),z(!1),K(!1),Q(new Set)},[W?.pathname]),i.useEffect(()=>{if(r.length>0&&!y&&!B&&!de&&!$){I(!1),U(!1),v(!1),k([]),x(null),A([]);let e=0;const o=10,n=()=>{e++,document.querySelector('[data-testid="whats-new-button"]')?ce(r[0]):e<o?setTimeout(n,1e3):I(!0)};n()}else r.length===0&&!B&&I(!0)},[r,y,B,de,$]),i.useEffect(()=>{const e=W?.query?.featureId;if(!e||B||P.length===0)return;const o=P.find(s=>s.id===e);if(!o||!o.featureTag)return;U(!0),h(!0);let n=0;const t=25,a=setInterval(()=>{n++;const s=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(s)){const u=[o];A(u),q(o,u),clearInterval(a)}else n>=t&&(h(!1),clearInterval(a))},200);return()=>{clearInterval(a)}},[P,W?.query?.featureId,B]),i.useEffect(()=>{if(P.length>0&&!B&&!O&&!T&&!p&&!w&&M&&!$){let e=null,o=null,n=null,t=!1;const a=()=>{if(t||T||p||w||!M)return;const s=P.filter(d=>{if(!d.featureTag||d.featureTag.trim()===""||E.has(d.id))return!1;const u=d.featureTag.startsWith("#")||d.featureTag.startsWith(".")||d.featureTag.startsWith("[")?d.featureTag:`#${d.featureTag}`;return document.querySelector(u)!==null});s.length>0&&(A(s),q(s[0],s),e&&(e.disconnect(),e=null),o&&(window.removeEventListener("scroll",o),o=null),n&&(clearTimeout(n),n=null))};return e=new MutationObserver(s=>{let d=!1;for(const u of s){if(u.type==="childList"&&u.addedNodes.length>0)for(let f=0;f<u.addedNodes.length;f++){const b=u.addedNodes[f];if(b.nodeType===Node.ELEMENT_NODE){const pe=b;if(pe.id||pe.querySelector("[id]")){d=!0;break}}}if(d)break}!O&&!t&&!T&&!p&&!w&&M&&d&&(n&&clearTimeout(n),n=setTimeout(()=>{!t&&!T&&!p&&!w&&M&&a()},200))}),o=()=>{!O&&!t&&!T&&!p&&!w&&M&&(n&&clearTimeout(n),requestAnimationFrame(()=>{n=setTimeout(()=>{!t&&!T&&!p&&!w&&M&&a()},300)}))},e&&e.observe(document.body,{childList:!0,subtree:!0}),o&&window.addEventListener("scroll",o,{passive:!0}),a(),setTimeout(()=>{!t&&!T&&!p&&!w&&M&&a()},100),setTimeout(()=>{!t&&!T&&!p&&!w&&M&&a()},1e3),setTimeout(()=>{!t&&!T&&!p&&!w&&M&&a()},500),()=>{t=!0,e&&e.disconnect(),o&&window.removeEventListener("scroll",o),n&&clearTimeout(n)}}else(P.length===0||B)&&(W?.query?.featureId&&p||(v(!1),k([]),x(null),A([]),U(!1)))},[P,B,O,T,p,w,M,c,$]);const ce=e=>{F(e);const o=r.findIndex(a=>a.id===e.id),n=r.length,t=[{target:Ne.SELECTORS.WHATS_NEW_BUTTON,content:S.jsx(ae.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>D(e),onExplore:a=>Z(e,a),onSecondaryAction:a=>H(e,a),onPrevious:()=>X(e),onNext:()=>G(e),setIsClosing:z}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];j(t),V(!0),R&&m&&R({storeId:m,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo})},D=i.useCallback(async e=>{const o=e||y;o&&(C(!0),await Promise.all(r.map(n=>c(n.id))),V(!1),F(null),j([]),I(!0),g&&m&&g({storeId:m,announcementId:o.id,announcementTitle:o.title,imageUrl:o.displayImage||o.image,videoUrl:o.productVideo,buttonClicked:"Skip",buttonName:"Skip",buttonUrl:void 0}),setTimeout(()=>{C(!1)},500))},[y,r,c]),Z=i.useCallback(async(e,o)=>{C(!0),await c(e.id);const n=o??e.primaryButton?.action;if(n==="Play Video"&&e.productVideo&&(L(e.productVideo),J(!0),_(!0)),n==="Open link"){const s=e.primaryButton?.redirectionUrl||e.redirectUrl;s&&!s.startsWith("http")&&(window.location.href=s)}V(!1),F(null),j([]),r.findIndex(s=>s.id===e.id)===r.length-1&&I(!0),g&&m&&g({storeId:m,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo,buttonClicked:"Primary",buttonName:e.primaryButton?.text||e.buttonText||"Explore",buttonUrl:e.primaryButton?.redirectionUrl||e.redirectUrl||e.productVideo}),setTimeout(()=>{C(!1)},500)},[r,c]),H=i.useCallback(async(e,o)=>{C(!0),await c(e.id),(o??e.secondaryButton?.action)==="Play Video"&&e.productVideo&&(L(e.productVideo),J(!0),_(!0)),V(!1),F(null),j([]),r.findIndex(s=>s.id===e.id)===r.length-1&&I(!0),g&&m&&g({storeId:m,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo,buttonClicked:"Secondary",buttonName:e.secondaryButton?.text||"Secondary",buttonUrl:e.secondaryButton?.redirectionUrl}),setTimeout(()=>{C(!1)},500)},[r,c]),X=i.useCallback(e=>{const o=e||y;if(!o)return;const n=r.findIndex(t=>t.id===o.id);if(n>0){const t=r[n-1];F(t);const a=n-1,s=r.length,d=[{target:'[data-testid="whats-new-button"]',content:S.jsx(ae.default,{feature:t,currentIndex:a,totalFeatures:s,onSkip:()=>D(t),onExplore:u=>Z(t,u),onSecondaryAction:u=>H(t,u),onPrevious:()=>X(t),onNext:()=>G(t),setIsClosing:z}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMajor:!0},styles:{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"}}}];j(d)}},[y,r]),G=i.useCallback(e=>{const o=e||y;if(!o)return;const n=r.findIndex(t=>t.id===o.id);if(n<r.length-1){const t=r[n+1];F(t);const a=n+1,s=r.length,d=[{target:'[data-testid="whats-new-button"]',content:S.jsx(ae.default,{feature:t,currentIndex:a,totalFeatures:s,onSkip:()=>D(t),onExplore:u=>Z(t,u),onSecondaryAction:u=>H(t,u),onPrevious:()=>X(t),onNext:()=>G(t),setIsClosing:z}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:t,isMajor:!0},styles:{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"}}}];j(d)}else C(!0),c(o.id),V(!1),F(null),j([]),I(!0),setTimeout(()=>{C(!1)},500)},[y,r,c]),Fe=()=>{r.length>0&&!y&&document.querySelector('[data-testid="whats-new-button"]')&&ce(r[0])};i.useEffect(()=>(window.showMajorUpdatePopup=Fe,()=>{delete window.showMajorUpdatePopup}),[r,y]);const ve=i.useCallback(e=>{const{action:o}=e;o===se.ACTIONS.CLOSE&&(y&&(C(!0),r.forEach(n=>{c(n.id)}),I(!0),setTimeout(()=>{C(!1)},500)),V(!1),F(null),j([]))},[y,r,c]),je=i.useCallback(e=>{const{action:o}=e;o===se.ACTIONS.CLOSE&&(p&&(h(!0),c(p.id),l.findIndex(a=>a.id===p.id)===l.length-1&&U(!0),setTimeout(()=>{h(!1)},500)),v(!1),x(null),k([]))},[p,l,c]),q=async(e,o)=>{x(e);const n=o||l,t=n.findIndex(f=>f.id===e.id),a=n.length,s=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,d=document.querySelector(s);if(d)try{const{scrollToElementSmooth:f}=await Promise.resolve().then(()=>require("./utils/elementHelpers.js"));await f(d,120)}catch{}const u=[{target:s,content:S.jsx(ie.default,{feature:e,currentIndex:t,totalFeatures:a,onSkip:()=>Y(e),onExplore:f=>ee(e,f),onSecondaryAction:f=>te(e,f),onPrevious:()=>oe(e),onNext:()=>ne(e),setIsClosing:K}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];k(u),v(!0),R&&m&&R({storeId:m,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo})},Y=i.useCallback(async e=>{const o=e||p;if(o){h(!0),await c(o.id),Q(t=>new Set(t).add(o.id)),v(!1),x(null),k([]);const n=l.find(t=>t.id!==o.id&&!E.has(t.id));g&&m&&g({storeId:m,announcementId:o.id,announcementTitle:o.title,imageUrl:o.displayImage||o.image,videoUrl:o.productVideo,buttonClicked:"Skip",buttonName:"Skip",buttonUrl:void 0}),setTimeout(()=>{h(!1),n?q(n,l):U(!0)},500)}},[p,l,c,E]),ee=i.useCallback(async(e,o)=>{h(!0),await c(e.id),Q(a=>new Set(a).add(e.id));const n=o??e.primaryButton?.action;if(n==="Play Video"&&e.productVideo&&(L(e.productVideo),J(!0),_(!0)),n==="Open link"){const a=e.primaryButton?.redirectionUrl||e.redirectUrl;a&&!a.startsWith("http")&&(window.location.href=a)}v(!1),x(null),k([]);const t=l.find(a=>a.id!==e.id&&!E.has(a.id));g&&m&&g({storeId:m,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo,buttonClicked:"Primary",buttonName:e.primaryButton?.text||e.buttonText||"Explore",buttonUrl:e.primaryButton?.redirectionUrl||e.redirectUrl||e.productVideo}),setTimeout(()=>{h(!1),t&&n!=="Play Video"?q(t,l):t||U(!0)},500)},[l,c,E]),te=i.useCallback(async(e,o)=>{h(!0),await c(e.id),Q(a=>new Set(a).add(e.id));const n=o??e.secondaryButton?.action;n==="Play Video"&&e.productVideo&&(L(e.productVideo),J(!0),_(!0)),v(!1),x(null),k([]);const t=l.find(a=>a.id!==e.id&&!E.has(a.id));g&&m&&g({storeId:m,announcementId:e.id,announcementTitle:e.title,imageUrl:e.displayImage||e.image,videoUrl:e.productVideo,buttonClicked:"Secondary",buttonName:e.secondaryButton?.text||"Secondary",buttonUrl:e.secondaryButton?.redirectionUrl}),setTimeout(()=>{h(!1),t&&n!=="Play Video"?q(t,l):t||U(!0)},500)},[l,c,E]),oe=i.useCallback(async e=>{const o=e||p;if(!o)return;const n=l.findIndex(t=>t.id===o.id);if(n>0){const t=l[n-1];x(t);const a=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,s=document.querySelector(a);if(s)try{const{scrollToElementSmooth:b}=await Promise.resolve().then(()=>require("./utils/elementHelpers.js"));await b(s,120)}catch{}const d=n-1,u=l.length,f=[{target:a,content:S.jsx(ie.default,{feature:t,currentIndex:d,totalFeatures:u,onSkip:()=>Y(t),onExplore:b=>ee(t,b),onSecondaryAction:b=>te(t,b),onPrevious:()=>oe(t),onNext:()=>ne(t),setIsClosing:K}),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"}}}];k(f)}},[p,l]),ne=i.useCallback(async e=>{const o=e||p;if(!o)return;const n=l.findIndex(t=>t.id===o.id);if(n<l.length-1){const t=l[n+1];x(t);const a=t.featureTag.startsWith("#")||t.featureTag.startsWith(".")||t.featureTag.startsWith("[")?t.featureTag:`#${t.featureTag}`,s=document.querySelector(a);if(s)try{const{scrollToElementSmooth:b}=await Promise.resolve().then(()=>require("./utils/elementHelpers.js"));await b(s,120)}catch{}const d=n+1,u=l.length,f=[{target:a,content:S.jsx(ie.default,{feature:t,currentIndex:d,totalFeatures:u,onSkip:()=>Y(t),onExplore:b=>ee(t,b),onSecondaryAction:b=>te(t,b),onPrevious:()=>oe(t),onNext:()=>ne(t),setIsClosing:K}),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"}}}];k(f)}else h(!0),U(!0),c(o.id),v(!1),x(null),k([]),setTimeout(()=>{h(!1)},500)},[p,l,c]);return S.jsxs(S.Fragment,{children:[N,le.length>0&&S.jsx(fe.default,{steps:le,run:xe,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ve,disableOverlayClose:!1,disableCloseOnEsc:!1,disableOverlay:!1,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:Te?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${we}`),re.length>0&&S.jsx(fe.default,{steps:re,run:O,continuous:!1,showProgress:!1,showSkipButton:!1,callback:je,disableOverlayClose:!1,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ue?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:ue?"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-${Ue}`),S.jsx(Ie.VideoModal,{isOpen:ke,videoUrl:Ce,onClose:()=>{J(!1),L(""),_(!1);const e=l.find(o=>!E.has(o.id));e?setTimeout(()=>{q(e,l)},300):U(!0)}})]})};exports.default=Ve;
 //# sourceMappingURL=FeatureAnnouncementProvider.js.map