uangcermat-web-toolkit-v2 0.2.22 → 0.2.23

package/build/src/components/CheckPicker/BaseCheckPicker.d.ts

@@ -1,3 +1,3 @@
 import { BaseCheckPickerInterface } from './BaseCheckPicker.type';
-declare const BaseCheckPicker: ({ 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, isRequired, labelRequired, labelRequiredStyles, containerRequiredStyles, onSearch, selectedAllText, isShowSelectedAllText, selectedAllTextStyles, activeCheckboxColor, itemTextStyles, listContainerStyles, isClearSearchOnClose, selectedItemTextStyles, activeItemTextStyles, maxSelected }: BaseCheckPickerInterface) => import("react/jsx-runtime").JSX.Element;
+declare const BaseCheckPicker: ({ 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, isRequired, labelRequired, labelRequiredStyles, containerRequiredStyles, onSearch, selectedAllText, isShowSelectedAllText, isShowUnmatchItem, selectedAllTextStyles, activeCheckboxColor, itemTextStyles, listContainerStyles, isClearSearchOnClose, selectedItemTextStyles, activeItemTextStyles, maxSelected }: BaseCheckPickerInterface) => import("react/jsx-runtime").JSX.Element;
 export default BaseCheckPicker;

package/build/src/components/CheckPicker/BaseCheckPicker.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"),r=require("../../../node_modules/react-window/dist/index.esm.js"),a=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var n=require("../Text/BaseText.js");require("../Text/Text.js");var i=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var o=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 d=require("../Checkbox/Checkbox.js"),c=require("../Icon/Icon.js"),u=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),x=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=({value:f,valueStyles:g,label:m,labelStyles:h,placeholder:j,placeholderStyles:p,containerStyles:w,activeContainerStyles:v,iconStyles:y,itemsContainerStyles:S,itemContainerStyles:k,oddBgColor:C,evenBgColor:N,isDisabled:B=!1,position:q="bottom-start",isAutoFlip:M,onSelectItem:O,onClean:R,isCleanable:L,isError:T,errorMessage:F,errorMessageStyles:G,helperMessage:E,helperMessageStyles:_,isSearchable:D,searchContainerStyles:I,activeSearchStyles:A,searchPlaceholder:z,searchStyles:P,iconSearchStyles:$,isShowFooterButton:H,footerButtonContainerStyles:K,footerButtonLabel:V,onClickFooterButton:W,noResultsLabel:J,noResultsLabelStyles:Q,badgeContainerStyles:U,badgeLabelStyles:X,variant:Y="box",data:Z,isRequired:ee,labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:se,onSearch:re,selectedAllText:ae,isShowSelectedAllText:ne=!0,selectedAllTextStyles:ie,activeCheckboxColor:oe,itemTextStyles:de,listContainerStyles:ce,isClearSearchOnClose:ue,selectedItemTextStyles:xe,activeItemTextStyles:be,maxSelected:fe})=>{const ge=s.useRef(null),me=s.useRef(null),he=s.useRef({}),[je,pe]=s.useState(""),[we,ve]=s.useState(0),[ye,Se]=s.useState(!1),ke=e=>he.current[e]||32,Ce=s.useCallback(((e,t)=>{he.current=Object.assign(Object.assign({},he.current),{[e]:t}),me.current&&me.current.resetAfterIndex(e)}),[]),Ne=s.useMemo((()=>{const e=Z;return""!==je&&je?e.filter((e=>e.label.toLowerCase().includes(je.toLowerCase()))):e}),[je,Z]),Be=s.useMemo((()=>{let e=0;return Ne.length>0&&(e=34*Ne.length),e}),[Ne.length,je]);s.useEffect((()=>{const e=null==f?void 0:f.filter((e=>e));(null==e?void 0:e.length)>=fe?Se(!0):Se(!1)}),[f,fe]);const qe=s.useCallback(((e,t)=>{if(ye&&!t)return;let l=f.slice();l=t?l.filter((t=>t!==e)):l.concat(e),null==O||O(l.filter((e=>""!==e))),l.length===fe?Se(!0):Se(!1)}),[ye,f,O,fe]),Me=s.useCallback((()=>{null==O||O([]),pe(""),Se(!1),null==R||R()}),[O,R]),Oe=({data:t,index:r,style:i,windowWidth:o})=>{const c=s.useRef(null);return s.useEffect((()=>{c.current&&Ce(r,c.current.getBoundingClientRect().height)}),[c,o]),e.jsx("div",Object.assign({className:x.twMerge(l.default("w-full flex items-center !min-h-[32px]",k,(!!a(k,"p-")||!!a(k,"px-")||!!a(k,"py-"))&&"p-0")),style:Object.assign(Object.assign({},i),{backgroundColor:r%2==0?C||"var(--dropdownList-background-odd)":N||"var(--dropdownList-background-even)"})},{children:e.jsx("div",Object.assign({ref:c,className:"w-full"},{children:e.jsx(u.ListboxOption,Object.assign({className:x.twMerge(l.default("relative cursor-default select-none p-2 bg-transparent list-none",a(k,"p-"),a(k,"px-"),a(k,"py-"))),value:t[r]},{children:({active:s})=>{const a=f.some((e=>e===t[r].value));return e.jsxs("div",Object.assign({className:x.twMerge("flex flex-row items-center gap-x-2 cursor-pointer",ye&&!a?"cursor-not-allowed":""),onClick:e=>{e.preventDefault(),qe(t[r].value,a)}},{children:[e.jsx(d,{checked:a,variant:"small",color:oe||void 0,isDisabled:ye&&!a}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:t[r].label,className:x.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${s&&!ye?x.twMerge("font-semibold text-dropdownList-text-hover",be):"font-normal"}`),a&&xe,de)})}))]}))}}),r)}),r)}))};s.useEffect((()=>{re&&re(je)}),[je]),s.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)ve(t.contentRect.width)}));return ge.current&&e.observe(ge.current),()=>{ge.current&&e.unobserve(ge.current)}}),[]);const Re=!a(w,"w-")||"w-full"===a(w,"w-")||!a(S,"w-")||"w-full"===a(S,"w-");return e.jsx(u.Listbox,Object.assign({multiple:!0},{children:e.jsxs("div",Object.assign({ref:ge,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!m&&e.jsx(n.default,{label:m,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",h)}),ee&&e.jsx(i,{labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:se})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:q,flip:M},{children:[e.jsx(u.ListboxButton,Object.assign({className:x.twMerge(l.default("p-0 bg-transparent",B&&"cursor-not-allowed"),se?a(w,"w-"):void 0),onClick:e=>{B&&e.preventDefault()}},{children:({open:t})=>e.jsxs("div",Object.assign({className:x.twMerge(l.default(x.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",w),"line"===Y&&"border-b border-t-0 border-x-0 rounded-none",t&&v?v:t?"border-fields-border-focus":void 0,B&&"border-dark-bermudaGray bg-light-whiteSmoke",T&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!j&&""===f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(n.default,{label:j,variant:"small",className:x.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),p)})})),""===f[0]?null:e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:f.length===Z.length&&ne?e.jsx(n.default,{label:ae||"All",variant:"small",className:x.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),ie)}):e.jsx(n.default,{label:Z.filter((e=>f.includes(e.value))).map((e=>e.label)).join(", "),variant:"small",className:x.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),g)})}))]})),""!==f[0]&&e.jsx("div",Object.assign({className:x.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]",U)},{children:e.jsx(n.default,{label:f.length.toString(),className:x.twMerge(l.default("font-normal text-[8px] leading-3"),X)})})),L&&""!==f[0]&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),Me()}},{children:e.jsx(c,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(c,{name:t?"chevronup":"chevrondown",className:x.twMerge(l.default("fill-dark-bermudaGray w-3 h-3",`${B&&"fill-dark-bermudaGray"}`),y)})]}))})),e.jsx(b.Transition,Object.assign({as:s.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(u.ListboxOptions,Object.assign({className:x.twMerge(l.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver z-50",w?a(w,"w-"):void 0),S),style:{width:Re?we:void 0,height:"auto",paddingTop:"1px",paddingBottom:"1px"}},{children:({open:t})=>(s.useEffect((()=>{!t&&ue&&pe("")}),[t]),e.jsxs(e.Fragment,{children:[D?e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:x.twMerge(l.default(x.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",I),A||"border-fields-border-focus"))},{children:[e.jsx("input",{placeholder:z||"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",P),onChange:e=>{pe(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:je}),e.jsx(c,{name:"search",className:x.twMerge("fill-dark-bermudaGray w-3 h-3",$)})]}))})):null,e.jsx("div",Object.assign({className:x.twMerge(l.default("p-0 overflow-hidden",a(S,"w-")?a(S,"w-"):a(w,"w-"))),style:{width:Re?we:void 0}},{children:Ne.length>0?e.jsx(r.VariableSizeList,Object.assign({ref:me,height:Be>320?320:Be,itemCount:Ne.length,itemSize:ke,width:"100%",className:x.twMerge("max-h-80 scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",ce),itemData:Ne,style:{height:"auto",paddingTop:"1px",paddingBottom:"1px"}},{children:Oe})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(n.default,{label:J||"No Results Found",className:x.twMerge("text-dark-bermudaGray font-normal text-sm",Q)})}))})),H&&e.jsx(o.default,{variant:"tertiary",onClick:()=>{null==W||W()},label:V||"Footer Button",className:x.twMerge("",K)})]}))}))}))]}))})),E&&!T&&e.jsx(n.default,{label:E,className:x.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",_)}),T&&!!F&&e.jsx(n.default,{label:F,className:x.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",G)})]}))}))};
+"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("../../../node_modules/react-window/dist/index.esm.js"),a=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var n=require("../Text/BaseText.js");require("../Text/Text.js");var i=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var o=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 d=require("../Checkbox/Checkbox.js"),c=require("../Icon/Icon.js"),u=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),x=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=({value:f,valueStyles:g,label:m,labelStyles:h,placeholder:j,placeholderStyles:p,containerStyles:w,activeContainerStyles:v,iconStyles:y,itemsContainerStyles:S,itemContainerStyles:k,oddBgColor:C,evenBgColor:N,isDisabled:B=!1,position:q="bottom-start",isAutoFlip:M,onSelectItem:O,onClean:R,isCleanable:L,isError:T,errorMessage:F,errorMessageStyles:G,helperMessage:E,helperMessageStyles:I,isSearchable:_,searchContainerStyles:D,activeSearchStyles:A,searchPlaceholder:z,searchStyles:P,iconSearchStyles:$,isShowFooterButton:H,footerButtonContainerStyles:K,footerButtonLabel:U,onClickFooterButton:V,noResultsLabel:W,noResultsLabelStyles:J,badgeContainerStyles:Q,badgeLabelStyles:X,variant:Y="box",data:Z,isRequired:ee,labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:se,onSearch:re,selectedAllText:ae,isShowSelectedAllText:ne=!0,isShowUnmatchItem:ie=!0,selectedAllTextStyles:oe,activeCheckboxColor:de,itemTextStyles:ce,listContainerStyles:ue,isClearSearchOnClose:xe,selectedItemTextStyles:be,activeItemTextStyles:fe,maxSelected:ge})=>{const me=s.useRef(null),he=s.useRef(null),je=s.useRef({}),[pe,we]=s.useState(""),[ve,ye]=s.useState(0),[Se,ke]=s.useState(!1),Ce=e=>je.current[e]||32,Ne=s.useCallback(((e,t)=>{je.current=Object.assign(Object.assign({},je.current),{[e]:t}),he.current&&he.current.resetAfterIndex(e)}),[]),Be=s.useMemo((()=>{const e=Z;return""!==pe&&pe?e.filter((e=>e.label.toLowerCase().includes(pe.toLowerCase()))):e}),[pe,Z]),qe=s.useMemo((()=>{let e=0;return Be.length>0&&(e=34*Be.length),e}),[Be.length,pe]);s.useEffect((()=>{const e=null==f?void 0:f.filter((e=>e));(null==e?void 0:e.length)>=ge?ke(!0):ke(!1)}),[f,ge]);const Me=s.useCallback(((e,t)=>{if(Se&&!t)return;let l=f.slice();l=t?l.filter((t=>t!==e)):l.concat(e),null==O||O(l.filter((e=>""!==e))),l.length===ge?ke(!0):ke(!1)}),[Se,f,O,ge]),Oe=s.useCallback((()=>{null==O||O([]),we(""),ke(!1),null==R||R()}),[O,R]),Re=({data:t,index:r,style:i,windowWidth:o})=>{const c=s.useRef(null);return s.useEffect((()=>{c.current&&Ne(r,c.current.getBoundingClientRect().height)}),[c,o]),e.jsx("div",Object.assign({className:x.twMerge(l.default("w-full flex items-center !min-h-[32px]",k,(!!a(k,"p-")||!!a(k,"px-")||!!a(k,"py-"))&&"p-0")),style:Object.assign(Object.assign({},i),{backgroundColor:r%2==0?C||"var(--dropdownList-background-odd)":N||"var(--dropdownList-background-even)"})},{children:e.jsx("div",Object.assign({ref:c,className:"w-full"},{children:e.jsx(u.ListboxOption,Object.assign({className:x.twMerge(l.default("relative cursor-default select-none p-2 bg-transparent list-none",a(k,"p-"),a(k,"px-"),a(k,"py-"))),value:t[r]},{children:({active:s})=>{const a=f.some((e=>e===t[r].value));return e.jsxs("div",Object.assign({className:x.twMerge("flex flex-row items-center gap-x-2 cursor-pointer",Se&&!a?"cursor-not-allowed":""),onClick:e=>{e.preventDefault(),Me(t[r].value,a)}},{children:[e.jsx(d,{checked:a,variant:"small",color:de||void 0,isDisabled:Se&&!a}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:t[r].label,className:x.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${s&&!Se?x.twMerge("font-semibold text-dropdownList-text-hover",fe):"font-normal"}`),a&&be,ce)})}))]}))}}),r)}),r)}))};s.useEffect((()=>{re&&re(pe)}),[pe]),s.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)ye(t.contentRect.width)}));return me.current&&e.observe(me.current),()=>{me.current&&e.unobserve(me.current)}}),[]);const Le=!a(w,"w-")||"w-full"===a(w,"w-")||!a(S,"w-")||"w-full"===a(S,"w-");return e.jsx(u.Listbox,Object.assign({multiple:!0},{children:e.jsxs("div",Object.assign({ref:me,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!m&&e.jsx(n.default,{label:m,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",h)}),ee&&e.jsx(i,{labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:se})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:q,flip:M},{children:[e.jsx(u.ListboxButton,Object.assign({className:x.twMerge(l.default("p-0 bg-transparent",B&&"cursor-not-allowed"),se?a(w,"w-"):void 0),onClick:e=>{B&&e.preventDefault()}},{children:({open:t})=>e.jsxs("div",Object.assign({className:x.twMerge(l.default(x.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",w),"line"===Y&&"border-b border-t-0 border-x-0 rounded-none",t&&v?v:t?"border-fields-border-focus":void 0,B&&"border-dark-bermudaGray bg-light-whiteSmoke",T&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!j&&""===f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(n.default,{label:j,variant:"small",className:x.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),p)})})),""===f[0]?null:e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:f.length===Z.length&&ne?e.jsx(n.default,{label:ae||"All",variant:"small",className:x.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),oe)}):e.jsx(n.default,{label:ie?f.map((e=>{var t;return(null===(t=Z.find((t=>t.value===e)))||void 0===t?void 0:t.label)||e})).join(", "):Z.filter((e=>f.includes(e.value))).map((e=>e.label||e)).join(", "),variant:"small",className:x.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),g)})}))]})),""!==f[0]&&e.jsx("div",Object.assign({className:x.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]",Q)},{children:e.jsx(n.default,{label:f.length.toString(),className:x.twMerge(l.default("font-normal text-[8px] leading-3"),X)})})),L&&""!==f[0]&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),Oe()}},{children:e.jsx(c,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(c,{name:t?"chevronup":"chevrondown",className:x.twMerge(l.default("fill-dark-bermudaGray w-3 h-3",`${B&&"fill-dark-bermudaGray"}`),y)})]}))})),e.jsx(b.Transition,Object.assign({as:s.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(u.ListboxOptions,Object.assign({className:x.twMerge(l.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver z-50",w?a(w,"w-"):void 0),S),style:{width:Le?ve:void 0,height:"auto",paddingTop:"1px",paddingBottom:"1px"}},{children:({open:t})=>(s.useEffect((()=>{!t&&xe&&we("")}),[t]),e.jsxs(e.Fragment,{children:[_?e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:x.twMerge(l.default(x.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",D),A||"border-fields-border-focus"))},{children:[e.jsx("input",{placeholder:z||"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",P),onChange:e=>{we(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:pe}),e.jsx(c,{name:"search",className:x.twMerge("fill-dark-bermudaGray w-3 h-3",$)})]}))})):null,e.jsx("div",Object.assign({className:x.twMerge(l.default("p-0 overflow-hidden",a(S,"w-")?a(S,"w-"):a(w,"w-"))),style:{width:Le?ve:void 0}},{children:Be.length>0?e.jsx(r.VariableSizeList,Object.assign({ref:he,height:qe>320?320:qe,itemCount:Be.length,itemSize:Ce,width:"100%",className:x.twMerge("max-h-80 scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",ue),itemData:Be,style:{height:"auto",paddingTop:"1px",paddingBottom:"1px"}},{children:Re})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(n.default,{label:W||"No Results Found",className:x.twMerge("text-dark-bermudaGray font-normal text-sm",J)})}))})),H&&e.jsx(o.default,{variant:"tertiary",onClick:()=>{null==V||V()},label:U||"Footer Button",className:x.twMerge("",K)})]}))}))}))]}))})),E&&!T&&e.jsx(n.default,{label:E,className:x.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",I)}),T&&!!F&&e.jsx(n.default,{label:F,className:x.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",G)})]}))}))};
 //# sourceMappingURL=BaseCheckPicker.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseCheckPicker.js","sources":["../../../../src/components/CheckPicker/BaseCheckPicker.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 { ListChildComponentProps, VariableSizeList as List } from 'react-window';\nimport { twMerge } from 'tailwind-merge';\n\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 { BaseCheckPickerDataInterface, BaseCheckPickerInterface } from './BaseCheckPicker.type';\n\ninterface RowProps extends ListChildComponentProps {\n  setSize: (index: number, size: number) => void;\n  windowWidth: number;\n}\n\nconst BaseCheckPicker = ({\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  data,\n  isRequired,\n  labelRequired,\n  labelRequiredStyles,\n  containerRequiredStyles,\n  onSearch,\n  selectedAllText,\n  isShowSelectedAllText = true,\n  selectedAllTextStyles,\n  activeCheckboxColor,\n  itemTextStyles,\n  listContainerStyles,\n  isClearSearchOnClose,\n  selectedItemTextStyles,\n  activeItemTextStyles,\n  maxSelected\n}: BaseCheckPickerInterface) => {\n  const rowHeight = 34;\n  const dafaultScrollbarStyles =\n    'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<List>(null);\n  const sizeMap = useRef<{ [key: number]: number }>({});\n\n  const [search, setSearch] = useState<string>('');\n  const [buttonWidth, setButtonWidth] = useState<number>(0);\n  const [isDisableSelected, setIsDisableSelected] = useState<boolean>(false);\n\n  const getSize = (index: number) => sizeMap.current[index] || 32;\n  const setSize = useCallback((index: number, size: number) => {\n    sizeMap.current = { ...sizeMap.current, [index]: size };\n    if (listRef.current) {\n      listRef.current.resetAfterIndex(index);\n    }\n  }, []);\n\n  const dataPicker: Array<BaseCheckPickerDataInterface> = useMemo(() => {\n    const temp: Array<BaseCheckPickerDataInterface> = data;\n    return search === '' || !search\n      ? temp\n      : temp.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()));\n  }, [search, data]);\n\n  const dropdownListHeight = useMemo(() => {\n    let temp = 0;\n    if (dataPicker.length > 0) {\n      temp = rowHeight * dataPicker.length;\n    }\n    return temp;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataPicker.length, search]);\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 RenderRow: React.FC = ({ data, index, style, windowWidth }: RowProps) => {\n    const rowRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n      if (rowRef.current) {\n        setSize(index, rowRef.current.getBoundingClientRect().height);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [rowRef, windowWidth]);\n\n    return (\n      <div\n        className={twMerge(\n          classNames(\n            'w-full flex items-center !min-h-[32px]',\n            itemContainerStyles,\n            (!!extractClasses(itemContainerStyles, 'p-') ||\n              !!extractClasses(itemContainerStyles, 'px-') ||\n              !!extractClasses(itemContainerStyles, 'py-')) &&\n              'p-0'\n          )\n        )}\n        style={{\n          ...style,\n          backgroundColor:\n            index % 2 === 0\n              ? oddBgColor || 'var(--dropdownList-background-odd)'\n              : evenBgColor || 'var(--dropdownList-background-even)'\n        }}\n      >\n        <div ref={rowRef} key={index} className='w-full'>\n          <ListboxOption\n            key={index}\n            className={twMerge(\n              classNames(\n                'relative cursor-default select-none p-2 bg-transparent list-none',\n                extractClasses(itemContainerStyles, 'p-'),\n                extractClasses(itemContainerStyles, 'px-'),\n                extractClasses(itemContainerStyles, 'py-')\n              )\n            )}\n            value={data[index]}\n          >\n            {({ active }) => {\n              const selected = value.some((i) => i === data[index].value);\n              return (\n                <div\n                  className={twMerge(\n                    'flex flex-row items-center gap-x-2 cursor-pointer',\n                    isDisableSelected && !selected ? 'cursor-not-allowed' : ''\n                  )}\n                  onClick={(e) => {\n                    e.preventDefault();\n                    handleItemClick(data[index].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={data[index].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              );\n            }}\n          </ListboxOption>\n        </div>\n      </div>\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  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 renderSelectedValue = () => {\n    if (value[0] === '') return null;\n\n    return (\n      <div className='flex flex-1 w-[calc(100%-52px)]'>\n        {value.length === data.length && 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={data\n              .filter((i: BaseCheckPickerDataInterface) => value.includes(i.value))\n              .map((i) => i.label)\n              .join(', ')}\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 && value[0] === '' && (\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                  {value[0] !== '' && (\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 && value[0] !== '' && (\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 z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{\n                  width: isWidthFull ? buttonWidth : undefined,\n                  height: 'auto',\n                  paddingTop: '1px',\n                  paddingBottom: '1px'\n                }}\n              >\n                {({ open }) => {\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (!open && isClearSearchOnClose) setSearch('');\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                          <List\n                            ref={listRef}\n                            height={dropdownListHeight > 320 ? 320 : dropdownListHeight}\n                            itemCount={dataPicker.length}\n                            itemSize={getSize}\n                            width={'100%'}\n                            className={twMerge(\n                              `max-h-80 ${dafaultScrollbarStyles}`,\n                              listContainerStyles\n                            )}\n                            itemData={dataPicker}\n                            style={{\n                              height: 'auto',\n                              paddingTop: '1px',\n                              paddingBottom: '1px'\n                            }}\n                          >\n                            {RenderRow}\n                          </List>\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 BaseCheckPicker;\n"],"names":["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","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","selectedAllText","isShowSelectedAllText","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","maxSelected","containerRef","useRef","listRef","sizeMap","search","setSearch","useState","buttonWidth","setButtonWidth","isDisableSelected","setIsDisableSelected","getSize","index","current","setSize","useCallback","size","Object","assign","resetAfterIndex","dataPicker","useMemo","temp","filter","item","toLowerCase","includes","dropdownListHeight","length","useEffect","filteredValue","handleItemClick","itemValue","isSelected","slice","i","concat","handleClean","RenderRow","style","windowWidth","rowRef","getBoundingClientRect","height","_jsx","className","twMerge","classNames","extractClasses","backgroundColor","children","ref","ListboxOption","active","selected","some","_jsxs","onClick","e","preventDefault","jsx","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","observe","unobserve","isWidthFull","Listbox","multiple","jsxs","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","join","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","paddingTop","paddingBottom","_Fragment","onChange","target","onKeyDown","stopPropagation","List","itemCount","itemSize","itemData","BaseButton"],"mappings":"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"}
+{"version":3,"file":"BaseCheckPicker.js","sources":["../../../../src/components/CheckPicker/BaseCheckPicker.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 { ListChildComponentProps, VariableSizeList as List } from 'react-window';\nimport { twMerge } from 'tailwind-merge';\n\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 { BaseCheckPickerDataInterface, BaseCheckPickerInterface } from './BaseCheckPicker.type';\n\ninterface RowProps extends ListChildComponentProps {\n  setSize: (index: number, size: number) => void;\n  windowWidth: number;\n}\n\nconst BaseCheckPicker = ({\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  data,\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}: BaseCheckPickerInterface) => {\n  const rowHeight = 34;\n  const dafaultScrollbarStyles =\n    'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<List>(null);\n  const sizeMap = useRef<{ [key: number]: number }>({});\n\n  const [search, setSearch] = useState<string>('');\n  const [buttonWidth, setButtonWidth] = useState<number>(0);\n  const [isDisableSelected, setIsDisableSelected] = useState<boolean>(false);\n\n  const getSize = (index: number) => sizeMap.current[index] || 32;\n  const setSize = useCallback((index: number, size: number) => {\n    sizeMap.current = { ...sizeMap.current, [index]: size };\n    if (listRef.current) {\n      listRef.current.resetAfterIndex(index);\n    }\n  }, []);\n\n  const dataPicker: Array<BaseCheckPickerDataInterface> = useMemo(() => {\n    const temp: Array<BaseCheckPickerDataInterface> = data;\n    return search === '' || !search\n      ? temp\n      : temp.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()));\n  }, [search, data]);\n\n  const dropdownListHeight = useMemo(() => {\n    let temp = 0;\n    if (dataPicker.length > 0) {\n      temp = rowHeight * dataPicker.length;\n    }\n    return temp;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataPicker.length, search]);\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 RenderRow: React.FC = ({ data, index, style, windowWidth }: RowProps) => {\n    const rowRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n      if (rowRef.current) {\n        setSize(index, rowRef.current.getBoundingClientRect().height);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [rowRef, windowWidth]);\n\n    return (\n      <div\n        className={twMerge(\n          classNames(\n            'w-full flex items-center !min-h-[32px]',\n            itemContainerStyles,\n            (!!extractClasses(itemContainerStyles, 'p-') ||\n              !!extractClasses(itemContainerStyles, 'px-') ||\n              !!extractClasses(itemContainerStyles, 'py-')) &&\n              'p-0'\n          )\n        )}\n        style={{\n          ...style,\n          backgroundColor:\n            index % 2 === 0\n              ? oddBgColor || 'var(--dropdownList-background-odd)'\n              : evenBgColor || 'var(--dropdownList-background-even)'\n        }}\n      >\n        <div ref={rowRef} key={index} className='w-full'>\n          <ListboxOption\n            key={index}\n            className={twMerge(\n              classNames(\n                'relative cursor-default select-none p-2 bg-transparent list-none',\n                extractClasses(itemContainerStyles, 'p-'),\n                extractClasses(itemContainerStyles, 'px-'),\n                extractClasses(itemContainerStyles, 'py-')\n              )\n            )}\n            value={data[index]}\n          >\n            {({ active }) => {\n              const selected = value.some((i) => i === data[index].value);\n              return (\n                <div\n                  className={twMerge(\n                    'flex flex-row items-center gap-x-2 cursor-pointer',\n                    isDisableSelected && !selected ? 'cursor-not-allowed' : ''\n                  )}\n                  onClick={(e) => {\n                    e.preventDefault();\n                    handleItemClick(data[index].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={data[index].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              );\n            }}\n          </ListboxOption>\n        </div>\n      </div>\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  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 renderSelectedValue = () => {\n    if (value[0] === '') return null;\n\n    return (\n      <div className='flex flex-1 w-[calc(100%-52px)]'>\n        {value.length === data.length && 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.map((i) => data.find((item) => item.value === i)?.label || i).join(', ')\n                : data\n                    .filter((i: BaseCheckPickerDataInterface) => 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 && value[0] === '' && (\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                  {value[0] !== '' && (\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 && value[0] !== '' && (\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 z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{\n                  width: isWidthFull ? buttonWidth : undefined,\n                  height: 'auto',\n                  paddingTop: '1px',\n                  paddingBottom: '1px'\n                }}\n              >\n                {({ open }) => {\n                  // eslint-disable-next-line react-hooks/rules-of-hooks\n                  useEffect(() => {\n                    if (!open && isClearSearchOnClose) setSearch('');\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                          <List\n                            ref={listRef}\n                            height={dropdownListHeight > 320 ? 320 : dropdownListHeight}\n                            itemCount={dataPicker.length}\n                            itemSize={getSize}\n                            width={'100%'}\n                            className={twMerge(\n                              `max-h-80 ${dafaultScrollbarStyles}`,\n                              listContainerStyles\n                            )}\n                            itemData={dataPicker}\n                            style={{\n                              height: 'auto',\n                              paddingTop: '1px',\n                              paddingBottom: '1px'\n                            }}\n                          >\n                            {RenderRow}\n                          </List>\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 BaseCheckPicker;\n"],"names":["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","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","selectedAllText","isShowSelectedAllText","isShowUnmatchItem","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","maxSelected","containerRef","useRef","listRef","sizeMap","search","setSearch","useState","buttonWidth","setButtonWidth","isDisableSelected","setIsDisableSelected","getSize","index","current","setSize","useCallback","size","Object","assign","resetAfterIndex","dataPicker","useMemo","temp","filter","item","toLowerCase","includes","dropdownListHeight","length","useEffect","filteredValue","handleItemClick","itemValue","isSelected","slice","i","concat","handleClean","RenderRow","style","windowWidth","rowRef","getBoundingClientRect","height","_jsx","className","twMerge","classNames","extractClasses","backgroundColor","children","ref","ListboxOption","active","selected","some","_jsxs","onClick","e","preventDefault","jsx","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","observe","unobserve","isWidthFull","Listbox","multiple","jsxs","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","_a","find","join","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","paddingTop","paddingBottom","_Fragment","onChange","target","onKeyDown","stopPropagation","List","itemCount","itemSize","itemData","BaseButton"],"mappings":"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"}

package/build/src/components/CheckPicker/BaseCheckPicker.type.d.ts

@@ -57,6 +57,7 @@ export type BaseCheckPickerInterface = {
     selectedAllText?: string;
     selectedAllTextStyles?: string;
     isShowSelectedAllText?: boolean;
+    isShowUnmatchItem?: boolean;
     activeCheckboxColor?: string;
     itemTextStyles?: string;
     listContainerStyles?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uangcermat-web-toolkit-v2",
-  "version": "0.2.22",
+  "version": "0.2.23",
   "outputDir": "build",
   "main": "build/src/index.js",
   "types": "build/src/index.d.ts",