uangcermat-web-toolkit-v2 0.2.27 → 0.2.28

package/build/src/components/CheckPicker/BaseInfiniteCheckPicker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime");require("../../../node_modules/react-query/es/react/setBatchUpdatesFn.js"),require("../../../node_modules/react-query/es/react/setLogger.js");var t=require("../../../node_modules/react-query/es/react/QueryClientProvider.js"),s=require("./InfiniteCheckPicker.js");const i=new(require("../../../node_modules/react-query/es/core/queryClient.js").QueryClient)({defaultOptions:{queries:{refetchOnWindowFocus:!1}}});module.exports=function(u){var{queryClient:n=i}=u,c=e.__rest(u,["queryClient"]);return r.jsx(t.QueryClientProvider,Object.assign({client:n},{children:r.jsx(s,Object.assign({},c))}))};
+"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),i=require("react-query"),t=require("./InfiniteCheckPicker.js");const n=new i.QueryClient({defaultOptions:{queries:{refetchOnWindowFocus:!1}}});module.exports=function(s){var{queryClient:u=n}=s,c=e.__rest(s,["queryClient"]);return r.jsx(i.QueryClientProvider,Object.assign({client:u},{children:r.jsx(t,Object.assign({},c))}))};
 //# sourceMappingURL=BaseInfiniteCheckPicker.js.map

package/build/src/components/CheckPicker/BaseInfiniteCheckPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseInfiniteCheckPicker.js","sources":["../../../../src/components/CheckPicker/BaseInfiniteCheckPicker.tsx"],"sourcesContent":["import React from 'react';\nimport { QueryClient, QueryClientProvider } from 'react-query';\n\nimport { BaseInfiniteCheckPickerInterface } from './BaseInfiniteCheckPicker.type';\nimport BaseInfiniteCheckPicker from './InfiniteCheckPicker';\n\nconst defaultQueryClient = new QueryClient({\n  defaultOptions: {\n    queries: {\n      refetchOnWindowFocus: false\n    }\n  }\n});\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface BaseInfiniteCheckPickerWithProviderProps<T = any>\n  extends BaseInfiniteCheckPickerInterface<T> {\n  queryClient?: QueryClient;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteCheckPickerWithProvider<T = any>({\n  queryClient = defaultQueryClient,\n  ...props\n}: BaseInfiniteCheckPickerWithProviderProps<T>) {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <BaseInfiniteCheckPicker {...props} />\n    </QueryClientProvider>\n  );\n}\n\nexport default BaseInfiniteCheckPickerWithProvider;\n"],"names":["defaultQueryClient","QueryClient","defaultOptions","queries","refetchOnWindowFocus","_a","queryClient","props","__rest","_jsx","QueryClientProvider","Object","assign","client","children","BaseInfiniteCheckPicker"],"mappings":"gWAMA,MAAMA,EAAqB,wEAAIC,aAAY,CACzCC,eAAgB,CACdC,QAAS,CACPC,sBAAsB,qBAY5B,SAAsDC,OAAAC,YACpDA,EAAcN,GAAkBK,EAC7BE,EAAKC,EAAAA,OAAAH,EAF4C,iBAIpD,OACEI,EAAAA,IAACC,EAAAA,oBAAmBC,OAAAC,OAAA,CAACC,OAAQP,GAC3B,CAAAQ,SAAAL,EAAAA,IAACM,EAA4BJ,OAAAC,OAAA,CAAA,EAAAL,MAGnC"}
+{"version":3,"file":"BaseInfiniteCheckPicker.js","sources":["../../../../src/components/CheckPicker/BaseInfiniteCheckPicker.tsx"],"sourcesContent":["import React from 'react';\nimport { QueryClient, QueryClientProvider } from 'react-query';\n\nimport { BaseInfiniteCheckPickerInterface } from './BaseInfiniteCheckPicker.type';\nimport BaseInfiniteCheckPicker from './InfiniteCheckPicker';\n\nconst defaultQueryClient = new QueryClient({\n  defaultOptions: {\n    queries: {\n      refetchOnWindowFocus: false\n    }\n  }\n});\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface BaseInfiniteCheckPickerWithProviderProps<T = any>\n  extends BaseInfiniteCheckPickerInterface<T> {\n  queryClient?: QueryClient;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteCheckPickerWithProvider<T = any>({\n  queryClient = defaultQueryClient,\n  ...props\n}: BaseInfiniteCheckPickerWithProviderProps<T>) {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <BaseInfiniteCheckPicker {...props} />\n    </QueryClientProvider>\n  );\n}\n\nexport default BaseInfiniteCheckPickerWithProvider;\n"],"names":["defaultQueryClient","QueryClient","defaultOptions","queries","refetchOnWindowFocus","_a","queryClient","props","__rest","_jsx","QueryClientProvider","Object","assign","client","children","BaseInfiniteCheckPicker"],"mappings":"wJAMA,MAAMA,EAAqB,IAAIC,EAAAA,YAAY,CACzCC,eAAgB,CACdC,QAAS,CACPC,sBAAsB,qBAY5B,SAAsDC,OAAAC,YACpDA,EAAcN,GAAkBK,EAC7BE,EAAKC,EAAAA,OAAAH,EAF4C,iBAIpD,OACEI,EAAAA,IAACC,EAAAA,oBAAmBC,OAAAC,OAAA,CAACC,OAAQP,GAC3B,CAAAQ,SAAAL,EAAAA,IAACM,EAA4BJ,OAAAC,OAAA,CAAA,EAAAL,MAGnC"}

package/build/src/components/CheckPicker/InfiniteCheckPicker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),l=require("../../../node_modules/classnames/index.js"),s=require("react");require("../../../node_modules/react-query/es/react/setBatchUpdatesFn.js"),require("../../../node_modules/react-query/es/react/setLogger.js");var r=require("../../../node_modules/react-query/es/react/QueryClientProvider.js"),a=require("../../hooks/useDebounce.js"),n=require("../../hooks/useInfinitePicker.js"),o=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var i=require("../Text/BaseText.js");require("../Text/Text.js");var d=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var c=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js");var u=require("../Checkbox/Checkbox.js"),x=require("../Icon/Icon.js"),f=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),m=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=function({fetchFn:g,queryKey:h,debounceMs:j=300,disabled:p=!1,pageSize:v=100,value:w,valueStyles:y,label:k,labelStyles:S,placeholder:N,placeholderStyles:q,containerStyles:C,activeContainerStyles:M,iconStyles:B,itemsContainerStyles:O,itemContainerStyles:R,oddBgColor:L,evenBgColor:F,isDisabled:T=!1,position:I="bottom-start",isAutoFlip:G,onSelectItem:_,onClean:E,isCleanable:D,isError:P,errorMessage:A,errorMessageStyles:z,helperMessage:$,helperMessageStyles:K,isSearchable:Q,searchContainerStyles:H,activeSearchStyles:U,searchPlaceholder:J,searchStyles:V,iconSearchStyles:W,isShowFooterButton:X,footerButtonContainerStyles:Y,footerButtonLabel:Z,onClickFooterButton:ee,noResultsLabel:te,noResultsLabelStyles:le,badgeContainerStyles:se,badgeLabelStyles:re,variant:ae="box",data:ne,isRequired:oe,labelRequired:ie,labelRequiredStyles:de,containerRequiredStyles:ce,onSearch:ue,selectedAllText:xe,isShowSelectedAllText:fe=!0,isShowUnmatchItem:be=!0,selectedAllTextStyles:me,activeCheckboxColor:ge,itemTextStyles:he,listContainerStyles:je,isClearSearchOnClose:pe,selectedItemTextStyles:ve,activeItemTextStyles:we,maxSelected:ye}){const ke=r.useQueryClient(),Se=s.useRef(null),Ne=s.useRef(null),[qe,Ce]=s.useState(""),Me=a.useDebounce(qe,j),[Be,Oe]=s.useState(0),[Re,Le]=s.useState(!1),Fe=s.useRef(null),[Te,Ie]=s.useState(!1),{data:Ge,isLoading:_e,isFetchingNextPage:Ee,hasNextPage:De,fetchNextPage:Pe,totalCount:Ae}=n.useInfinitePicker({fetchFn:g,queryKey:h,search:Me,pageSize:v,enabled:!p});console.log("dataInfinite length",Ae);const ze=s.useMemo((()=>Ge||[]),[Ge]);s.useEffect((()=>{const e=null==w?void 0:w.filter((e=>e));(null==e?void 0:e.length)>=ye?Le(!0):Le(!1)}),[w,ye]);const $e=s.useCallback(((e,t)=>{if(Re&&!t)return;let l=w.slice();l=t?l.filter((t=>t!==e)):l.concat(e),null==_||_(l.filter((e=>""!==e))),l.length===ye?Le(!0):Le(!1)}),[Re,w,_,ye]),Ke=s.useCallback((()=>{null==_||_([]),Ce(""),Le(!1),null==E||E()}),[_,E]),Qe=(t,s)=>e.jsx(b.ListboxOption,Object.assign({className:f.twMerge(l.default("relative cursor-default select-none list-none",o(R,"p-"),o(R,"px-"),o(R,"py-"))),value:t},{children:({active:r})=>{const a=w.some((e=>e===t.value));return e.jsx("div",Object.assign({className:f.twMerge(l.default("w-full flex items-center !min-h-[32px] p-2",R,(!!o(R,"p-")||!!o(R,"px-")||!!o(R,"py-"))&&"p-2")),style:{backgroundColor:s%2==0?L||"var(--dropdownList-background-odd)":F||"var(--dropdownList-background-even)"}},{children:e.jsxs("div",Object.assign({className:f.twMerge("flex flex-row items-center gap-x-2 cursor-pointer w-full",Re&&!a?"cursor-not-allowed":""),onClick:e=>{e.preventDefault(),$e(t.value,a)}},{children:[e.jsx(u,{checked:a,variant:"small",color:ge||void 0,isDisabled:Re&&!a}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(i.default,{label:t.label,className:f.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${r&&!Re?f.twMerge("font-semibold text-dropdownList-text-hover",we):"font-normal"}`),a&&ve,he)})}))]}))}))}}),`${t.value}-${s}`);s.useEffect((()=>{ue&&ue(qe)}),[qe]),s.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)Oe(t.contentRect.width)}));return Se.current&&e.observe(Se.current),()=>{Se.current&&e.unobserve(Se.current)}}),[]),s.useEffect((()=>{const e=Fe.current,t=Ne.current;if(!e||!t||!De||Ee)return;const l=new IntersectionObserver((e=>{var t;(null===(t=e[0])||void 0===t?void 0:t.isIntersecting)&&De&&!Ee&&Pe()}),{root:t,rootMargin:"50px",threshold:.1});return l.observe(e),()=>{l.disconnect()}}),[De,Ee,Pe,ze.length]);const He=!o(C,"w-")||"w-full"===o(C,"w-")||!o(O,"w-")||"w-full"===o(O,"w-"),Ue=()=>w&&w.length>0&&!(1===w.length&&""===w[0]);return e.jsx(b.Listbox,Object.assign({multiple:!0},{children:e.jsxs("div",Object.assign({ref:Se,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!k&&e.jsx(i.default,{label:k,className:f.twMerge("font-normal text-dark-gumbo text-[10px]",S)}),oe&&e.jsx(d,{labelRequired:ie,labelRequiredStyles:de,containerRequiredStyles:ce})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:I,flip:G},{children:[e.jsx(b.ListboxButton,Object.assign({className:f.twMerge(l.default("p-0 bg-transparent",T&&"cursor-not-allowed"),ce?o(C,"w-"):void 0),onClick:e=>{T&&e.preventDefault()}},{children:({open:t})=>e.jsxs("div",Object.assign({className:f.twMerge(l.default(f.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",C),"line"===ae&&"border-b border-t-0 border-x-0 rounded-none",t&&M?M:t?"border-fields-border-focus":void 0,T&&"border-dark-bermudaGray bg-light-whiteSmoke",P&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!N&&!Ue()&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(i.default,{label:N,variant:"small",className:f.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),q)})})),Ue()?e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:w.length===Ae&&fe?e.jsx(i.default,{label:xe||"All",variant:"small",className:f.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),me)}):e.jsx(i.default,{label:be?w.map((e=>{var t;return(null===(t=ze.find((t=>t.value===e)))||void 0===t?void 0:t.label)||e})).join(", "):ze.filter((e=>w.includes(e.value))).map((e=>e.label||e)).join(", "),variant:"small",className:f.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),y)})})):null]})),Ue()&&e.jsx("div",Object.assign({className:f.twMerge("flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]",se)},{children:e.jsx(i.default,{label:w.length.toString(),className:f.twMerge(l.default("font-normal text-[8px] leading-3"),re)})})),D&&Ue()&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),Ke()}},{children:e.jsx(x,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(x,{name:t?"chevronup":"chevrondown",className:f.twMerge(l.default("fill-dark-bermudaGray w-3 h-3",`${T&&"fill-dark-bermudaGray"}`),B)})]}))})),e.jsx(m.Transition,Object.assign({as:s.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(b.ListboxOptions,Object.assign({className:f.twMerge(l.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50",C?o(C,"w-"):void 0),O),style:{width:He?Be:void 0,height:"auto"}},{children:({open:t})=>(s.useEffect((()=>{!t&&pe&&Ce("")}),[t]),s.useEffect((()=>{if(t&&!Te){const e=[...h,Me];ke.resetQueries(e),Ie(!0),Ne.current&&(Ne.current.scrollTop=0)}else!t&&Te&&Ie(!1)}),[t]),e.jsxs(e.Fragment,{children:[Q?e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:f.twMerge(l.default(f.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",H),U||"border-fields-border-focus"))},{children:[e.jsx("input",{placeholder:J||"Search",className:f.twMerge("flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs",V),onChange:e=>{Ce(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:qe}),e.jsx(x,{name:"search",className:f.twMerge("fill-dark-bermudaGray w-3 h-3",W)})]}))})):null,e.jsx("div",Object.assign({className:f.twMerge(l.default("p-0 overflow-hidden",o(O,"w-")?o(O,"w-"):o(C,"w-"))),style:{width:He?Be:void 0}},{children:ze.length>0?e.jsxs("div",Object.assign({ref:Ne,className:f.twMerge("max-h-80 overflow-y-auto scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",je),style:{maxHeight:320}},{children:[ze.map(((e,t)=>Qe(e,t))),De&&e.jsx("div",Object.assign({ref:Fe,className:"w-full h-8 flex items-center justify-center"},{children:Ee?e.jsx(i.default,{label:"Loading",className:"text-dark-bermudaGray font-normal text-xs text-center"}):e.jsx("div",{className:"w-full h-1"})}))]})):_e?e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(i.default,{label:"Loading",className:f.twMerge("text-dark-bermudaGray font-normal text-sm text-center",le)})})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(i.default,{label:te||"No Results Found",className:f.twMerge("text-dark-bermudaGray font-normal text-sm",le)})}))})),X&&e.jsx(c.default,{variant:"tertiary",onClick:()=>{null==ee||ee()},label:Z||"Footer Button",className:f.twMerge("",Y)})]}))}))}))]}))})),$&&!P&&e.jsx(i.default,{label:$,className:f.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",K)}),P&&!!A&&e.jsx(i.default,{label:A,className:f.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",z)})]}))}))};
+"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),l=require("../../../node_modules/classnames/index.js"),s=require("react"),r=require("react-query"),a=require("../../hooks/useDebounce.js"),n=require("../../hooks/useInfinitePicker.js"),i=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var o=require("../Text/BaseText.js");require("../Text/Text.js");var d=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var c=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js");var u=require("../Checkbox/Checkbox.js"),x=require("../Icon/Icon.js"),f=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),m=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=function({fetchFn:g,queryKey:h,debounceMs:j=300,disabled:p=!1,pageSize:w=100,value:v,valueStyles:y,label:k,labelStyles:S,placeholder:N,placeholderStyles:q,containerStyles:C,activeContainerStyles:M,iconStyles:B,itemsContainerStyles:O,itemContainerStyles:R,oddBgColor:L,evenBgColor:T,isDisabled:F=!1,position:I="bottom-start",isAutoFlip:G,onSelectItem:E,onClean:D,isCleanable:P,isError:_,errorMessage:A,errorMessageStyles:z,helperMessage:$,helperMessageStyles:K,isSearchable:H,searchContainerStyles:Q,activeSearchStyles:U,searchPlaceholder:J,searchStyles:V,iconSearchStyles:W,isShowFooterButton:X,footerButtonContainerStyles:Y,footerButtonLabel:Z,onClickFooterButton:ee,noResultsLabel:te,noResultsLabelStyles:le,badgeContainerStyles:se,badgeLabelStyles:re,variant:ae="box",data:ne,isRequired:ie,labelRequired:oe,labelRequiredStyles:de,containerRequiredStyles:ce,onSearch:ue,selectedAllText:xe,isShowSelectedAllText:fe=!0,isShowUnmatchItem:be=!0,selectedAllTextStyles:me,activeCheckboxColor:ge,itemTextStyles:he,listContainerStyles:je,isClearSearchOnClose:pe,selectedItemTextStyles:we,activeItemTextStyles:ve,maxSelected:ye}){const ke=r.useQueryClient(),Se=s.useRef(null),Ne=s.useRef(null),[qe,Ce]=s.useState(""),Me=a.useDebounce(qe,j),[Be,Oe]=s.useState(0),[Re,Le]=s.useState(!1),Te=s.useRef(null),[Fe,Ie]=s.useState(!1),{data:Ge,isLoading:Ee,isFetchingNextPage:De,hasNextPage:Pe,fetchNextPage:_e,totalCount:Ae}=n.useInfinitePicker({fetchFn:g,queryKey:h,search:Me,pageSize:w,enabled:!p});console.log("dataInfinite length",Ae);const ze=s.useMemo((()=>Ge||[]),[Ge]);s.useEffect((()=>{const e=null==v?void 0:v.filter((e=>e));(null==e?void 0:e.length)>=ye?Le(!0):Le(!1)}),[v,ye]);const $e=s.useCallback(((e,t)=>{if(Re&&!t)return;let l=v.slice();l=t?l.filter((t=>t!==e)):l.concat(e),null==E||E(l.filter((e=>""!==e))),l.length===ye?Le(!0):Le(!1)}),[Re,v,E,ye]),Ke=s.useCallback((()=>{null==E||E([]),Ce(""),Le(!1),null==D||D()}),[E,D]),He=(t,s)=>e.jsx(b.ListboxOption,Object.assign({className:f.twMerge(l.default("relative cursor-default select-none list-none",i(R,"p-"),i(R,"px-"),i(R,"py-"))),value:t},{children:({active:r})=>{const a=v.some((e=>e===t.value));return e.jsx("div",Object.assign({className:f.twMerge(l.default("w-full flex items-center !min-h-[32px] p-2",R,(!!i(R,"p-")||!!i(R,"px-")||!!i(R,"py-"))&&"p-2")),style:{backgroundColor:s%2==0?L||"var(--dropdownList-background-odd)":T||"var(--dropdownList-background-even)"}},{children:e.jsxs("div",Object.assign({className:f.twMerge("flex flex-row items-center gap-x-2 cursor-pointer w-full",Re&&!a?"cursor-not-allowed":""),onClick:e=>{e.preventDefault(),$e(t.value,a)}},{children:[e.jsx(u,{checked:a,variant:"small",color:ge||void 0,isDisabled:Re&&!a}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(o.default,{label:t.label,className:f.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${r&&!Re?f.twMerge("font-semibold text-dropdownList-text-hover",ve):"font-normal"}`),a&&we,he)})}))]}))}))}}),`${t.value}-${s}`);s.useEffect((()=>{ue&&ue(qe)}),[qe]),s.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)Oe(t.contentRect.width)}));return Se.current&&e.observe(Se.current),()=>{Se.current&&e.unobserve(Se.current)}}),[]),s.useEffect((()=>{const e=Te.current,t=Ne.current;if(!e||!t||!Pe||De)return;const l=new IntersectionObserver((e=>{var t;(null===(t=e[0])||void 0===t?void 0:t.isIntersecting)&&Pe&&!De&&_e()}),{root:t,rootMargin:"50px",threshold:.1});return l.observe(e),()=>{l.disconnect()}}),[Pe,De,_e,ze.length]);const Qe=!i(C,"w-")||"w-full"===i(C,"w-")||!i(O,"w-")||"w-full"===i(O,"w-"),Ue=()=>v&&v.length>0&&!(1===v.length&&""===v[0]);return e.jsx(b.Listbox,Object.assign({multiple:!0},{children:e.jsxs("div",Object.assign({ref:Se,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!k&&e.jsx(o.default,{label:k,className:f.twMerge("font-normal text-dark-gumbo text-[10px]",S)}),ie&&e.jsx(d,{labelRequired:oe,labelRequiredStyles:de,containerRequiredStyles:ce})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:I,flip:G},{children:[e.jsx(b.ListboxButton,Object.assign({className:f.twMerge(l.default("p-0 bg-transparent",F&&"cursor-not-allowed"),ce?i(C,"w-"):void 0),onClick:e=>{F&&e.preventDefault()}},{children:({open:t})=>e.jsxs("div",Object.assign({className:f.twMerge(l.default(f.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",C),"line"===ae&&"border-b border-t-0 border-x-0 rounded-none",t&&M?M:t?"border-fields-border-focus":void 0,F&&"border-dark-bermudaGray bg-light-whiteSmoke",_&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!N&&!Ue()&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(o.default,{label:N,variant:"small",className:f.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),q)})})),Ue()?e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:v.length===Ae&&fe?e.jsx(o.default,{label:xe||"All",variant:"small",className:f.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),me)}):e.jsx(o.default,{label:be?v.map((e=>{var t;return(null===(t=ze.find((t=>t.value===e)))||void 0===t?void 0:t.label)||e})).join(", "):ze.filter((e=>v.includes(e.value))).map((e=>e.label||e)).join(", "),variant:"small",className:f.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),y)})})):null]})),Ue()&&e.jsx("div",Object.assign({className:f.twMerge("flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]",se)},{children:e.jsx(o.default,{label:v.length.toString(),className:f.twMerge(l.default("font-normal text-[8px] leading-3"),re)})})),P&&Ue()&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),Ke()}},{children:e.jsx(x,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(x,{name:t?"chevronup":"chevrondown",className:f.twMerge(l.default("fill-dark-bermudaGray w-3 h-3",`${F&&"fill-dark-bermudaGray"}`),B)})]}))})),e.jsx(m.Transition,Object.assign({as:s.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(b.ListboxOptions,Object.assign({className:f.twMerge(l.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50",C?i(C,"w-"):void 0),O),style:{width:Qe?Be:void 0,height:"auto"}},{children:({open:t})=>(s.useEffect((()=>{!t&&pe&&Ce("")}),[t]),s.useEffect((()=>{if(t&&!Fe){const e=[...h,Me];ke.resetQueries(e),Ie(!0),Ne.current&&(Ne.current.scrollTop=0)}else!t&&Fe&&Ie(!1)}),[t]),e.jsxs(e.Fragment,{children:[H?e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:f.twMerge(l.default(f.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",Q),U||"border-fields-border-focus"))},{children:[e.jsx("input",{placeholder:J||"Search",className:f.twMerge("flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs",V),onChange:e=>{Ce(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:qe}),e.jsx(x,{name:"search",className:f.twMerge("fill-dark-bermudaGray w-3 h-3",W)})]}))})):null,e.jsx("div",Object.assign({className:f.twMerge(l.default("p-0 overflow-hidden",i(O,"w-")?i(O,"w-"):i(C,"w-"))),style:{width:Qe?Be:void 0}},{children:ze.length>0?e.jsxs("div",Object.assign({ref:Ne,className:f.twMerge("max-h-80 overflow-y-auto scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",je),style:{maxHeight:320}},{children:[ze.map(((e,t)=>He(e,t))),Pe&&e.jsx("div",Object.assign({ref:Te,className:"w-full h-8 flex items-center justify-center"},{children:De?e.jsx(o.default,{label:"Loading",className:"text-dark-bermudaGray font-normal text-xs text-center"}):e.jsx("div",{className:"w-full h-1"})}))]})):Ee?e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(o.default,{label:"Loading",className:f.twMerge("text-dark-bermudaGray font-normal text-sm text-center",le)})})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(o.default,{label:te||"No Results Found",className:f.twMerge("text-dark-bermudaGray font-normal text-sm",le)})}))})),X&&e.jsx(c.default,{variant:"tertiary",onClick:()=>{null==ee||ee()},label:Z||"Footer Button",className:f.twMerge("",Y)})]}))}))}))]}))})),$&&!_&&e.jsx(o.default,{label:$,className:f.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",K)}),_&&!!A&&e.jsx(o.default,{label:A,className:f.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",z)})]}))}))};
 //# sourceMappingURL=InfiniteCheckPicker.js.map

package/build/src/components/CheckPicker/InfiniteCheckPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"InfiniteCheckPicker.js","sources":["../../../../src/components/CheckPicker/InfiniteCheckPicker.tsx"],"sourcesContent":["import {\n  Listbox,\n  ListboxButton,\n  ListboxOption,\n  ListboxOptions,\n  Transition\n} from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport classNames from 'classnames';\nimport { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useQueryClient } from 'react-query';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useDebounce } from '../../hooks/useDebounce';\nimport { useInfinitePicker } from '../../hooks/useInfinitePicker';\nimport extractClasses from '../../utils/extractClasses';\nimport { BaseBadgeRequired } from '../Badge';\nimport { BaseButton } from '../Button';\nimport { Checkbox } from '../Checkbox';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n  BaseInfiniteCheckPickerDataInterface,\n  BaseInfiniteCheckPickerInterface\n} from './BaseInfiniteCheckPicker.type';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteCheckPicker<T = any>({\n  fetchFn,\n  queryKey,\n  debounceMs = 300,\n  disabled = false,\n  pageSize = 100,\n  value,\n  valueStyles,\n  label,\n  labelStyles,\n  placeholder,\n  placeholderStyles,\n  containerStyles,\n  activeContainerStyles,\n  iconStyles,\n  itemsContainerStyles,\n  itemContainerStyles,\n  oddBgColor,\n  evenBgColor,\n  isDisabled = false,\n  position = 'bottom-start',\n  isAutoFlip,\n  onSelectItem,\n  onClean,\n  isCleanable,\n  isError,\n  errorMessage,\n  errorMessageStyles,\n  helperMessage,\n  helperMessageStyles,\n  isSearchable,\n  searchContainerStyles,\n  activeSearchStyles,\n  searchPlaceholder,\n  searchStyles,\n  iconSearchStyles,\n  isShowFooterButton,\n  footerButtonContainerStyles,\n  footerButtonLabel,\n  onClickFooterButton,\n  noResultsLabel,\n  noResultsLabelStyles,\n  badgeContainerStyles,\n  badgeLabelStyles,\n  variant = 'box',\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  data: _data, // Keep for backward compatibility but don't use (using dataInfinite instead)\n  isRequired,\n  labelRequired,\n  labelRequiredStyles,\n  containerRequiredStyles,\n  onSearch,\n  selectedAllText,\n  isShowSelectedAllText = true,\n  isShowUnmatchItem = true,\n  selectedAllTextStyles,\n  activeCheckboxColor,\n  itemTextStyles,\n  listContainerStyles,\n  isClearSearchOnClose,\n  selectedItemTextStyles,\n  activeItemTextStyles,\n  maxSelected\n}: BaseInfiniteCheckPickerInterface<T>) {\n  const defaultScrollbarStyles =\n    'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n  const queryClient = useQueryClient();\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n\n  const [search, setSearch] = useState<string>('');\n  const debouncedQuery = useDebounce(search, debounceMs);\n  const [buttonWidth, setButtonWidth] = useState<number>(0);\n  const [isDisableSelected, setIsDisableSelected] = useState<boolean>(false);\n\n  const sentinelRef = useRef<HTMLDivElement>(null);\n  const [isDropdownOpen, setIsDropdownOpen] = useState<boolean>(false);\n  const {\n    data: dataInfinite,\n    isLoading,\n    isFetchingNextPage,\n    hasNextPage,\n    fetchNextPage,\n    totalCount\n  } = useInfinitePicker({\n    fetchFn,\n    queryKey,\n    search: debouncedQuery,\n    pageSize,\n    enabled: !disabled\n  });\n\n  // eslint-disable-next-line no-console\n  console.log('dataInfinite length', totalCount);\n\n  const dataPicker: Array<BaseInfiniteCheckPickerDataInterface> = useMemo(() => {\n    // Use dataInfinite from the hook instead of static data prop\n    // Type assertion is safe here as the API should return the correct format\n    return (dataInfinite || []) as Array<BaseInfiniteCheckPickerDataInterface>;\n  }, [dataInfinite]);\n\n  const maxDropdownHeight = 320; // Maximum height for the dropdown list\n\n  useEffect(() => {\n    const filteredValue = value?.filter((item) => item);\n    if (filteredValue?.length >= maxSelected) {\n      setIsDisableSelected(true);\n    } else {\n      setIsDisableSelected(false);\n    }\n  }, [value, maxSelected]);\n\n  const handleItemClick = useCallback(\n    (itemValue: string, isSelected: boolean) => {\n      if (isDisableSelected && !isSelected) return;\n\n      let temp = value.slice();\n      if (isSelected) {\n        temp = temp.filter((i) => i !== itemValue);\n      } else {\n        temp = temp.concat(itemValue);\n      }\n\n      onSelectItem?.(temp.filter((i) => i !== ''));\n\n      if (temp.length === maxSelected) {\n        setIsDisableSelected(true);\n      } else {\n        setIsDisableSelected(false);\n      }\n    },\n    [isDisableSelected, value, onSelectItem, maxSelected]\n  );\n\n  const handleClean = useCallback(() => {\n    onSelectItem?.([]);\n    setSearch('');\n    setIsDisableSelected(false);\n    onClean?.();\n  }, [onSelectItem, onClean]);\n\n  // eslint-disable-next-line sonarjs/cognitive-complexity\n  const renderItem = (item: BaseInfiniteCheckPickerDataInterface, index: number) => {\n    return (\n      <ListboxOption\n        key={`${item.value}-${index}`}\n        className={twMerge(\n          classNames(\n            'relative cursor-default select-none list-none',\n            extractClasses(itemContainerStyles, 'p-'),\n            extractClasses(itemContainerStyles, 'px-'),\n            extractClasses(itemContainerStyles, 'py-')\n          )\n        )}\n        value={item}\n      >\n        {({ active }) => {\n          const selected = value.some((i) => i === item.value);\n          return (\n            <div\n              className={twMerge(\n                classNames(\n                  'w-full flex items-center !min-h-[32px] p-2',\n                  itemContainerStyles,\n                  (!!extractClasses(itemContainerStyles, 'p-') ||\n                    !!extractClasses(itemContainerStyles, 'px-') ||\n                    !!extractClasses(itemContainerStyles, 'py-')) &&\n                    'p-2'\n                )\n              )}\n              style={{\n                backgroundColor:\n                  index % 2 === 0\n                    ? oddBgColor || 'var(--dropdownList-background-odd)'\n                    : evenBgColor || 'var(--dropdownList-background-even)'\n              }}\n            >\n              <div\n                className={twMerge(\n                  'flex flex-row items-center gap-x-2 cursor-pointer w-full',\n                  isDisableSelected && !selected ? 'cursor-not-allowed' : ''\n                )}\n                onClick={(e) => {\n                  e.preventDefault();\n                  handleItemClick(item.value, selected);\n                }}\n              >\n                <Checkbox\n                  checked={selected}\n                  variant='small'\n                  color={activeCheckboxColor || undefined}\n                  isDisabled={isDisableSelected && !selected}\n                />\n\n                <div className='flex flex-1'>\n                  <BaseText\n                    label={item.label}\n                    className={twMerge(\n                      classNames(\n                        'text-xs text-dropdownList-text-default leading-[14px]',\n                        `${\n                          active && !isDisableSelected\n                            ? twMerge(\n                                'font-semibold text-dropdownList-text-hover',\n                                activeItemTextStyles\n                              )\n                            : 'font-normal'\n                        }`\n                      ),\n                      selected && selectedItemTextStyles,\n                      itemTextStyles\n                    )}\n                  />\n                </div>\n              </div>\n            </div>\n          );\n        }}\n      </ListboxOption>\n    );\n  };\n\n  useEffect(() => {\n    if (onSearch) onSearch(search);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [search]);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setButtonWidth(entry.contentRect.width);\n      }\n    });\n\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current);\n    }\n\n    return () => {\n      if (containerRef.current) {\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        resizeObserver.unobserve(containerRef.current);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    const sentinel = sentinelRef.current;\n    const scrollContainer = listRef.current;\n\n    if (!sentinel || !scrollContainer || !hasNextPage || isFetchingNextPage) {\n      return;\n    }\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        if (entries[0]?.isIntersecting && hasNextPage && !isFetchingNextPage) {\n          fetchNextPage();\n        }\n      },\n      {\n        root: scrollContainer,\n        rootMargin: '50px',\n        threshold: 0.1\n      }\n    );\n\n    observer.observe(sentinel);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [hasNextPage, isFetchingNextPage, fetchNextPage, dataPicker.length]);\n\n  const isWidthFull =\n    !extractClasses(containerStyles, 'w-') ||\n    extractClasses(containerStyles, 'w-') === 'w-full' ||\n    !extractClasses(itemsContainerStyles, 'w-') ||\n    extractClasses(itemsContainerStyles, 'w-') === 'w-full';\n\n  // Helper function to check if value array has actual selections\n  const hasSelectedValues = () => {\n    return value && value.length > 0 && !(value.length === 1 && value[0] === '');\n  };\n\n  const renderSelectedValue = () => {\n    if (!hasSelectedValues()) return null;\n\n    return (\n      <div className='flex flex-1 w-[calc(100%-52px)]'>\n        {value.length === totalCount && isShowSelectedAllText ? (\n          <BaseText\n            label={selectedAllText || 'All'}\n            variant='small'\n            className={twMerge(\n              classNames(\n                'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n              ),\n              selectedAllTextStyles\n            )}\n          />\n        ) : (\n          <BaseText\n            label={\n              isShowUnmatchItem\n                ? value\n                    .map((i) => dataPicker.find((item) => item.value === i)?.label || i)\n                    .join(', ')\n                : dataPicker\n                    .filter((i: BaseInfiniteCheckPickerDataInterface) => value.includes(i.value))\n                    .map((i) => i.label || i)\n                    .join(', ')\n            }\n            variant='small'\n            className={twMerge(\n              classNames(\n                'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n              ),\n              valueStyles\n            )}\n          />\n        )}\n      </div>\n    );\n  };\n\n  const renderSearchSection = () => {\n    if (!isSearchable) return null;\n\n    return (\n      <div className='p-2 bg-light-whiteSolid w-full'>\n        <div\n          className={twMerge(\n            classNames(\n              twMerge(\n                'flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1',\n                searchContainerStyles\n              ),\n              activeSearchStyles ? activeSearchStyles : 'border-fields-border-focus'\n            )\n          )}\n        >\n          <input\n            placeholder={searchPlaceholder || 'Search'}\n            className={twMerge(\n              'flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs',\n              searchStyles\n            )}\n            onChange={(e) => {\n              setSearch(e.target.value);\n            }}\n            onKeyDown={(e) => e.stopPropagation()}\n            value={search}\n          />\n          <Icon\n            name='search'\n            className={twMerge('fill-dark-bermudaGray w-3 h-3', iconSearchStyles)}\n          />\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <Listbox multiple>\n      <div ref={containerRef} className='flex flex-col gap-y-1'>\n        <div className='flex flex-row items-end gap-x-1'>\n          {!!label && (\n            <BaseText\n              label={label}\n              className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n            />\n          )}\n          {isRequired && (\n            <BaseBadgeRequired\n              labelRequired={labelRequired}\n              labelRequiredStyles={labelRequiredStyles}\n              containerRequiredStyles={containerRequiredStyles}\n            />\n          )}\n        </div>\n        <div className='relative inline-block'>\n          <Float placement={position} flip={isAutoFlip}>\n            <ListboxButton\n              className={twMerge(\n                classNames('p-0 bg-transparent', isDisabled && 'cursor-not-allowed'),\n                containerRequiredStyles ? extractClasses(containerStyles, 'w-') : undefined\n              )}\n              onClick={(e) => {\n                if (isDisabled) {\n                  e.preventDefault();\n                }\n              }}\n            >\n              {({ open }) => (\n                <div\n                  className={twMerge(\n                    classNames(\n                      twMerge(\n                        'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid',\n                        containerStyles\n                      ),\n                      variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n                      open && activeContainerStyles\n                        ? activeContainerStyles\n                        : open\n                        ? 'border-fields-border-focus'\n                        : undefined,\n                      isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n                      isError && 'border-red-fireEngineRed'\n                    )\n                  )}\n                >\n                  <div className='flex flex-1'>\n                    {!!placeholder && !hasSelectedValues() && (\n                      <div className='flex flex-1 w-full'>\n                        <BaseText\n                          label={placeholder}\n                          variant='small'\n                          className={twMerge(\n                            classNames(\n                              'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n                            ),\n                            placeholderStyles\n                          )}\n                        />\n                      </div>\n                    )}\n\n                    {renderSelectedValue()}\n                  </div>\n\n                  {hasSelectedValues() && (\n                    <div\n                      className={twMerge(\n                        'flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]',\n                        badgeContainerStyles\n                      )}\n                    >\n                      <BaseText\n                        label={value.length.toString()}\n                        className={twMerge(\n                          classNames('font-normal text-[8px] leading-3'),\n                          badgeLabelStyles\n                        )}\n                      />\n                    </div>\n                  )}\n\n                  {isCleanable && hasSelectedValues() && (\n                    <div\n                      className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-1'\n                      onClick={(e) => {\n                        e.preventDefault();\n                        handleClean();\n                      }}\n                    >\n                      <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n                    </div>\n                  )}\n                  <Icon\n                    name={open ? 'chevronup' : 'chevrondown'}\n                    className={twMerge(\n                      classNames(\n                        'fill-dark-bermudaGray w-3 h-3',\n                        `${isDisabled && 'fill-dark-bermudaGray'}`\n                      ),\n                      iconStyles\n                    )}\n                  />\n                </div>\n              )}\n            </ListboxButton>\n            <Transition\n              as={Fragment}\n              leave='transition ease-in duration-100'\n              leaveFrom='opacity-100'\n              leaveTo='opacity-0'\n            >\n              <ListboxOptions\n                className={twMerge(\n                  classNames(\n                    'rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{\n                  width: isWidthFull ? buttonWidth : undefined,\n                  height: 'auto'\n                }}\n              >\n                {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n                {({ open }) => {\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (!open && isClearSearchOnClose) setSearch('');\n                  }, [open]);\n\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (open && !isDropdownOpen) {\n                      // Dropdown just opened - reset infinite scroll data to start fresh\n                      const queryKeyWithSearch = [...queryKey, debouncedQuery];\n                      queryClient.resetQueries(queryKeyWithSearch);\n                      setIsDropdownOpen(true);\n                      // Reset scroll position to top\n                      if (listRef.current) {\n                        listRef.current.scrollTop = 0;\n                      }\n                    } else if (!open && isDropdownOpen) {\n                      // Dropdown just closed\n                      setIsDropdownOpen(false);\n                    }\n                  }, [open]);\n\n                  return (\n                    <>\n                      {renderSearchSection()}\n                      <div\n                        className={twMerge(\n                          classNames(\n                            'p-0 overflow-hidden',\n                            extractClasses(itemsContainerStyles, 'w-')\n                              ? extractClasses(itemsContainerStyles, 'w-')\n                              : extractClasses(containerStyles, 'w-')\n                          )\n                        )}\n                        style={{ width: isWidthFull ? buttonWidth : undefined }}\n                      >\n                        {dataPicker.length > 0 ? (\n                          <div\n                            ref={listRef}\n                            className={twMerge(\n                              `max-h-80 overflow-y-auto ${defaultScrollbarStyles}`,\n                              listContainerStyles\n                            )}\n                            style={{\n                              maxHeight: maxDropdownHeight\n                            }}\n                          >\n                            {dataPicker.map((item, index) => renderItem(item, index))}\n                            {/* Infinite loading sentinel */}\n                            {hasNextPage && (\n                              <div\n                                ref={sentinelRef}\n                                className='w-full h-8 flex items-center justify-center'\n                              >\n                                {isFetchingNextPage ? (\n                                  <BaseText\n                                    label='Loading'\n                                    className='text-dark-bermudaGray font-normal text-xs text-center'\n                                  />\n                                ) : (\n                                  <div className='w-full h-1' />\n                                )}\n                              </div>\n                            )}\n                          </div>\n                        ) : isLoading ? (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label='Loading'\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm text-center',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        ) : (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label={noResultsLabel || 'No Results Found'}\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        )}\n                      </div>\n                      {isShowFooterButton && (\n                        <BaseButton\n                          variant='tertiary'\n                          onClick={() => {\n                            onClickFooterButton?.();\n                          }}\n                          label={footerButtonLabel || 'Footer Button'}\n                          className={twMerge('', footerButtonContainerStyles)}\n                        />\n                      )}\n                    </>\n                  );\n                }}\n              </ListboxOptions>\n            </Transition>\n          </Float>\n        </div>\n\n        {helperMessage && !isError && (\n          <BaseText\n            label={helperMessage}\n            className={twMerge(\n              'font-normal text-dark-bermudaGray text-[10px] inline-block',\n              helperMessageStyles\n            )}\n          />\n        )}\n\n        {isError && !!errorMessage && (\n          <BaseText\n            label={errorMessage}\n            className={twMerge(\n              'font-normal text-red-fireEngineRed text-[10px] inline-block',\n              errorMessageStyles\n            )}\n          />\n        )}\n      </div>\n    </Listbox>\n  );\n}\n\nexport default BaseInfiniteCheckPicker;\n"],"names":["fetchFn","queryKey","debounceMs","disabled","pageSize","value","valueStyles","label","labelStyles","placeholder","placeholderStyles","containerStyles","activeContainerStyles","iconStyles","itemsContainerStyles","itemContainerStyles","oddBgColor","evenBgColor","isDisabled","position","isAutoFlip","onSelectItem","onClean","isCleanable","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isSearchable","searchContainerStyles","activeSearchStyles","searchPlaceholder","searchStyles","iconSearchStyles","isShowFooterButton","footerButtonContainerStyles","footerButtonLabel","onClickFooterButton","noResultsLabel","noResultsLabelStyles","badgeContainerStyles","badgeLabelStyles","variant","data","_data","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","selectedAllText","isShowSelectedAllText","isShowUnmatchItem","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","maxSelected","queryClient","useQueryClient","containerRef","useRef","listRef","search","setSearch","useState","debouncedQuery","useDebounce","buttonWidth","setButtonWidth","isDisableSelected","setIsDisableSelected","sentinelRef","isDropdownOpen","setIsDropdownOpen","dataInfinite","isLoading","isFetchingNextPage","hasNextPage","fetchNextPage","totalCount","useInfinitePicker","enabled","console","log","dataPicker","useMemo","useEffect","filteredValue","filter","item","length","handleItemClick","useCallback","itemValue","isSelected","temp","slice","i","concat","handleClean","renderItem","index","_jsx","ListboxOption","Object","assign","className","twMerge","classNames","extractClasses","children","active","selected","some","style","backgroundColor","_jsxs","jsxs","onClick","e","preventDefault","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","current","observe","unobserve","sentinel","scrollContainer","observer","IntersectionObserver","_a","isIntersecting","root","rootMargin","threshold","disconnect","isWidthFull","hasSelectedValues","jsx","Listbox","multiple","ref","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","find","join","includes","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","height","queryKeyWithSearch","resetQueries","scrollTop","_Fragment","onChange","target","onKeyDown","stopPropagation","maxHeight","BaseButton"],"mappings":"y2CA2BA,UAA0CA,QACxCA,EAAOC,SACPA,EAAQC,WACRA,EAAa,IAAGC,SAChBA,GAAW,EAAKC,SAChBA,EAAW,IAAGC,MACdA,EAAKC,YACLA,EAAWC,MACXA,EAAKC,YACLA,EAAWC,YACXA,EAAWC,kBACXA,EAAiBC,gBACjBA,EAAeC,sBACfA,EAAqBC,WACrBA,EAAUC,qBACVA,EAAoBC,oBACpBA,EAAmBC,WACnBA,EAAUC,YACVA,EAAWC,WACXA,GAAa,EAAKC,SAClBA,EAAW,eAAcC,WACzBA,EAAUC,aACVA,EAAYC,QACZA,EAAOC,YACPA,EAAWC,QACXA,EAAOC,aACPA,EAAYC,mBACZA,EAAkBC,cAClBA,EAAaC,oBACbA,EAAmBC,aACnBA,EAAYC,sBACZA,EAAqBC,mBACrBA,EAAkBC,kBAClBA,EAAiBC,aACjBA,EAAYC,iBACZA,EAAgBC,mBAChBA,EAAkBC,4BAClBA,EAA2BC,kBAC3BA,EAAiBC,oBACjBA,GAAmBC,eACnBA,GAAcC,qBACdA,GAAoBC,qBACpBA,GAAoBC,iBACpBA,GAAgBC,QAChBA,GAAU,MAEVC,KAAMC,GAAKC,WACXA,GAAUC,cACVA,GAAaC,oBACbA,GAAmBC,wBACnBA,GAAuBC,SACvBA,GAAQC,gBACRA,GAAeC,sBACfA,IAAwB,EAAIC,kBAC5BA,IAAoB,EAAIC,sBACxBA,GAAqBC,oBACrBA,GAAmBC,eACnBA,GAAcC,oBACdA,GAAmBC,qBACnBA,GAAoBC,uBACpBA,GAAsBC,qBACtBA,GAAoBC,YACpBA,KAEA,MAGMC,GAAcC,EAAAA,iBACdC,GAAeC,SAAuB,MACtCC,GAAUD,SAAuB,OAEhCE,GAAQC,IAAaC,EAAQA,SAAS,IACvCC,GAAiBC,EAAAA,YAAYJ,GAAQjE,IACpCsE,GAAaC,IAAkBJ,EAAQA,SAAS,IAChDK,GAAmBC,IAAwBN,EAAQA,UAAU,GAE9DO,GAAcX,SAAuB,OACpCY,GAAgBC,IAAqBT,EAAQA,UAAU,IAE5DzB,KAAMmC,GAAYC,UAClBA,GAASC,mBACTA,GAAkBC,YAClBA,GAAWC,cACXA,GAAaC,WACbA,IACEC,oBAAkB,CACpBrF,UACAC,WACAkE,OAAQG,GACRlE,WACAkF,SAAUnF,IAIZoF,QAAQC,IAAI,sBAAuBJ,IAEnC,MAAMK,GAA0DC,EAAAA,SAAQ,IAG9DX,IAAgB,IACvB,CAACA,KAIJY,EAAAA,WAAU,KACR,MAAMC,EAAgBvF,eAAAA,EAAOwF,QAAQC,GAASA,KAC1CF,aAAa,EAAbA,EAAeG,SAAUlC,GAC3Bc,IAAqB,GAErBA,IAAqB,EACtB,GACA,CAACtE,EAAOwD,KAEX,MAAMmC,GAAkBC,EAAAA,aACtB,CAACC,EAAmBC,KAClB,GAAIzB,KAAsByB,EAAY,OAEtC,IAAIC,EAAO/F,EAAMgG,QAEfD,EADED,EACKC,EAAKP,QAAQS,GAAMA,IAAMJ,IAEzBE,EAAKG,OAAOL,GAGrB7E,SAAAA,EAAe+E,EAAKP,QAAQS,GAAY,KAANA,KAE9BF,EAAKL,SAAWlC,GAClBc,IAAqB,GAErBA,IAAqB,EACtB,GAEH,CAACD,GAAmBrE,EAAOgB,EAAcwC,KAGrC2C,GAAcP,EAAAA,aAAY,KAC9B5E,SAAAA,EAAe,IACf+C,GAAU,IACVO,IAAqB,GACrBrD,SAAAA,GAAW,GACV,CAACD,EAAcC,IAGZmF,GAAa,CAACX,EAA4CY,IAE5DC,MAACC,EAAaA,cAAAC,OAAAC,OAAA,CAEZC,UAAWC,UACTC,EAAAA,QACE,gDACAC,EAAenG,EAAqB,MACpCmG,EAAenG,EAAqB,OACpCmG,EAAenG,EAAqB,SAGxCV,MAAOyF,GAEN,CAAAqB,SAAA,EAAGC,aACF,MAAMC,EAAWhH,EAAMiH,MAAMhB,GAAMA,IAAMR,EAAKzF,QAC9C,OACEsG,EAAAA,yBACEI,UAAWC,EAAOA,QAChBC,EAAU,QACR,6CACAlG,KACGmG,EAAenG,EAAqB,SACnCmG,EAAenG,EAAqB,UACpCmG,EAAenG,EAAqB,SACtC,QAGNwG,MAAO,CACLC,gBACEd,EAAQ,GAAM,EACV1F,GAAc,qCACdC,GAAe,wCAGvB,CAAAkG,SAAAM,EAAAC,KAAA,MAAAb,OAAAC,OAAA,CACEC,UAAWC,EAAAA,QACT,2DACAtC,KAAsB2C,EAAW,qBAAuB,IAE1DM,QAAUC,IACRA,EAAEC,iBACF7B,GAAgBF,EAAKzF,MAAOgH,EAAS,GACtC,CAAAF,SAAA,CAEDR,EAAAA,IAACmB,EACC,CAAAC,QAASV,EACT1E,QAAQ,QACRqF,MAAOzE,SAAuB0E,EAC9B/G,WAAYwD,KAAsB2C,IAGpCV,2BAAKI,UAAU,eAAa,CAAAI,SAC1BR,EAAAA,IAACuB,EAAAA,SACC3H,MAAOuF,EAAKvF,MACZwG,UAAWC,UACTC,EAAAA,QACE,wDACA,GACEG,IAAW1C,GACPsC,EAAOA,QACL,6CACApD,IAEF,iBAGRyD,GAAY1D,GACZH,eAMV,IAvEC,GAAGsC,EAAKzF,SAASqG,KA6E5Bf,EAAAA,WAAU,KACJzC,IAAUA,GAASiB,GAAO,GAE7B,CAACA,KAEJwB,EAAAA,WAAU,KACR,MAAMwC,EAAiB,IAAIC,gBAAgBC,IACzC,IAAK,MAAMC,KAASD,EAClB5D,GAAe6D,EAAMC,YAAYC,MAClC,IAOH,OAJIxE,GAAayE,SACfN,EAAeO,QAAQ1E,GAAayE,SAG/B,KACDzE,GAAayE,SAEfN,EAAeQ,UAAU3E,GAAayE,QACvC,CACF,GACA,IAEH9C,EAAAA,WAAU,KACR,MAAMiD,EAAWhE,GAAY6D,QACvBI,EAAkB3E,GAAQuE,QAEhC,IAAKG,IAAaC,IAAoB3D,IAAeD,GACnD,OAGF,MAAM6D,EAAW,IAAIC,sBAClBV,WACiB,QAAZW,EAAAX,EAAQ,UAAI,IAAAW,OAAA,EAAAA,EAAAC,iBAAkB/D,KAAgBD,IAChDE,IACD,GAEH,CACE+D,KAAML,EACNM,WAAY,OACZC,UAAW,KAMf,OAFAN,EAASJ,QAAQE,GAEV,KACLE,EAASO,YAAY,CACtB,GACA,CAACnE,GAAaD,GAAoBE,GAAeM,GAAWM,SAE/D,MAAMuD,IACHpC,EAAevG,EAAiB,OACS,WAA1CuG,EAAevG,EAAiB,QAC/BuG,EAAepG,EAAsB,OACS,WAA/CoG,EAAepG,EAAsB,MAGjCyI,GAAoB,IACjBlJ,GAASA,EAAM0F,OAAS,KAAwB,IAAjB1F,EAAM0F,QAA6B,KAAb1F,EAAM,IAiFpE,OACEsG,EAAC6C,IAAAC,UAAQ5C,OAAAC,OAAA,CAAA4C,UACP,GAAA,CAAAvC,SAAAM,OAAA,MAAAZ,OAAAC,OAAA,CAAK6C,IAAK3F,GAAc+C,UAAU,yBAChC,CAAAI,SAAA,CAAAM,EAAAC,KAAA,MAAAb,OAAAC,OAAA,CAAKC,UAAU,mCAAiC,CAAAI,SAAA,GAC3C5G,GACDoG,EAAAA,IAACuB,EAAQ,QAAA,CACP3H,MAAOA,EACPwG,UAAWC,EAAOA,QAAC,0CAA2CxG,KAGjEsC,IACC6D,EAAC6C,IAAAI,EACC,CAAA7G,cAAeA,GACfC,oBAAqBA,GACrBC,wBAAyBA,SAI/B0D,EAAAA,IAAA,MAAAE,OAAAC,OAAA,CAAKC,UAAU,yBAAuB,CAAAI,SACpCM,EAACC,KAAAmC,QAAMhD,OAAAC,OAAA,CAAAgD,UAAW3I,EAAU4I,KAAM3I,GAAU,CAAA+F,SAAA,CAC1CR,EAAAA,IAACqD,EAAaA,cACZnD,OAAAC,OAAA,CAAAC,UAAWC,EAAOA,QAChBC,UAAW,qBAAsB/F,GAAc,sBAC/C+B,GAA0BiE,EAAevG,EAAiB,WAAQsH,GAEpEN,QAAUC,IACJ1G,GACF0G,EAAEC,gBACH,GAGF,CAAAV,SAAA,EAAG8C,UACFxC,EAAAA,KAAA,MAAAZ,OAAAC,OAAA,CACEC,UAAWC,EAAAA,QACTC,EAAU,QACRD,UACE,2GACArG,GAEU,SAAZgC,IAAsB,8CACtBsH,GAAQrJ,EACJA,EACAqJ,EACA,kCACAhC,EACJ/G,GAAc,8CACdM,GAAW,8BAEd,CAAA2F,SAAA,CAEDM,4BAAKV,UAAU,eAAa,CAAAI,SAAA,GACvB1G,IAAgB8I,MACjB5C,EAAA6C,IAAA,MAAA3C,OAAAC,OAAA,CAAKC,UAAU,sBACb,CAAAI,SAAAR,EAAA6C,IAACtB,UAAQ,CACP3H,MAAOE,EACPkC,QAAQ,QACRoE,UAAWC,EAAAA,QACTC,EAAU,QACR,mFAEFvG,QAzInB6I,KAGH5C,EAAAA,IAAK,MAAAE,OAAAC,OAAA,CAAAC,UAAU,6CACZ1G,EAAM0F,SAAWX,IAAchC,GAC9BuD,EAAC6C,IAAAtB,WACC3H,MAAO4C,IAAmB,MAC1BR,QAAQ,QACRoE,UAAWC,EAAOA,QAChBC,EAAU,QACR,yFAEF3D,MAIJqD,MAACuB,EAAQ,QAAA,CACP3H,MACE8C,GACIhD,EACG6J,KAAK5D,IAAK,IAAA0C,EAAC,OAA2C,QAA3CA,EAAAvD,GAAW0E,MAAMrE,GAASA,EAAKzF,QAAUiG,WAAE,IAAA0C,OAAA,EAAAA,EAAEzI,QAAS+F,CAAC,IAClE8D,KAAK,MACR3E,GACGI,QAAQS,GAA4CjG,EAAMgK,SAAS/D,EAAEjG,SACrE6J,KAAK5D,GAAMA,EAAE/F,OAAS+F,IACtB8D,KAAK,MAEdzH,QAAQ,QACRoE,UAAWC,EAAOA,QAChBC,UACE,yFAEF3G,QAhCuB,SAkJlBiJ,MACC5C,MACE,MAAAE,OAAAC,OAAA,CAAAC,UAAWC,UACT,0IACAvE,KACD,CAAA0E,SAEDR,EAAAA,IAACuB,EAAQ,QACP,CAAA3H,MAAOF,EAAM0F,OAAOuE,WACpBvD,UAAWC,EAAOA,QAChBC,UAAW,oCACXvE,SAMPnB,GAAegI,MACd5C,EAAAA,IACE,MAAAE,OAAAC,OAAA,CAAAC,UAAU,gEACVY,QAAUC,IACRA,EAAEC,iBACFrB,IAAa,GACd,CAAAW,SAEDR,EAAAA,IAAC4D,EAAI,CAACC,KAAK,QAAQzD,UAAU,qCAGjCJ,EAAC6C,IAAAe,GACCC,KAAMP,EAAO,YAAc,cAC3BlD,UAAWC,EAAOA,QAChBC,EAAU,QACR,gCACA,GAAG/F,GAAc,2BAEnBL,YAMV8F,EAAAA,IAAC8D,EAAAA,0BACCC,GAAIC,EAAQA,SACZC,MAAM,kCACNC,UAAU,cACVC,QAAQ,uBAERnE,EAAAA,IAACoE,EAAAA,eACClE,OAAAC,OAAA,CAAAC,UAAWC,EAAOA,QAChBC,EAAU,QACR,4GACAtG,EAAkBuG,EAAevG,EAAiB,WAAQsH,GAE5DnH,GAEFyG,MAAO,CACLiB,MAAOc,GAAc9E,QAAcyD,EACnC+C,OAAQ,SACT,CAAA7D,SAGA,EAAG8C,WAEFtE,EAAAA,WAAU,MACHsE,GAAQvG,IAAsBU,GAAU,GAAG,GAC/C,CAAC6F,IAGJtE,EAAAA,WAAU,KACR,GAAIsE,IAASpF,GAAgB,CAE3B,MAAMoG,EAAqB,IAAIhL,EAAUqE,IACzCR,GAAYoH,aAAaD,GACzBnG,IAAkB,GAEdZ,GAAQuE,UACVvE,GAAQuE,QAAQ0C,UAAY,EAE/B,MAAWlB,GAAQpF,IAElBC,IAAkB,EACnB,GACA,CAACmF,IAGFxC,EAAAA,KACG2D,EAAAA,SAAA,CAAAjE,SAAA,CA/LdtF,EAGH8E,EAAK6C,IAAA,MAAA3C,OAAAC,OAAA,CAAAC,UAAU,4CACbU,EACEC,KAAA,MAAAb,OAAAC,OAAA,CAAAC,UAAWC,EAAAA,QACTC,EAAU,QACRD,EAAOA,QACL,uFACAlF,GAEFC,GAA0C,gCAI9C,CAAAoF,SAAA,CAAAR,EAAA6C,IAAA,QAAA,CACE/I,YAAauB,GAAqB,SAClC+E,UAAWC,EAAOA,QAChB,mJACA/E,GAEFoJ,SAAWzD,IACTxD,GAAUwD,EAAE0D,OAAOjL,MAAM,EAE3BkL,UAAY3D,GAAMA,EAAE4D,kBACpBnL,MAAO8D,KAETwC,EAAAA,IAAC4D,GACCC,KAAK,SACLzD,UAAWC,EAAOA,QAAC,gCAAiC9E,YA7BlC,KAgMRyE,EAAA6C,IAAA,MAAA3C,OAAAC,OAAA,CACEC,UAAWC,UACTC,EAAAA,QACE,sBACAC,EAAepG,EAAsB,MACjCoG,EAAepG,EAAsB,MACrCoG,EAAevG,EAAiB,QAGxC4G,MAAO,CAAEiB,MAAOc,GAAc9E,QAAcyD,IAAW,CAAAd,SAEtD1B,GAAWM,OAAS,EACnB0B,EAAAC,KAAA,MAAAb,OAAAC,OAAA,CACE6C,IAAKzF,GACL6C,UAAWC,EAAAA,QACT,4JACAvD,IAEF8D,MAAO,CACLkE,UArbF,MAsbC,CAAAtE,SAAA,CAEA1B,GAAWyE,KAAI,CAACpE,EAAMY,IAAUD,GAAWX,EAAMY,KAEjDxB,IACCyB,EACE6C,IAAA,MAAA3C,OAAAC,OAAA,CAAA6C,IAAK/E,GACLmC,UAAU,yDAET9B,GACC0B,EAAA6C,IAACtB,UAAQ,CACP3H,MAAM,UACNwG,UAAU,0DAGZJ,EAAK6C,IAAA,MAAA,CAAAzC,UAAU,sBAKrB/B,GACF2B,EAAAA,IAAK,MAAAE,OAAAC,OAAA,CAAAC,UAAU,oBACb,CAAAI,SAAAR,EAAAA,IAACuB,EAAQ,QAAA,CACP3H,MAAM,UACNwG,UAAWC,EAAOA,QAChB,wDACAxE,SAKNmE,EAAA6C,IAAA,MAAA3C,OAAAC,OAAA,CAAKC,UAAU,oBACb,CAAAI,SAAAR,EAAA6C,IAACtB,UAAQ,CACP3H,MAAOgC,IAAkB,mBACzBwE,UAAWC,EAAAA,QACT,4CACAxE,YAMTL,GACCwE,EAAAA,IAAC+E,EAAU,QAAA,CACT/I,QAAQ,WACRgF,QAAS,KACPrF,UAAAA,IAAuB,EAEzB/B,MAAO8B,GAAqB,gBAC5B0E,UAAWC,EAAAA,QAAQ,GAAI5E,sBAWxCT,IAAkBH,GACjBmF,EAAC6C,IAAAtB,EAAQ,SACP3H,MAAOoB,EACPoF,UAAWC,EAAAA,QACT,6DACApF,KAKLJ,KAAaC,GACZkF,EAAAA,IAACuB,EAAQ,QAAA,CACP3H,MAAOkB,EACPsF,UAAWC,UACT,8DACAtF,WAOd"}
+{"version":3,"file":"InfiniteCheckPicker.js","sources":["../../../../src/components/CheckPicker/InfiniteCheckPicker.tsx"],"sourcesContent":["import {\n  Listbox,\n  ListboxButton,\n  ListboxOption,\n  ListboxOptions,\n  Transition\n} from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport classNames from 'classnames';\nimport { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useQueryClient } from 'react-query';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useDebounce } from '../../hooks/useDebounce';\nimport { useInfinitePicker } from '../../hooks/useInfinitePicker';\nimport extractClasses from '../../utils/extractClasses';\nimport { BaseBadgeRequired } from '../Badge';\nimport { BaseButton } from '../Button';\nimport { Checkbox } from '../Checkbox';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n  BaseInfiniteCheckPickerDataInterface,\n  BaseInfiniteCheckPickerInterface\n} from './BaseInfiniteCheckPicker.type';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteCheckPicker<T = any>({\n  fetchFn,\n  queryKey,\n  debounceMs = 300,\n  disabled = false,\n  pageSize = 100,\n  value,\n  valueStyles,\n  label,\n  labelStyles,\n  placeholder,\n  placeholderStyles,\n  containerStyles,\n  activeContainerStyles,\n  iconStyles,\n  itemsContainerStyles,\n  itemContainerStyles,\n  oddBgColor,\n  evenBgColor,\n  isDisabled = false,\n  position = 'bottom-start',\n  isAutoFlip,\n  onSelectItem,\n  onClean,\n  isCleanable,\n  isError,\n  errorMessage,\n  errorMessageStyles,\n  helperMessage,\n  helperMessageStyles,\n  isSearchable,\n  searchContainerStyles,\n  activeSearchStyles,\n  searchPlaceholder,\n  searchStyles,\n  iconSearchStyles,\n  isShowFooterButton,\n  footerButtonContainerStyles,\n  footerButtonLabel,\n  onClickFooterButton,\n  noResultsLabel,\n  noResultsLabelStyles,\n  badgeContainerStyles,\n  badgeLabelStyles,\n  variant = 'box',\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  data: _data, // Keep for backward compatibility but don't use (using dataInfinite instead)\n  isRequired,\n  labelRequired,\n  labelRequiredStyles,\n  containerRequiredStyles,\n  onSearch,\n  selectedAllText,\n  isShowSelectedAllText = true,\n  isShowUnmatchItem = true,\n  selectedAllTextStyles,\n  activeCheckboxColor,\n  itemTextStyles,\n  listContainerStyles,\n  isClearSearchOnClose,\n  selectedItemTextStyles,\n  activeItemTextStyles,\n  maxSelected\n}: BaseInfiniteCheckPickerInterface<T>) {\n  const defaultScrollbarStyles =\n    'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n  const queryClient = useQueryClient();\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n\n  const [search, setSearch] = useState<string>('');\n  const debouncedQuery = useDebounce(search, debounceMs);\n  const [buttonWidth, setButtonWidth] = useState<number>(0);\n  const [isDisableSelected, setIsDisableSelected] = useState<boolean>(false);\n\n  const sentinelRef = useRef<HTMLDivElement>(null);\n  const [isDropdownOpen, setIsDropdownOpen] = useState<boolean>(false);\n  const {\n    data: dataInfinite,\n    isLoading,\n    isFetchingNextPage,\n    hasNextPage,\n    fetchNextPage,\n    totalCount\n  } = useInfinitePicker({\n    fetchFn,\n    queryKey,\n    search: debouncedQuery,\n    pageSize,\n    enabled: !disabled\n  });\n\n  // eslint-disable-next-line no-console\n  console.log('dataInfinite length', totalCount);\n\n  const dataPicker: Array<BaseInfiniteCheckPickerDataInterface> = useMemo(() => {\n    // Use dataInfinite from the hook instead of static data prop\n    // Type assertion is safe here as the API should return the correct format\n    return (dataInfinite || []) as Array<BaseInfiniteCheckPickerDataInterface>;\n  }, [dataInfinite]);\n\n  const maxDropdownHeight = 320; // Maximum height for the dropdown list\n\n  useEffect(() => {\n    const filteredValue = value?.filter((item) => item);\n    if (filteredValue?.length >= maxSelected) {\n      setIsDisableSelected(true);\n    } else {\n      setIsDisableSelected(false);\n    }\n  }, [value, maxSelected]);\n\n  const handleItemClick = useCallback(\n    (itemValue: string, isSelected: boolean) => {\n      if (isDisableSelected && !isSelected) return;\n\n      let temp = value.slice();\n      if (isSelected) {\n        temp = temp.filter((i) => i !== itemValue);\n      } else {\n        temp = temp.concat(itemValue);\n      }\n\n      onSelectItem?.(temp.filter((i) => i !== ''));\n\n      if (temp.length === maxSelected) {\n        setIsDisableSelected(true);\n      } else {\n        setIsDisableSelected(false);\n      }\n    },\n    [isDisableSelected, value, onSelectItem, maxSelected]\n  );\n\n  const handleClean = useCallback(() => {\n    onSelectItem?.([]);\n    setSearch('');\n    setIsDisableSelected(false);\n    onClean?.();\n  }, [onSelectItem, onClean]);\n\n  // eslint-disable-next-line sonarjs/cognitive-complexity\n  const renderItem = (item: BaseInfiniteCheckPickerDataInterface, index: number) => {\n    return (\n      <ListboxOption\n        key={`${item.value}-${index}`}\n        className={twMerge(\n          classNames(\n            'relative cursor-default select-none list-none',\n            extractClasses(itemContainerStyles, 'p-'),\n            extractClasses(itemContainerStyles, 'px-'),\n            extractClasses(itemContainerStyles, 'py-')\n          )\n        )}\n        value={item}\n      >\n        {({ active }) => {\n          const selected = value.some((i) => i === item.value);\n          return (\n            <div\n              className={twMerge(\n                classNames(\n                  'w-full flex items-center !min-h-[32px] p-2',\n                  itemContainerStyles,\n                  (!!extractClasses(itemContainerStyles, 'p-') ||\n                    !!extractClasses(itemContainerStyles, 'px-') ||\n                    !!extractClasses(itemContainerStyles, 'py-')) &&\n                    'p-2'\n                )\n              )}\n              style={{\n                backgroundColor:\n                  index % 2 === 0\n                    ? oddBgColor || 'var(--dropdownList-background-odd)'\n                    : evenBgColor || 'var(--dropdownList-background-even)'\n              }}\n            >\n              <div\n                className={twMerge(\n                  'flex flex-row items-center gap-x-2 cursor-pointer w-full',\n                  isDisableSelected && !selected ? 'cursor-not-allowed' : ''\n                )}\n                onClick={(e) => {\n                  e.preventDefault();\n                  handleItemClick(item.value, selected);\n                }}\n              >\n                <Checkbox\n                  checked={selected}\n                  variant='small'\n                  color={activeCheckboxColor || undefined}\n                  isDisabled={isDisableSelected && !selected}\n                />\n\n                <div className='flex flex-1'>\n                  <BaseText\n                    label={item.label}\n                    className={twMerge(\n                      classNames(\n                        'text-xs text-dropdownList-text-default leading-[14px]',\n                        `${\n                          active && !isDisableSelected\n                            ? twMerge(\n                                'font-semibold text-dropdownList-text-hover',\n                                activeItemTextStyles\n                              )\n                            : 'font-normal'\n                        }`\n                      ),\n                      selected && selectedItemTextStyles,\n                      itemTextStyles\n                    )}\n                  />\n                </div>\n              </div>\n            </div>\n          );\n        }}\n      </ListboxOption>\n    );\n  };\n\n  useEffect(() => {\n    if (onSearch) onSearch(search);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [search]);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setButtonWidth(entry.contentRect.width);\n      }\n    });\n\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current);\n    }\n\n    return () => {\n      if (containerRef.current) {\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        resizeObserver.unobserve(containerRef.current);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    const sentinel = sentinelRef.current;\n    const scrollContainer = listRef.current;\n\n    if (!sentinel || !scrollContainer || !hasNextPage || isFetchingNextPage) {\n      return;\n    }\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        if (entries[0]?.isIntersecting && hasNextPage && !isFetchingNextPage) {\n          fetchNextPage();\n        }\n      },\n      {\n        root: scrollContainer,\n        rootMargin: '50px',\n        threshold: 0.1\n      }\n    );\n\n    observer.observe(sentinel);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [hasNextPage, isFetchingNextPage, fetchNextPage, dataPicker.length]);\n\n  const isWidthFull =\n    !extractClasses(containerStyles, 'w-') ||\n    extractClasses(containerStyles, 'w-') === 'w-full' ||\n    !extractClasses(itemsContainerStyles, 'w-') ||\n    extractClasses(itemsContainerStyles, 'w-') === 'w-full';\n\n  // Helper function to check if value array has actual selections\n  const hasSelectedValues = () => {\n    return value && value.length > 0 && !(value.length === 1 && value[0] === '');\n  };\n\n  const renderSelectedValue = () => {\n    if (!hasSelectedValues()) return null;\n\n    return (\n      <div className='flex flex-1 w-[calc(100%-52px)]'>\n        {value.length === totalCount && isShowSelectedAllText ? (\n          <BaseText\n            label={selectedAllText || 'All'}\n            variant='small'\n            className={twMerge(\n              classNames(\n                'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n              ),\n              selectedAllTextStyles\n            )}\n          />\n        ) : (\n          <BaseText\n            label={\n              isShowUnmatchItem\n                ? value\n                    .map((i) => dataPicker.find((item) => item.value === i)?.label || i)\n                    .join(', ')\n                : dataPicker\n                    .filter((i: BaseInfiniteCheckPickerDataInterface) => value.includes(i.value))\n                    .map((i) => i.label || i)\n                    .join(', ')\n            }\n            variant='small'\n            className={twMerge(\n              classNames(\n                'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n              ),\n              valueStyles\n            )}\n          />\n        )}\n      </div>\n    );\n  };\n\n  const renderSearchSection = () => {\n    if (!isSearchable) return null;\n\n    return (\n      <div className='p-2 bg-light-whiteSolid w-full'>\n        <div\n          className={twMerge(\n            classNames(\n              twMerge(\n                'flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1',\n                searchContainerStyles\n              ),\n              activeSearchStyles ? activeSearchStyles : 'border-fields-border-focus'\n            )\n          )}\n        >\n          <input\n            placeholder={searchPlaceholder || 'Search'}\n            className={twMerge(\n              'flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs',\n              searchStyles\n            )}\n            onChange={(e) => {\n              setSearch(e.target.value);\n            }}\n            onKeyDown={(e) => e.stopPropagation()}\n            value={search}\n          />\n          <Icon\n            name='search'\n            className={twMerge('fill-dark-bermudaGray w-3 h-3', iconSearchStyles)}\n          />\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <Listbox multiple>\n      <div ref={containerRef} className='flex flex-col gap-y-1'>\n        <div className='flex flex-row items-end gap-x-1'>\n          {!!label && (\n            <BaseText\n              label={label}\n              className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n            />\n          )}\n          {isRequired && (\n            <BaseBadgeRequired\n              labelRequired={labelRequired}\n              labelRequiredStyles={labelRequiredStyles}\n              containerRequiredStyles={containerRequiredStyles}\n            />\n          )}\n        </div>\n        <div className='relative inline-block'>\n          <Float placement={position} flip={isAutoFlip}>\n            <ListboxButton\n              className={twMerge(\n                classNames('p-0 bg-transparent', isDisabled && 'cursor-not-allowed'),\n                containerRequiredStyles ? extractClasses(containerStyles, 'w-') : undefined\n              )}\n              onClick={(e) => {\n                if (isDisabled) {\n                  e.preventDefault();\n                }\n              }}\n            >\n              {({ open }) => (\n                <div\n                  className={twMerge(\n                    classNames(\n                      twMerge(\n                        'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid',\n                        containerStyles\n                      ),\n                      variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n                      open && activeContainerStyles\n                        ? activeContainerStyles\n                        : open\n                        ? 'border-fields-border-focus'\n                        : undefined,\n                      isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n                      isError && 'border-red-fireEngineRed'\n                    )\n                  )}\n                >\n                  <div className='flex flex-1'>\n                    {!!placeholder && !hasSelectedValues() && (\n                      <div className='flex flex-1 w-full'>\n                        <BaseText\n                          label={placeholder}\n                          variant='small'\n                          className={twMerge(\n                            classNames(\n                              'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n                            ),\n                            placeholderStyles\n                          )}\n                        />\n                      </div>\n                    )}\n\n                    {renderSelectedValue()}\n                  </div>\n\n                  {hasSelectedValues() && (\n                    <div\n                      className={twMerge(\n                        'flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]',\n                        badgeContainerStyles\n                      )}\n                    >\n                      <BaseText\n                        label={value.length.toString()}\n                        className={twMerge(\n                          classNames('font-normal text-[8px] leading-3'),\n                          badgeLabelStyles\n                        )}\n                      />\n                    </div>\n                  )}\n\n                  {isCleanable && hasSelectedValues() && (\n                    <div\n                      className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-1'\n                      onClick={(e) => {\n                        e.preventDefault();\n                        handleClean();\n                      }}\n                    >\n                      <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n                    </div>\n                  )}\n                  <Icon\n                    name={open ? 'chevronup' : 'chevrondown'}\n                    className={twMerge(\n                      classNames(\n                        'fill-dark-bermudaGray w-3 h-3',\n                        `${isDisabled && 'fill-dark-bermudaGray'}`\n                      ),\n                      iconStyles\n                    )}\n                  />\n                </div>\n              )}\n            </ListboxButton>\n            <Transition\n              as={Fragment}\n              leave='transition ease-in duration-100'\n              leaveFrom='opacity-100'\n              leaveTo='opacity-0'\n            >\n              <ListboxOptions\n                className={twMerge(\n                  classNames(\n                    'rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{\n                  width: isWidthFull ? buttonWidth : undefined,\n                  height: 'auto'\n                }}\n              >\n                {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n                {({ open }) => {\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (!open && isClearSearchOnClose) setSearch('');\n                  }, [open]);\n\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (open && !isDropdownOpen) {\n                      // Dropdown just opened - reset infinite scroll data to start fresh\n                      const queryKeyWithSearch = [...queryKey, debouncedQuery];\n                      queryClient.resetQueries(queryKeyWithSearch);\n                      setIsDropdownOpen(true);\n                      // Reset scroll position to top\n                      if (listRef.current) {\n                        listRef.current.scrollTop = 0;\n                      }\n                    } else if (!open && isDropdownOpen) {\n                      // Dropdown just closed\n                      setIsDropdownOpen(false);\n                    }\n                  }, [open]);\n\n                  return (\n                    <>\n                      {renderSearchSection()}\n                      <div\n                        className={twMerge(\n                          classNames(\n                            'p-0 overflow-hidden',\n                            extractClasses(itemsContainerStyles, 'w-')\n                              ? extractClasses(itemsContainerStyles, 'w-')\n                              : extractClasses(containerStyles, 'w-')\n                          )\n                        )}\n                        style={{ width: isWidthFull ? buttonWidth : undefined }}\n                      >\n                        {dataPicker.length > 0 ? (\n                          <div\n                            ref={listRef}\n                            className={twMerge(\n                              `max-h-80 overflow-y-auto ${defaultScrollbarStyles}`,\n                              listContainerStyles\n                            )}\n                            style={{\n                              maxHeight: maxDropdownHeight\n                            }}\n                          >\n                            {dataPicker.map((item, index) => renderItem(item, index))}\n                            {/* Infinite loading sentinel */}\n                            {hasNextPage && (\n                              <div\n                                ref={sentinelRef}\n                                className='w-full h-8 flex items-center justify-center'\n                              >\n                                {isFetchingNextPage ? (\n                                  <BaseText\n                                    label='Loading'\n                                    className='text-dark-bermudaGray font-normal text-xs text-center'\n                                  />\n                                ) : (\n                                  <div className='w-full h-1' />\n                                )}\n                              </div>\n                            )}\n                          </div>\n                        ) : isLoading ? (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label='Loading'\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm text-center',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        ) : (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label={noResultsLabel || 'No Results Found'}\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        )}\n                      </div>\n                      {isShowFooterButton && (\n                        <BaseButton\n                          variant='tertiary'\n                          onClick={() => {\n                            onClickFooterButton?.();\n                          }}\n                          label={footerButtonLabel || 'Footer Button'}\n                          className={twMerge('', footerButtonContainerStyles)}\n                        />\n                      )}\n                    </>\n                  );\n                }}\n              </ListboxOptions>\n            </Transition>\n          </Float>\n        </div>\n\n        {helperMessage && !isError && (\n          <BaseText\n            label={helperMessage}\n            className={twMerge(\n              'font-normal text-dark-bermudaGray text-[10px] inline-block',\n              helperMessageStyles\n            )}\n          />\n        )}\n\n        {isError && !!errorMessage && (\n          <BaseText\n            label={errorMessage}\n            className={twMerge(\n              'font-normal text-red-fireEngineRed text-[10px] inline-block',\n              errorMessageStyles\n            )}\n          />\n        )}\n      </div>\n    </Listbox>\n  );\n}\n\nexport default BaseInfiniteCheckPicker;\n"],"names":["fetchFn","queryKey","debounceMs","disabled","pageSize","value","valueStyles","label","labelStyles","placeholder","placeholderStyles","containerStyles","activeContainerStyles","iconStyles","itemsContainerStyles","itemContainerStyles","oddBgColor","evenBgColor","isDisabled","position","isAutoFlip","onSelectItem","onClean","isCleanable","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isSearchable","searchContainerStyles","activeSearchStyles","searchPlaceholder","searchStyles","iconSearchStyles","isShowFooterButton","footerButtonContainerStyles","footerButtonLabel","onClickFooterButton","noResultsLabel","noResultsLabelStyles","badgeContainerStyles","badgeLabelStyles","variant","data","_data","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","selectedAllText","isShowSelectedAllText","isShowUnmatchItem","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","maxSelected","queryClient","useQueryClient","containerRef","useRef","listRef","search","setSearch","useState","debouncedQuery","useDebounce","buttonWidth","setButtonWidth","isDisableSelected","setIsDisableSelected","sentinelRef","isDropdownOpen","setIsDropdownOpen","dataInfinite","isLoading","isFetchingNextPage","hasNextPage","fetchNextPage","totalCount","useInfinitePicker","enabled","console","log","dataPicker","useMemo","useEffect","filteredValue","filter","item","length","handleItemClick","useCallback","itemValue","isSelected","temp","slice","i","concat","handleClean","renderItem","index","_jsx","ListboxOption","Object","assign","className","twMerge","classNames","extractClasses","children","active","selected","some","style","backgroundColor","_jsxs","jsxs","onClick","e","preventDefault","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","current","observe","unobserve","sentinel","scrollContainer","observer","IntersectionObserver","_a","isIntersecting","root","rootMargin","threshold","disconnect","isWidthFull","hasSelectedValues","jsx","Listbox","multiple","ref","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","find","join","includes","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","height","queryKeyWithSearch","resetQueries","scrollTop","_Fragment","onChange","target","onKeyDown","stopPropagation","maxHeight","BaseButton"],"mappings":"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"}

package/build/src/components/SelectPicker/BaseInfiniteSelectPicker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime");require("../../../node_modules/react-query/es/react/setBatchUpdatesFn.js"),require("../../../node_modules/react-query/es/react/setLogger.js");var t=require("../../../node_modules/react-query/es/react/QueryClientProvider.js"),s=require("./InfiniteSelectPicker.js");const i=new(require("../../../node_modules/react-query/es/core/queryClient.js").QueryClient)({defaultOptions:{queries:{refetchOnWindowFocus:!1}}});module.exports=function(u){var{queryClient:n=i}=u,c=e.__rest(u,["queryClient"]);return r.jsx(t.QueryClientProvider,Object.assign({client:n},{children:r.jsx(s,Object.assign({},c))}))};
+"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),i=require("react-query"),t=require("./InfiniteSelectPicker.js");const n=new i.QueryClient({defaultOptions:{queries:{refetchOnWindowFocus:!1}}});module.exports=function(s){var{queryClient:u=n}=s,c=e.__rest(s,["queryClient"]);return r.jsx(i.QueryClientProvider,Object.assign({client:u},{children:r.jsx(t,Object.assign({},c))}))};
 //# sourceMappingURL=BaseInfiniteSelectPicker.js.map

package/build/src/components/SelectPicker/BaseInfiniteSelectPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseInfiniteSelectPicker.js","sources":["../../../../src/components/SelectPicker/BaseInfiniteSelectPicker.tsx"],"sourcesContent":["import React from 'react';\nimport { QueryClient, QueryClientProvider } from 'react-query';\n\nimport { BaseInfiniteSelectPickerInterface } from './BaseInfiniteSelectPicker.type';\nimport BaseInfiniteSelectPicker from './InfiniteSelectPicker';\n\n// Create a default query client\nconst defaultQueryClient = new QueryClient({\n  defaultOptions: {\n    queries: {\n      refetchOnWindowFocus: false\n    }\n  }\n});\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface BaseInfiniteSelectPickerWithProviderProps<T = any>\n  extends BaseInfiniteSelectPickerInterface<T> {\n  queryClient?: QueryClient;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteSelectPickerWithProvider<T = any>({\n  queryClient = defaultQueryClient,\n  ...props\n}: BaseInfiniteSelectPickerWithProviderProps<T>) {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <BaseInfiniteSelectPicker {...props} />\n    </QueryClientProvider>\n  );\n}\n\nexport default BaseInfiniteSelectPickerWithProvider;\n"],"names":["defaultQueryClient","QueryClient","defaultOptions","queries","refetchOnWindowFocus","_a","queryClient","props","__rest","_jsx","QueryClientProvider","Object","assign","client","children","BaseInfiniteSelectPicker"],"mappings":"iWAOA,MAAMA,EAAqB,wEAAIC,aAAY,CACzCC,eAAgB,CACdC,QAAS,CACPC,sBAAsB,qBAY5B,SAAuDC,OAAAC,YACrDA,EAAcN,GAAkBK,EAC7BE,EAAKC,EAAAA,OAAAH,EAF6C,iBAIrD,OACEI,EAAAA,IAACC,EAAAA,oBAAmBC,OAAAC,OAAA,CAACC,OAAQP,GAC3B,CAAAQ,SAAAL,EAAAA,IAACM,EAA6BJ,OAAAC,OAAA,CAAA,EAAAL,MAGpC"}
+{"version":3,"file":"BaseInfiniteSelectPicker.js","sources":["../../../../src/components/SelectPicker/BaseInfiniteSelectPicker.tsx"],"sourcesContent":["import React from 'react';\nimport { QueryClient, QueryClientProvider } from 'react-query';\n\nimport { BaseInfiniteSelectPickerInterface } from './BaseInfiniteSelectPicker.type';\nimport BaseInfiniteSelectPicker from './InfiniteSelectPicker';\n\n// Create a default query client\nconst defaultQueryClient = new QueryClient({\n  defaultOptions: {\n    queries: {\n      refetchOnWindowFocus: false\n    }\n  }\n});\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ninterface BaseInfiniteSelectPickerWithProviderProps<T = any>\n  extends BaseInfiniteSelectPickerInterface<T> {\n  queryClient?: QueryClient;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteSelectPickerWithProvider<T = any>({\n  queryClient = defaultQueryClient,\n  ...props\n}: BaseInfiniteSelectPickerWithProviderProps<T>) {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <BaseInfiniteSelectPicker {...props} />\n    </QueryClientProvider>\n  );\n}\n\nexport default BaseInfiniteSelectPickerWithProvider;\n"],"names":["defaultQueryClient","QueryClient","defaultOptions","queries","refetchOnWindowFocus","_a","queryClient","props","__rest","_jsx","QueryClientProvider","Object","assign","client","children","BaseInfiniteSelectPicker"],"mappings":"yJAOA,MAAMA,EAAqB,IAAIC,EAAAA,YAAY,CACzCC,eAAgB,CACdC,QAAS,CACPC,sBAAsB,qBAY5B,SAAuDC,OAAAC,YACrDA,EAAcN,GAAkBK,EAC7BE,EAAKC,EAAAA,OAAAH,EAF6C,iBAIrD,OACEI,EAAAA,IAACC,EAAAA,oBAAmBC,OAAAC,OAAA,CAACC,OAAQP,GAC3B,CAAAQ,SAAAL,EAAAA,IAACM,EAA6BJ,OAAAC,OAAA,CAAA,EAAAL,MAGpC"}

package/build/src/components/SelectPicker/InfiniteSelectPicker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),r=require("../../../node_modules/classnames/index.js"),s=require("react");require("../../../node_modules/react-query/es/react/setBatchUpdatesFn.js"),require("../../../node_modules/react-query/es/react/setLogger.js");var l=require("../../../node_modules/react-query/es/react/QueryClientProvider.js"),a=require("../../hooks/useDebounce.js"),n=require("../../hooks/useInfinitePicker.js"),o=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var i=require("../Text/BaseText.js");require("../Text/Text.js");var d=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var u=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js");var c=require("../Icon/Icon.js"),x=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),f=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=function({fetchFn:m,queryKey:g,debounceMs:j=300,disabled:h=!1,pageSize:p=100,label:v,labelStyles:w,value:y,valueStyles:k,placeholder:q,placeholderStyles:N,containerStyles:S,activeContainerStyles:B,iconStyles:M,itemsContainerStyles:C,itemContainerStyles:O,oddBgColor:R,evenBgColor:L,isDisabled:F=!1,position:G="bottom-start",isAutoFlip:_,onSelectItem:I,onClean:T,isCleanable:E,isError:P,errorMessage:D,errorMessageStyles:z,helperMessage:$,helperMessageStyles:K,isSearchable:Q,searchContainerStyles:H,activeSearchStyles:A,searchPlaceholder:U,searchStyles:J,iconSearchStyles:V,isShowFooterButton:W,footerButtonContainerStyles:X,footerButtonLabel:Y,onClickFooterButton:Z,noResultsLabel:ee,noResultsLabelStyles:te,variant:re="box",data:se,isRequired:le,labelRequired:ae,labelRequiredStyles:ne,containerRequiredStyles:oe,onSearch:ie,itemTextStyles:de,listContainerStyles:ue,isClearSearchOnClose:ce,activeItemTextStyles:xe}){const be=l.useQueryClient(),fe=s.useRef(null),me=s.useRef(null),[ge,je]=s.useState(""),he=a.useDebounce(ge,j),[pe,ve]=s.useState(0),we=s.useRef(null),[ye,ke]=s.useState(!1),{data:qe,isLoading:Ne,isFetchingNextPage:Se,hasNextPage:Be,fetchNextPage:Me}=n.useInfinitePicker({fetchFn:m,queryKey:g,search:he,pageSize:p,enabled:!h}),Ce=s.useMemo((()=>qe||[]),[qe]),Oe=(t,s)=>e.jsx(b.ListboxOption,Object.assign({className:x.twMerge(r.default("relative cursor-default select-none list-none",o(O,"p-"),o(O,"px-"),o(O,"py-"))),value:t},{children:({active:l})=>e.jsx("div",Object.assign({className:x.twMerge(r.default("w-full flex items-center !min-h-[32px] p-2 cursor-pointer",O,(!!o(O,"p-")||!!o(O,"px-")||!!o(O,"py-"))&&"p-2")),style:{backgroundColor:s%2==0?R||"var(--dropdownList-background-odd)":L||"var(--dropdownList-background-even)"},onClick:e=>{e.preventDefault(),null==I||I(t)}},{children:e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(i.default,{label:t.label,className:x.twMerge(r.default("text-xs text-dropdownList-text-default leading-[14px]",`${l?x.twMerge("font-semibold text-dropdownList-text-hover",xe):"font-normal"}`),de)})}))}))}),`${t.value}-${s}`);s.useEffect((()=>{ie&&ie(ge)}),[ge]),s.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)ve(t.contentRect.width)}));return fe.current&&e.observe(fe.current),()=>{fe.current&&e.unobserve(fe.current)}}),[]),s.useEffect((()=>{const e=we.current,t=me.current;if(!e||!t||!Be||Se)return;const r=new IntersectionObserver((e=>{var t;(null===(t=e[0])||void 0===t?void 0:t.isIntersecting)&&Be&&!Se&&Me()}),{root:t,rootMargin:"50px",threshold:.1});return r.observe(e),()=>{r.disconnect()}}),[Be,Se,Me,Ce.length]);const Re=!o(S,"w-")||"w-full"===o(S,"w-")||!o(C,"w-")||"w-full"===o(C,"w-");return e.jsx(b.Listbox,{children:e.jsxs("div",Object.assign({ref:fe,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!v&&e.jsx(i.default,{label:v,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",w)}),le&&e.jsx(d,{labelRequired:ae,labelRequiredStyles:ne,containerRequiredStyles:oe})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:G,flip:_},{children:[e.jsx(b.ListboxButton,Object.assign({className:x.twMerge(r.default("p-0 bg-transparent",F&&"cursor-not-allowed"),S?o(S,"w-"):void 0),onClick:e=>{F&&e.preventDefault()}},{children:({open:t})=>{var s;return e.jsxs("div",Object.assign({className:x.twMerge(r.default(x.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",S),"line"===re&&"border-b border-t-0 border-x-0 rounded-none",t&&B?B:t?"border-fields-border-focus":void 0,F&&"border-dark-bermudaGray bg-light-whiteSmoke",P&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!q&&!y&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(i.default,{label:q,variant:"small",className:x.twMerge(r.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),N)})})),!!y&&e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:e.jsx(i.default,{label:(null===(s=Ce.find((e=>e.value===y)))||void 0===s?void 0:s.label)||y,variant:"small",className:x.twMerge(r.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),k)})}))]})),E&&!!y&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),null==I||I({value:"",label:""}),je(""),null==T||T()}},{children:e.jsx(c,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(c,{name:t?"chevronup":"chevrondown",className:x.twMerge(r.default("fill-dark-bermudaGray w-3 h-3",`${F&&"fill-dark-bermudaGray"}`),M)})]}))}})),e.jsx(f.Transition,Object.assign({as:s.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(b.ListboxOptions,Object.assign({className:x.twMerge(r.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50",S?o(S,"w-"):void 0),C),style:{width:Re?pe:void 0,height:"auto"}},{children:({open:t})=>(s.useEffect((()=>{!t&&ce&&je("")}),[t]),s.useEffect((()=>{if(t&&!ye){const e=[...g,he];be.resetQueries(e),ke(!0),me.current&&(me.current.scrollTop=0)}else!t&&ye&&ke(!1)}),[t]),e.jsxs(e.Fragment,{children:[Q?e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:x.twMerge(r.default(x.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",H),A||"border-fields-border-focus"))},{children:[e.jsx("input",{placeholder:U||"Search",className:x.twMerge("flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs",J),onChange:e=>{je(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:ge}),e.jsx(c,{name:"search",className:x.twMerge("fill-dark-bermudaGray w-3 h-3",V)})]}))})):null,e.jsx("div",Object.assign({className:x.twMerge(r.default("p-0 overflow-hidden",o(C,"w-")?o(C,"w-"):o(S,"w-"))),style:{width:Re?pe:void 0}},{children:Ce.length>0?e.jsxs("div",Object.assign({ref:me,className:x.twMerge("max-h-80 overflow-y-auto scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",ue),style:{maxHeight:320}},{children:[Ce.map(((e,t)=>Oe(e,t))),Be&&e.jsx("div",Object.assign({ref:we,className:"w-full h-8 flex items-center justify-center"},{children:Se?e.jsx(i.default,{label:"Loading",className:"text-dark-bermudaGray font-normal text-xs text-center w-full"}):e.jsx("div",{className:"w-full h-1"})}))]})):Ne?e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(i.default,{label:"Loading",className:x.twMerge("text-dark-bermudaGray font-normal text-sm text-center",te)})})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(i.default,{label:ee||"No Results Found",className:x.twMerge("text-dark-bermudaGray font-normal text-sm",te)})}))})),W&&e.jsx(u.default,{variant:"tertiary",onClick:()=>{null==Z||Z()},label:Y||"Footer Button",className:x.twMerge("",X)})]}))}))}))]}))})),$&&!P&&e.jsx(i.default,{label:$,className:x.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",K)}),P&&!!D&&e.jsx(i.default,{label:D,className:x.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",z)})]}))})};
+"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),r=require("../../../node_modules/classnames/index.js"),s=require("react"),l=require("react-query"),a=require("../../hooks/useDebounce.js"),n=require("../../hooks/useInfinitePicker.js"),i=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var o=require("../Text/BaseText.js");require("../Text/Text.js");var d=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var c=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js");var u=require("../Icon/Icon.js"),x=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),f=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=function({fetchFn:m,queryKey:g,debounceMs:j=300,disabled:h=!1,pageSize:p=100,label:v,labelStyles:w,value:y,valueStyles:k,placeholder:N,placeholderStyles:S,containerStyles:q,activeContainerStyles:B,iconStyles:M,itemsContainerStyles:O,itemContainerStyles:C,oddBgColor:R,evenBgColor:L,isDisabled:F=!1,position:G="bottom-start",isAutoFlip:I,onSelectItem:T,onClean:E,isCleanable:D,isError:P,errorMessage:_,errorMessageStyles:z,helperMessage:$,helperMessageStyles:K,isSearchable:H,searchContainerStyles:Q,activeSearchStyles:A,searchPlaceholder:J,searchStyles:U,iconSearchStyles:V,isShowFooterButton:W,footerButtonContainerStyles:X,footerButtonLabel:Y,onClickFooterButton:Z,noResultsLabel:ee,noResultsLabelStyles:te,variant:re="box",data:se,isRequired:le,labelRequired:ae,labelRequiredStyles:ne,containerRequiredStyles:ie,onSearch:oe,itemTextStyles:de,listContainerStyles:ce,isClearSearchOnClose:ue,activeItemTextStyles:xe}){const be=l.useQueryClient(),fe=s.useRef(null),me=s.useRef(null),[ge,je]=s.useState(""),he=a.useDebounce(ge,j),[pe,ve]=s.useState(0),we=s.useRef(null),[ye,ke]=s.useState(!1),{data:Ne,isLoading:Se,isFetchingNextPage:qe,hasNextPage:Be,fetchNextPage:Me}=n.useInfinitePicker({fetchFn:m,queryKey:g,search:he,pageSize:p,enabled:!h}),Oe=s.useMemo((()=>Ne||[]),[Ne]),Ce=(t,s)=>e.jsx(b.ListboxOption,Object.assign({className:x.twMerge(r.default("relative cursor-default select-none list-none",i(C,"p-"),i(C,"px-"),i(C,"py-"))),value:t},{children:({active:l})=>e.jsx("div",Object.assign({className:x.twMerge(r.default("w-full flex items-center !min-h-[32px] p-2 cursor-pointer",C,(!!i(C,"p-")||!!i(C,"px-")||!!i(C,"py-"))&&"p-2")),style:{backgroundColor:s%2==0?R||"var(--dropdownList-background-odd)":L||"var(--dropdownList-background-even)"},onClick:e=>{e.preventDefault(),null==T||T(t)}},{children:e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(o.default,{label:t.label,className:x.twMerge(r.default("text-xs text-dropdownList-text-default leading-[14px]",`${l?x.twMerge("font-semibold text-dropdownList-text-hover",xe):"font-normal"}`),de)})}))}))}),`${t.value}-${s}`);s.useEffect((()=>{oe&&oe(ge)}),[ge]),s.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)ve(t.contentRect.width)}));return fe.current&&e.observe(fe.current),()=>{fe.current&&e.unobserve(fe.current)}}),[]),s.useEffect((()=>{const e=we.current,t=me.current;if(!e||!t||!Be||qe)return;const r=new IntersectionObserver((e=>{var t;(null===(t=e[0])||void 0===t?void 0:t.isIntersecting)&&Be&&!qe&&Me()}),{root:t,rootMargin:"50px",threshold:.1});return r.observe(e),()=>{r.disconnect()}}),[Be,qe,Me,Oe.length]);const Re=!i(q,"w-")||"w-full"===i(q,"w-")||!i(O,"w-")||"w-full"===i(O,"w-");return e.jsx(b.Listbox,{children:e.jsxs("div",Object.assign({ref:fe,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!v&&e.jsx(o.default,{label:v,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",w)}),le&&e.jsx(d,{labelRequired:ae,labelRequiredStyles:ne,containerRequiredStyles:ie})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:G,flip:I},{children:[e.jsx(b.ListboxButton,Object.assign({className:x.twMerge(r.default("p-0 bg-transparent",F&&"cursor-not-allowed"),q?i(q,"w-"):void 0),onClick:e=>{F&&e.preventDefault()}},{children:({open:t})=>{var s;return e.jsxs("div",Object.assign({className:x.twMerge(r.default(x.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",q),"line"===re&&"border-b border-t-0 border-x-0 rounded-none",t&&B?B:t?"border-fields-border-focus":void 0,F&&"border-dark-bermudaGray bg-light-whiteSmoke",P&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!N&&!y&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(o.default,{label:N,variant:"small",className:x.twMerge(r.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),S)})})),!!y&&e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:e.jsx(o.default,{label:(null===(s=Oe.find((e=>e.value===y)))||void 0===s?void 0:s.label)||y,variant:"small",className:x.twMerge(r.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),k)})}))]})),D&&!!y&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),null==T||T({value:"",label:""}),je(""),null==E||E()}},{children:e.jsx(u,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(u,{name:t?"chevronup":"chevrondown",className:x.twMerge(r.default("fill-dark-bermudaGray w-3 h-3",`${F&&"fill-dark-bermudaGray"}`),M)})]}))}})),e.jsx(f.Transition,Object.assign({as:s.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(b.ListboxOptions,Object.assign({className:x.twMerge(r.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50",q?i(q,"w-"):void 0),O),style:{width:Re?pe:void 0,height:"auto"}},{children:({open:t})=>(s.useEffect((()=>{!t&&ue&&je("")}),[t]),s.useEffect((()=>{if(t&&!ye){const e=[...g,he];be.resetQueries(e),ke(!0),me.current&&(me.current.scrollTop=0)}else!t&&ye&&ke(!1)}),[t]),e.jsxs(e.Fragment,{children:[H?e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:x.twMerge(r.default(x.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",Q),A||"border-fields-border-focus"))},{children:[e.jsx("input",{placeholder:J||"Search",className:x.twMerge("flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs",U),onChange:e=>{je(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:ge}),e.jsx(u,{name:"search",className:x.twMerge("fill-dark-bermudaGray w-3 h-3",V)})]}))})):null,e.jsx("div",Object.assign({className:x.twMerge(r.default("p-0 overflow-hidden",i(O,"w-")?i(O,"w-"):i(q,"w-"))),style:{width:Re?pe:void 0}},{children:Oe.length>0?e.jsxs("div",Object.assign({ref:me,className:x.twMerge("max-h-80 overflow-y-auto scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",ce),style:{maxHeight:320}},{children:[Oe.map(((e,t)=>Ce(e,t))),Be&&e.jsx("div",Object.assign({ref:we,className:"w-full h-8 flex items-center justify-center"},{children:qe?e.jsx(o.default,{label:"Loading",className:"text-dark-bermudaGray font-normal text-xs text-center w-full"}):e.jsx("div",{className:"w-full h-1"})}))]})):Se?e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(o.default,{label:"Loading",className:x.twMerge("text-dark-bermudaGray font-normal text-sm text-center",te)})})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(o.default,{label:ee||"No Results Found",className:x.twMerge("text-dark-bermudaGray font-normal text-sm",te)})}))})),W&&e.jsx(c.default,{variant:"tertiary",onClick:()=>{null==Z||Z()},label:Y||"Footer Button",className:x.twMerge("",X)})]}))}))}))]}))})),$&&!P&&e.jsx(o.default,{label:$,className:x.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",K)}),P&&!!_&&e.jsx(o.default,{label:_,className:x.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",z)})]}))})};
 //# sourceMappingURL=InfiniteSelectPicker.js.map

package/build/src/components/SelectPicker/InfiniteSelectPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"InfiniteSelectPicker.js","sources":["../../../../src/components/SelectPicker/InfiniteSelectPicker.tsx"],"sourcesContent":["import {\n  Listbox,\n  ListboxButton,\n  ListboxOption,\n  ListboxOptions,\n  Transition\n} from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport classNames from 'classnames';\nimport { Fragment, useEffect, useMemo, useRef, useState } from 'react';\nimport { useQueryClient } from 'react-query';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useDebounce } from '../../hooks/useDebounce';\nimport { useInfinitePicker } from '../../hooks/useInfinitePicker';\nimport extractClasses from '../../utils/extractClasses';\nimport { BaseBadgeRequired } from '../Badge';\nimport { BaseButton } from '../Button';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n  BaseInfiniteSelectPickerDataInterface,\n  BaseInfiniteSelectPickerInterface\n} from './BaseInfiniteSelectPicker.type';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteSelectPicker<T = any>({\n  fetchFn,\n  queryKey,\n  debounceMs = 300,\n  disabled = false,\n  pageSize = 100,\n  label,\n  labelStyles,\n  value,\n  valueStyles,\n  placeholder,\n  placeholderStyles,\n  containerStyles,\n  activeContainerStyles,\n  iconStyles,\n  itemsContainerStyles,\n  itemContainerStyles,\n  oddBgColor,\n  evenBgColor,\n  isDisabled = false,\n  position = 'bottom-start',\n  isAutoFlip,\n  onSelectItem,\n  onClean,\n  isCleanable,\n  isError,\n  errorMessage,\n  errorMessageStyles,\n  helperMessage,\n  helperMessageStyles,\n  isSearchable,\n  searchContainerStyles,\n  activeSearchStyles,\n  searchPlaceholder,\n  searchStyles,\n  iconSearchStyles,\n  isShowFooterButton,\n  footerButtonContainerStyles,\n  footerButtonLabel,\n  onClickFooterButton,\n  noResultsLabel,\n  noResultsLabelStyles,\n  variant = 'box',\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  data: _data, // Keep for backward compatibility but don't use (using dataInfinite instead)\n  isRequired,\n  labelRequired,\n  labelRequiredStyles,\n  containerRequiredStyles,\n  onSearch,\n  itemTextStyles,\n  listContainerStyles,\n  isClearSearchOnClose,\n  activeItemTextStyles\n}: BaseInfiniteSelectPickerInterface<T>) {\n  const defaultScrollbarStyles =\n    'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n  const queryClient = useQueryClient();\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n\n  const [search, setSearch] = useState<string>('');\n  const debouncedQuery = useDebounce(search, debounceMs);\n  const [buttonWidth, setButtonWidth] = useState<number>(0);\n\n  const sentinelRef = useRef<HTMLDivElement>(null);\n  const [isDropdownOpen, setIsDropdownOpen] = useState<boolean>(false);\n  const {\n    data: dataInfinite,\n    isLoading,\n    isFetchingNextPage,\n    hasNextPage,\n    fetchNextPage\n  } = useInfinitePicker({\n    fetchFn,\n    queryKey,\n    search: debouncedQuery,\n    pageSize,\n    enabled: !disabled\n  });\n\n  const dataPicker: Array<BaseInfiniteSelectPickerDataInterface> = useMemo(() => {\n    // Use dataInfinite from the hook instead of static data prop\n    // Type assertion is safe here as the API should return the correct format\n    return (dataInfinite || []) as Array<BaseInfiniteSelectPickerDataInterface>;\n  }, [dataInfinite]);\n\n  const maxDropdownHeight = 320; // Maximum height for the dropdown list\n\n  // eslint-disable-next-line sonarjs/cognitive-complexity\n  const renderItem = (item: BaseInfiniteSelectPickerDataInterface, index: number) => {\n    return (\n      <ListboxOption\n        key={`${item.value}-${index}`}\n        className={twMerge(\n          classNames(\n            'relative cursor-default select-none list-none',\n            extractClasses(itemContainerStyles, 'p-'),\n            extractClasses(itemContainerStyles, 'px-'),\n            extractClasses(itemContainerStyles, 'py-')\n          )\n        )}\n        value={item}\n      >\n        {({ active }) => {\n          return (\n            <div\n              className={twMerge(\n                classNames(\n                  'w-full flex items-center !min-h-[32px] p-2 cursor-pointer',\n                  itemContainerStyles,\n                  (!!extractClasses(itemContainerStyles, 'p-') ||\n                    !!extractClasses(itemContainerStyles, 'px-') ||\n                    !!extractClasses(itemContainerStyles, 'py-')) &&\n                    'p-2'\n                )\n              )}\n              style={{\n                backgroundColor:\n                  index % 2 === 0\n                    ? oddBgColor || 'var(--dropdownList-background-odd)'\n                    : evenBgColor || 'var(--dropdownList-background-even)'\n              }}\n              onClick={(e) => {\n                e.preventDefault();\n                onSelectItem?.(item);\n              }}\n            >\n              <div className='flex flex-1'>\n                <BaseText\n                  label={item.label}\n                  className={twMerge(\n                    classNames(\n                      'text-xs text-dropdownList-text-default leading-[14px]',\n                      `${\n                        active\n                          ? twMerge(\n                              'font-semibold text-dropdownList-text-hover',\n                              activeItemTextStyles\n                            )\n                          : 'font-normal'\n                      }`\n                    ),\n                    itemTextStyles\n                  )}\n                />\n              </div>\n            </div>\n          );\n        }}\n      </ListboxOption>\n    );\n  };\n\n  useEffect(() => {\n    if (onSearch) onSearch(search);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [search]);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setButtonWidth(entry.contentRect.width);\n      }\n    });\n\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current);\n    }\n\n    return () => {\n      if (containerRef.current) {\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        resizeObserver.unobserve(containerRef.current);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    const sentinel = sentinelRef.current;\n    const scrollContainer = listRef.current;\n\n    if (!sentinel || !scrollContainer || !hasNextPage || isFetchingNextPage) {\n      return;\n    }\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        if (entries[0]?.isIntersecting && hasNextPage && !isFetchingNextPage) {\n          fetchNextPage();\n        }\n      },\n      {\n        root: scrollContainer,\n        rootMargin: '50px',\n        threshold: 0.1\n      }\n    );\n\n    observer.observe(sentinel);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [hasNextPage, isFetchingNextPage, fetchNextPage, dataPicker.length]);\n\n  const isWidthFull =\n    !extractClasses(containerStyles, 'w-') ||\n    extractClasses(containerStyles, 'w-') === 'w-full' ||\n    !extractClasses(itemsContainerStyles, 'w-') ||\n    extractClasses(itemsContainerStyles, 'w-') === 'w-full';\n\n  const renderSearchSection = () => {\n    if (!isSearchable) return null;\n\n    return (\n      <div className='p-2 bg-light-whiteSolid w-full'>\n        <div\n          className={twMerge(\n            classNames(\n              twMerge(\n                'flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1',\n                searchContainerStyles\n              ),\n              activeSearchStyles ? activeSearchStyles : 'border-fields-border-focus'\n            )\n          )}\n        >\n          <input\n            placeholder={searchPlaceholder || 'Search'}\n            className={twMerge(\n              'flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs',\n              searchStyles\n            )}\n            onChange={(e) => {\n              setSearch(e.target.value);\n            }}\n            onKeyDown={(e) => e.stopPropagation()}\n            value={search}\n          />\n          <Icon\n            name='search'\n            className={twMerge('fill-dark-bermudaGray w-3 h-3', iconSearchStyles)}\n          />\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <Listbox>\n      <div ref={containerRef} className='flex flex-col gap-y-1'>\n        <div className='flex flex-row items-end gap-x-1'>\n          {!!label && (\n            <BaseText\n              label={label}\n              className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n            />\n          )}\n          {isRequired && (\n            <BaseBadgeRequired\n              labelRequired={labelRequired}\n              labelRequiredStyles={labelRequiredStyles}\n              containerRequiredStyles={containerRequiredStyles}\n            />\n          )}\n        </div>\n        <div className='relative inline-block'>\n          <Float placement={position} flip={isAutoFlip}>\n            <ListboxButton\n              className={twMerge(\n                classNames('p-0 bg-transparent', isDisabled && 'cursor-not-allowed'),\n                containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n              )}\n              onClick={(e) => {\n                if (isDisabled) {\n                  e.preventDefault();\n                }\n              }}\n            >\n              {({ open }) => (\n                <div\n                  className={twMerge(\n                    classNames(\n                      twMerge(\n                        'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid',\n                        containerStyles\n                      ),\n                      variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n                      open && activeContainerStyles\n                        ? activeContainerStyles\n                        : open\n                        ? 'border-fields-border-focus'\n                        : undefined,\n                      isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n                      isError && 'border-red-fireEngineRed'\n                    )\n                  )}\n                >\n                  <div className='flex flex-1'>\n                    {!!placeholder && !value && (\n                      <div className='flex flex-1 w-full'>\n                        <BaseText\n                          label={placeholder}\n                          variant='small'\n                          className={twMerge(\n                            classNames(\n                              'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n                            ),\n                            placeholderStyles\n                          )}\n                        />\n                      </div>\n                    )}\n\n                    {!!value && (\n                      <div className='flex flex-1 w-[calc(100%-52px)]'>\n                        <BaseText\n                          label={\n                            dataPicker.find(\n                              (item: BaseInfiniteSelectPickerDataInterface) => item.value === value\n                            )?.label || value\n                          }\n                          variant='small'\n                          className={twMerge(\n                            classNames(\n                              'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n                            ),\n                            valueStyles\n                          )}\n                        />\n                      </div>\n                    )}\n                  </div>\n\n                  {isCleanable && !!value && (\n                    <div\n                      className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-1'\n                      onClick={(e) => {\n                        e.preventDefault();\n                        onSelectItem?.({ value: '', label: '' });\n                        setSearch('');\n                        onClean?.();\n                      }}\n                    >\n                      <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n                    </div>\n                  )}\n                  <Icon\n                    name={open ? 'chevronup' : 'chevrondown'}\n                    className={twMerge(\n                      classNames(\n                        'fill-dark-bermudaGray w-3 h-3',\n                        `${isDisabled && 'fill-dark-bermudaGray'}`\n                      ),\n                      iconStyles\n                    )}\n                  />\n                </div>\n              )}\n            </ListboxButton>\n            <Transition\n              as={Fragment}\n              leave='transition ease-in duration-100'\n              leaveFrom='opacity-100'\n              leaveTo='opacity-0'\n            >\n              <ListboxOptions\n                className={twMerge(\n                  classNames(\n                    'rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{\n                  width: isWidthFull ? buttonWidth : undefined,\n                  height: 'auto'\n                }}\n              >\n                {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n                {({ open }) => {\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (!open && isClearSearchOnClose) setSearch('');\n                  }, [open]);\n\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (open && !isDropdownOpen) {\n                      // Dropdown just opened - reset infinite scroll data to start fresh\n                      const queryKeyWithSearch = [...queryKey, debouncedQuery];\n                      queryClient.resetQueries(queryKeyWithSearch);\n                      setIsDropdownOpen(true);\n                      // Reset scroll position to top\n                      if (listRef.current) {\n                        listRef.current.scrollTop = 0;\n                      }\n                    } else if (!open && isDropdownOpen) {\n                      // Dropdown just closed\n                      setIsDropdownOpen(false);\n                    }\n                  }, [open]);\n\n                  return (\n                    <>\n                      {renderSearchSection()}\n                      <div\n                        className={twMerge(\n                          classNames(\n                            'p-0 overflow-hidden',\n                            extractClasses(itemsContainerStyles, 'w-')\n                              ? extractClasses(itemsContainerStyles, 'w-')\n                              : extractClasses(containerStyles, 'w-')\n                          )\n                        )}\n                        style={{ width: isWidthFull ? buttonWidth : undefined }}\n                      >\n                        {dataPicker.length > 0 ? (\n                          <div\n                            ref={listRef}\n                            className={twMerge(\n                              `max-h-80 overflow-y-auto ${defaultScrollbarStyles}`,\n                              listContainerStyles\n                            )}\n                            style={{\n                              maxHeight: maxDropdownHeight\n                            }}\n                          >\n                            {dataPicker.map((item, index) => renderItem(item, index))}\n                            {/* Infinite loading sentinel */}\n                            {hasNextPage && (\n                              <div\n                                ref={sentinelRef}\n                                className='w-full h-8 flex items-center justify-center'\n                              >\n                                {isFetchingNextPage ? (\n                                  <BaseText\n                                    label='Loading'\n                                    className='text-dark-bermudaGray font-normal text-xs text-center w-full'\n                                  />\n                                ) : (\n                                  <div className='w-full h-1' />\n                                )}\n                              </div>\n                            )}\n                          </div>\n                        ) : isLoading ? (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label='Loading'\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm text-center',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        ) : (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label={noResultsLabel || 'No Results Found'}\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        )}\n                      </div>\n                      {isShowFooterButton && (\n                        <BaseButton\n                          variant='tertiary'\n                          onClick={() => {\n                            onClickFooterButton?.();\n                          }}\n                          label={footerButtonLabel || 'Footer Button'}\n                          className={twMerge('', footerButtonContainerStyles)}\n                        />\n                      )}\n                    </>\n                  );\n                }}\n              </ListboxOptions>\n            </Transition>\n          </Float>\n        </div>\n\n        {helperMessage && !isError && (\n          <BaseText\n            label={helperMessage}\n            className={twMerge(\n              'font-normal text-dark-bermudaGray text-[10px] inline-block',\n              helperMessageStyles\n            )}\n          />\n        )}\n\n        {isError && !!errorMessage && (\n          <BaseText\n            label={errorMessage}\n            className={twMerge(\n              'font-normal text-red-fireEngineRed text-[10px] inline-block',\n              errorMessageStyles\n            )}\n          />\n        )}\n      </div>\n    </Listbox>\n  );\n}\n\nexport default BaseInfiniteSelectPicker;\n"],"names":["fetchFn","queryKey","debounceMs","disabled","pageSize","label","labelStyles","value","valueStyles","placeholder","placeholderStyles","containerStyles","activeContainerStyles","iconStyles","itemsContainerStyles","itemContainerStyles","oddBgColor","evenBgColor","isDisabled","position","isAutoFlip","onSelectItem","onClean","isCleanable","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isSearchable","searchContainerStyles","activeSearchStyles","searchPlaceholder","searchStyles","iconSearchStyles","isShowFooterButton","footerButtonContainerStyles","footerButtonLabel","onClickFooterButton","noResultsLabel","noResultsLabelStyles","variant","data","_data","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","itemTextStyles","listContainerStyles","isClearSearchOnClose","activeItemTextStyles","queryClient","useQueryClient","containerRef","useRef","listRef","search","setSearch","useState","debouncedQuery","useDebounce","buttonWidth","setButtonWidth","sentinelRef","isDropdownOpen","setIsDropdownOpen","dataInfinite","isLoading","isFetchingNextPage","hasNextPage","fetchNextPage","useInfinitePicker","enabled","dataPicker","useMemo","renderItem","item","index","_jsx","ListboxOption","Object","assign","className","twMerge","classNames","extractClasses","children","active","style","backgroundColor","onClick","e","preventDefault","jsx","BaseText","useEffect","resizeObserver","ResizeObserver","entries","entry","contentRect","width","current","observe","unobserve","sentinel","scrollContainer","observer","IntersectionObserver","_a","isIntersecting","root","rootMargin","threshold","disconnect","length","isWidthFull","Listbox","_jsxs","ref","BaseBadgeRequired","jsxs","Float","placement","flip","ListboxButton","undefined","open","find","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","height","queryKeyWithSearch","resetQueries","scrollTop","_Fragment","onChange","target","onKeyDown","stopPropagation","maxHeight","map","BaseButton"],"mappings":"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"}
+{"version":3,"file":"InfiniteSelectPicker.js","sources":["../../../../src/components/SelectPicker/InfiniteSelectPicker.tsx"],"sourcesContent":["import {\n  Listbox,\n  ListboxButton,\n  ListboxOption,\n  ListboxOptions,\n  Transition\n} from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport classNames from 'classnames';\nimport { Fragment, useEffect, useMemo, useRef, useState } from 'react';\nimport { useQueryClient } from 'react-query';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useDebounce } from '../../hooks/useDebounce';\nimport { useInfinitePicker } from '../../hooks/useInfinitePicker';\nimport extractClasses from '../../utils/extractClasses';\nimport { BaseBadgeRequired } from '../Badge';\nimport { BaseButton } from '../Button';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n  BaseInfiniteSelectPickerDataInterface,\n  BaseInfiniteSelectPickerInterface\n} from './BaseInfiniteSelectPicker.type';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction BaseInfiniteSelectPicker<T = any>({\n  fetchFn,\n  queryKey,\n  debounceMs = 300,\n  disabled = false,\n  pageSize = 100,\n  label,\n  labelStyles,\n  value,\n  valueStyles,\n  placeholder,\n  placeholderStyles,\n  containerStyles,\n  activeContainerStyles,\n  iconStyles,\n  itemsContainerStyles,\n  itemContainerStyles,\n  oddBgColor,\n  evenBgColor,\n  isDisabled = false,\n  position = 'bottom-start',\n  isAutoFlip,\n  onSelectItem,\n  onClean,\n  isCleanable,\n  isError,\n  errorMessage,\n  errorMessageStyles,\n  helperMessage,\n  helperMessageStyles,\n  isSearchable,\n  searchContainerStyles,\n  activeSearchStyles,\n  searchPlaceholder,\n  searchStyles,\n  iconSearchStyles,\n  isShowFooterButton,\n  footerButtonContainerStyles,\n  footerButtonLabel,\n  onClickFooterButton,\n  noResultsLabel,\n  noResultsLabelStyles,\n  variant = 'box',\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  data: _data, // Keep for backward compatibility but don't use (using dataInfinite instead)\n  isRequired,\n  labelRequired,\n  labelRequiredStyles,\n  containerRequiredStyles,\n  onSearch,\n  itemTextStyles,\n  listContainerStyles,\n  isClearSearchOnClose,\n  activeItemTextStyles\n}: BaseInfiniteSelectPickerInterface<T>) {\n  const defaultScrollbarStyles =\n    'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n  const queryClient = useQueryClient();\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n\n  const [search, setSearch] = useState<string>('');\n  const debouncedQuery = useDebounce(search, debounceMs);\n  const [buttonWidth, setButtonWidth] = useState<number>(0);\n\n  const sentinelRef = useRef<HTMLDivElement>(null);\n  const [isDropdownOpen, setIsDropdownOpen] = useState<boolean>(false);\n  const {\n    data: dataInfinite,\n    isLoading,\n    isFetchingNextPage,\n    hasNextPage,\n    fetchNextPage\n  } = useInfinitePicker({\n    fetchFn,\n    queryKey,\n    search: debouncedQuery,\n    pageSize,\n    enabled: !disabled\n  });\n\n  const dataPicker: Array<BaseInfiniteSelectPickerDataInterface> = useMemo(() => {\n    // Use dataInfinite from the hook instead of static data prop\n    // Type assertion is safe here as the API should return the correct format\n    return (dataInfinite || []) as Array<BaseInfiniteSelectPickerDataInterface>;\n  }, [dataInfinite]);\n\n  const maxDropdownHeight = 320; // Maximum height for the dropdown list\n\n  // eslint-disable-next-line sonarjs/cognitive-complexity\n  const renderItem = (item: BaseInfiniteSelectPickerDataInterface, index: number) => {\n    return (\n      <ListboxOption\n        key={`${item.value}-${index}`}\n        className={twMerge(\n          classNames(\n            'relative cursor-default select-none list-none',\n            extractClasses(itemContainerStyles, 'p-'),\n            extractClasses(itemContainerStyles, 'px-'),\n            extractClasses(itemContainerStyles, 'py-')\n          )\n        )}\n        value={item}\n      >\n        {({ active }) => {\n          return (\n            <div\n              className={twMerge(\n                classNames(\n                  'w-full flex items-center !min-h-[32px] p-2 cursor-pointer',\n                  itemContainerStyles,\n                  (!!extractClasses(itemContainerStyles, 'p-') ||\n                    !!extractClasses(itemContainerStyles, 'px-') ||\n                    !!extractClasses(itemContainerStyles, 'py-')) &&\n                    'p-2'\n                )\n              )}\n              style={{\n                backgroundColor:\n                  index % 2 === 0\n                    ? oddBgColor || 'var(--dropdownList-background-odd)'\n                    : evenBgColor || 'var(--dropdownList-background-even)'\n              }}\n              onClick={(e) => {\n                e.preventDefault();\n                onSelectItem?.(item);\n              }}\n            >\n              <div className='flex flex-1'>\n                <BaseText\n                  label={item.label}\n                  className={twMerge(\n                    classNames(\n                      'text-xs text-dropdownList-text-default leading-[14px]',\n                      `${\n                        active\n                          ? twMerge(\n                              'font-semibold text-dropdownList-text-hover',\n                              activeItemTextStyles\n                            )\n                          : 'font-normal'\n                      }`\n                    ),\n                    itemTextStyles\n                  )}\n                />\n              </div>\n            </div>\n          );\n        }}\n      </ListboxOption>\n    );\n  };\n\n  useEffect(() => {\n    if (onSearch) onSearch(search);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [search]);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setButtonWidth(entry.contentRect.width);\n      }\n    });\n\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current);\n    }\n\n    return () => {\n      if (containerRef.current) {\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        resizeObserver.unobserve(containerRef.current);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    const sentinel = sentinelRef.current;\n    const scrollContainer = listRef.current;\n\n    if (!sentinel || !scrollContainer || !hasNextPage || isFetchingNextPage) {\n      return;\n    }\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        if (entries[0]?.isIntersecting && hasNextPage && !isFetchingNextPage) {\n          fetchNextPage();\n        }\n      },\n      {\n        root: scrollContainer,\n        rootMargin: '50px',\n        threshold: 0.1\n      }\n    );\n\n    observer.observe(sentinel);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [hasNextPage, isFetchingNextPage, fetchNextPage, dataPicker.length]);\n\n  const isWidthFull =\n    !extractClasses(containerStyles, 'w-') ||\n    extractClasses(containerStyles, 'w-') === 'w-full' ||\n    !extractClasses(itemsContainerStyles, 'w-') ||\n    extractClasses(itemsContainerStyles, 'w-') === 'w-full';\n\n  const renderSearchSection = () => {\n    if (!isSearchable) return null;\n\n    return (\n      <div className='p-2 bg-light-whiteSolid w-full'>\n        <div\n          className={twMerge(\n            classNames(\n              twMerge(\n                'flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1',\n                searchContainerStyles\n              ),\n              activeSearchStyles ? activeSearchStyles : 'border-fields-border-focus'\n            )\n          )}\n        >\n          <input\n            placeholder={searchPlaceholder || 'Search'}\n            className={twMerge(\n              'flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs',\n              searchStyles\n            )}\n            onChange={(e) => {\n              setSearch(e.target.value);\n            }}\n            onKeyDown={(e) => e.stopPropagation()}\n            value={search}\n          />\n          <Icon\n            name='search'\n            className={twMerge('fill-dark-bermudaGray w-3 h-3', iconSearchStyles)}\n          />\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <Listbox>\n      <div ref={containerRef} className='flex flex-col gap-y-1'>\n        <div className='flex flex-row items-end gap-x-1'>\n          {!!label && (\n            <BaseText\n              label={label}\n              className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n            />\n          )}\n          {isRequired && (\n            <BaseBadgeRequired\n              labelRequired={labelRequired}\n              labelRequiredStyles={labelRequiredStyles}\n              containerRequiredStyles={containerRequiredStyles}\n            />\n          )}\n        </div>\n        <div className='relative inline-block'>\n          <Float placement={position} flip={isAutoFlip}>\n            <ListboxButton\n              className={twMerge(\n                classNames('p-0 bg-transparent', isDisabled && 'cursor-not-allowed'),\n                containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n              )}\n              onClick={(e) => {\n                if (isDisabled) {\n                  e.preventDefault();\n                }\n              }}\n            >\n              {({ open }) => (\n                <div\n                  className={twMerge(\n                    classNames(\n                      twMerge(\n                        'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid',\n                        containerStyles\n                      ),\n                      variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n                      open && activeContainerStyles\n                        ? activeContainerStyles\n                        : open\n                        ? 'border-fields-border-focus'\n                        : undefined,\n                      isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n                      isError && 'border-red-fireEngineRed'\n                    )\n                  )}\n                >\n                  <div className='flex flex-1'>\n                    {!!placeholder && !value && (\n                      <div className='flex flex-1 w-full'>\n                        <BaseText\n                          label={placeholder}\n                          variant='small'\n                          className={twMerge(\n                            classNames(\n                              'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n                            ),\n                            placeholderStyles\n                          )}\n                        />\n                      </div>\n                    )}\n\n                    {!!value && (\n                      <div className='flex flex-1 w-[calc(100%-52px)]'>\n                        <BaseText\n                          label={\n                            dataPicker.find(\n                              (item: BaseInfiniteSelectPickerDataInterface) => item.value === value\n                            )?.label || value\n                          }\n                          variant='small'\n                          className={twMerge(\n                            classNames(\n                              'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n                            ),\n                            valueStyles\n                          )}\n                        />\n                      </div>\n                    )}\n                  </div>\n\n                  {isCleanable && !!value && (\n                    <div\n                      className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-1'\n                      onClick={(e) => {\n                        e.preventDefault();\n                        onSelectItem?.({ value: '', label: '' });\n                        setSearch('');\n                        onClean?.();\n                      }}\n                    >\n                      <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n                    </div>\n                  )}\n                  <Icon\n                    name={open ? 'chevronup' : 'chevrondown'}\n                    className={twMerge(\n                      classNames(\n                        'fill-dark-bermudaGray w-3 h-3',\n                        `${isDisabled && 'fill-dark-bermudaGray'}`\n                      ),\n                      iconStyles\n                    )}\n                  />\n                </div>\n              )}\n            </ListboxButton>\n            <Transition\n              as={Fragment}\n              leave='transition ease-in duration-100'\n              leaveFrom='opacity-100'\n              leaveTo='opacity-0'\n            >\n              <ListboxOptions\n                className={twMerge(\n                  classNames(\n                    'rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver bg-white z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{\n                  width: isWidthFull ? buttonWidth : undefined,\n                  height: 'auto'\n                }}\n              >\n                {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n                {({ open }) => {\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (!open && isClearSearchOnClose) setSearch('');\n                  }, [open]);\n\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (open && !isDropdownOpen) {\n                      // Dropdown just opened - reset infinite scroll data to start fresh\n                      const queryKeyWithSearch = [...queryKey, debouncedQuery];\n                      queryClient.resetQueries(queryKeyWithSearch);\n                      setIsDropdownOpen(true);\n                      // Reset scroll position to top\n                      if (listRef.current) {\n                        listRef.current.scrollTop = 0;\n                      }\n                    } else if (!open && isDropdownOpen) {\n                      // Dropdown just closed\n                      setIsDropdownOpen(false);\n                    }\n                  }, [open]);\n\n                  return (\n                    <>\n                      {renderSearchSection()}\n                      <div\n                        className={twMerge(\n                          classNames(\n                            'p-0 overflow-hidden',\n                            extractClasses(itemsContainerStyles, 'w-')\n                              ? extractClasses(itemsContainerStyles, 'w-')\n                              : extractClasses(containerStyles, 'w-')\n                          )\n                        )}\n                        style={{ width: isWidthFull ? buttonWidth : undefined }}\n                      >\n                        {dataPicker.length > 0 ? (\n                          <div\n                            ref={listRef}\n                            className={twMerge(\n                              `max-h-80 overflow-y-auto ${defaultScrollbarStyles}`,\n                              listContainerStyles\n                            )}\n                            style={{\n                              maxHeight: maxDropdownHeight\n                            }}\n                          >\n                            {dataPicker.map((item, index) => renderItem(item, index))}\n                            {/* Infinite loading sentinel */}\n                            {hasNextPage && (\n                              <div\n                                ref={sentinelRef}\n                                className='w-full h-8 flex items-center justify-center'\n                              >\n                                {isFetchingNextPage ? (\n                                  <BaseText\n                                    label='Loading'\n                                    className='text-dark-bermudaGray font-normal text-xs text-center w-full'\n                                  />\n                                ) : (\n                                  <div className='w-full h-1' />\n                                )}\n                              </div>\n                            )}\n                          </div>\n                        ) : isLoading ? (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label='Loading'\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm text-center',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        ) : (\n                          <div className='py-2 px-4 w-full'>\n                            <BaseText\n                              label={noResultsLabel || 'No Results Found'}\n                              className={twMerge(\n                                'text-dark-bermudaGray font-normal text-sm',\n                                noResultsLabelStyles\n                              )}\n                            />\n                          </div>\n                        )}\n                      </div>\n                      {isShowFooterButton && (\n                        <BaseButton\n                          variant='tertiary'\n                          onClick={() => {\n                            onClickFooterButton?.();\n                          }}\n                          label={footerButtonLabel || 'Footer Button'}\n                          className={twMerge('', footerButtonContainerStyles)}\n                        />\n                      )}\n                    </>\n                  );\n                }}\n              </ListboxOptions>\n            </Transition>\n          </Float>\n        </div>\n\n        {helperMessage && !isError && (\n          <BaseText\n            label={helperMessage}\n            className={twMerge(\n              'font-normal text-dark-bermudaGray text-[10px] inline-block',\n              helperMessageStyles\n            )}\n          />\n        )}\n\n        {isError && !!errorMessage && (\n          <BaseText\n            label={errorMessage}\n            className={twMerge(\n              'font-normal text-red-fireEngineRed text-[10px] inline-block',\n              errorMessageStyles\n            )}\n          />\n        )}\n      </div>\n    </Listbox>\n  );\n}\n\nexport default BaseInfiniteSelectPicker;\n"],"names":["fetchFn","queryKey","debounceMs","disabled","pageSize","label","labelStyles","value","valueStyles","placeholder","placeholderStyles","containerStyles","activeContainerStyles","iconStyles","itemsContainerStyles","itemContainerStyles","oddBgColor","evenBgColor","isDisabled","position","isAutoFlip","onSelectItem","onClean","isCleanable","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isSearchable","searchContainerStyles","activeSearchStyles","searchPlaceholder","searchStyles","iconSearchStyles","isShowFooterButton","footerButtonContainerStyles","footerButtonLabel","onClickFooterButton","noResultsLabel","noResultsLabelStyles","variant","data","_data","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","itemTextStyles","listContainerStyles","isClearSearchOnClose","activeItemTextStyles","queryClient","useQueryClient","containerRef","useRef","listRef","search","setSearch","useState","debouncedQuery","useDebounce","buttonWidth","setButtonWidth","sentinelRef","isDropdownOpen","setIsDropdownOpen","dataInfinite","isLoading","isFetchingNextPage","hasNextPage","fetchNextPage","useInfinitePicker","enabled","dataPicker","useMemo","renderItem","item","index","_jsx","ListboxOption","Object","assign","className","twMerge","classNames","extractClasses","children","active","style","backgroundColor","onClick","e","preventDefault","jsx","BaseText","useEffect","resizeObserver","ResizeObserver","entries","entry","contentRect","width","current","observe","unobserve","sentinel","scrollContainer","observer","IntersectionObserver","_a","isIntersecting","root","rootMargin","threshold","disconnect","length","isWidthFull","Listbox","_jsxs","ref","BaseBadgeRequired","jsxs","Float","placement","flip","ListboxButton","undefined","open","find","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","height","queryKeyWithSearch","resetQueries","scrollTop","_Fragment","onChange","target","onKeyDown","stopPropagation","maxHeight","map","BaseButton"],"mappings":"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"}

package/build/src/components/Table/TableResponsive.js

@@ -1,4 +1,4 @@
-"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),o=require("../../../node_modules/@formkit/auto-animate/index.mjs.js"),n=require("../../../node_modules/classnames/index.js"),a=require("../../../node_modules/prop-types/index.js"),s=require("../../../node_modules/react-table/index.js");require("../../../node_modules/react-table-sticky/build/index.js");var l=require("styled-components"),i=require("../../hooks/useDidMountEffect.js");require("../../../node_modules/react-query/es/react/setBatchUpdatesFn.js"),require("../../../node_modules/react-query/es/react/setLogger.js");var d=require("../../styles/Colors.js"),c=require("../../utils/freezeColumn.js"),u=require("../../utils/getChildrenOnDisplayName.js");require("../Badge/Badge.js");var b=require("../Badge/BaseBadge.js"),h=require("../Text/BaseText.js"),g=require("../Text/Text.js");require("../Button/ButtonHyperlink.js");var p=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js");var x=require("../LoadingIndicator/LoadingIndicator.js");require("../LoadingIndicator/LoadingIndicatorBox.js");var m=require("../Menu/BaseMenuDropdown.js"),f=require("../Pagination/BasePagination.js"),y=require("../SwitchPicker/BaseSwitchPicker.js"),v=require("./TableBase.js"),j=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),S=require("../../../_virtual/index5.js");function w(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var C=w(l);const k={pageIndex:0,pageSize:10,textAlign:"left"},I=C.default.div`
+"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),o=require("../../../node_modules/@formkit/auto-animate/index.mjs.js"),n=require("../../../node_modules/classnames/index.js"),a=require("../../../node_modules/prop-types/index.js"),s=require("../../../node_modules/react-table/index.js");require("../../../node_modules/react-table-sticky/build/index.js");var l=require("styled-components"),i=require("../../hooks/useDidMountEffect.js");require("react-query");var d=require("../../styles/Colors.js"),c=require("../../utils/freezeColumn.js"),u=require("../../utils/getChildrenOnDisplayName.js");require("../Badge/Badge.js");var b=require("../Badge/BaseBadge.js"),h=require("../Text/BaseText.js"),p=require("../Text/Text.js");require("../Button/ButtonHyperlink.js");var g=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js");var x=require("../LoadingIndicator/LoadingIndicator.js");require("../LoadingIndicator/LoadingIndicatorBox.js");var m=require("../Menu/BaseMenuDropdown.js"),f=require("../Pagination/BasePagination.js"),y=require("../SwitchPicker/BaseSwitchPicker.js"),v=require("./TableBase.js"),j=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),S=require("../../../_virtual/index5.js");function w(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var C=w(l);const k={pageIndex:0,pageSize:10,textAlign:"left"},I=C.default.div`
   bottom: 0;
   display: flex;
   flex-direction: column;
@@ -42,7 +42,7 @@
     cursor: pointer;
     :hover {
       p {
-        font-family: ${g.fontFamilyMapper["semi-bold"]};
+        font-family: ${p.fontFamilyMapper["semi-bold"]};
       }
     }
     td {
@@ -132,7 +132,7 @@
           }
         `}}
   }
-`,H=C.default(g.default)`
+`,H=C.default(p.default)`
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   color: ${({isEmpty:e,color:t})=>t||(e?"var(--tableResponsive-body-text-notSpecifiedAndNone)":"var(--tableResponsive-body-text-default)")};
@@ -140,5 +140,5 @@
   line-height: 16px;
   overflow: hidden;
   white-space: normal;
-`,R=a=>{var{getCellProps:l=v.defaultPropGetter,pageIndex:g=k.pageIndex,pageSize:p=k.pageSize,emptyTableHeight:w=200,onClickRow:C,variant:T="regular",isSelectable:R=!1,freezedColumn:q=0,freezeHeader:z=!1,hideRowIndex:N=!1,tableHeight:P=400}=a,L=e.__rest(a,["getCellProps","pageIndex","pageSize","emptyTableHeight","onClickRow","variant","isSelectable","freezedColumn","freezeHeader","hideRowIndex","tableHeight"]);const{onPageChange:_,isHidePagination:D,isHideTable:$,isHideItemShownDropdown:G,isHideShowColumnDropdown:U,isHideSelectedAmount:F,totalData:V,totalPage:W,isManualSort:J,itemShownLabel:K,selectedAmountValue:Q,selectedAmountLabel:X,selectedAmountLabelStyles:Y,selectedAmountBadgeStyles:Z,itemShownLabelStyles:ee,itemShownDropdown:te,showColumnDropdown:re,onSort:oe,isRefetchData:ne,loadingContainerStyles:ae}=L,se=v.tableSizeMapper[T].charTotal,le=r.useMemo((()=>L.data),[L.data]),ie=r.useMemo((()=>c({header:L.header,freezedColumn:q})),[q,L.header]),de=r.useMemo((()=>L.sortBy&&J?[L.sortBy]:[]),[L.sortBy,J]),ce=r.useRef(),ue=r.useRef(),[be,he]=r.useState(0),ge=r.useMemo((()=>{let e;return L.header&&(e=L.header.reduce(((e,t)=>e+(t.width||150)),0),L.rowActions&&(e+=100),N||(e+=40),R||(e+=48)),e}),[L.header,N,L.rowActions,R]),[pe,xe]=r.useState(D?void 0:Math.ceil(V/p)),[me,fe]=r.useState(0);r.useEffect((()=>{ce.current&&o.default(ce.current)}),[ce]),r.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)he(t.contentRect.width)}));return ue.current&&e.observe(ue.current),()=>{ue.current&&e.unobserve(ue.current)}}),[]);const{canNextPage:ye,canPreviousPage:ve,getTableProps:je,getTableBodyProps:Se,gotoPage:we,headerGroups:Ce,nextPage:ke,page:Ie,pageCount:Te,prepareRow:Oe,previousPage:Ae,selectedFlatRows:Ee,setHiddenColumns:Be,state:{pageIndex:Me,pageSize:He,sortBy:[Re]}}=s.reactTableExports.useTable({columns:ie,data:le,manualSortBy:J,manualPagination:!D,pageCount:pe,initialState:{sortBy:de,pageIndex:D?k.pageIndex:g,pageSize:p,hiddenColumns:[],selectedRowIds:L.initialCheckedRows?(()=>{const e={},t=L.initialCheckedRows;return t&&t.forEach((t=>{const r=le.findIndex((e=>e.id===t));e[r.toString()]=!0})),e})():{"-1":!0}}},s.reactTableExports.useBlockLayout,s.reactTableExports.useSortBy,s.reactTableExports.usePagination,s.reactTableExports.useRowSelect,S.__exports.useSticky,(e=>v.tableHooks({hooks:e,isSelectable:R,hideRowIndex:N,rowIndexAlign:L.rowIndexAlign,variant:T,actionLabel:L.actionLabel,rowActions:L.rowActions,freezedColumn:q,checkedColor:L.checkedColor,totalMaxChecked:L.totalMaxChecked}))),qe=r.useMemo((()=>D?0:He*Me),[D,Me,He]);i.useDidMountEffect((()=>{"function"==typeof L.onSelectedRow&&R&&L.onSelectedRow(Ee)}),[L.onSelectedRow,Ee]),r.useEffect((()=>{var e;if(Ee){const t=Ee.map((e=>e.original.id));null===(e=L.onCheckedRow)||void 0===e||e.call(L,t)}}),[Ee]),r.useEffect((()=>{L.hiddenColumns&&Be(L.hiddenColumns||[])}),[L.hiddenColumns,Be]),r.useEffect((()=>{"function"==typeof _&&_({pageIndex:Me,pageSize:He})}),[Me,He]),r.useEffect((()=>{D||xe(Math.ceil(V/He))}),[He,V,D]),r.useEffect((()=>{"function"==typeof oe&&oe({sortBy:Re})}),[oe,Re]),r.useEffect((()=>{const e=[];Ie.forEach((t=>{t.cells.forEach((t=>{Array.isArray(t.value)&&e.push(t.value.length)}))}));const t=e.length>0?Math.max(...e):0;fe(t)}),[Ie]);const ze=(!!q||!!z)&&ge>be,Ne=0===le.length,Pe=u.getChildrenOnDisplayName(L.children,"ListTabs"),Le=u.getChildrenOnDisplayName(L.children,"MidTabs"),_e=u.getChildrenOnDisplayName(L.children,"ItemContent");return t.jsxs("div",Object.assign({className:"flex flex-col w-full h-full"},{children:[t.jsxs("div",Object.assign({ref:ce,className:j.twMerge("flex flex-col w-full bg-accordionTabs-container-background-default mb-3 rounded-lg p-2",L.headerContainerStyles)},{children:[t.jsxs("div",Object.assign({className:"flex flex-row items-center w-full gap-x-1"},{children:[t.jsx("div",Object.assign({className:"flex flex-1"},{children:Pe})),Le&&t.jsx(t.Fragment,{children:Le}),!D&&Te>0&&t.jsx("div",{children:t.jsx(f,Object.assign({canPreviousPage:ve,canNextPage:ye,totalData:D?le.length:V,pageIndex:Me,onClickPage:{first:()=>we(0),prev:Ae,next:ke,last:()=>we(Te-1),gotoPage:e=>we(e)},totalPage:W||Te,isShowPagination:!0},L.pagination))}),!G&&!!te&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(h.default,{label:K||"Item Shown",className:j.twMerge("font-normal text-dark-gumbo",ee)}),t.jsx(m,Object.assign({},te))]})),!U&&!!re&&t.jsx("div",{children:t.jsx(y,Object.assign({},re))}),!F&&R&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(h.default,{label:X||"Selected Items",className:j.twMerge("font-normal text-dark-gumbo",Y)}),t.jsx(b,{label:`${Q}`,containerStyles:j.twMerge("bg-dark-bermudaGray",Z)})]}))]})),_e]})),t.jsx("div",Object.assign({className:($?"hidden":"flex")+" flex-1 relative w-full h-full overflow-auto z-10"},{children:t.jsxs(I,{children:[t.jsx(M,Object.assign({ref:ue,$isOverflowAuto:!ze,$isLoading:L.isLoading,$isEmpty:Ne,tableHeight:P,rowEvenColor:L.rowEvenColor,rowOddColor:L.rowOddColor,variant:T,className:j.twMerge("w-full h-full",L.tableContainerStyles)},{children:t.jsxs(B,Object.assign({},je(),{freezeHeader:z,variant:T,"data-test-id":L.dataTestId,rowOddColor:L.rowOddColor,rowEvenColor:L.rowEvenColor},{children:[ne&&t.jsx("div",Object.assign({className:j.twMerge("absolute top-0 flex flex-1 items-center justify-center w-full h-full bg-light-whiteSolid z-20",ae)},{children:t.jsx(x,{size:"small"})})),t.jsx(A,{headerGroups:Ce,variant:T,freezeHeader:z,textSortedStyles:L.textSortedStyles,textUnsortedStyles:L.textUnsortedStyles,iconSortedStyles:L.iconSortedStyles,iconUnsortedStyles:L.iconUnsortedStyles,headerStyles:L.headerStyles,childHeaderStyles:L.childHeaderStyles}),t.jsx(E,Object.assign({},Se(),{children:Ie.map(((o,a)=>{Oe(o);const s=()=>C&&C(o.original),i=o.getRowProps(),{key:d}=i,c=e.__rest(i,["key"]);return r.createElement("tr",Object.assign({},c,{key:d||a,style:{display:"flex",width:"auto"}}),o.cells.map(((a,i)=>{const d=a.getCellProps(l(a)),{key:c,checkboxIsDisabled:u}=d,b=e.__rest(d,["key","checkboxIsDisabled"]);return r.createElement("td",Object.assign({},b,{key:c||a.row.id,className:j.twMerge(n.default(!!a.column.parent&&"border border-t-0 border-b-0 border-solid border-dark-solitude",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&"border-l-0",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!o.cells[i-1].column.parent&&"border-r-0",o.cells[i+1]&&o.cells[i-1]&&!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&"border-l-0",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&o.cells[i-1].column.parent.id!==a.column.parent.id&&"border-r-0",!o.cells[i+1]&&"border-l-0"))}),"custom"===a.column.type?t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,onClick:a.column.disableClick?null:s},{children:a.render("Cell",Object.assign({numberAddition:qe},"selectable"===a.column.accessor?{checkboxIsDisabled:u}:{}))})):t.jsx(t.Fragment,{children:Array.isArray(a.value)?a.value.map(((e,r)=>t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,countArrayValue:me,isColSpan:!0,onClick:a.column.disableClick?null:s},{children:t.jsx(H,Object.assign({isEmpty:!e,textAlign:a.column.textAlign||k.textAlign,label:a.column.isCanShowEmptyCell?e:e||"-",variant:"small",ellipsis:!!a.value&&a.value.length>=se},a.column.textStyle))}),r))):t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,onClick:a.column.disableClick?null:s},{children:t.jsx(H,Object.assign({isEmpty:!a.value,textAlign:a.column.textAlign||k.textAlign,label:a.column.isCanShowEmptyCell?a.value:a.value||"-",variant:"small",ellipsis:!!a.value&&a.value.length>=se},a.column.textStyle))}))}))})))}))}))]}))})),Ne&&!L.isLoading&&t.jsx(O,{children:t.jsx(v.EmptyData,{emptyTableHeight:w,noRecordLabel:L.noRecordLabel,noRecordComponent:L.noRecordComponent})}),L.isLoading&&t.jsx(O,{children:t.jsx(x,{size:"small",color:L.loadingColor?L.loadingColor:d.ColorBlue.yaleBlue,secondaryColor:L.loadingSecondaryColor?L.loadingSecondaryColor:d.ColorBlue.lapisLazuli})})]})}))]}))},q=({children:e})=>{const o=r.Children.toArray(e);return t.jsx("div",Object.assign({className:"flex flex-row w-full"},{children:r.Children.map(o,((e,r)=>{const o=u.getChildrenOnDisplayName(e,"ItemTabs");return t.jsx("div",Object.assign({className:"flex flex-row items-center"},{children:o}),r)}))}))};q.displayName="ListTabs",R.ListTabs=q;const z=({children:e,containerStyles:r})=>t.jsx(t.Fragment,{children:e?t.jsx("div",Object.assign({className:j.twMerge("flex flex-row flex-1",r)},{children:e})):null});z.displayName="MidTabs",R.MidTabs=z;const N=o=>{var{children:a,isActive:s}=o,l=e.__rest(o,["children","isActive"]);const[i,d]=r.useState(!1),[c,u]=r.useState(!1),b=r.useRef(null);return r.useEffect((()=>{const e=()=>{u(!1),b.current&&!b.current.matches(":hover")&&d(!1)};return c&&document.addEventListener("mouseup",e),()=>{document.removeEventListener("mouseup",e)}}),[c]),t.jsx(t.Fragment,{children:a||t.jsx("div",Object.assign({ref:b,onMouseDown:()=>u(!0),onMouseEnter:()=>d(!0),onMouseLeave:()=>{c||d(!1)}},{children:t.jsx(p.default,Object.assign({},l,{leftIconStyles:j.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||s)&&"fill-accordionTabs-button-textAndIcon-active"),l.leftIconStyles),rightIcon:s?"chevronup":l.rightIcon||"chevrondown",rightIconStyles:j.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||s)&&"fill-accordionTabs-button-textAndIcon-active"),l.rightIconStyles),className:j.twMerge(n.default("\n            bg-accordionTabs-button-background-default active:bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-hover \n            border-accordionTabs-button-border-default active:border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-hover \n            text-accordionTabs-button-textAndIcon-default active:text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-hover\n            ",s&&"\n              bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-active \n              border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-active \n              text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-active\n              "),l.className)}))}))})};N.displayName="ItemTabs",R.ItemTabs=N;const P=({children:e})=>t.jsx(t.Fragment,{children:e});P.displayName="ItemContent",R.ItemContent=P,R.prototype={pageSize:a.propTypesExports.number,emptyTableHeight:a.propTypesExports.number,onClickRow:a.propTypesExports.func,variant:a.propTypesExports.string,isSelectable:a.propTypesExports.bool,freezedColumn:a.propTypesExports.number,freezeHeader:a.propTypesExports.bool,hideRowIndex:a.propTypesExports.bool,tableHeight:a.propTypesExports.number},module.exports=R;
+`,R=a=>{var{getCellProps:l=v.defaultPropGetter,pageIndex:p=k.pageIndex,pageSize:g=k.pageSize,emptyTableHeight:w=200,onClickRow:C,variant:T="regular",isSelectable:R=!1,freezedColumn:z=0,freezeHeader:N=!1,hideRowIndex:q=!1,tableHeight:P=400}=a,L=e.__rest(a,["getCellProps","pageIndex","pageSize","emptyTableHeight","onClickRow","variant","isSelectable","freezedColumn","freezeHeader","hideRowIndex","tableHeight"]);const{onPageChange:D,isHidePagination:_,isHideTable:$,isHideItemShownDropdown:G,isHideShowColumnDropdown:U,isHideSelectedAmount:F,totalData:V,totalPage:W,isManualSort:J,itemShownLabel:K,selectedAmountValue:Q,selectedAmountLabel:X,selectedAmountLabelStyles:Y,selectedAmountBadgeStyles:Z,itemShownLabelStyles:ee,itemShownDropdown:te,showColumnDropdown:re,onSort:oe,isRefetchData:ne,loadingContainerStyles:ae}=L,se=v.tableSizeMapper[T].charTotal,le=r.useMemo((()=>L.data),[L.data]),ie=r.useMemo((()=>c({header:L.header,freezedColumn:z})),[z,L.header]),de=r.useMemo((()=>L.sortBy&&J?[L.sortBy]:[]),[L.sortBy,J]),ce=r.useRef(),ue=r.useRef(),[be,he]=r.useState(0),pe=r.useMemo((()=>{let e;return L.header&&(e=L.header.reduce(((e,t)=>e+(t.width||150)),0),L.rowActions&&(e+=100),q||(e+=40),R||(e+=48)),e}),[L.header,q,L.rowActions,R]),[ge,xe]=r.useState(_?void 0:Math.ceil(V/g)),[me,fe]=r.useState(0);r.useEffect((()=>{ce.current&&o.default(ce.current)}),[ce]),r.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)he(t.contentRect.width)}));return ue.current&&e.observe(ue.current),()=>{ue.current&&e.unobserve(ue.current)}}),[]);const{canNextPage:ye,canPreviousPage:ve,getTableProps:je,getTableBodyProps:Se,gotoPage:we,headerGroups:Ce,nextPage:ke,page:Ie,pageCount:Te,prepareRow:Oe,previousPage:Ae,selectedFlatRows:Ee,setHiddenColumns:Be,state:{pageIndex:Me,pageSize:He,sortBy:[Re]}}=s.reactTableExports.useTable({columns:ie,data:le,manualSortBy:J,manualPagination:!_,pageCount:ge,initialState:{sortBy:de,pageIndex:_?k.pageIndex:p,pageSize:g,hiddenColumns:[],selectedRowIds:L.initialCheckedRows?(()=>{const e={},t=L.initialCheckedRows;return t&&t.forEach((t=>{const r=le.findIndex((e=>e.id===t));e[r.toString()]=!0})),e})():{"-1":!0}}},s.reactTableExports.useBlockLayout,s.reactTableExports.useSortBy,s.reactTableExports.usePagination,s.reactTableExports.useRowSelect,S.__exports.useSticky,(e=>v.tableHooks({hooks:e,isSelectable:R,hideRowIndex:q,rowIndexAlign:L.rowIndexAlign,variant:T,actionLabel:L.actionLabel,rowActions:L.rowActions,freezedColumn:z,checkedColor:L.checkedColor,totalMaxChecked:L.totalMaxChecked}))),ze=r.useMemo((()=>_?0:He*Me),[_,Me,He]);i.useDidMountEffect((()=>{"function"==typeof L.onSelectedRow&&R&&L.onSelectedRow(Ee)}),[L.onSelectedRow,Ee]),r.useEffect((()=>{var e;if(Ee){const t=Ee.map((e=>e.original.id));null===(e=L.onCheckedRow)||void 0===e||e.call(L,t)}}),[Ee]),r.useEffect((()=>{L.hiddenColumns&&Be(L.hiddenColumns||[])}),[L.hiddenColumns,Be]),r.useEffect((()=>{"function"==typeof D&&D({pageIndex:Me,pageSize:He})}),[Me,He]),r.useEffect((()=>{_||xe(Math.ceil(V/He))}),[He,V,_]),r.useEffect((()=>{"function"==typeof oe&&oe({sortBy:Re})}),[oe,Re]),r.useEffect((()=>{const e=[];Ie.forEach((t=>{t.cells.forEach((t=>{Array.isArray(t.value)&&e.push(t.value.length)}))}));const t=e.length>0?Math.max(...e):0;fe(t)}),[Ie]);const Ne=(!!z||!!N)&&pe>be,qe=0===le.length,Pe=u.getChildrenOnDisplayName(L.children,"ListTabs"),Le=u.getChildrenOnDisplayName(L.children,"MidTabs"),De=u.getChildrenOnDisplayName(L.children,"ItemContent");return t.jsxs("div",Object.assign({className:"flex flex-col w-full h-full"},{children:[t.jsxs("div",Object.assign({ref:ce,className:j.twMerge("flex flex-col w-full bg-accordionTabs-container-background-default mb-3 rounded-lg p-2",L.headerContainerStyles)},{children:[t.jsxs("div",Object.assign({className:"flex flex-row items-center w-full gap-x-1"},{children:[t.jsx("div",Object.assign({className:"flex flex-1"},{children:Pe})),Le&&t.jsx(t.Fragment,{children:Le}),!_&&Te>0&&t.jsx("div",{children:t.jsx(f,Object.assign({canPreviousPage:ve,canNextPage:ye,totalData:_?le.length:V,pageIndex:Me,onClickPage:{first:()=>we(0),prev:Ae,next:ke,last:()=>we(Te-1),gotoPage:e=>we(e)},totalPage:W||Te,isShowPagination:!0},L.pagination))}),!G&&!!te&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(h.default,{label:K||"Item Shown",className:j.twMerge("font-normal text-dark-gumbo",ee)}),t.jsx(m,Object.assign({},te))]})),!U&&!!re&&t.jsx("div",{children:t.jsx(y,Object.assign({},re))}),!F&&R&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(h.default,{label:X||"Selected Items",className:j.twMerge("font-normal text-dark-gumbo",Y)}),t.jsx(b,{label:`${Q}`,containerStyles:j.twMerge("bg-dark-bermudaGray",Z)})]}))]})),De]})),t.jsx("div",Object.assign({className:($?"hidden":"flex")+" flex-1 relative w-full h-full overflow-auto z-10"},{children:t.jsxs(I,{children:[t.jsx(M,Object.assign({ref:ue,$isOverflowAuto:!Ne,$isLoading:L.isLoading,$isEmpty:qe,tableHeight:P,rowEvenColor:L.rowEvenColor,rowOddColor:L.rowOddColor,variant:T,className:j.twMerge("w-full h-full",L.tableContainerStyles)},{children:t.jsxs(B,Object.assign({},je(),{freezeHeader:N,variant:T,"data-test-id":L.dataTestId,rowOddColor:L.rowOddColor,rowEvenColor:L.rowEvenColor},{children:[ne&&t.jsx("div",Object.assign({className:j.twMerge("absolute top-0 flex flex-1 items-center justify-center w-full h-full bg-light-whiteSolid z-20",ae)},{children:t.jsx(x,{size:"small"})})),t.jsx(A,{headerGroups:Ce,variant:T,freezeHeader:N,textSortedStyles:L.textSortedStyles,textUnsortedStyles:L.textUnsortedStyles,iconSortedStyles:L.iconSortedStyles,iconUnsortedStyles:L.iconUnsortedStyles,headerStyles:L.headerStyles,childHeaderStyles:L.childHeaderStyles}),t.jsx(E,Object.assign({},Se(),{children:Ie.map(((o,a)=>{Oe(o);const s=()=>C&&C(o.original),i=o.getRowProps(),{key:d}=i,c=e.__rest(i,["key"]);return r.createElement("tr",Object.assign({},c,{key:d||a,style:{display:"flex",width:"auto"}}),o.cells.map(((a,i)=>{const d=a.getCellProps(l(a)),{key:c,checkboxIsDisabled:u}=d,b=e.__rest(d,["key","checkboxIsDisabled"]);return r.createElement("td",Object.assign({},b,{key:c||a.row.id,className:j.twMerge(n.default(!!a.column.parent&&"border border-t-0 border-b-0 border-solid border-dark-solitude",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&"border-l-0",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!o.cells[i-1].column.parent&&"border-r-0",o.cells[i+1]&&o.cells[i-1]&&!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&"border-l-0",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&o.cells[i-1].column.parent.id!==a.column.parent.id&&"border-r-0",!o.cells[i+1]&&"border-l-0"))}),"custom"===a.column.type?t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,onClick:a.column.disableClick?null:s},{children:a.render("Cell",Object.assign({numberAddition:ze},"selectable"===a.column.accessor?{checkboxIsDisabled:u}:{}))})):t.jsx(t.Fragment,{children:Array.isArray(a.value)?a.value.map(((e,r)=>t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,countArrayValue:me,isColSpan:!0,onClick:a.column.disableClick?null:s},{children:t.jsx(H,Object.assign({isEmpty:!e,textAlign:a.column.textAlign||k.textAlign,label:a.column.isCanShowEmptyCell?e:e||"-",variant:"small",ellipsis:!!a.value&&a.value.length>=se},a.column.textStyle))}),r))):t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,onClick:a.column.disableClick?null:s},{children:t.jsx(H,Object.assign({isEmpty:!a.value,textAlign:a.column.textAlign||k.textAlign,label:a.column.isCanShowEmptyCell?a.value:a.value||"-",variant:"small",ellipsis:!!a.value&&a.value.length>=se},a.column.textStyle))}))}))})))}))}))]}))})),qe&&!L.isLoading&&t.jsx(O,{children:t.jsx(v.EmptyData,{emptyTableHeight:w,noRecordLabel:L.noRecordLabel,noRecordComponent:L.noRecordComponent})}),L.isLoading&&t.jsx(O,{children:t.jsx(x,{size:"small",color:L.loadingColor?L.loadingColor:d.ColorBlue.yaleBlue,secondaryColor:L.loadingSecondaryColor?L.loadingSecondaryColor:d.ColorBlue.lapisLazuli})})]})}))]}))},z=({children:e})=>{const o=r.Children.toArray(e);return t.jsx("div",Object.assign({className:"flex flex-row w-full"},{children:r.Children.map(o,((e,r)=>{const o=u.getChildrenOnDisplayName(e,"ItemTabs");return t.jsx("div",Object.assign({className:"flex flex-row items-center"},{children:o}),r)}))}))};z.displayName="ListTabs",R.ListTabs=z;const N=({children:e,containerStyles:r})=>t.jsx(t.Fragment,{children:e?t.jsx("div",Object.assign({className:j.twMerge("flex flex-row flex-1",r)},{children:e})):null});N.displayName="MidTabs",R.MidTabs=N;const q=o=>{var{children:a,isActive:s}=o,l=e.__rest(o,["children","isActive"]);const[i,d]=r.useState(!1),[c,u]=r.useState(!1),b=r.useRef(null);return r.useEffect((()=>{const e=()=>{u(!1),b.current&&!b.current.matches(":hover")&&d(!1)};return c&&document.addEventListener("mouseup",e),()=>{document.removeEventListener("mouseup",e)}}),[c]),t.jsx(t.Fragment,{children:a||t.jsx("div",Object.assign({ref:b,onMouseDown:()=>u(!0),onMouseEnter:()=>d(!0),onMouseLeave:()=>{c||d(!1)}},{children:t.jsx(g.default,Object.assign({},l,{leftIconStyles:j.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||s)&&"fill-accordionTabs-button-textAndIcon-active"),l.leftIconStyles),rightIcon:s?"chevronup":l.rightIcon||"chevrondown",rightIconStyles:j.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||s)&&"fill-accordionTabs-button-textAndIcon-active"),l.rightIconStyles),className:j.twMerge(n.default("\n            bg-accordionTabs-button-background-default active:bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-hover \n            border-accordionTabs-button-border-default active:border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-hover \n            text-accordionTabs-button-textAndIcon-default active:text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-hover\n            ",s&&"\n              bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-active \n              border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-active \n              text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-active\n              "),l.className)}))}))})};q.displayName="ItemTabs",R.ItemTabs=q;const P=({children:e})=>{const n=r.useRef(null);return r.useEffect((()=>{n.current&&o.default(n.current)}),[n]),t.jsx("div",Object.assign({ref:n},{children:e}))};P.displayName="ItemContent",R.ItemContent=P,R.prototype={pageSize:a.propTypesExports.number,emptyTableHeight:a.propTypesExports.number,onClickRow:a.propTypesExports.func,variant:a.propTypesExports.string,isSelectable:a.propTypesExports.bool,freezedColumn:a.propTypesExports.number,freezeHeader:a.propTypesExports.bool,hideRowIndex:a.propTypesExports.bool,tableHeight:a.propTypesExports.number},module.exports=R;
 //# sourceMappingURL=TableResponsive.js.map