uangcermat-web-toolkit-v2 0.2.2 → 0.2.4

package/build/src/components/Breadcrumbs/BaseBreadcrumbs.d.ts

@@ -1,8 +1,8 @@
 import { BaseBreadcrumbInterface, BaseBreadcrumbsChildInterface } from './BaseBreadcrumbs.type';
 declare const BaseBreadcrumbs: {
-    ({ children }: BaseBreadcrumbInterface): import("react/jsx-runtime").JSX.Element;
+    ({ children, containerStyles }: BaseBreadcrumbInterface): import("react/jsx-runtime").JSX.Element;
     Child: {
-        ({ label, labelStyles, iconStyles, linkContainerStyles, children, ...props }: BaseBreadcrumbsChildInterface): import("react/jsx-runtime").JSX.Element;
+        ({ label, labelStyles, iconStyles, iconContainerStyles, linkContainerStyles, children, ...props }: BaseBreadcrumbsChildInterface): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
 };

package/build/src/components/Breadcrumbs/BaseBreadcrumbs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),l=require("react"),s=require("../../utils/getChildrenOnDisplayName.js"),t=require("../Icon/Icon.js"),i=require("../Text/BaseText.js");require("../Text/Text.js");var n=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js");const a=({children:e})=>{const t=l.Children.toArray(e);return r.jsx("div",Object.assign({className:"flex flex-1 flex-row items-center h-full mr-4 gap-x-3"},{children:l.Children.map(t,((e,l)=>{const t=s.getChildrenOnDisplayName(e,"Child");return r.jsx("div",Object.assign({className:"flex flex-row items-center"},{children:t}),l)}))}))},c=l=>{var{label:s,labelStyles:a,iconStyles:c,linkContainerStyles:d,children:o}=l,x=e.__rest(l,["label","labelStyles","iconStyles","linkContainerStyles","children"]);return r.jsx(r.Fragment,{children:o||r.jsx("a",Object.assign({},x,{children:r.jsxs("div",Object.assign({className:n.twMerge("flex flex-row items-center p-0 bg-transparent gap-x-3",d)},{children:[r.jsx(i.default,{label:s||"",className:n.twMerge("text-sm font-semibold text-hyperlink-color-default hover:underline decoration-hyperlink-color-default cursor-pointer",a)}),r.jsx(t,{name:"chevronright",className:n.twMerge("w-[6px] h-[10px] fill-dark-gumbo",c)})]}))}))})};c.displayName="Child",a.Child=c,module.exports=a;
+"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),l=require("react"),t=require("../../utils/getChildrenOnDisplayName.js"),s=require("../Icon/Icon.js"),i=require("../Text/BaseText.js");require("../Text/Text.js");var n=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js");const a=({children:e,containerStyles:s})=>{const i=l.Children.toArray(e);return r.jsx("div",Object.assign({className:n.twMerge("flex flex-1 flex-row items-center h-full mr-4 gap-x-1",s)},{children:l.Children.map(i,((e,l)=>{const s=t.getChildrenOnDisplayName(e,"Child");return r.jsx("div",Object.assign({className:"flex flex-row items-center"},{children:s}),l)}))}))},c=l=>{var{label:t,labelStyles:a,iconStyles:c,iconContainerStyles:o,linkContainerStyles:d,children:x}=l,m=e.__rest(l,["label","labelStyles","iconStyles","iconContainerStyles","linkContainerStyles","children"]);return r.jsx(r.Fragment,{children:x||r.jsx("a",Object.assign({},m,{children:r.jsxs("div",Object.assign({className:n.twMerge("flex flex-row items-center p-0 bg-transparent gap-x-1",d)},{children:[r.jsx(i.default,{label:t||"",className:n.twMerge("text-sm font-semibold text-hyperlink-color-default hover:underline decoration-hyperlink-color-default cursor-pointer",a)}),r.jsx("div",Object.assign({className:n.twMerge("w-4 h-4 flex items-center justify-center",o)},{children:r.jsx(s,{name:"chevronright",className:n.twMerge("w-[6px] h-[10px] fill-dark-gumbo",c)})}))]}))}))})};c.displayName="Child",a.Child=c,module.exports=a;
 //# sourceMappingURL=BaseBreadcrumbs.js.map

package/build/src/components/Breadcrumbs/BaseBreadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseBreadcrumbs.js","sources":["../../../../src/components/Breadcrumbs/BaseBreadcrumbs.tsx"],"sourcesContent":["import React, { Children } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport { getChildrenOnDisplayName } from '../..//utils/getChildrenOnDisplayName';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport { BaseBreadcrumbInterface, BaseBreadcrumbsChildInterface } from './BaseBreadcrumbs.type';\n\nconst BaseBreadcrumbs = ({ children }: BaseBreadcrumbInterface) => {\n  const arrayChildren = Children.toArray(children);\n\n  return (\n    <div className='flex flex-1 flex-row items-center h-full mr-4 gap-x-3'>\n      {Children.map(arrayChildren, (item, index) => {\n        const child = getChildrenOnDisplayName(item, 'Child');\n        return (\n          <div key={index} className='flex flex-row items-center'>\n            {child}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nconst Child = ({\n  label,\n  labelStyles,\n  iconStyles,\n  linkContainerStyles,\n  children,\n  ...props\n}: BaseBreadcrumbsChildInterface) => (\n  <>\n    {children ? (\n      children\n    ) : (\n      <a {...props}>\n        <div\n          className={twMerge(\n            'flex flex-row items-center p-0 bg-transparent gap-x-3',\n            linkContainerStyles\n          )}\n        >\n          <BaseText\n            label={label || ''}\n            className={twMerge(\n              'text-sm font-semibold text-hyperlink-color-default hover:underline decoration-hyperlink-color-default cursor-pointer',\n              labelStyles\n            )}\n          />\n\n          <Icon\n            name='chevronright'\n            className={twMerge('w-[6px] h-[10px] fill-dark-gumbo', iconStyles)}\n          />\n        </div>\n      </a>\n    )}\n  </>\n);\nChild.displayName = 'Child';\nBaseBreadcrumbs.Child = Child;\n\nexport default BaseBreadcrumbs;\n"],"names":["BaseBreadcrumbs","children","arrayChildren","Children","toArray","_jsx","Object","assign","className","map","item","index","child","getChildrenOnDisplayName","jsx","Child","_a","label","labelStyles","iconStyles","linkContainerStyles","props","__rest","_Fragment","_jsxs","twMerge","BaseText","Icon","name","displayName"],"mappings":"yUAQA,MAAMA,EAAkB,EAAGC,eACzB,MAAMC,EAAgBC,EAAAA,SAASC,QAAQH,GAEvC,OACEI,EAAAA,IAAK,MAAAC,OAAAC,OAAA,CAAAC,UAAU,mEACZL,EAAQA,SAACM,IAAIP,GAAe,CAACQ,EAAMC,KAClC,MAAMC,EAAQC,EAAAA,yBAAyBH,EAAM,SAC7C,OACEL,EAAiBS,IAAA,MAAAR,OAAAC,OAAA,CAAAC,UAAU,8BACxB,CAAAP,SAAAW,IADOD,EAGV,MAGN,EAGEI,EAASC,IAAA,IAAAC,MACbA,EAAKC,YACLA,EAAWC,WACXA,EAAUC,oBACVA,EAAmBnB,SACnBA,GAE8Be,EAD3BK,EAAKC,EAAAA,OAAAN,EANK,uEAOsB,OACnCX,MAAAkB,EAAAA,SAAA,CAAAtB,SACGA,GAGCI,EAAOS,IAAA,IAAAR,OAAAC,OAAA,CAAA,EAAAc,EACL,CAAApB,SAAAuB,OAAA,MAAAlB,OAAAC,OAAA,CACEC,UAAWiB,EAAOA,QAChB,wDACAL,IACD,CAAAnB,SAAA,CAEDI,MAACqB,EAAAA,QACC,CAAAT,MAAOA,GAAS,GAChBT,UAAWiB,UACT,uHACAP,KAIJb,EAACS,IAAAa,GACCC,KAAK,eACLpB,UAAWiB,EAAOA,QAAC,mCAAoCN,aAMlE,EACDJ,EAAMc,YAAc,QACpB7B,EAAgBe,MAAQA"}
+{"version":3,"file":"BaseBreadcrumbs.js","sources":["../../../../src/components/Breadcrumbs/BaseBreadcrumbs.tsx"],"sourcesContent":["import React, { Children } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport { getChildrenOnDisplayName } from '../..//utils/getChildrenOnDisplayName';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport { BaseBreadcrumbInterface, BaseBreadcrumbsChildInterface } from './BaseBreadcrumbs.type';\n\nconst BaseBreadcrumbs = ({ children, containerStyles }: BaseBreadcrumbInterface) => {\n  const arrayChildren = Children.toArray(children);\n\n  return (\n    <div\n      className={twMerge('flex flex-1 flex-row items-center h-full mr-4 gap-x-1', containerStyles)}\n    >\n      {Children.map(arrayChildren, (item, index) => {\n        const child = getChildrenOnDisplayName(item, 'Child');\n        return (\n          <div key={index} className='flex flex-row items-center'>\n            {child}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nconst Child = ({\n  label,\n  labelStyles,\n  iconStyles,\n  iconContainerStyles,\n  linkContainerStyles,\n  children,\n  ...props\n}: BaseBreadcrumbsChildInterface) => (\n  <>\n    {children ? (\n      children\n    ) : (\n      <a {...props}>\n        <div\n          className={twMerge(\n            'flex flex-row items-center p-0 bg-transparent gap-x-1',\n            linkContainerStyles\n          )}\n        >\n          <BaseText\n            label={label || ''}\n            className={twMerge(\n              'text-sm font-semibold text-hyperlink-color-default hover:underline decoration-hyperlink-color-default cursor-pointer',\n              labelStyles\n            )}\n          />\n          <div className={twMerge('w-4 h-4 flex items-center justify-center', iconContainerStyles)}>\n            <Icon\n              name='chevronright'\n              className={twMerge('w-[6px] h-[10px] fill-dark-gumbo', iconStyles)}\n            />\n          </div>\n        </div>\n      </a>\n    )}\n  </>\n);\nChild.displayName = 'Child';\nBaseBreadcrumbs.Child = Child;\n\nexport default BaseBreadcrumbs;\n"],"names":["BaseBreadcrumbs","children","containerStyles","arrayChildren","Children","toArray","_jsx","className","twMerge","map","item","index","child","getChildrenOnDisplayName","jsx","Object","assign","Child","_a","label","labelStyles","iconStyles","iconContainerStyles","linkContainerStyles","props","__rest","_Fragment","_jsxs","BaseText","Icon","name","displayName"],"mappings":"yUAQM,MAAAA,EAAkB,EAAGC,WAAUC,sBACnC,MAAMC,EAAgBC,EAAAA,SAASC,QAAQJ,GAEvC,OACEK,EAAAA,yBACEC,UAAWC,EAAAA,QAAQ,wDAAyDN,IAAgB,CAAAD,SAE3FG,EAAQA,SAACK,IAAIN,GAAe,CAACO,EAAMC,KAClC,MAAMC,EAAQC,EAAAA,yBAAyBH,EAAM,SAC7C,OACEJ,EAAiBQ,IAAA,MAAAC,OAAAC,OAAA,CAAAT,UAAU,8BACxB,CAAAN,SAAAW,IADOD,EAGV,MAGN,EAGEM,EAASC,IAAA,IAAAC,MACbA,EAAKC,YACLA,EAAWC,WACXA,EAAUC,oBACVA,EAAmBC,oBACnBA,EAAmBtB,SACnBA,GAE8BiB,EAD3BM,EAAKC,EAAAA,OAAAP,EAPK,6FAQsB,OACnCZ,EAAAA,IACGoB,EAAAA,SAAA,CAAAzB,SAAAA,GAGCK,EAAOQ,IAAA,IAAAC,OAAAC,OAAA,CAAA,EAAAQ,YACLG,EAAAA,KACE,MAAAZ,OAAAC,OAAA,CAAAT,UAAWC,EAAOA,QAChB,wDACAe,eAGFjB,EAACQ,IAAAc,EAAQ,QACP,CAAAT,MAAOA,GAAS,GAChBZ,UAAWC,EAAOA,QAChB,uHACAY,KAGJd,EAAAA,yBAAKC,UAAWC,EAAOA,QAAC,2CAA4Cc,IAAoB,CAAArB,SACtFK,EAAAA,IAACuB,EAAI,CACHC,KAAK,eACLvB,UAAWC,EAAOA,QAAC,mCAAoCa,gBAOpE,EACDJ,EAAMc,YAAc,QACpB/B,EAAgBiB,MAAQA"}

package/build/src/components/Breadcrumbs/BaseBreadcrumbs.type.d.ts

@@ -3,9 +3,11 @@ export type BaseBreadcrumbsChildInterface = {
     label?: string;
     labelStyles?: string;
     iconStyles?: string;
+    iconContainerStyles?: string;
     linkContainerStyles?: string;
     children?: React.ReactNode;
 } & React.HTMLProps<HTMLAnchorElement>;
 export type BaseBreadcrumbInterface = {
     children?: React.ReactNode;
+    containerStyles?: string;
 };

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, selectedAllTextStyles, activeCheckboxColor, itemTextStyles, listContainerStyles, isClearSearchOnClose, selectedItemTextStyles, activeItemTextStyles }: 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, 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"),r=require("react"),s=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:m,label:g,labelStyles:j,placeholder:h,placeholderStyles:p,containerStyles:w,activeContainerStyles:v,iconStyles:y,itemsContainerStyles:k,itemContainerStyles:S,oddBgColor:C,evenBgColor:N,isDisabled:q=!1,position:O="bottom-start",isAutoFlip:B,onSelectItem:M,onClean:R,isCleanable:L,isError:T,errorMessage:F,errorMessageStyles:G,helperMessage:E,helperMessageStyles:_,isSearchable:I,searchContainerStyles:D,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:re,onSearch:se,selectedAllText:ae,selectedAllTextStyles:ne,activeCheckboxColor:ie,itemTextStyles:oe,listContainerStyles:de,isClearSearchOnClose:ce,selectedItemTextStyles:ue,activeItemTextStyles:xe})=>{const be=r.useRef(null),fe=r.useRef(null),me=r.useRef({}),[ge,je]=r.useState(""),[he,pe]=r.useState(0),we=e=>me.current[e]||32,ve=r.useCallback(((e,t)=>{me.current=Object.assign(Object.assign({},me.current),{[e]:t}),fe.current&&fe.current.resetAfterIndex(e)}),[]),ye=r.useMemo((()=>{const e=Z;return""!==ge&&ge?e.filter((e=>e.label.toLowerCase().includes(ge.toLowerCase()))):e}),[ge,Z]),ke=r.useMemo((()=>{let e=0;return ye.length>0&&(e=34*ye.length),e}),[ye.length,ge]),Se=({data:t,index:s,style:i,windowWidth:o})=>{const c=r.useRef(null);return r.useEffect((()=>{c.current&&ve(s,c.current.getBoundingClientRect().height)}),[c,o]),e.jsx("div",Object.assign({className:x.twMerge(l.default("w-full flex items-center !min-h-[32px]",S,(!!a(S,"p-")||!!a(S,"px-")||!!a(S,"py-"))&&"p-0")),style:Object.assign(Object.assign({},i),{backgroundColor:s%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(S,"p-"),a(S,"px-"),a(S,"py-"))),value:t[s]},{children:({active:r})=>{const a=f.some((e=>e===t[s].value));return e.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2 cursor-pointer",onClick:e=>{e.preventDefault();let l=f.slice();l=a?l.filter((e=>e!==t[s].value)):l.concat(t[s].value),null==M||M(l.filter((e=>""!==e)))}},{children:[e.jsx(d,{checked:a,variant:"small",color:ie||void 0}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:t[s].label,className:x.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${r?x.twMerge("font-semibold text-dropdownList-text-hover",xe):"font-normal"}`),a&&ue,oe)})}))]}))}}),s)}),s)}))};r.useEffect((()=>{se&&se(ge)}),[ge]),r.useEffect((()=>{se&&se(ge)}),[ge]),r.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)pe(t.contentRect.width)}));return be.current&&e.observe(be.current),()=>{be.current&&e.unobserve(be.current)}}),[]);const Ce=!a(w,"w-")||"w-full"===a(w,"w-")||!a(k,"w-")||"w-full"===a(k,"w-");return e.jsx(u.Listbox,Object.assign({multiple:!0},{children:e.jsxs("div",Object.assign({ref:be,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!g&&e.jsx(n.default,{label:g,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",j)}),ee&&e.jsx(i,{labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:re})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:O,flip:B},{children:[e.jsx(u.ListboxButton,Object.assign({className:x.twMerge(l.default("p-0 bg-transparent",q&&"cursor-not-allowed"),re?a(w,"w-"):void 0),onClick:e=>{q&&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,q&&"border-dark-bermudaGray bg-light-whiteSmoke",T&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!h&&""===f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(n.default,{label:h,variant:"small",className:x.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),p)})})),""!==f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:f.length===Z.length?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]"),ne)}):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]"),m)})}))]})),""!==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(),null==M||M([]),je(""),null==R||R()}},{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",`${q&&"fill-dark-bermudaGray"}`),y)})]}))})),e.jsx(b.Transition,Object.assign({as:r.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),k),style:{width:Ce?he:void 0}},{children:({open:t})=>(r.useEffect((()=>{!t&&ce&&je("")}),[t]),e.jsxs(e.Fragment,{children:[I&&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),t&&A?A:t?"border-fields-border-focus":void 0))},{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=>{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",$)})]}))})),e.jsx("div",Object.assign({className:x.twMerge(l.default("p-0 overflow-hidden",a(k,"w-")?a(k,"w-"):a(w,"w-"))),style:{width:Ce?he:void 0}},{children:ye.length>0?e.jsx(s.VariableSizeList,Object.assign({ref:fe,height:ke>320?320:ke,itemCount:ye.length,itemSize:we,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",de),itemData:ye},{children:Se})):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"),r=require("react"),s=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:m,label:g,labelStyles:j,placeholder:h,placeholderStyles:w,containerStyles:p,activeContainerStyles:v,iconStyles:y,itemsContainerStyles:S,itemContainerStyles:k,oddBgColor:C,evenBgColor:N,isDisabled:q=!1,position:M="bottom-start",isAutoFlip:O,onSelectItem:B,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:re,onSearch:se,selectedAllText:ae,selectedAllTextStyles:ne,activeCheckboxColor:ie,itemTextStyles:oe,listContainerStyles:de,isClearSearchOnClose:ce,selectedItemTextStyles:ue,activeItemTextStyles:xe,maxSelected:be})=>{const fe=r.useRef(null),me=r.useRef(null),ge=r.useRef({}),[je,he]=r.useState(""),[we,pe]=r.useState(0),[ve,ye]=r.useState(!1),Se=e=>ge.current[e]||32,ke=r.useCallback(((e,t)=>{ge.current=Object.assign(Object.assign({},ge.current),{[e]:t}),me.current&&me.current.resetAfterIndex(e)}),[]),Ce=r.useMemo((()=>{const e=Z;return""!==je&&je?e.filter((e=>e.label.toLowerCase().includes(je.toLowerCase()))):e}),[je,Z]),Ne=r.useMemo((()=>{let e=0;return Ce.length>0&&(e=34*Ce.length),e}),[Ce.length,je]),qe=({data:t,index:s,style:i,windowWidth:o})=>{const c=r.useRef(null);return r.useEffect((()=>{c.current&&ke(s,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:s%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[s]},{children:({active:r})=>{const a=f.some((e=>e===t[s].value));return e.jsxs("div",Object.assign({className:x.twMerge("flex flex-row items-center gap-x-2 cursor-pointer",ve&&!a?"cursor-not-allowed":""),onClick:e=>{if(e.preventDefault(),ve&&!a)return;let l=f.slice();l=a?l.filter((e=>e!==t[s].value)):l.concat(t[s].value),null==B||B(l.filter((e=>""!==e))),l.length===be?ye(!0):ye(!1)}},{children:[e.jsx(d,{checked:a,variant:"small",color:ie||void 0,isDisabled:ve&&!a}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:t[s].label,className:x.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${r&&!ve?x.twMerge("font-semibold text-dropdownList-text-hover",xe):"font-normal"}`),a&&ue,oe)})}))]}))}}),s)}),s)}))};r.useEffect((()=>{se&&se(je)}),[je]),r.useEffect((()=>{se&&se(je)}),[je]),r.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)pe(t.contentRect.width)}));return fe.current&&e.observe(fe.current),()=>{fe.current&&e.unobserve(fe.current)}}),[]);const Me=!a(p,"w-")||"w-full"===a(p,"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:fe,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!g&&e.jsx(n.default,{label:g,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",j)}),ee&&e.jsx(i,{labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:re})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:M,flip:O},{children:[e.jsx(u.ListboxButton,Object.assign({className:x.twMerge(l.default("p-0 bg-transparent",q&&"cursor-not-allowed"),re?a(p,"w-"):void 0),onClick:e=>{q&&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",p),"line"===Y&&"border-b border-t-0 border-x-0 rounded-none",t&&v?v:t?"border-fields-border-focus":void 0,q&&"border-dark-bermudaGray bg-light-whiteSmoke",T&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!h&&""===f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(n.default,{label:h,variant:"small",className:x.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),w)})})),""!==f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:f.length===Z.length?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]"),ne)}):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]"),m)})}))]})),""!==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(),null==B||B([]),he(""),ye(!1),null==R||R()}},{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",`${q&&"fill-dark-bermudaGray"}`),y)})]}))})),e.jsx(b.Transition,Object.assign({as:r.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",p?a(p,"w-"):void 0),S),style:{width:Me?we:void 0}},{children:({open:t})=>(r.useEffect((()=>{!t&&ce&&he("")}),[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),t&&A?A:t?"border-fields-border-focus":void 0))},{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=>{he(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:je}),e.jsx(c,{name:"search",className:x.twMerge("fill-dark-bermudaGray w-3 h-3",$)})]}))})),e.jsx("div",Object.assign({className:x.twMerge(l.default("p-0 overflow-hidden",a(S,"w-")?a(S,"w-"):a(p,"w-"))),style:{width:Me?we:void 0}},{children:Ce.length>0?e.jsx(s.VariableSizeList,Object.assign({ref:me,height:Ne>320?320:Ne,itemCount:Ce.length,itemSize:Se,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",de),itemData:Ce},{children:qe})):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)})]}))}))};
 //# 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}\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  selectedAllTextStyles,\n  activeCheckboxColor,\n  itemTextStyles,\n  listContainerStyles,\n  isClearSearchOnClose,\n  selectedItemTextStyles,\n  activeItemTextStyles\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\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  // 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='flex flex-row items-center gap-x-2 cursor-pointer'\n                  onClick={(e) => {\n                    e.preventDefault();\n\n                    let temp = value.slice();\n                    if (selected) {\n                      temp = temp.filter((i) => i !== data[index].value);\n                    } else {\n                      temp = temp.concat(data[index].value);\n                    }\n\n                    onSelectItem?.(temp.filter((i) => i !== ''));\n                  }}\n                >\n                  <Checkbox\n                    checked={selected}\n                    variant='small'\n                    color={activeCheckboxColor || undefined}\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\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    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  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                    {value[0] !== '' && (\n                      <div className='flex flex-1 w-[calc(100%-52px)]'>\n                        {value.length === data.length ? (\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                  </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\n                        onSelectItem?.([]);\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 z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{ width: isWidthFull ? buttonWidth : undefined }}\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                  return (\n                    <>\n                      {isSearchable && (\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                                open && activeSearchStyles\n                                  ? activeSearchStyles\n                                  : open\n                                  ? 'border-fields-border-focus'\n                                  : undefined\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                      <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                          >\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","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","containerRef","useRef","listRef","sizeMap","search","setSearch","useState","buttonWidth","setButtonWidth","getSize","index","current","setSize","useCallback","size","Object","assign","resetAfterIndex","dataPicker","useMemo","temp","filter","item","toLowerCase","includes","dropdownListHeight","length","RenderRow","style","windowWidth","rowRef","useEffect","getBoundingClientRect","height","_jsx","className","twMerge","classNames","extractClasses","backgroundColor","children","ref","ListboxOption","active","selected","some","i","_jsxs","jsxs","onClick","e","preventDefault","slice","concat","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","observe","unobserve","isWidthFull","jsx","Listbox","multiple","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","join","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","_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}\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  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  // 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\n                    if (isDisableSelected && !selected) return;\n\n                    let temp = value.slice();\n                    if (selected) {\n                      temp = temp.filter((i) => i !== data[index].value);\n                    } else {\n                      temp = temp.concat(data[index].value);\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                >\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    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  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                    {value[0] !== '' && (\n                      <div className='flex flex-1 w-[calc(100%-52px)]'>\n                        {value.length === data.length ? (\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                  </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\n                        onSelectItem?.([]);\n                        setSearch('');\n                        setIsDisableSelected(false);\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 z-50',\n                    containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n                  ),\n                  itemsContainerStyles\n                )}\n                style={{ width: isWidthFull ? buttonWidth : undefined }}\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                  return (\n                    <>\n                      {isSearchable && (\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                                open && activeSearchStyles\n                                  ? activeSearchStyles\n                                  : open\n                                  ? 'border-fields-border-focus'\n                                  : undefined\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                      <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                          >\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","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","RenderRow","style","windowWidth","rowRef","useEffect","getBoundingClientRect","height","_jsx","className","twMerge","classNames","extractClasses","backgroundColor","children","ref","ListboxOption","active","selected","some","i","_jsxs","onClick","e","preventDefault","slice","concat","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","_Fragment","onChange","target","onKeyDown","stopPropagation","List","itemCount","itemSize","itemData","BaseButton"],"mappings":"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"}

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

@@ -62,4 +62,5 @@ export type BaseCheckPickerInterface = {
     isClearSearchOnClose?: boolean;
     selectedItemTextStyles?: string;
     activeItemTextStyles?: string;
+    maxSelected?: number;
 } & BaseBadgeRequiredInterface;

package/build/src/components/Popover/BasePopover.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("react"),i=require("../../utils/getChildrenOnDisplayName.js"),n=require("../Icon/Icon.js"),s=require("../Text/BaseText.js");require("../Text/Text.js");var o=require("../../../node_modules/@headlessui/react/dist/components/popover/popover.js"),l=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),a=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");const c=({iconTriangleContainerStyles:s,iconTriangleStyles:c,panelContainerStyles:d,offsetX:m=0,offsetY:p=0,children:u,position:f="right-start",isAutoFlip:g,containerStyles:h})=>{const j={"top-start":"justify-center w-full -top-[9px] origin-center -rotate-90",top:"justify-center w-full -top-[9px] origin-center -rotate-90","top-end":"justify-center w-full -top-[9px] origin-center -rotate-90","right-start":"items-center h-full top-0 -right-[9px]",right:"items-center h-full top-0 -right-[9px]","right-end":"items-center h-full top-0 -right-[9px]","bottom-start":"justify-center w-full -bottom-[9px] origin-center rotate-90",bottom:"justify-center w-full -bottom-[9px] origin-center rotate-90","bottom-end":"justify-center w-full -bottom-[9px] origin-center rotate-90","left-start":"items-center h-full origin-center rotate-180 top-0 -left-[9px]",left:"items-center h-full origin-center rotate-180 top-0 -left-[9px]","left-end":"items-center h-full origin-center rotate-180 top-0 -left-[9px]"},x={"top-start":"mb-1.5",top:"mb-1.5","top-end":"mb-1.5","right-start":"ml-1.5",right:"ml-1.5","right-end":"ml-1.5","bottom-start":"mt-1.5",bottom:"mt-1.5","bottom-end":"mt-1.5","left-start":"mr-1.5",left:"mr-1.5","left-end":"mr-1.5"},b=e=>{const[t]=e.split("-");return"right"===t||"left"===t};return e.jsx(o.Popover,Object.assign({className:l.twMerge("relative",h)},{children:({open:h,close:w})=>e.jsxs(t.Float,Object.assign({placement:f,flip:g,offset:{crossAxis:b(f)?p:m,mainAxis:b(f)?m:p}},{children:[e.jsxs("div",Object.assign({className:"relative"},{children:[e.jsx(o.PopoverButton,Object.assign({className:"p-0 bg-transparent outline-none w-full z-10"},{children:i.getChildrenOnDisplayName("function"==typeof u?u({open:h,close:w}):u,"Button")})),h&&e.jsx("div",Object.assign({className:l.twMerge(`absolute flex z-20 transition ease-in duration-100 ${j[f]}`,s)},{children:e.jsx(n,{name:"triangleLeft",className:l.twMerge("w-3 h-3 fill-dark-solitude",c)})}))]})),e.jsx(a.Transition,Object.assign({as:r.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(o.PopoverPanel,Object.assign({className:l.twMerge(`rounded min-w-0 bg-white flex flex-col overflow-hidden border-dark-silver z-20 shadow-lg ${x[f]}`,d)},{children:i.getChildrenOnDisplayName("function"==typeof u?u({open:h,close:w}):u,"Panel")}))}))]}))}))},d=({children:t})=>e.jsx(e.Fragment,{children:t||e.jsx(s.default,{label:"Popover"})});d.displayName="Button",c.Button=d;const m=({children:t})=>e.jsx(e.Fragment,{children:t||e.jsx("div",{className:"w-52 h-52 bg-dark-solitude"})});m.displayName="Panel",c.Panel=m,module.exports=c;
+"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),r=require("react"),i=require("../../utils/getChildrenOnDisplayName.js"),s=require("../Icon/Icon.js"),n=require("../Text/BaseText.js");require("../Text/Text.js");var o=require("../../../node_modules/@headlessui/react/dist/components/popover/popover.js"),l=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),a=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");const c=({iconTriangleContainerStyles:n,iconTriangleStyles:c,panelContainerStyles:d,offsetX:m=0,offsetY:p=0,children:u,position:f="right-start",isAutoFlip:g,containerStyles:h})=>{const j={"top-start":"justify-center w-full -top-[9px] origin-center -rotate-90",top:"justify-center w-full -top-[9px] origin-center -rotate-90","top-end":"justify-center w-full -top-[9px] origin-center -rotate-90","right-start":"items-center h-full top-0 -right-[9px]",right:"items-center h-full top-0 -right-[9px]","right-end":"items-center h-full top-0 -right-[9px]","bottom-start":"justify-center w-full -bottom-[9px] origin-center rotate-90",bottom:"justify-center w-full -bottom-[9px] origin-center rotate-90","bottom-end":"justify-center w-full -bottom-[9px] origin-center rotate-90","left-start":"items-center h-full origin-center rotate-180 top-0 -left-[9px]",left:"items-center h-full origin-center rotate-180 top-0 -left-[9px]","left-end":"items-center h-full origin-center rotate-180 top-0 -left-[9px]"},x={"top-start":"mb-1.5",top:"mb-1.5","top-end":"mb-1.5","right-start":"ml-1.5",right:"ml-1.5","right-end":"ml-1.5","bottom-start":"mt-1.5",bottom:"mt-1.5","bottom-end":"mt-1.5","left-start":"mr-1.5",left:"mr-1.5","left-end":"mr-1.5"},b=e=>{const[t]=e.split("-");return"right"===t||"left"===t};return e.jsx(o.Popover,Object.assign({className:l.twMerge("relative",h)},{children:({open:h,close:w})=>e.jsxs(t.Float,Object.assign({placement:f,flip:g,offset:{crossAxis:b(f)?p:m,mainAxis:b(f)?m:p}},{children:[e.jsxs("div",Object.assign({className:"relative"},{children:[e.jsx(o.PopoverButton,Object.assign({className:"p-0 bg-transparent outline-none w-full z-10"},{children:i.getChildrenOnDisplayName("function"==typeof u?u({open:h,close:w}):u,"Button")})),h&&e.jsx("div",Object.assign({className:l.twMerge(`absolute flex z-20 transition ease-in duration-100 ${j[f]}`,n)},{children:e.jsx(s,{name:"triangleLeft",className:l.twMerge("w-3 h-3 fill-dark-solitude shadow-lg",c)})}))]})),e.jsx(a.Transition,Object.assign({as:r.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(o.PopoverPanel,Object.assign({className:l.twMerge(`rounded-lg min-w-0 bg-white flex flex-col overflow-hidden border-dark-silver shadow-lg z-20 ${x[f]}`,d)},{children:i.getChildrenOnDisplayName("function"==typeof u?u({open:h,close:w}):u,"Panel")}))}))]}))}))},d=({children:t})=>e.jsx(e.Fragment,{children:t||e.jsx(n.default,{label:"Popover"})});d.displayName="Button",c.Button=d;const m=({children:t})=>e.jsx(e.Fragment,{children:t||e.jsx("div",{className:"w-52 h-52 bg-dark-solitude"})});m.displayName="Panel",c.Panel=m,module.exports=c;
 //# sourceMappingURL=BasePopover.js.map

package/build/src/components/Popover/BasePopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasePopover.js","sources":["../../../../src/components/Popover/BasePopover.tsx"],"sourcesContent":["import { Popover, PopoverButton, PopoverPanel, Transition } from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport React, { Fragment } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport { getChildrenOnDisplayName } from '../../utils/getChildrenOnDisplayName';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n  BasePopoverButtonInterface,\n  BasePopoverInterface,\n  BasePopoverPanelInterface,\n  PickerPosition\n} from './BasePopover.type';\n\nconst BasePopover = ({\n  iconTriangleContainerStyles,\n  iconTriangleStyles,\n  panelContainerStyles,\n  offsetX = 0,\n  offsetY = 0,\n  children,\n  position = 'right-start',\n  isAutoFlip,\n  containerStyles\n}: BasePopoverInterface) => {\n  const TriangleTransformMapper: Record<PickerPosition, string> = {\n    'top-start': 'justify-center w-full -top-[9px] origin-center -rotate-90',\n    top: 'justify-center w-full -top-[9px] origin-center -rotate-90',\n    'top-end': 'justify-center w-full -top-[9px] origin-center -rotate-90',\n    'right-start': 'items-center h-full top-0 -right-[9px]',\n    right: 'items-center h-full top-0 -right-[9px]',\n    'right-end': 'items-center h-full top-0 -right-[9px]',\n    'bottom-start': 'justify-center w-full -bottom-[9px] origin-center rotate-90',\n    bottom: 'justify-center w-full -bottom-[9px] origin-center rotate-90',\n    'bottom-end': 'justify-center w-full -bottom-[9px] origin-center rotate-90',\n    'left-start': 'items-center h-full origin-center rotate-180 top-0 -left-[9px]',\n    left: 'items-center h-full origin-center rotate-180 top-0 -left-[9px]',\n    'left-end': 'items-center h-full origin-center rotate-180 top-0 -left-[9px]'\n  };\n\n  const PickerPositionMapper: Record<PickerPosition, string> = {\n    'top-start': 'mb-1.5',\n    top: 'mb-1.5',\n    'top-end': 'mb-1.5',\n    'right-start': 'ml-1.5',\n    right: 'ml-1.5',\n    'right-end': 'ml-1.5',\n    'bottom-start': 'mt-1.5',\n    bottom: 'mt-1.5',\n    'bottom-end': 'mt-1.5',\n    'left-start': 'mr-1.5',\n    left: 'mr-1.5',\n    'left-end': 'mr-1.5'\n  };\n\n  const checkPosition = (position: string): boolean => {\n    const [direction] = position.split('-');\n    return direction === 'right' || direction === 'left';\n  };\n\n  return (\n    <Popover className={twMerge('relative', containerStyles)}>\n      {({ open, close }) => (\n        <Float\n          placement={position}\n          flip={isAutoFlip}\n          offset={{\n            crossAxis: checkPosition(position) ? offsetY : offsetX,\n            mainAxis: checkPosition(position) ? offsetX : offsetY\n          }}\n        >\n          <div className='relative'>\n            <PopoverButton className='p-0 bg-transparent outline-none w-full z-10'>\n              {getChildrenOnDisplayName(\n                typeof children === 'function' ? children({ open, close }) : children,\n                'Button'\n              )}\n            </PopoverButton>\n            {open && (\n              <div\n                className={twMerge(\n                  `absolute flex z-20 transition ease-in duration-100 ${TriangleTransformMapper[position]}`,\n                  iconTriangleContainerStyles\n                )}\n              >\n                <Icon\n                  name='triangleLeft'\n                  className={twMerge('w-3 h-3 fill-dark-solitude', iconTriangleStyles)}\n                />\n              </div>\n            )}\n          </div>\n          <Transition\n            as={Fragment}\n            leave='transition ease-in duration-100'\n            leaveFrom='opacity-100'\n            leaveTo='opacity-0'\n          >\n            <PopoverPanel\n              className={twMerge(\n                `rounded min-w-0 bg-white flex flex-col overflow-hidden border-dark-silver z-20 shadow-lg ${PickerPositionMapper[position]}`,\n                panelContainerStyles\n              )}\n            >\n              {getChildrenOnDisplayName(\n                typeof children === 'function' ? children({ open, close }) : children,\n                'Panel'\n              )}\n            </PopoverPanel>\n          </Transition>\n        </Float>\n      )}\n    </Popover>\n  );\n};\n\n// TODO: adjust default button\nconst Button = ({ children }: BasePopoverButtonInterface) => {\n  return <>{children ? children : <BaseText label='Popover' />}</>;\n};\nButton.displayName = 'Button';\nBasePopover.Button = Button;\n\n// TODO: adjust default panel\nconst Panel = ({ children }: BasePopoverPanelInterface) => {\n  return <>{children ? children : <div className='w-52 h-52 bg-dark-solitude' />}</>;\n};\nPanel.displayName = 'Panel';\nBasePopover.Panel = Panel;\n\nexport default BasePopover;\n"],"names":["BasePopover","iconTriangleContainerStyles","iconTriangleStyles","panelContainerStyles","offsetX","offsetY","children","position","isAutoFlip","containerStyles","TriangleTransformMapper","top","right","bottom","left","PickerPositionMapper","checkPosition","direction","split","_jsx","Popover","Object","assign","className","twMerge","open","close","_jsxs","Float","placement","flip","offset","crossAxis","mainAxis","PopoverButton","getChildrenOnDisplayName","Icon","name","jsx","Transition","as","Fragment","leave","leaveFrom","leaveTo","PopoverPanel","Button","BaseText","label","displayName","Panel","_Fragment"],"mappings":"8iBAeA,MAAMA,EAAc,EAClBC,8BACAC,qBACAC,uBACAC,UAAU,EACVC,UAAU,EACVC,WACAC,WAAW,cACXC,aACAC,sBAEA,MAAMC,EAA0D,CAC9D,YAAa,4DACbC,IAAK,4DACL,UAAW,4DACX,cAAe,yCACfC,MAAO,yCACP,YAAa,yCACb,eAAgB,8DAChBC,OAAQ,8DACR,aAAc,8DACd,aAAc,iEACdC,KAAM,iEACN,WAAY,kEAGRC,EAAuD,CAC3D,YAAa,SACbJ,IAAK,SACL,UAAW,SACX,cAAe,SACfC,MAAO,SACP,YAAa,SACb,eAAgB,SAChBC,OAAQ,SACR,aAAc,SACd,aAAc,SACdC,KAAM,SACN,WAAY,UAGRE,EAAiBT,IACrB,MAAOU,GAAaV,EAASW,MAAM,KACnC,MAAqB,UAAdD,GAAuC,SAAdA,CAAoB,EAGtD,OACEE,MAACC,EAAAA,QAAOC,OAAAC,OAAA,CAACC,UAAWC,EAAOA,QAAC,WAAYf,IACrC,CAAAH,SAAA,EAAGmB,OAAMC,WACRC,OAACC,EAAAA,MACCP,OAAAC,OAAA,CAAAO,UAAWtB,EACXuB,KAAMtB,EACNuB,OAAQ,CACNC,UAAWhB,EAAcT,GAAYF,EAAUD,EAC/C6B,SAAUjB,EAAcT,GAAYH,EAAUC,IAC/C,CAAAC,SAAA,CAEDqB,EAAAA,KAAK,MAAAN,OAAAC,OAAA,CAAAC,UAAU,uBACbJ,EAAAA,IAACe,EAAaA,cAACb,OAAAC,OAAA,CAAAC,UAAU,+CACtB,CAAAjB,SAAA6B,EAAAA,yBACqB,mBAAb7B,EAA0BA,EAAS,CAAEmB,OAAMC,UAAWpB,EAC7D,aAGHmB,GACCN,MACE,MAAAE,OAAAC,OAAA,CAAAC,UAAWC,EAAAA,QACT,sDAAsDd,EAAwBH,KAC9EN,IACD,CAAAK,SAEDa,EAAAA,IAACiB,GACCC,KAAK,eACLd,UAAWC,EAAAA,QAAQ,6BAA8BtB,YAKzDiB,EAAAmB,IAACC,EAAUA,WACTlB,OAAAC,OAAA,CAAAkB,GAAIC,WACJC,MAAM,kCACNC,UAAU,cACVC,QAAQ,aAAW,CAAAtC,SAEnBa,EAAAA,IAAC0B,EAAAA,aAAYxB,OAAAC,OAAA,CACXC,UAAWC,EAAOA,QAChB,4FAA4FT,EAAqBR,KACjHJ,IAGD,CAAAG,SAAA6B,EAAAA,yBACqB,mBAAb7B,EAA0BA,EAAS,CAAEmB,OAAMC,UAAWpB,EAC7D,qBAOZ,EAIEwC,EAAS,EAAGxC,cACTa,2BAAGb,GAAsBa,MAAC4B,EAAAA,QAAS,CAAAC,MAAM,cAElDF,EAAOG,YAAc,SACrBjD,EAAY8C,OAASA,EAGrB,MAAMI,EAAQ,EAAG5C,cACRa,EAAGmB,IAAAa,EAAAV,SAAA,CAAAnC,SAAAA,GAAsBa,aAAKI,UAAU,iCAEjD2B,EAAMD,YAAc,QACpBjD,EAAYkD,MAAQA"}
+{"version":3,"file":"BasePopover.js","sources":["../../../../src/components/Popover/BasePopover.tsx"],"sourcesContent":["import { Popover, PopoverButton, PopoverPanel, Transition } from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport React, { Fragment } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport { getChildrenOnDisplayName } from '../../utils/getChildrenOnDisplayName';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n  BasePopoverButtonInterface,\n  BasePopoverInterface,\n  BasePopoverPanelInterface,\n  PickerPosition\n} from './BasePopover.type';\n\nconst BasePopover = ({\n  iconTriangleContainerStyles,\n  iconTriangleStyles,\n  panelContainerStyles,\n  offsetX = 0,\n  offsetY = 0,\n  children,\n  position = 'right-start',\n  isAutoFlip,\n  containerStyles\n}: BasePopoverInterface) => {\n  const TriangleTransformMapper: Record<PickerPosition, string> = {\n    'top-start': 'justify-center w-full -top-[9px] origin-center -rotate-90',\n    top: 'justify-center w-full -top-[9px] origin-center -rotate-90',\n    'top-end': 'justify-center w-full -top-[9px] origin-center -rotate-90',\n    'right-start': 'items-center h-full top-0 -right-[9px]',\n    right: 'items-center h-full top-0 -right-[9px]',\n    'right-end': 'items-center h-full top-0 -right-[9px]',\n    'bottom-start': 'justify-center w-full -bottom-[9px] origin-center rotate-90',\n    bottom: 'justify-center w-full -bottom-[9px] origin-center rotate-90',\n    'bottom-end': 'justify-center w-full -bottom-[9px] origin-center rotate-90',\n    'left-start': 'items-center h-full origin-center rotate-180 top-0 -left-[9px]',\n    left: 'items-center h-full origin-center rotate-180 top-0 -left-[9px]',\n    'left-end': 'items-center h-full origin-center rotate-180 top-0 -left-[9px]'\n  };\n\n  const PickerPositionMapper: Record<PickerPosition, string> = {\n    'top-start': 'mb-1.5',\n    top: 'mb-1.5',\n    'top-end': 'mb-1.5',\n    'right-start': 'ml-1.5',\n    right: 'ml-1.5',\n    'right-end': 'ml-1.5',\n    'bottom-start': 'mt-1.5',\n    bottom: 'mt-1.5',\n    'bottom-end': 'mt-1.5',\n    'left-start': 'mr-1.5',\n    left: 'mr-1.5',\n    'left-end': 'mr-1.5'\n  };\n\n  const checkPosition = (position: string): boolean => {\n    const [direction] = position.split('-');\n    return direction === 'right' || direction === 'left';\n  };\n\n  return (\n    <Popover className={twMerge('relative', containerStyles)}>\n      {({ open, close }) => (\n        <Float\n          placement={position}\n          flip={isAutoFlip}\n          offset={{\n            crossAxis: checkPosition(position) ? offsetY : offsetX,\n            mainAxis: checkPosition(position) ? offsetX : offsetY\n          }}\n        >\n          <div className='relative'>\n            <PopoverButton className='p-0 bg-transparent outline-none w-full z-10'>\n              {getChildrenOnDisplayName(\n                typeof children === 'function' ? children({ open, close }) : children,\n                'Button'\n              )}\n            </PopoverButton>\n            {open && (\n              <div\n                className={twMerge(\n                  `absolute flex z-20 transition ease-in duration-100 ${TriangleTransformMapper[position]}`,\n                  iconTriangleContainerStyles\n                )}\n              >\n                <Icon\n                  name='triangleLeft'\n                  className={twMerge('w-3 h-3 fill-dark-solitude shadow-lg', iconTriangleStyles)}\n                />\n              </div>\n            )}\n          </div>\n          <Transition\n            as={Fragment}\n            leave='transition ease-in duration-100'\n            leaveFrom='opacity-100'\n            leaveTo='opacity-0'\n          >\n            <PopoverPanel\n              className={twMerge(\n                `rounded-lg min-w-0 bg-white flex flex-col overflow-hidden border-dark-silver shadow-lg z-20 ${PickerPositionMapper[position]}`,\n                panelContainerStyles\n              )}\n            >\n              {getChildrenOnDisplayName(\n                typeof children === 'function' ? children({ open, close }) : children,\n                'Panel'\n              )}\n            </PopoverPanel>\n          </Transition>\n        </Float>\n      )}\n    </Popover>\n  );\n};\n\n// TODO: adjust default button\nconst Button = ({ children }: BasePopoverButtonInterface) => {\n  return <>{children ? children : <BaseText label='Popover' />}</>;\n};\nButton.displayName = 'Button';\nBasePopover.Button = Button;\n\n// TODO: adjust default panel\nconst Panel = ({ children }: BasePopoverPanelInterface) => {\n  return <>{children ? children : <div className='w-52 h-52 bg-dark-solitude' />}</>;\n};\nPanel.displayName = 'Panel';\nBasePopover.Panel = Panel;\n\nexport default BasePopover;\n"],"names":["BasePopover","iconTriangleContainerStyles","iconTriangleStyles","panelContainerStyles","offsetX","offsetY","children","position","isAutoFlip","containerStyles","TriangleTransformMapper","top","right","bottom","left","PickerPositionMapper","checkPosition","direction","split","_jsx","Popover","Object","assign","className","twMerge","open","close","_jsxs","Float","placement","flip","offset","crossAxis","mainAxis","PopoverButton","getChildrenOnDisplayName","Icon","name","jsx","Transition","as","Fragment","leave","leaveFrom","leaveTo","PopoverPanel","Button","BaseText","label","displayName","Panel","_Fragment"],"mappings":"8iBAeA,MAAMA,EAAc,EAClBC,8BACAC,qBACAC,uBACAC,UAAU,EACVC,UAAU,EACVC,WACAC,WAAW,cACXC,aACAC,sBAEA,MAAMC,EAA0D,CAC9D,YAAa,4DACbC,IAAK,4DACL,UAAW,4DACX,cAAe,yCACfC,MAAO,yCACP,YAAa,yCACb,eAAgB,8DAChBC,OAAQ,8DACR,aAAc,8DACd,aAAc,iEACdC,KAAM,iEACN,WAAY,kEAGRC,EAAuD,CAC3D,YAAa,SACbJ,IAAK,SACL,UAAW,SACX,cAAe,SACfC,MAAO,SACP,YAAa,SACb,eAAgB,SAChBC,OAAQ,SACR,aAAc,SACd,aAAc,SACdC,KAAM,SACN,WAAY,UAGRE,EAAiBT,IACrB,MAAOU,GAAaV,EAASW,MAAM,KACnC,MAAqB,UAAdD,GAAuC,SAAdA,CAAoB,EAGtD,OACEE,MAACC,EAAAA,QAAOC,OAAAC,OAAA,CAACC,UAAWC,EAAOA,QAAC,WAAYf,IACrC,CAAAH,SAAA,EAAGmB,OAAMC,WACRC,OAACC,EAAAA,MACCP,OAAAC,OAAA,CAAAO,UAAWtB,EACXuB,KAAMtB,EACNuB,OAAQ,CACNC,UAAWhB,EAAcT,GAAYF,EAAUD,EAC/C6B,SAAUjB,EAAcT,GAAYH,EAAUC,IAC/C,CAAAC,SAAA,CAEDqB,EAAAA,KAAK,MAAAN,OAAAC,OAAA,CAAAC,UAAU,uBACbJ,EAAAA,IAACe,EAAaA,cAACb,OAAAC,OAAA,CAAAC,UAAU,+CACtB,CAAAjB,SAAA6B,EAAAA,yBACqB,mBAAb7B,EAA0BA,EAAS,CAAEmB,OAAMC,UAAWpB,EAC7D,aAGHmB,GACCN,MACE,MAAAE,OAAAC,OAAA,CAAAC,UAAWC,EAAAA,QACT,sDAAsDd,EAAwBH,KAC9EN,IACD,CAAAK,SAEDa,EAAAA,IAACiB,GACCC,KAAK,eACLd,UAAWC,EAAAA,QAAQ,uCAAwCtB,YAKnEiB,EAAAmB,IAACC,EAAUA,WACTlB,OAAAC,OAAA,CAAAkB,GAAIC,WACJC,MAAM,kCACNC,UAAU,cACVC,QAAQ,aAAW,CAAAtC,SAEnBa,EAAAA,IAAC0B,EAAAA,aAAYxB,OAAAC,OAAA,CACXC,UAAWC,EAAOA,QAChB,+FAA+FT,EAAqBR,KACpHJ,IAGD,CAAAG,SAAA6B,EAAAA,yBACqB,mBAAb7B,EAA0BA,EAAS,CAAEmB,OAAMC,UAAWpB,EAC7D,qBAOZ,EAIEwC,EAAS,EAAGxC,cACTa,2BAAGb,GAAsBa,MAAC4B,EAAAA,QAAS,CAAAC,MAAM,cAElDF,EAAOG,YAAc,SACrBjD,EAAY8C,OAASA,EAGrB,MAAMI,EAAQ,EAAG5C,cACRa,EAAGmB,IAAAa,EAAAV,SAAA,CAAAnC,SAAAA,GAAsBa,aAAKI,UAAU,iCAEjD2B,EAAMD,YAAc,QACpBjD,EAAYkD,MAAQA"}

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

@@ -144,12 +144,12 @@
     }
 
     [data-sticky-last-left-td] {
-      box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.16);
+      box-shadow: 4px 0px 4px 0px rgba(82, 97, 107, 0.15);
       clip-path: inset(0px -15px 0px 0px);
     }
 
     [data-sticky-first-right-td] {
-      box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.16);
+      box-shadow: 4px 0px 4px 0px rgba(82, 97, 107, 0.15);
       clip-path: inset(0px -15px 0px 0px);
     }
   }

package/build/src/components/Table/TablePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TablePage.js","sources":["../../../../src/components/Table/TablePage.tsx"],"sourcesContent":["import * as PropTypes from 'prop-types';\nimport { useEffect, useMemo, useState } from 'react';\nimport {\n  TableCellProps,\n  useBlockLayout,\n  usePagination,\n  useRowSelect,\n  useSortBy,\n  useTable\n} from 'react-table';\nimport { useSticky } from 'react-table-sticky';\nimport styled, { css } from 'styled-components';\n\nimport { useDidMountEffect } from '../../hooks/useDidMountEffect';\nimport { ColorBlue, ColorDark, ColorLight } from '../../styles/Colors';\nimport { MarginType } from '../../styles/Spacing';\nimport freezeColumn from '../../utils/freezeColumn';\nimport { ButtonLink } from '../Button';\nimport { Icon } from '../Icon';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { fontFamilyMapper, Text, TextAlign } from '../Text';\nimport { TableHeaderInterface, TablePageInterface, TableVariantInterface } from './';\nimport { TableStyleInterface } from './Table.type';\nimport {\n  CellContainerContentStyled,\n  CellContainerHeaderStyled,\n  defaultPropGetter,\n  EmptyData,\n  getIsExcludedSortable,\n  SortIcon,\n  tableHooks,\n  TableLoaderContainer,\n  tableSizeMapper\n} from './TableBase';\nimport { TableContainerStyledProps } from './TablePage.type';\n\nconst defaultValue: {\n  pageIndex: number;\n  pageSize: number;\n  textAlign: TextAlign;\n} = {\n  pageIndex: 0,\n  pageSize: 10,\n  textAlign: 'left'\n};\n\nconst TablePageContainer = styled.div<{ $isLoading?: boolean }>`\n  ${({ $isLoading }) => {\n    if (!$isLoading) return null;\n    return css`\n      display: flex;\n      position: relative;\n      > div {\n        &:nth-child(2) {\n          left: 50%;\n          position: absolute;\n          top: 50%;\n          transform: translate(-50%, -50%);\n        }\n      }\n    `;\n  }}\n`;\n\nconst TableHeaderStyled = styled.thead`\n  tr {\n    z-index: 4;\n    box-shadow: 0px 1px 1px 0px rgb(0 0 0 / 25%);\n    clip-path: inset(-10px 0px);\n    :first-child {\n      th {\n        display: flex !important;\n      }\n    }\n  }\n  th {\n    border-bottom: 1px solid ${ColorDark.silver};\n    box-sizing: border-box !important;\n    :last-child {\n      border-right: 0;\n    }\n    p {\n      width: auto;\n    }\n  }\n`;\n\nconst TableHeader = (props: TableHeaderInterface) => {\n  return (\n    <TableHeaderStyled>\n      {props.headerGroups.map((headerGroup, i) => (\n        <tr key={`headerGroup-${i}`} {...headerGroup.getHeaderGroupProps()}>\n          {headerGroup.headers.map((column) => (\n            <th\n              {...column.getHeaderProps(\n                getIsExcludedSortable(column) && column.getSortByToggleProps()\n              )}\n              key={column.id}\n            >\n              <CellContainerHeaderStyled\n                textAlign={column.textAlign || defaultValue.textAlign}\n                variant={props.variant}\n              >\n                {typeof column.Header.valueOf() !== 'string' ? (\n                  column.render('Header')\n                ) : (\n                  <>\n                    <Text\n                      textAlign={column.textAlign || defaultValue.textAlign}\n                      label={column.Header.toString()}\n                      variant={tableSizeMapper[props.variant].fontSize}\n                      fontWeight='semi-bold'\n                    />\n                    {!column.columns && (\n                      <span\n                        style={{\n                          display: 'flex',\n                          justifyContent: 'center',\n                          alignItems: 'center'\n                        }}\n                      >\n                        {!column.disableSortBy && (\n                          <SortIcon isSorted={column.isSorted} isSortedDesc={column.isSortedDesc} />\n                        )}\n                      </span>\n                    )}\n                  </>\n                )}\n              </CellContainerHeaderStyled>\n            </th>\n          ))}\n        </tr>\n      ))}\n    </TableHeaderStyled>\n  );\n};\n\nconst TableBodyStyled = styled.tbody`\n  tr {\n    cursor: pointer;\n    :hover {\n      p {\n        font-family: ${fontFamilyMapper['semi-bold']};\n      }\n    }\n    td {\n      box-sizing: border-box !important;\n      :last-child {\n        border-right: 0;\n      }\n    }\n  }\n`;\n\nconst ContainerPaginationButton = styled.div<{\n  isDisableChangePage?: boolean;\n  isCurrentPage?: boolean;\n  activePageColor?: string;\n}>`\n  align-items: center;\n  background-color: ${(props) => (props.isDisableChangePage ? ColorDark.silver : undefined)};\n  border: 1px solid;\n  border-color: ${(props) =>\n    props.isCurrentPage ? props.activePageColor ?? ColorBlue.yaleBlue : ColorDark.silver};\n  border-radius: ${MarginType['micro']};\n  display: flex;\n  height: 32px;\n  justify-content: center;\n  margin-right: ${MarginType['micro']};\n  width: 32px;\n`;\n\nconst ActivePageText = styled(Text)<{ activePageColor?: string }>`\n  color: ${(props) =>\n    props.theme?.table?.pagination?.activePageNumberText ||\n    (props.activePageColor ?? ColorBlue.yaleBlue)};\n`;\n\nconst PaginationNextFooter = ({\n  pageIndexLabel,\n  gotoPage,\n  page\n}: {\n  pageIndexLabel: number;\n  gotoPage: (page: number) => void;\n  page: number;\n}) => {\n  return (\n    <ContainerPaginationButton>\n      <ButtonLink onClick={() => gotoPage(page)} onMouseDown={() => gotoPage(page)}>\n        <div style={{ margin: `0 ${MarginType['extra-small']}` }}>\n          <Text label={'' + pageIndexLabel} variant='small' />\n        </div>\n      </ButtonLink>\n    </ContainerPaginationButton>\n  );\n};\n\nconst PaginationPreviousFooter = ({\n  pageIndexLabel,\n  gotoPage,\n  page\n}: {\n  pageIndexLabel: number;\n  gotoPage: (page: number) => void;\n  page: number;\n}) => {\n  return (\n    <ContainerPaginationButton>\n      <ButtonLink onClick={() => gotoPage(page)}>\n        <div style={{ margin: `0 ${MarginType['extra-small']}` }}>\n          <Text label={'' + pageIndexLabel} variant='small' />\n        </div>\n      </ButtonLink>\n    </ContainerPaginationButton>\n  );\n};\n\nconst PaginationFooter = ({\n  totalData,\n  pageIndex,\n  canPreviousPage,\n  canNextPage,\n  onClick,\n  totalPage,\n  activePageColor\n}: {\n  totalData: number;\n  pageIndex: number;\n  canPreviousPage: boolean;\n  canNextPage: boolean;\n  onClick: {\n    first: () => void;\n    prev: () => void;\n    next: () => void;\n    last: () => void;\n    gotoPage: (page: number) => void;\n  };\n  totalPage: number;\n  activePageColor?: string;\n}) => (\n  <div\n    style={{\n      display: 'flex',\n      justifyContent: 'space-between',\n      marginTop: 8\n    }}\n  >\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        position: 'sticky',\n        left: 0\n      }}\n    >\n      <Text label={`Total: ${totalData}`} variant='small' color={ColorDark.gumbo} />\n    </div>\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        position: 'sticky',\n        right: 0\n      }}\n    >\n      <ContainerPaginationButton isDisableChangePage={!canPreviousPage}>\n        <ButtonLink onClick={onClick.first}>\n          <Icon\n            name='chevronDoubleArrowLeft'\n            size='extra-small'\n            color={canPreviousPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n      <ContainerPaginationButton isDisableChangePage={!canPreviousPage}>\n        <ButtonLink onClick={onClick.prev}>\n          <Icon\n            name='chevronleft'\n            size='extra-small'\n            color={canPreviousPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n      {canPreviousPage && pageIndex !== 1 && (\n        <PaginationPreviousFooter\n          pageIndexLabel={pageIndex - 1}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex - 2}\n        />\n      )}\n      {canPreviousPage && (\n        <PaginationPreviousFooter\n          pageIndexLabel={pageIndex}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex - 1}\n        />\n      )}\n      <ContainerPaginationButton isCurrentPage activePageColor={activePageColor}>\n        <div style={{ margin: `0 ${MarginType['extra-small']}` }}>\n          <ActivePageText\n            label={'' + (pageIndex + 1)}\n            variant='small'\n            activePageColor={activePageColor}\n          />\n        </div>\n      </ContainerPaginationButton>\n      {canNextPage && (\n        <PaginationNextFooter\n          pageIndexLabel={pageIndex + 2}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex + 1}\n        />\n      )}\n      {canNextPage && pageIndex + 2 !== totalPage && (\n        <PaginationNextFooter\n          pageIndexLabel={pageIndex + 3}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex + 2}\n        />\n      )}\n      <ContainerPaginationButton isDisableChangePage={!canNextPage}>\n        <ButtonLink onClick={onClick.next} onMouseDown={onClick.next}>\n          <Icon\n            name='chevronright'\n            size='extra-small'\n            color={canNextPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n      <ContainerPaginationButton isDisableChangePage={!canNextPage}>\n        <ButtonLink onClick={onClick.last} onMouseDown={onClick.last}>\n          <Icon\n            name='chevronDoubleArrowRight'\n            size='extra-small'\n            color={canNextPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n    </div>\n  </div>\n);\n\ninterface TableStyledInterface extends TableVariantInterface, TableStyleInterface {\n  freezeHeader?: boolean;\n}\n\ninterface CustomCellProps extends TableCellProps {\n  checkboxIsDisabled?: boolean;\n}\n\nconst TableStyled = styled.table<TableStyledInterface>`\n  thead:first-child {\n    ${({ freezeHeader }) =>\n      freezeHeader && 'position: sticky !important;  top: 0 !important; z-index: 5 !important'}\n  }\n  border-spacing: 0;\n  margin-top: ${MarginType['extra-small']};\n  width: 100%;\n  th {\n    padding: 0px 8px;\n    background-color: ${ColorLight.whiteSolid};\n    height: ${({ variant }) => tableSizeMapper[variant].thHeight};\n  }\n  td {\n    min-height: ${({ variant }) => tableSizeMapper[variant].tdMinHeight};\n    max-height: ${({ variant }) => tableSizeMapper[variant].tdMaxHeight};\n    :last-child {\n      border-right: 0;\n    }\n  }\n  tr {\n    :nth-child(odd) {\n      background-color: ${({ rowEvenColor }) => rowEvenColor};\n    }\n    :nth-child(even) {\n      background-color: ${({ rowOddColor }) => rowOddColor};\n    }\n    :last-child {\n      td {\n        border-bottom: 0;\n      }\n    }\n  }\n`;\n\nconst TableContainerStyled = styled.div<TableContainerStyledProps>`\n  overflow: ${({ $isOverflowAuto }) => ($isOverflowAuto ? 'auto' : 'visible')};\n  width: 100%;\n\n  ${({ $isLoading, $isEmpty }) => {\n    if ($isLoading) {\n      return css`\n        display: flex;\n        height: 100%;\n        max-height: 60vh;\n        min-height: 380px;\n        opacity: 0.5;\n        overflow: hidden;\n        pointer-events: none;\n      `;\n    }\n\n    if ($isEmpty) {\n      return css`\n        display: flex;\n        min-height: 100px;\n      `;\n    }\n\n    return css`\n      display: flex;\n      height: 100%;\n      max-height: 60vh;\n      min-height: 380px;\n      overflow: auto;\n    `;\n  }}\n\n  table {\n    tr {\n      :hover {\n        background-color: ${ColorLight.whiteSmoke};\n        p {\n          font-family: ${fontFamilyMapper['semi-bold']};\n        }\n        td {\n          background-color: ${ColorLight.whiteSmoke};\n        }\n      }\n      :last-child {\n        td {\n          border-bottom: 0;\n        }\n      }\n      :nth-child(odd) {\n        td {\n          background-color: ${({ rowEvenColor }) => rowEvenColor};\n        }\n      }\n      :nth-child(even) {\n        td {\n          background-color: ${({ rowOddColor }) => rowOddColor};\n        }\n      }\n    }\n\n    [data-sticky-last-left-td] {\n      box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.16);\n      clip-path: inset(0px -15px 0px 0px);\n    }\n\n    [data-sticky-first-right-td] {\n      box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.16);\n      clip-path: inset(0px -15px 0px 0px);\n    }\n  }\n`;\n\nconst TextStyled = styled(Text)`\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  display: -webkit-inline-box;\n  overflow: hidden;\n  white-space: normal;\n`;\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst Table = ({ getCellProps = defaultPropGetter, ...props }: TablePageInterface) => {\n  // FIXME: pindahin logic di component ke custom hooks\n  const { onPageChange, isManualPagination, totalData, isManualSort, onSort, activePageColor } =\n    props;\n  const charTotal = tableSizeMapper[props.variant].charTotal;\n  const data = useMemo(() => props.data, [props.data]);\n  const columns = useMemo(\n    () => freezeColumn({ header: props.header, freezedColumn: props.freezedColumn }),\n    [props.freezedColumn, props.header]\n  );\n  const sortBy = useMemo(() => {\n    if (props.sortBy && isManualSort) return [props.sortBy];\n    return [];\n  }, [props.sortBy, isManualSort]);\n\n  const [pageCountState, setPageCountState] = useState(\n    isManualPagination ? Math.ceil(totalData / props.pageSize) : undefined\n  );\n  const [countCellSpan, setCountCellSpan] = useState<number>(0);\n\n  const {\n    canNextPage,\n    canPreviousPage,\n    getTableProps,\n    getTableBodyProps,\n    gotoPage,\n    headerGroups,\n    nextPage,\n    page,\n    pageCount,\n    prepareRow,\n    previousPage,\n    selectedFlatRows,\n    setHiddenColumns,\n    state: {\n      pageIndex,\n      pageSize,\n      sortBy: [sortByState]\n    }\n  } = useTable(\n    {\n      columns,\n      data,\n      manualSortBy: isManualSort,\n      manualPagination: isManualPagination,\n      pageCount: pageCountState,\n      initialState: {\n        sortBy,\n        pageIndex: isManualPagination ? props.pageIndex : defaultValue.pageIndex,\n        pageSize: props.pageSize,\n        hiddenColumns: []\n      }\n    },\n    useBlockLayout,\n    useSortBy,\n    usePagination,\n    useRowSelect,\n    useSticky,\n    (hooks) =>\n      tableHooks({\n        hooks,\n        isSelectable: props.isSelectable,\n        hideRowIndex: props.hideRowIndex,\n        rowIndexAlign: props.rowIndexAlign,\n        variant: props.variant,\n        rowActions: props.rowActions,\n        actionLabel: props.actionLabel,\n        freezedColumn: props.freezedColumn\n      })\n  );\n\n  const indexRowAddition = useMemo(() => {\n    if (!isManualPagination) return 0;\n    return pageSize * pageIndex;\n  }, [isManualPagination, pageIndex, pageSize]);\n\n  useDidMountEffect(() => {\n    if (typeof props.onSelectedRow === 'function' && props.isSelectable) {\n      props.onSelectedRow(selectedFlatRows);\n    }\n  }, [props.onSelectedRow, selectedFlatRows]);\n\n  // FIXME: find better implementation for hidden columns\n  useEffect(() => {\n    if (props.hiddenColumns) setHiddenColumns(props.hiddenColumns || []);\n  }, [props.hiddenColumns, setHiddenColumns]);\n\n  useEffect(() => {\n    if (typeof onPageChange === 'function') {\n      onPageChange({ pageIndex, pageSize });\n    }\n  }, [onPageChange, pageIndex, pageSize]);\n\n  useEffect(() => {\n    if (isManualPagination) {\n      setPageCountState(Math.ceil(totalData / pageSize));\n    }\n  }, [pageSize, totalData, isManualPagination]);\n\n  useEffect(() => {\n    if (typeof onSort === 'function') {\n      onSort({ sortBy: sortByState });\n    }\n  }, [onSort, sortByState]);\n\n  useEffect(() => {\n    const filterHasArray: Array<number> = [];\n    page.forEach((row) => {\n      row.cells.forEach((item) => {\n        if (Array.isArray(item.value)) {\n          filterHasArray.push(item.value.length);\n        }\n      });\n    });\n    const countCellData = filterHasArray.length > 0 ? Math.max(...filterHasArray) : 0;\n    setCountCellSpan(countCellData);\n  }, [page]);\n\n  const isOverflowAuto = !!props.freezedColumn || !!props.freezeHeader;\n  const isEmpty = data.length === 0;\n\n  return (\n    <TablePageContainer $isLoading={props.isLoading}>\n      <TableContainerStyled\n        $isOverflowAuto={!isOverflowAuto}\n        $isLoading={props.isLoading}\n        $isEmpty={isEmpty}\n        rowEvenColor={props.rowEvenColor}\n        rowOddColor={props.rowOddColor}\n        variant={props.variant}\n      >\n        <TableStyled\n          {...getTableProps()}\n          freezeHeader={props.freezeHeader}\n          variant={props.variant}\n          data-test-id={props.dataTestId}\n          rowOddColor={props.rowOddColor}\n          rowEvenColor={props.rowEvenColor}\n        >\n          <TableHeader\n            headerGroups={headerGroups}\n            variant={props.variant}\n            freezeHeader={props.freezeHeader}\n          />\n          <TableBodyStyled {...getTableBodyProps()}>\n            {\n              // eslint-disable-next-line sonarjs/cognitive-complexity\n              page.map((row, i) => {\n                prepareRow(row);\n                const onClick = () => props.onClickRow && props.onClickRow(row.original);\n                return (\n                  <tr key={i} {...row.getRowProps()}>\n                    {row.cells.map((cell) => {\n                      const { checkboxIsDisabled, ...restCellProps } = cell.getCellProps(\n                        getCellProps(cell)\n                      ) as CustomCellProps;\n                      return (\n                        <td key={cell.row.id} {...restCellProps}>\n                          {cell.column.type === 'custom' ? (\n                            <CellContainerContentStyled\n                              variant={props.variant}\n                              isBaseline\n                              onClick={cell.column.disableClick ? null : onClick}\n                            >\n                              {cell.render('Cell', {\n                                numberAddition: indexRowAddition,\n                                ...(cell.column.accessor === 'selectable'\n                                  ? { checkboxIsDisabled }\n                                  : {})\n                              })}\n                            </CellContainerContentStyled>\n                          ) : (\n                            <>\n                              {Array.isArray(cell.value) ? (\n                                cell.value.map((valueCell, index) => (\n                                  <CellContainerContentStyled\n                                    variant={props.variant}\n                                    key={index}\n                                    isBaseline\n                                    countArrayValue={countCellSpan}\n                                    isColSpan\n                                    onClick={cell.column.disableClick ? null : onClick}\n                                  >\n                                    <TextStyled\n                                      textAlign={cell.column.textAlign || defaultValue.textAlign}\n                                      label={\n                                        cell.column.isCanShowEmptyCell\n                                          ? valueCell\n                                          : valueCell || '-'\n                                      }\n                                      variant='medium'\n                                      ellipsis={cell.value ? cell.value.length >= charTotal : false}\n                                      {...cell.column.textStyle}\n                                    />\n                                  </CellContainerContentStyled>\n                                ))\n                              ) : (\n                                <CellContainerContentStyled\n                                  variant={props.variant}\n                                  isBaseline\n                                  onClick={cell.column.disableClick ? null : onClick}\n                                >\n                                  <TextStyled\n                                    textAlign={cell.column.textAlign || defaultValue.textAlign}\n                                    label={\n                                      cell.column.isCanShowEmptyCell\n                                        ? cell.value\n                                        : cell.value || '-'\n                                    }\n                                    variant='medium'\n                                    ellipsis={cell.value ? cell.value.length >= charTotal : false}\n                                    {...cell.column.textStyle}\n                                  />\n                                </CellContainerContentStyled>\n                              )}\n                            </>\n                          )}\n                        </td>\n                      );\n                    })}\n                  </tr>\n                );\n              })\n            }\n          </TableBodyStyled>\n        </TableStyled>\n      </TableContainerStyled>\n\n      {props.isLoading ? (\n        <TableLoaderContainer\n          style={{\n            height: props.emptyTableHeight\n          }}\n        >\n          <LoadingIndicator size='small' />\n        </TableLoaderContainer>\n      ) : (\n        <>\n          {isEmpty && (\n            <EmptyData\n              emptyTableHeight={props.emptyTableHeight}\n              noRecordLabel={props.noRecordLabel}\n            />\n          )}\n          {!!pageCount && (\n            <PaginationFooter\n              canPreviousPage={canPreviousPage}\n              canNextPage={canNextPage}\n              totalData={isManualPagination ? totalData : data.length}\n              pageIndex={pageIndex}\n              onClick={{\n                first: () => gotoPage(0),\n                prev: previousPage,\n                next: nextPage,\n                last: () => gotoPage(pageCount - 1),\n                gotoPage: (page) => gotoPage(page)\n              }}\n              totalPage={pageCount}\n              activePageColor={activePageColor}\n            />\n          )}\n        </>\n      )}\n    </TablePageContainer>\n  );\n};\n\nTable.prototype = {\n  pageSize: PropTypes.number,\n  emptyTableHeight: PropTypes.number,\n  onClickRow: PropTypes.func,\n  variant: PropTypes.string,\n  isSelectable: PropTypes.bool,\n  freezedColumn: PropTypes.number,\n  freezeHeader: PropTypes.bool,\n  hideRowIndex: PropTypes.bool\n};\n\nTable.defaultProps = {\n  pageSize: defaultValue.pageSize,\n  pageIndex: defaultValue.pageIndex,\n  emptyTableHeight: 200,\n  onClickRow: undefined,\n  variant: 'regular',\n  isSelectable: false,\n  freezedColumn: 0,\n  freezeHeader: false,\n  hideRowIndex: false\n};\n\nexport default Table;\n"],"names":["defaultValue","TablePageContainer","styled","div","$isLoading","css","TableHeaderStyled","thead","ColorDark","silver","TableHeader","props","_jsx","jsx","children","headerGroups","map","headerGroup","i","Object","assign","getHeaderGroupProps","headers","column","_createElement","getHeaderProps","getIsExcludedSortable","getSortByToggleProps","key","id","CellContainerHeaderStyled","textAlign","variant","Header","valueOf","render","_jsxs","_Fragment","Text","label","toString","tableSizeMapper","fontSize","fontWeight","columns","style","display","justifyContent","alignItems","disableSortBy","SortIcon","isSorted","isSortedDesc","TableBodyStyled","tbody","fontFamilyMapper","ContainerPaginationButton","isDisableChangePage","undefined","_a","isCurrentPage","activePageColor","ColorBlue","yaleBlue","MarginType","ActivePageText","_c","_b","theme","table","pagination","activePageNumberText","_d","PaginationNextFooter","pageIndexLabel","gotoPage","page","ButtonLink","onClick","onMouseDown","margin","PaginationPreviousFooter","PaginationFooter","totalData","pageIndex","canPreviousPage","canNextPage","totalPage","marginTop","position","left","color","gumbo","right","first","Icon","name","size","solitude","prev","next","last","TableStyled","freezeHeader","ColorLight","whiteSolid","thHeight","tdMinHeight","tdMaxHeight","rowEvenColor","rowOddColor","TableContainerStyled","$isOverflowAuto","$isEmpty","whiteSmoke","TextStyled","Table","getCellProps","defaultPropGetter","__rest","onPageChange","isManualPagination","isManualSort","onSort","charTotal","data","useMemo","freezeColumn","header","freezedColumn","sortBy","pageCountState","setPageCountState","useState","Math","ceil","pageSize","countCellSpan","setCountCellSpan","getTableProps","getTableBodyProps","nextPage","pageCount","prepareRow","previousPage","selectedFlatRows","setHiddenColumns","state","sortByState","useTable","manualSortBy","manualPagination","initialState","hiddenColumns","useBlockLayout","useSortBy","usePagination","reactTableExports","useRowSelect","useSticky","hooks","tableHooks","isSelectable","hideRowIndex","rowIndexAlign","rowActions","actionLabel","indexRowAddition","useDidMountEffect","onSelectedRow","useEffect","filterHasArray","forEach","row","cells","item","Array","isArray","value","push","length","countCellData","max","isOverflowAuto","isEmpty","isLoading","dataTestId","onClickRow","original","getRowProps","cell","checkboxIsDisabled","restCellProps","type","CellContainerContentStyled","isBaseline","disableClick","numberAddition","accessor","Fragment","valueCell","index","countArrayValue","isColSpan","isCanShowEmptyCell","ellipsis","textStyle","TableLoaderContainer","height","emptyTableHeight","LoadingIndicator","EmptyData","noRecordLabel","prototype","PropTypes.number","propTypesExports","number","PropTypes.func","func","PropTypes.string","string","PropTypes.bool","bool","defaultProps"],"mappings":"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"}
+{"version":3,"file":"TablePage.js","sources":["../../../../src/components/Table/TablePage.tsx"],"sourcesContent":["import * as PropTypes from 'prop-types';\nimport { useEffect, useMemo, useState } from 'react';\nimport {\n  TableCellProps,\n  useBlockLayout,\n  usePagination,\n  useRowSelect,\n  useSortBy,\n  useTable\n} from 'react-table';\nimport { useSticky } from 'react-table-sticky';\nimport styled, { css } from 'styled-components';\n\nimport { useDidMountEffect } from '../../hooks/useDidMountEffect';\nimport { ColorBlue, ColorDark, ColorLight } from '../../styles/Colors';\nimport { MarginType } from '../../styles/Spacing';\nimport freezeColumn from '../../utils/freezeColumn';\nimport { ButtonLink } from '../Button';\nimport { Icon } from '../Icon';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { fontFamilyMapper, Text, TextAlign } from '../Text';\nimport { TableHeaderInterface, TablePageInterface, TableVariantInterface } from './';\nimport { TableStyleInterface } from './Table.type';\nimport {\n  CellContainerContentStyled,\n  CellContainerHeaderStyled,\n  defaultPropGetter,\n  EmptyData,\n  getIsExcludedSortable,\n  SortIcon,\n  tableHooks,\n  TableLoaderContainer,\n  tableSizeMapper\n} from './TableBase';\nimport { TableContainerStyledProps } from './TablePage.type';\n\nconst defaultValue: {\n  pageIndex: number;\n  pageSize: number;\n  textAlign: TextAlign;\n} = {\n  pageIndex: 0,\n  pageSize: 10,\n  textAlign: 'left'\n};\n\nconst TablePageContainer = styled.div<{ $isLoading?: boolean }>`\n  ${({ $isLoading }) => {\n    if (!$isLoading) return null;\n    return css`\n      display: flex;\n      position: relative;\n      > div {\n        &:nth-child(2) {\n          left: 50%;\n          position: absolute;\n          top: 50%;\n          transform: translate(-50%, -50%);\n        }\n      }\n    `;\n  }}\n`;\n\nconst TableHeaderStyled = styled.thead`\n  tr {\n    z-index: 4;\n    box-shadow: 0px 1px 1px 0px rgb(0 0 0 / 25%);\n    clip-path: inset(-10px 0px);\n    :first-child {\n      th {\n        display: flex !important;\n      }\n    }\n  }\n  th {\n    border-bottom: 1px solid ${ColorDark.silver};\n    box-sizing: border-box !important;\n    :last-child {\n      border-right: 0;\n    }\n    p {\n      width: auto;\n    }\n  }\n`;\n\nconst TableHeader = (props: TableHeaderInterface) => {\n  return (\n    <TableHeaderStyled>\n      {props.headerGroups.map((headerGroup, i) => (\n        <tr key={`headerGroup-${i}`} {...headerGroup.getHeaderGroupProps()}>\n          {headerGroup.headers.map((column) => (\n            <th\n              {...column.getHeaderProps(\n                getIsExcludedSortable(column) && column.getSortByToggleProps()\n              )}\n              key={column.id}\n            >\n              <CellContainerHeaderStyled\n                textAlign={column.textAlign || defaultValue.textAlign}\n                variant={props.variant}\n              >\n                {typeof column.Header.valueOf() !== 'string' ? (\n                  column.render('Header')\n                ) : (\n                  <>\n                    <Text\n                      textAlign={column.textAlign || defaultValue.textAlign}\n                      label={column.Header.toString()}\n                      variant={tableSizeMapper[props.variant].fontSize}\n                      fontWeight='semi-bold'\n                    />\n                    {!column.columns && (\n                      <span\n                        style={{\n                          display: 'flex',\n                          justifyContent: 'center',\n                          alignItems: 'center'\n                        }}\n                      >\n                        {!column.disableSortBy && (\n                          <SortIcon isSorted={column.isSorted} isSortedDesc={column.isSortedDesc} />\n                        )}\n                      </span>\n                    )}\n                  </>\n                )}\n              </CellContainerHeaderStyled>\n            </th>\n          ))}\n        </tr>\n      ))}\n    </TableHeaderStyled>\n  );\n};\n\nconst TableBodyStyled = styled.tbody`\n  tr {\n    cursor: pointer;\n    :hover {\n      p {\n        font-family: ${fontFamilyMapper['semi-bold']};\n      }\n    }\n    td {\n      box-sizing: border-box !important;\n      :last-child {\n        border-right: 0;\n      }\n    }\n  }\n`;\n\nconst ContainerPaginationButton = styled.div<{\n  isDisableChangePage?: boolean;\n  isCurrentPage?: boolean;\n  activePageColor?: string;\n}>`\n  align-items: center;\n  background-color: ${(props) => (props.isDisableChangePage ? ColorDark.silver : undefined)};\n  border: 1px solid;\n  border-color: ${(props) =>\n    props.isCurrentPage ? props.activePageColor ?? ColorBlue.yaleBlue : ColorDark.silver};\n  border-radius: ${MarginType['micro']};\n  display: flex;\n  height: 32px;\n  justify-content: center;\n  margin-right: ${MarginType['micro']};\n  width: 32px;\n`;\n\nconst ActivePageText = styled(Text)<{ activePageColor?: string }>`\n  color: ${(props) =>\n    props.theme?.table?.pagination?.activePageNumberText ||\n    (props.activePageColor ?? ColorBlue.yaleBlue)};\n`;\n\nconst PaginationNextFooter = ({\n  pageIndexLabel,\n  gotoPage,\n  page\n}: {\n  pageIndexLabel: number;\n  gotoPage: (page: number) => void;\n  page: number;\n}) => {\n  return (\n    <ContainerPaginationButton>\n      <ButtonLink onClick={() => gotoPage(page)} onMouseDown={() => gotoPage(page)}>\n        <div style={{ margin: `0 ${MarginType['extra-small']}` }}>\n          <Text label={'' + pageIndexLabel} variant='small' />\n        </div>\n      </ButtonLink>\n    </ContainerPaginationButton>\n  );\n};\n\nconst PaginationPreviousFooter = ({\n  pageIndexLabel,\n  gotoPage,\n  page\n}: {\n  pageIndexLabel: number;\n  gotoPage: (page: number) => void;\n  page: number;\n}) => {\n  return (\n    <ContainerPaginationButton>\n      <ButtonLink onClick={() => gotoPage(page)}>\n        <div style={{ margin: `0 ${MarginType['extra-small']}` }}>\n          <Text label={'' + pageIndexLabel} variant='small' />\n        </div>\n      </ButtonLink>\n    </ContainerPaginationButton>\n  );\n};\n\nconst PaginationFooter = ({\n  totalData,\n  pageIndex,\n  canPreviousPage,\n  canNextPage,\n  onClick,\n  totalPage,\n  activePageColor\n}: {\n  totalData: number;\n  pageIndex: number;\n  canPreviousPage: boolean;\n  canNextPage: boolean;\n  onClick: {\n    first: () => void;\n    prev: () => void;\n    next: () => void;\n    last: () => void;\n    gotoPage: (page: number) => void;\n  };\n  totalPage: number;\n  activePageColor?: string;\n}) => (\n  <div\n    style={{\n      display: 'flex',\n      justifyContent: 'space-between',\n      marginTop: 8\n    }}\n  >\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        position: 'sticky',\n        left: 0\n      }}\n    >\n      <Text label={`Total: ${totalData}`} variant='small' color={ColorDark.gumbo} />\n    </div>\n    <div\n      style={{\n        display: 'flex',\n        alignItems: 'center',\n        position: 'sticky',\n        right: 0\n      }}\n    >\n      <ContainerPaginationButton isDisableChangePage={!canPreviousPage}>\n        <ButtonLink onClick={onClick.first}>\n          <Icon\n            name='chevronDoubleArrowLeft'\n            size='extra-small'\n            color={canPreviousPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n      <ContainerPaginationButton isDisableChangePage={!canPreviousPage}>\n        <ButtonLink onClick={onClick.prev}>\n          <Icon\n            name='chevronleft'\n            size='extra-small'\n            color={canPreviousPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n      {canPreviousPage && pageIndex !== 1 && (\n        <PaginationPreviousFooter\n          pageIndexLabel={pageIndex - 1}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex - 2}\n        />\n      )}\n      {canPreviousPage && (\n        <PaginationPreviousFooter\n          pageIndexLabel={pageIndex}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex - 1}\n        />\n      )}\n      <ContainerPaginationButton isCurrentPage activePageColor={activePageColor}>\n        <div style={{ margin: `0 ${MarginType['extra-small']}` }}>\n          <ActivePageText\n            label={'' + (pageIndex + 1)}\n            variant='small'\n            activePageColor={activePageColor}\n          />\n        </div>\n      </ContainerPaginationButton>\n      {canNextPage && (\n        <PaginationNextFooter\n          pageIndexLabel={pageIndex + 2}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex + 1}\n        />\n      )}\n      {canNextPage && pageIndex + 2 !== totalPage && (\n        <PaginationNextFooter\n          pageIndexLabel={pageIndex + 3}\n          gotoPage={onClick.gotoPage}\n          page={pageIndex + 2}\n        />\n      )}\n      <ContainerPaginationButton isDisableChangePage={!canNextPage}>\n        <ButtonLink onClick={onClick.next} onMouseDown={onClick.next}>\n          <Icon\n            name='chevronright'\n            size='extra-small'\n            color={canNextPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n      <ContainerPaginationButton isDisableChangePage={!canNextPage}>\n        <ButtonLink onClick={onClick.last} onMouseDown={onClick.last}>\n          <Icon\n            name='chevronDoubleArrowRight'\n            size='extra-small'\n            color={canNextPage ? ColorDark.silver : ColorDark.solitude}\n          />\n        </ButtonLink>\n      </ContainerPaginationButton>\n    </div>\n  </div>\n);\n\ninterface TableStyledInterface extends TableVariantInterface, TableStyleInterface {\n  freezeHeader?: boolean;\n}\n\ninterface CustomCellProps extends TableCellProps {\n  checkboxIsDisabled?: boolean;\n}\n\nconst TableStyled = styled.table<TableStyledInterface>`\n  thead:first-child {\n    ${({ freezeHeader }) =>\n      freezeHeader && 'position: sticky !important;  top: 0 !important; z-index: 5 !important'}\n  }\n  border-spacing: 0;\n  margin-top: ${MarginType['extra-small']};\n  width: 100%;\n  th {\n    padding: 0px 8px;\n    background-color: ${ColorLight.whiteSolid};\n    height: ${({ variant }) => tableSizeMapper[variant].thHeight};\n  }\n  td {\n    min-height: ${({ variant }) => tableSizeMapper[variant].tdMinHeight};\n    max-height: ${({ variant }) => tableSizeMapper[variant].tdMaxHeight};\n    :last-child {\n      border-right: 0;\n    }\n  }\n  tr {\n    :nth-child(odd) {\n      background-color: ${({ rowEvenColor }) => rowEvenColor};\n    }\n    :nth-child(even) {\n      background-color: ${({ rowOddColor }) => rowOddColor};\n    }\n    :last-child {\n      td {\n        border-bottom: 0;\n      }\n    }\n  }\n`;\n\nconst TableContainerStyled = styled.div<TableContainerStyledProps>`\n  overflow: ${({ $isOverflowAuto }) => ($isOverflowAuto ? 'auto' : 'visible')};\n  width: 100%;\n\n  ${({ $isLoading, $isEmpty }) => {\n    if ($isLoading) {\n      return css`\n        display: flex;\n        height: 100%;\n        max-height: 60vh;\n        min-height: 380px;\n        opacity: 0.5;\n        overflow: hidden;\n        pointer-events: none;\n      `;\n    }\n\n    if ($isEmpty) {\n      return css`\n        display: flex;\n        min-height: 100px;\n      `;\n    }\n\n    return css`\n      display: flex;\n      height: 100%;\n      max-height: 60vh;\n      min-height: 380px;\n      overflow: auto;\n    `;\n  }}\n\n  table {\n    tr {\n      :hover {\n        background-color: ${ColorLight.whiteSmoke};\n        p {\n          font-family: ${fontFamilyMapper['semi-bold']};\n        }\n        td {\n          background-color: ${ColorLight.whiteSmoke};\n        }\n      }\n      :last-child {\n        td {\n          border-bottom: 0;\n        }\n      }\n      :nth-child(odd) {\n        td {\n          background-color: ${({ rowEvenColor }) => rowEvenColor};\n        }\n      }\n      :nth-child(even) {\n        td {\n          background-color: ${({ rowOddColor }) => rowOddColor};\n        }\n      }\n    }\n\n    [data-sticky-last-left-td] {\n      box-shadow: 4px 0px 4px 0px rgba(82, 97, 107, 0.15);\n      clip-path: inset(0px -15px 0px 0px);\n    }\n\n    [data-sticky-first-right-td] {\n      box-shadow: 4px 0px 4px 0px rgba(82, 97, 107, 0.15);\n      clip-path: inset(0px -15px 0px 0px);\n    }\n  }\n`;\n\nconst TextStyled = styled(Text)`\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  display: -webkit-inline-box;\n  overflow: hidden;\n  white-space: normal;\n`;\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst Table = ({ getCellProps = defaultPropGetter, ...props }: TablePageInterface) => {\n  // FIXME: pindahin logic di component ke custom hooks\n  const { onPageChange, isManualPagination, totalData, isManualSort, onSort, activePageColor } =\n    props;\n  const charTotal = tableSizeMapper[props.variant].charTotal;\n  const data = useMemo(() => props.data, [props.data]);\n  const columns = useMemo(\n    () => freezeColumn({ header: props.header, freezedColumn: props.freezedColumn }),\n    [props.freezedColumn, props.header]\n  );\n  const sortBy = useMemo(() => {\n    if (props.sortBy && isManualSort) return [props.sortBy];\n    return [];\n  }, [props.sortBy, isManualSort]);\n\n  const [pageCountState, setPageCountState] = useState(\n    isManualPagination ? Math.ceil(totalData / props.pageSize) : undefined\n  );\n  const [countCellSpan, setCountCellSpan] = useState<number>(0);\n\n  const {\n    canNextPage,\n    canPreviousPage,\n    getTableProps,\n    getTableBodyProps,\n    gotoPage,\n    headerGroups,\n    nextPage,\n    page,\n    pageCount,\n    prepareRow,\n    previousPage,\n    selectedFlatRows,\n    setHiddenColumns,\n    state: {\n      pageIndex,\n      pageSize,\n      sortBy: [sortByState]\n    }\n  } = useTable(\n    {\n      columns,\n      data,\n      manualSortBy: isManualSort,\n      manualPagination: isManualPagination,\n      pageCount: pageCountState,\n      initialState: {\n        sortBy,\n        pageIndex: isManualPagination ? props.pageIndex : defaultValue.pageIndex,\n        pageSize: props.pageSize,\n        hiddenColumns: []\n      }\n    },\n    useBlockLayout,\n    useSortBy,\n    usePagination,\n    useRowSelect,\n    useSticky,\n    (hooks) =>\n      tableHooks({\n        hooks,\n        isSelectable: props.isSelectable,\n        hideRowIndex: props.hideRowIndex,\n        rowIndexAlign: props.rowIndexAlign,\n        variant: props.variant,\n        rowActions: props.rowActions,\n        actionLabel: props.actionLabel,\n        freezedColumn: props.freezedColumn\n      })\n  );\n\n  const indexRowAddition = useMemo(() => {\n    if (!isManualPagination) return 0;\n    return pageSize * pageIndex;\n  }, [isManualPagination, pageIndex, pageSize]);\n\n  useDidMountEffect(() => {\n    if (typeof props.onSelectedRow === 'function' && props.isSelectable) {\n      props.onSelectedRow(selectedFlatRows);\n    }\n  }, [props.onSelectedRow, selectedFlatRows]);\n\n  // FIXME: find better implementation for hidden columns\n  useEffect(() => {\n    if (props.hiddenColumns) setHiddenColumns(props.hiddenColumns || []);\n  }, [props.hiddenColumns, setHiddenColumns]);\n\n  useEffect(() => {\n    if (typeof onPageChange === 'function') {\n      onPageChange({ pageIndex, pageSize });\n    }\n  }, [onPageChange, pageIndex, pageSize]);\n\n  useEffect(() => {\n    if (isManualPagination) {\n      setPageCountState(Math.ceil(totalData / pageSize));\n    }\n  }, [pageSize, totalData, isManualPagination]);\n\n  useEffect(() => {\n    if (typeof onSort === 'function') {\n      onSort({ sortBy: sortByState });\n    }\n  }, [onSort, sortByState]);\n\n  useEffect(() => {\n    const filterHasArray: Array<number> = [];\n    page.forEach((row) => {\n      row.cells.forEach((item) => {\n        if (Array.isArray(item.value)) {\n          filterHasArray.push(item.value.length);\n        }\n      });\n    });\n    const countCellData = filterHasArray.length > 0 ? Math.max(...filterHasArray) : 0;\n    setCountCellSpan(countCellData);\n  }, [page]);\n\n  const isOverflowAuto = !!props.freezedColumn || !!props.freezeHeader;\n  const isEmpty = data.length === 0;\n\n  return (\n    <TablePageContainer $isLoading={props.isLoading}>\n      <TableContainerStyled\n        $isOverflowAuto={!isOverflowAuto}\n        $isLoading={props.isLoading}\n        $isEmpty={isEmpty}\n        rowEvenColor={props.rowEvenColor}\n        rowOddColor={props.rowOddColor}\n        variant={props.variant}\n      >\n        <TableStyled\n          {...getTableProps()}\n          freezeHeader={props.freezeHeader}\n          variant={props.variant}\n          data-test-id={props.dataTestId}\n          rowOddColor={props.rowOddColor}\n          rowEvenColor={props.rowEvenColor}\n        >\n          <TableHeader\n            headerGroups={headerGroups}\n            variant={props.variant}\n            freezeHeader={props.freezeHeader}\n          />\n          <TableBodyStyled {...getTableBodyProps()}>\n            {\n              // eslint-disable-next-line sonarjs/cognitive-complexity\n              page.map((row, i) => {\n                prepareRow(row);\n                const onClick = () => props.onClickRow && props.onClickRow(row.original);\n                return (\n                  <tr key={i} {...row.getRowProps()}>\n                    {row.cells.map((cell) => {\n                      const { checkboxIsDisabled, ...restCellProps } = cell.getCellProps(\n                        getCellProps(cell)\n                      ) as CustomCellProps;\n                      return (\n                        <td key={cell.row.id} {...restCellProps}>\n                          {cell.column.type === 'custom' ? (\n                            <CellContainerContentStyled\n                              variant={props.variant}\n                              isBaseline\n                              onClick={cell.column.disableClick ? null : onClick}\n                            >\n                              {cell.render('Cell', {\n                                numberAddition: indexRowAddition,\n                                ...(cell.column.accessor === 'selectable'\n                                  ? { checkboxIsDisabled }\n                                  : {})\n                              })}\n                            </CellContainerContentStyled>\n                          ) : (\n                            <>\n                              {Array.isArray(cell.value) ? (\n                                cell.value.map((valueCell, index) => (\n                                  <CellContainerContentStyled\n                                    variant={props.variant}\n                                    key={index}\n                                    isBaseline\n                                    countArrayValue={countCellSpan}\n                                    isColSpan\n                                    onClick={cell.column.disableClick ? null : onClick}\n                                  >\n                                    <TextStyled\n                                      textAlign={cell.column.textAlign || defaultValue.textAlign}\n                                      label={\n                                        cell.column.isCanShowEmptyCell\n                                          ? valueCell\n                                          : valueCell || '-'\n                                      }\n                                      variant='medium'\n                                      ellipsis={cell.value ? cell.value.length >= charTotal : false}\n                                      {...cell.column.textStyle}\n                                    />\n                                  </CellContainerContentStyled>\n                                ))\n                              ) : (\n                                <CellContainerContentStyled\n                                  variant={props.variant}\n                                  isBaseline\n                                  onClick={cell.column.disableClick ? null : onClick}\n                                >\n                                  <TextStyled\n                                    textAlign={cell.column.textAlign || defaultValue.textAlign}\n                                    label={\n                                      cell.column.isCanShowEmptyCell\n                                        ? cell.value\n                                        : cell.value || '-'\n                                    }\n                                    variant='medium'\n                                    ellipsis={cell.value ? cell.value.length >= charTotal : false}\n                                    {...cell.column.textStyle}\n                                  />\n                                </CellContainerContentStyled>\n                              )}\n                            </>\n                          )}\n                        </td>\n                      );\n                    })}\n                  </tr>\n                );\n              })\n            }\n          </TableBodyStyled>\n        </TableStyled>\n      </TableContainerStyled>\n\n      {props.isLoading ? (\n        <TableLoaderContainer\n          style={{\n            height: props.emptyTableHeight\n          }}\n        >\n          <LoadingIndicator size='small' />\n        </TableLoaderContainer>\n      ) : (\n        <>\n          {isEmpty && (\n            <EmptyData\n              emptyTableHeight={props.emptyTableHeight}\n              noRecordLabel={props.noRecordLabel}\n            />\n          )}\n          {!!pageCount && (\n            <PaginationFooter\n              canPreviousPage={canPreviousPage}\n              canNextPage={canNextPage}\n              totalData={isManualPagination ? totalData : data.length}\n              pageIndex={pageIndex}\n              onClick={{\n                first: () => gotoPage(0),\n                prev: previousPage,\n                next: nextPage,\n                last: () => gotoPage(pageCount - 1),\n                gotoPage: (page) => gotoPage(page)\n              }}\n              totalPage={pageCount}\n              activePageColor={activePageColor}\n            />\n          )}\n        </>\n      )}\n    </TablePageContainer>\n  );\n};\n\nTable.prototype = {\n  pageSize: PropTypes.number,\n  emptyTableHeight: PropTypes.number,\n  onClickRow: PropTypes.func,\n  variant: PropTypes.string,\n  isSelectable: PropTypes.bool,\n  freezedColumn: PropTypes.number,\n  freezeHeader: PropTypes.bool,\n  hideRowIndex: PropTypes.bool\n};\n\nTable.defaultProps = {\n  pageSize: defaultValue.pageSize,\n  pageIndex: defaultValue.pageIndex,\n  emptyTableHeight: 200,\n  onClickRow: undefined,\n  variant: 'regular',\n  isSelectable: false,\n  freezedColumn: 0,\n  freezeHeader: false,\n  hideRowIndex: false\n};\n\nexport default Table;\n"],"names":["defaultValue","TablePageContainer","styled","div","$isLoading","css","TableHeaderStyled","thead","ColorDark","silver","TableHeader","props","_jsx","jsx","children","headerGroups","map","headerGroup","i","Object","assign","getHeaderGroupProps","headers","column","_createElement","getHeaderProps","getIsExcludedSortable","getSortByToggleProps","key","id","CellContainerHeaderStyled","textAlign","variant","Header","valueOf","render","_jsxs","_Fragment","Text","label","toString","tableSizeMapper","fontSize","fontWeight","columns","style","display","justifyContent","alignItems","disableSortBy","SortIcon","isSorted","isSortedDesc","TableBodyStyled","tbody","fontFamilyMapper","ContainerPaginationButton","isDisableChangePage","undefined","_a","isCurrentPage","activePageColor","ColorBlue","yaleBlue","MarginType","ActivePageText","_c","_b","theme","table","pagination","activePageNumberText","_d","PaginationNextFooter","pageIndexLabel","gotoPage","page","ButtonLink","onClick","onMouseDown","margin","PaginationPreviousFooter","PaginationFooter","totalData","pageIndex","canPreviousPage","canNextPage","totalPage","marginTop","position","left","color","gumbo","right","first","Icon","name","size","solitude","prev","next","last","TableStyled","freezeHeader","ColorLight","whiteSolid","thHeight","tdMinHeight","tdMaxHeight","rowEvenColor","rowOddColor","TableContainerStyled","$isOverflowAuto","$isEmpty","whiteSmoke","TextStyled","Table","getCellProps","defaultPropGetter","__rest","onPageChange","isManualPagination","isManualSort","onSort","charTotal","data","useMemo","freezeColumn","header","freezedColumn","sortBy","pageCountState","setPageCountState","useState","Math","ceil","pageSize","countCellSpan","setCountCellSpan","getTableProps","getTableBodyProps","nextPage","pageCount","prepareRow","previousPage","selectedFlatRows","setHiddenColumns","state","sortByState","useTable","manualSortBy","manualPagination","initialState","hiddenColumns","useBlockLayout","useSortBy","usePagination","reactTableExports","useRowSelect","useSticky","hooks","tableHooks","isSelectable","hideRowIndex","rowIndexAlign","rowActions","actionLabel","indexRowAddition","useDidMountEffect","onSelectedRow","useEffect","filterHasArray","forEach","row","cells","item","Array","isArray","value","push","length","countCellData","max","isOverflowAuto","isEmpty","isLoading","dataTestId","onClickRow","original","getRowProps","cell","checkboxIsDisabled","restCellProps","type","CellContainerContentStyled","isBaseline","disableClick","numberAddition","accessor","Fragment","valueCell","index","countArrayValue","isColSpan","isCanShowEmptyCell","ellipsis","textStyle","TableLoaderContainer","height","emptyTableHeight","LoadingIndicator","EmptyData","noRecordLabel","prototype","PropTypes.number","propTypesExports","number","PropTypes.func","func","PropTypes.string","string","PropTypes.bool","bool","defaultProps"],"mappings":"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"}

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

@@ -56,7 +56,7 @@
 `,A=w.default.table`
   border-spacing: 0;
   thead:first-child {
-    ${({freezeHeader:e})=>e&&"position: sticky !important;  top: 0 !important; z-index: 5 !important"}
+    ${({freezeHeader:e})=>e&&"position: sticky !important;  top: 0 !important; z-index: 35 !important"}
   }
   tbody:first-child {
     ${({freezeHeader:e})=>e&&"height: (100% - 82px)"}

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

@@ -1 +1 @@
-{"version":3,"file":"TableResponsive.js","sources":["../../../../src/components/Table/TableResponsive.tsx"],"sourcesContent":["import autoAnimate from '@formkit/auto-animate';\nimport classNames from 'classnames';\nimport * as PropTypes from 'prop-types';\nimport React, { Children, useEffect, useMemo, useRef, useState } from 'react';\nimport {\n  HeaderGroup,\n  TableCellProps,\n  useBlockLayout,\n  usePagination,\n  useRowSelect,\n  useSortBy,\n  useTable\n} from 'react-table';\nimport { useSticky } from 'react-table-sticky';\nimport styled, { css } from 'styled-components';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useDidMountEffect } from '../../hooks';\nimport { ColorBlue, ColorLight } from '../../styles/Colors';\nimport freezeColumn from '../../utils/freezeColumn';\nimport { getChildrenOnDisplayName } from '../../utils/getChildrenOnDisplayName';\nimport { BaseButton } from '../Button';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { BaseMenuDropdown } from '../Menu';\nimport { BasePagination } from '../Pagination';\nimport { BaseSwitchPicker } from '../SwitchPicker';\nimport { BaseText, fontFamilyMapper, Text, TextAlign } from '../Text';\nimport { TableHeaderInterface, TableResponsiveInterface, TableVariantInterface } from '.';\nimport { TableStyleInterface } from './Table.type';\nimport {\n  CellContainerContentStyled,\n  CellContainerHeaderStyled,\n  defaultPropGetter,\n  EmptyData,\n  getIsExcludedSortable,\n  SortIcon,\n  tableHooks,\n  tableSizeMapper\n} from './TableBase';\nimport {\n  TableResponsiveContainerStyledProps,\n  TableResponsiveItemContentInterface,\n  TableResponsiveItemTabsInterface,\n  TableResponsiveListTabsInterface,\n  TableResponsiveMidTabsInterface\n} from './TableResponsive.type';\n\nconst defaultValue: {\n  pageIndex: number;\n  pageSize: number;\n  textAlign: TextAlign;\n} = {\n  pageIndex: 0,\n  pageSize: 10,\n  textAlign: 'left'\n};\n\nconst TableResponsiveContainerStyled = styled.div`\n  bottom: 0;\n  display: flex;\n  flex-direction: column;\n  left: 0;\n  position: absolute;\n  right: 0;\n  top: 0;\n`;\n\nconst TableHeaderStyled = styled.thead<{ headerGroupsLength?: number }>`\n  tr {\n    box-shadow: 0px 1px 1px 0px rgb(0 0 0 / 25%);\n    clip-path: inset(-10px 0px);\n    margin-top: -2px;\n    :first-child {\n      th {\n        display: flex !important;\n      }\n    }\n    z-index: 4;\n  }\n  th {\n    box-sizing: border-box !important;\n    min-height: ${({ headerGroupsLength }) => `${headerGroupsLength * 28}px`} !important;\n    :last-child {\n      border-right: 0;\n      flex: 1;\n    }\n    p {\n      letter-spacing: 0px !important;\n      line-height: 12px !important;\n      width: auto;\n    }\n  }\n`;\n\nconst TableLoadingAndEmptyContainerStyled = styled.div`\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 100%;\n`;\n\nconst TableHeader = (props: TableHeaderInterface) => {\n  const isIdHasPlaceholder = (id: string) => {\n    return id.includes('placeholder');\n  };\n\n  const splitByPlaceholder = (id: string) => {\n    return id.split('_placeholder_');\n  };\n\n  useMemo(() => {\n    const hg = props.headerGroups.slice();\n    if (hg.length > 1) {\n      const dataHg: Array<HeaderGroup> = hg;\n      for (let i = 0; i !== dataHg.length; i++) {\n        if (dataHg[i].headers.length > 1) {\n          for (let j = 0; j < dataHg[i].headers.length; j++) {\n            if (isIdHasPlaceholder(dataHg[i].headers[j].id)) {\n              const index = splitByPlaceholder(dataHg[i].headers[j].id)[1];\n              dataHg[i].headers[j] = dataHg[i + 1].headers[parseInt(index)];\n            }\n          }\n        }\n      }\n\n      return dataHg;\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [props.headerGroups]);\n\n  const { key, ...headerGroupProps } = props.headerGroups[0].getHeaderGroupProps();\n\n  return (\n    <>\n      <TableHeaderStyled headerGroupsLength={props.headerGroups.length}>\n        <tr\n          {...headerGroupProps}\n          key={key}\n          style={{\n            display: 'flex',\n            width: 'auto',\n            backgroundColor: ColorLight.whiteSmoke,\n            minHeight: 28 * props.headerGroups.length\n          }}\n        >\n          {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n          {props.headerGroups[0].headers.map((column, indexHeaderGroups) => (\n            <th\n              {...column.getHeaderProps(\n                getIsExcludedSortable(column) && column.getSortByToggleProps()\n              )}\n              className={twMerge(\n                classNames(\n                  'flex flex-col',\n                  twMerge('bg-tableResponsive-header-background-colspan', props.headerStyles),\n                  column.columns &&\n                    'border border-t-0 border-b-0 border-solid border-dark-solitude',\n                  props.headerGroups[0].headers[indexHeaderGroups - 1] &&\n                    props.headerGroups[0].headers[indexHeaderGroups - 1].columns &&\n                    'border-l-0'\n                )\n              )}\n              key={column.id}\n            >\n              <CellContainerHeaderStyled\n                textAlign={column.textAlign || defaultValue.textAlign}\n                variant={props.variant}\n                style={{ minHeight: !column.columns ? 28 * props.headerGroups.length : 28 }}\n              >\n                <div className={classNames('flex flex-row items-center p-2')}>\n                  {typeof column.Header.valueOf() !== 'string' ? (\n                    column.render('Header')\n                  ) : (\n                    <>\n                      <BaseText\n                        label={column.Header.toString()}\n                        className={classNames(\n                          'text-[10px] font-normal text-center',\n                          column.isSorted\n                            ? twMerge(\n                                'text-tableResponsive-header-textAndIcon-active',\n                                props.textSortedStyles\n                              )\n                            : twMerge(\n                                'text-tableResponsive-header-textAndIcon-default',\n                                props.textUnsortedStyles\n                              )\n                        )}\n                      />\n                      {!column.columns && (\n                        <span\n                          style={{\n                            display: 'flex',\n                            justifyContent: 'center',\n                            alignItems: 'center'\n                          }}\n                        >\n                          {!column.disableSortBy && (\n                            <SortIcon\n                              isSorted={column.isSorted}\n                              isSortedDesc={column.isSortedDesc}\n                              iconSortedStyles={props.iconSortedStyles}\n                              iconUnsortedStyles={props.iconUnsortedStyles}\n                            />\n                          )}\n                        </span>\n                      )}\n                    </>\n                  )}\n                </div>\n              </CellContainerHeaderStyled>\n              {column.columns && (\n                <div\n                  className={twMerge(\n                    'flex flex-row bg-tableResponsive-header-background-underColspan',\n                    props.childHeaderStyles\n                  )}\n                >\n                  {column.columns.map((item) => {\n                    return (\n                      <CellContainerHeaderStyled\n                        key={item.Header.toString()}\n                        textAlign={item.textAlign || defaultValue.textAlign}\n                        variant={props.variant}\n                        style={{ minHeight: 28 }}\n                      >\n                        <div\n                          className={classNames('flex flex-row items-center p-2')}\n                          style={{ minHeight: 28, minWidth: item.width }}\n                        >\n                          <BaseText\n                            label={item.Header.toString()}\n                            className={classNames(\n                              'text-[10px] font-normal text-center',\n                              column.isSorted\n                                ? twMerge(\n                                    'text-tableResponsive-header-textAndIcon-default',\n                                    props.textSortedStyles\n                                  )\n                                : twMerge(\n                                    'text-tableResponsive-header-textAndIcon-default',\n                                    props.textUnsortedStyles\n                                  )\n                            )}\n                          />\n                          {!column.columns && (\n                            <span\n                              style={{\n                                display: 'flex',\n                                justifyContent: 'center',\n                                alignItems: 'center'\n                              }}\n                            >\n                              {!column.disableSortBy && (\n                                <SortIcon\n                                  isSorted={column.isSorted}\n                                  isSortedDesc={column.isSortedDesc}\n                                  iconSortedStyles={props.iconSortedStyles}\n                                  iconUnsortedStyles={props.iconUnsortedStyles}\n                                />\n                              )}\n                            </span>\n                          )}\n                        </div>\n                      </CellContainerHeaderStyled>\n                    );\n                  })}\n                </div>\n              )}\n            </th>\n          ))}\n        </tr>\n      </TableHeaderStyled>\n    </>\n  );\n};\n\nconst TableBodyStyled = styled.tbody`\n  tr {\n    cursor: pointer;\n    :hover {\n      p {\n        font-family: ${fontFamilyMapper['semi-bold']};\n      }\n    }\n    td {\n      box-sizing: border-box !important;\n      :last-child {\n        border-right: 0;\n      }\n    }\n    z-index: 10;\n  }\n`;\n\ninterface TableStyledInterface extends TableVariantInterface, TableStyleInterface {\n  freezeHeader?: boolean;\n}\n\ninterface CustomCellProps extends TableCellProps {\n  checkboxIsDisabled?: boolean;\n}\n\nconst TableStyled = styled.table<TableStyledInterface>`\n  border-spacing: 0;\n  thead:first-child {\n    ${({ freezeHeader }) =>\n      freezeHeader && 'position: sticky !important;  top: 0 !important; z-index: 5 !important'}\n  }\n  tbody:first-child {\n    ${({ freezeHeader }) => freezeHeader && 'height: (100% - 82px)'}\n  }\n  width: 100%;\n  td {\n    max-height: ${({ variant }) => tableSizeMapper[variant].tdMaxHeight};\n    min-height: ${({ variant }) => tableSizeMapper[variant].tdMinHeight};\n    :last-child {\n      border-right: 0;\n      flex: 1;\n    }\n  }\n  tr {\n    :nth-child(odd) {\n      background-color: ${({ rowEvenColor }) => rowEvenColor};\n    }\n    :nth-child(even) {\n      background-color: ${({ rowOddColor }) => rowOddColor};\n    }\n    :last-child {\n      td {\n        border-bottom: 0;\n      }\n    }\n  }\n`;\n\nconst TableContainerStyled = styled.div<TableResponsiveContainerStyledProps>`\n  overflow: hidden;\n  width: 100%;\n\n  ${({ $isLoading, $isEmpty }) => {\n    if ($isLoading) {\n      return css`\n        display: flex;\n        height: 0px;\n        opacity: 0.5;\n        overflow: hidden;\n        pointer-events: none;\n        width: 0px;\n      `;\n    }\n\n    if ($isEmpty) {\n      return css`\n        display: flex;\n        height: 60px;\n        width: 100%;\n      `;\n    }\n\n    return css`\n      display: flex;\n      flex: 1;\n      flex-direction: column;\n      height: 100%;\n      overflow: auto;\n    `;\n  }}\n\n  table {\n    tr {\n      :last-child {\n        td {\n          border-bottom: 0;\n        }\n      }\n      :nth-child(odd) {\n        td {\n          background-color: ${({ rowOddColor }) =>\n            rowOddColor || 'var(--tableResponsive-body-background-odd)'};\n        }\n      }\n      :nth-child(even) {\n        td {\n          background-color: ${({ rowEvenColor }) =>\n            rowEvenColor || 'var(--tableResponsive-body-background-even)'};\n        }\n      }\n    }\n\n    ${({ $isOverflowAuto }) => {\n      if (!$isOverflowAuto) {\n        return css`\n          [data-sticky-td] {\n            box-shadow: 4px 0px 6px -1px rgba(0, 0, 0, 0.16);\n            clip-path: inset(-1px -15px -1px 0px);\n          }\n        `;\n      }\n    }}\n  }\n`;\n\nconst TextStyled = styled(Text)<{ isEmpty: boolean }>`\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  color: ${({ isEmpty, color }) =>\n    color\n      ? color\n      : isEmpty\n      ? 'var(--tableResponsive-body-text-notSpecifiedAndNone)'\n      : 'var(--tableResponsive-body-text-default)'};\n  display: -webkit-inline-box;\n  overflow: hidden;\n  white-space: normal;\n`;\n\n// TableResponsive.defaultProps = {\n//   pageSize: defaultValue.pageSize,\n//   pageIndex: defaultValue.pageIndex,\n//   emptyTableHeight: 200,\n//   onClickRow: undefined,\n//   variant: 'regular',\n//   isSelectable: false,\n//   freezedColumn: 0,\n//   freezeHeader: false,\n//   hideRowIndex: false,\n//   tableHeight: 400\n// };\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst TableResponsive = ({\n  getCellProps = defaultPropGetter,\n  pageIndex: tablePageIndex = defaultValue.pageIndex,\n  pageSize: tablePageSize = defaultValue.pageSize,\n  emptyTableHeight = 200,\n  onClickRow = undefined,\n  variant = 'regular',\n  isSelectable = false,\n  freezedColumn = 0,\n  freezeHeader = false,\n  hideRowIndex = false,\n  tableHeight = 400,\n  ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nTableResponsiveInterface) => {\n  // FIXME: pindahin logic di component ke custom hooks\n  const {\n    onPageChange,\n    isHidePagination,\n    isHideTable,\n    isHideItemShownDropdown,\n    isHideShowColumnDropdown,\n    totalData,\n    totalPage,\n    isManualSort,\n    itemShownLabel,\n    itemShownLabelStyles,\n    itemShownDropdown,\n    showColumnDropdown,\n    onSort,\n    isRefetchData,\n    loadingContainerStyles\n  } = props;\n  const charTotal = tableSizeMapper[variant].charTotal;\n  const data = useMemo(() => props.data, [props.data]);\n  const columns = useMemo(\n    () => freezeColumn({ header: props.header, freezedColumn: freezedColumn }),\n    [freezedColumn, props.header]\n  );\n\n  const sortBy = useMemo(() => {\n    if (props.sortBy && isManualSort) return [props.sortBy];\n    return [];\n  }, [props.sortBy, isManualSort]);\n\n  const parentRef = useRef<HTMLDivElement>();\n  const tableRef = useRef<HTMLDivElement>();\n\n  const [totalWidthOfContainer, setTotalWidhtOfContainer] = useState<number>(0);\n\n  const totalWidthfColumn = useMemo(() => {\n    let temp;\n    if (props.header) {\n      temp = props.header.reduce((e, c) => {\n        return e + (c.width || 150);\n      }, 0);\n\n      if (props.rowActions) {\n        temp += 100;\n      }\n\n      if (!hideRowIndex) {\n        temp += 40;\n      }\n\n      if (!isSelectable) {\n        temp += 48;\n      }\n    }\n    return temp;\n  }, [props.header, hideRowIndex, props.rowActions, isSelectable]);\n\n  const [pageCountState, setPageCountState] = useState(\n    !isHidePagination ? Math.ceil(totalData / tablePageSize) : undefined\n  );\n  const [countCellSpan, setCountCellSpan] = useState<number>(0);\n\n  const selectedIdRows = () => {\n    const temp: { [key: string]: boolean } = {};\n    const rows = props.initialCheckedRows;\n    if (rows) {\n      rows.forEach((row) => {\n        const index = data.findIndex((e: { id: string }) => e.id === row);\n        temp[index.toString()] = true;\n      });\n    }\n    return temp;\n  };\n\n  useEffect(() => {\n    if (parentRef.current) {\n      autoAnimate(parentRef.current);\n    }\n  }, [parentRef]);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setTotalWidhtOfContainer(entry.contentRect.width);\n      }\n    });\n\n    if (tableRef.current) {\n      resizeObserver.observe(tableRef.current);\n    }\n\n    return () => {\n      if (tableRef.current) {\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        resizeObserver.unobserve(tableRef.current);\n      }\n    };\n  }, []);\n\n  const {\n    canNextPage,\n    canPreviousPage,\n    getTableProps,\n    getTableBodyProps,\n    gotoPage,\n    headerGroups,\n    nextPage,\n    page,\n    pageCount,\n    prepareRow,\n    previousPage,\n    selectedFlatRows,\n    setHiddenColumns,\n    state: {\n      pageIndex,\n      pageSize,\n      sortBy: [sortByState]\n    }\n  } = useTable(\n    {\n      columns,\n      data,\n      manualSortBy: isManualSort,\n      manualPagination: !isHidePagination,\n      pageCount: pageCountState,\n      initialState: {\n        sortBy,\n        pageIndex: !isHidePagination ? tablePageIndex : defaultValue.pageIndex,\n        pageSize: tablePageSize,\n        hiddenColumns: [],\n        selectedRowIds: props.initialCheckedRows ? selectedIdRows() : { '-1': true }\n      }\n    },\n    useBlockLayout,\n    useSortBy,\n    usePagination,\n    useRowSelect,\n    useSticky,\n    (hooks) =>\n      tableHooks({\n        hooks,\n        isSelectable: isSelectable,\n        hideRowIndex: hideRowIndex,\n        rowIndexAlign: props.rowIndexAlign,\n        variant: variant,\n        actionLabel: props.actionLabel,\n        rowActions: props.rowActions,\n        freezedColumn: freezedColumn,\n        checkedColor: props.checkedColor\n      })\n  );\n\n  const indexRowAddition = useMemo(() => {\n    if (isHidePagination) return 0;\n    return pageSize * pageIndex;\n  }, [isHidePagination, pageIndex, pageSize]);\n\n  useDidMountEffect(() => {\n    if (typeof props.onSelectedRow === 'function' && isSelectable) {\n      props.onSelectedRow(selectedFlatRows);\n    }\n  }, [props.onSelectedRow, selectedFlatRows]);\n\n  useEffect(() => {\n    if (selectedFlatRows) {\n      const temp = selectedFlatRows.map((item) => item.original.id);\n      props.onCheckedRow?.(temp);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedFlatRows]);\n\n  // FIXME: find better implementation for hidden columns\n  useEffect(() => {\n    if (props.hiddenColumns) setHiddenColumns(props.hiddenColumns || []);\n  }, [props.hiddenColumns, setHiddenColumns]);\n\n  useEffect(() => {\n    if (typeof onPageChange === 'function') {\n      onPageChange({ pageIndex, pageSize });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pageIndex, pageSize]);\n\n  useEffect(() => {\n    if (!isHidePagination) {\n      setPageCountState(Math.ceil(totalData / pageSize));\n    }\n  }, [pageSize, totalData, isHidePagination]);\n\n  useEffect(() => {\n    if (typeof onSort === 'function') {\n      onSort({ sortBy: sortByState });\n    }\n  }, [onSort, sortByState]);\n\n  useEffect(() => {\n    const filterHasArray: Array<number> = [];\n    page.forEach((row) => {\n      row.cells.forEach((item) => {\n        if (Array.isArray(item.value)) {\n          filterHasArray.push(item.value.length);\n        }\n      });\n    });\n    const countCellData = filterHasArray.length > 0 ? Math.max(...filterHasArray) : 0;\n    setCountCellSpan(countCellData);\n  }, [page]);\n\n  const isOverflowAuto =\n    (!!freezedColumn || !!freezeHeader) && totalWidthfColumn > totalWidthOfContainer;\n  const isEmpty = data.length === 0;\n\n  const listTabs = getChildrenOnDisplayName(props.children, 'ListTabs');\n  const midTabs = getChildrenOnDisplayName(props.children, 'MidTabs');\n  const itemContent = getChildrenOnDisplayName(props.children, 'ItemContent');\n\n  return (\n    <div className='flex flex-col w-full h-full'>\n      {/* Layout Header */}\n      <div\n        ref={parentRef}\n        className={twMerge(\n          'flex flex-col w-full bg-accordionTabs-container-background-default mb-3 rounded-lg p-2',\n          props.headerContainerStyles\n        )}\n      >\n        <div className='flex flex-row items-center w-full gap-x-1'>\n          <div className='flex flex-1'>{listTabs}</div>\n          {midTabs && <>{midTabs}</>}\n          {!isHidePagination && pageCount > 0 && (\n            <div>\n              <BasePagination\n                canPreviousPage={canPreviousPage}\n                canNextPage={canNextPage}\n                totalData={!isHidePagination ? totalData : data.length}\n                pageIndex={pageIndex}\n                onClickPage={{\n                  first: () => gotoPage(0),\n                  prev: previousPage,\n                  next: nextPage,\n                  last: () => gotoPage(pageCount - 1),\n                  gotoPage: (page) => gotoPage(page)\n                }}\n                totalPage={totalPage || pageCount}\n                isShowPagination={true}\n                {...props.pagination}\n              />\n            </div>\n          )}\n\n          {!isHideItemShownDropdown && !!itemShownDropdown && (\n            <div className='flex flex-row items-center gap-x-2'>\n              <BaseText\n                label={itemShownLabel || 'Item Shown'}\n                className={twMerge('font-normal text-dark-gumbo', itemShownLabelStyles)}\n              />\n              <BaseMenuDropdown {...itemShownDropdown} />\n            </div>\n          )}\n\n          {!isHideShowColumnDropdown && !!showColumnDropdown && (\n            <div>\n              <BaseSwitchPicker {...showColumnDropdown} />\n            </div>\n          )}\n        </div>\n\n        {itemContent}\n      </div>\n\n      {/* Layout Content/Body */}\n      <div\n        className={`${\n          isHideTable ? 'hidden' : 'flex'\n        } flex-1 relative w-full h-full overflow-auto z-10`}\n      >\n        <TableResponsiveContainerStyled>\n          <TableContainerStyled\n            ref={tableRef}\n            $isOverflowAuto={!isOverflowAuto}\n            $isLoading={props.isLoading}\n            $isEmpty={isEmpty}\n            tableHeight={tableHeight}\n            rowEvenColor={props.rowEvenColor}\n            rowOddColor={props.rowOddColor}\n            variant={variant}\n            className={twMerge('w-full h-full', props.tableContainerStyles)}\n          >\n            <TableStyled\n              {...getTableProps()}\n              freezeHeader={freezeHeader}\n              variant={variant}\n              data-test-id={props.dataTestId}\n              rowOddColor={props.rowOddColor}\n              rowEvenColor={props.rowEvenColor}\n            >\n              {isRefetchData && (\n                <div\n                  className={twMerge(\n                    'absolute top-0 flex flex-1 items-center justify-center w-full h-full bg-light-whiteSolid z-20',\n                    loadingContainerStyles\n                  )}\n                >\n                  <LoadingIndicator size='small' />\n                </div>\n              )}\n              <TableHeader\n                headerGroups={headerGroups}\n                variant={variant}\n                freezeHeader={freezeHeader}\n                textSortedStyles={props.textSortedStyles}\n                textUnsortedStyles={props.textUnsortedStyles}\n                iconSortedStyles={props.iconSortedStyles}\n                iconUnsortedStyles={props.iconUnsortedStyles}\n                headerStyles={props.headerStyles}\n                childHeaderStyles={props.childHeaderStyles}\n              />\n              <TableBodyStyled {...getTableBodyProps()}>\n                {\n                  // eslint-disable-next-line sonarjs/cognitive-complexity\n                  page.map((row, i) => {\n                    prepareRow(row);\n                    const onClick = () => onClickRow && onClickRow(row.original);\n                    const { key, ...rowProps } = row.getRowProps();\n\n                    return (\n                      <tr\n                        {...rowProps}\n                        key={key || i}\n                        style={{\n                          display: 'flex',\n                          width: 'auto'\n                        }}\n                      >\n                        {row.cells.map((cell, indexCell) => {\n                          const { key, checkboxIsDisabled, ...restCellProps } = cell.getCellProps(\n                            getCellProps(cell)\n                          ) as CustomCellProps;\n                          return (\n                            <td\n                              {...restCellProps}\n                              key={key || cell.row.id}\n                              className={twMerge(\n                                classNames(\n                                  !!cell.column.parent &&\n                                    'border border-t-0 border-b-0 border-solid border-dark-solitude',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !!row.cells[indexCell + 1].column.parent &&\n                                    !!row.cells[indexCell - 1].column.parent &&\n                                    'border-l-0',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !!row.cells[indexCell + 1].column.parent &&\n                                    !row.cells[indexCell - 1].column.parent &&\n                                    'border-r-0',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !row.cells[indexCell + 1].column.parent &&\n                                    !!row.cells[indexCell - 1].column.parent &&\n                                    'border-l-0',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !!row.cells[indexCell + 1].column.parent &&\n                                    !!row.cells[indexCell - 1].column.parent &&\n                                    row.cells[indexCell - 1].column.parent.id !==\n                                      cell.column.parent.id &&\n                                    'border-r-0',\n                                  !row.cells[indexCell + 1] && 'border-l-0'\n                                )\n                              )}\n                            >\n                              {cell.column.type === 'custom' ? (\n                                <CellContainerContentStyled\n                                  variant={variant}\n                                  isBaseline\n                                  onClick={cell.column.disableClick ? null : onClick}\n                                >\n                                  {cell.render('Cell', {\n                                    numberAddition: indexRowAddition,\n                                    ...(cell.column.accessor === 'selectable'\n                                      ? { checkboxIsDisabled }\n                                      : {})\n                                  })}\n                                </CellContainerContentStyled>\n                              ) : (\n                                <>\n                                  {Array.isArray(cell.value) ? (\n                                    cell.value.map((valueCell, index) => (\n                                      <CellContainerContentStyled\n                                        variant={variant}\n                                        key={index}\n                                        isBaseline\n                                        countArrayValue={countCellSpan}\n                                        isColSpan\n                                        onClick={cell.column.disableClick ? null : onClick}\n                                      >\n                                        <TextStyled\n                                          isEmpty={!valueCell}\n                                          textAlign={\n                                            cell.column.textAlign || defaultValue.textAlign\n                                          }\n                                          label={\n                                            cell.column.isCanShowEmptyCell\n                                              ? valueCell\n                                              : valueCell || '-'\n                                          }\n                                          variant='small'\n                                          ellipsis={\n                                            cell.value ? cell.value.length >= charTotal : false\n                                          }\n                                          {...cell.column.textStyle}\n                                        />\n                                      </CellContainerContentStyled>\n                                    ))\n                                  ) : (\n                                    <CellContainerContentStyled\n                                      variant={variant}\n                                      isBaseline\n                                      onClick={cell.column.disableClick ? null : onClick}\n                                    >\n                                      <TextStyled\n                                        isEmpty={!cell.value}\n                                        textAlign={cell.column.textAlign || defaultValue.textAlign}\n                                        label={\n                                          cell.column.isCanShowEmptyCell\n                                            ? cell.value\n                                            : cell.value || '-'\n                                        }\n                                        variant='small'\n                                        ellipsis={\n                                          cell.value ? cell.value.length >= charTotal : false\n                                        }\n                                        {...cell.column.textStyle}\n                                      />\n                                    </CellContainerContentStyled>\n                                  )}\n                                </>\n                              )}\n                            </td>\n                          );\n                        })}\n                      </tr>\n                    );\n                  })\n                }\n              </TableBodyStyled>\n            </TableStyled>\n          </TableContainerStyled>\n\n          {isEmpty && !props.isLoading && (\n            <TableLoadingAndEmptyContainerStyled>\n              <EmptyData\n                emptyTableHeight={emptyTableHeight}\n                noRecordLabel={props.noRecordLabel}\n                noRecordComponent={props.noRecordComponent}\n              />\n            </TableLoadingAndEmptyContainerStyled>\n          )}\n\n          {props.isLoading && (\n            <TableLoadingAndEmptyContainerStyled>\n              <LoadingIndicator\n                size='small'\n                color={props.loadingColor ? props.loadingColor : ColorBlue.yaleBlue}\n                secondaryColor={\n                  props.loadingSecondaryColor ? props.loadingSecondaryColor : ColorBlue.lapisLazuli\n                }\n              />\n            </TableLoadingAndEmptyContainerStyled>\n          )}\n        </TableResponsiveContainerStyled>\n      </div>\n    </div>\n  );\n};\n\nconst ListTabs = ({ children }: TableResponsiveListTabsInterface) => {\n  const arrListTabs = Children.toArray(children);\n  return (\n    <div className='flex flex-row w-full'>\n      {Children.map(arrListTabs, (item, index) => {\n        const tab = getChildrenOnDisplayName(item, 'ItemTabs');\n        return (\n          <div key={index} className='flex flex-row items-center'>\n            {tab}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nListTabs.displayName = 'ListTabs';\nTableResponsive.ListTabs = ListTabs;\n\nconst MidTabs = ({ children, containerStyles }: TableResponsiveMidTabsInterface) => {\n  return (\n    <>\n      {children ? (\n        <div className={twMerge('flex flex-row flex-1', containerStyles)}>{children}</div>\n      ) : null}\n    </>\n  );\n};\nMidTabs.displayName = 'MidTabs';\nTableResponsive.MidTabs = MidTabs;\n\nconst ItemTabs = ({ children, isActive, ...props }: TableResponsiveItemTabsInterface) => {\n  const [isMouseEnter, setIsMouseEnter] = useState<boolean>(false);\n  const [isMouseDown, setIsMouseDown] = useState<boolean>(false);\n\n  return (\n    <>\n      {children ? (\n        children\n      ) : (\n        <div\n          onMouseDown={() => setIsMouseDown(true)}\n          onMouseUp={() => setIsMouseDown(false)}\n          onMouseEnter={() => setIsMouseEnter(true)}\n          onMouseLeave={() => setIsMouseEnter(false)}\n        >\n          <BaseButton\n            {...props}\n            leftIconStyles={twMerge(\n              classNames(\n                'fill-accordionTabs-button-textAndIcon-default',\n                isMouseEnter && 'fill-accordionTabs-button-textAndIcon-hover',\n                (isMouseDown || isActive) && 'fill-accordionTabs-button-textAndIcon-active'\n              ),\n              props.leftIconStyles\n            )}\n            rightIcon={isActive ? 'chevronup' : props.rightIcon || 'chevrondown'}\n            rightIconStyles={twMerge(\n              classNames(\n                'fill-accordionTabs-button-textAndIcon-default',\n                isMouseEnter && 'fill-accordionTabs-button-textAndIcon-hover',\n                (isMouseDown || isActive) && 'fill-accordionTabs-button-textAndIcon-active'\n              ),\n              props.rightIconStyles\n            )}\n            className={twMerge(\n              classNames(\n                `\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            `,\n                isActive &&\n                  `\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              `\n              ),\n              props.className\n            )}\n          />\n        </div>\n      )}\n    </>\n  );\n};\nItemTabs.displayName = 'ItemTabs';\nTableResponsive.ItemTabs = ItemTabs;\n\nconst ItemContent = ({ children }: TableResponsiveItemContentInterface) => {\n  return <>{children}</>;\n};\nItemContent.displayName = 'ItemContent';\nTableResponsive.ItemContent = ItemContent;\n\nTableResponsive.prototype = {\n  pageSize: PropTypes.number,\n  emptyTableHeight: PropTypes.number,\n  onClickRow: PropTypes.func,\n  variant: PropTypes.string,\n  isSelectable: PropTypes.bool,\n  freezedColumn: PropTypes.number,\n  freezeHeader: PropTypes.bool,\n  hideRowIndex: PropTypes.bool,\n  tableHeight: PropTypes.number\n};\n\nexport default TableResponsive;\n"],"names":["defaultValue","pageIndex","pageSize","textAlign","TableResponsiveContainerStyled","styled","div","TableHeaderStyled","thead","headerGroupsLength","TableLoadingAndEmptyContainerStyled","TableHeader","props","splitByPlaceholder","id","split","useMemo","hg","headerGroups","slice","length","dataHg","i","headers","j","includes","index","parseInt","_a","getHeaderGroupProps","key","headerGroupProps","__rest","_jsx","jsx","children","_createElement","style","display","width","backgroundColor","ColorLight","whiteSmoke","minHeight","map","column","indexHeaderGroups","createElement","Object","assign","getHeaderProps","getIsExcludedSortable","getSortByToggleProps","className","twMerge","classNames","headerStyles","columns","CellContainerHeaderStyled","variant","Header","valueOf","render","_jsxs","_Fragment","Fragment","BaseText","label","toString","isSorted","textSortedStyles","textUnsortedStyles","justifyContent","alignItems","disableSortBy","SortIcon","isSortedDesc","iconSortedStyles","iconUnsortedStyles","childHeaderStyles","item","jsxs","minWidth","TableBodyStyled","tbody","fontFamilyMapper","TableStyled","table","freezeHeader","tableSizeMapper","tdMaxHeight","tdMinHeight","rowEvenColor","rowOddColor","TableContainerStyled","$isLoading","$isEmpty","css","$isOverflowAuto","TextStyled","Text","isEmpty","color","TableResponsive","getCellProps","defaultPropGetter","tablePageIndex","tablePageSize","emptyTableHeight","onClickRow","isSelectable","freezedColumn","hideRowIndex","tableHeight","onPageChange","isHidePagination","isHideTable","isHideItemShownDropdown","isHideShowColumnDropdown","totalData","totalPage","isManualSort","itemShownLabel","itemShownLabelStyles","itemShownDropdown","showColumnDropdown","onSort","isRefetchData","loadingContainerStyles","charTotal","data","freezeColumn","header","sortBy","parentRef","useRef","tableRef","totalWidthOfContainer","setTotalWidhtOfContainer","useState","totalWidthfColumn","temp","reduce","e","c","rowActions","pageCountState","setPageCountState","undefined","Math","ceil","countCellSpan","setCountCellSpan","useEffect","current","autoAnimate","resizeObserver","ResizeObserver","entries","entry","contentRect","observe","unobserve","canNextPage","canPreviousPage","getTableProps","getTableBodyProps","gotoPage","nextPage","page","pageCount","prepareRow","previousPage","selectedFlatRows","setHiddenColumns","state","sortByState","useTable","manualSortBy","manualPagination","initialState","hiddenColumns","selectedRowIds","initialCheckedRows","rows","forEach","row","findIndex","selectedIdRows","useBlockLayout","useSortBy","usePagination","reactTableExports","useRowSelect","useSticky","hooks","tableHooks","rowIndexAlign","actionLabel","checkedColor","indexRowAddition","useDidMountEffect","onSelectedRow","original","onCheckedRow","call","filterHasArray","cells","Array","isArray","value","push","countCellData","max","isOverflowAuto","listTabs","getChildrenOnDisplayName","midTabs","itemContent","ref","headerContainerStyles","BasePagination","onClickPage","first","prev","next","last","isShowPagination","pagination","BaseMenuDropdown","BaseSwitchPicker","isLoading","tableContainerStyles","dataTestId","LoadingIndicator","size","onClick","getRowProps","rowProps","cell","indexCell","checkboxIsDisabled","restCellProps","parent","type","CellContainerContentStyled","isBaseline","disableClick","numberAddition","accessor","valueCell","countArrayValue","isColSpan","isCanShowEmptyCell","ellipsis","textStyle","EmptyData","noRecordLabel","noRecordComponent","loadingColor","ColorBlue","yaleBlue","secondaryColor","loadingSecondaryColor","lapisLazuli","ListTabs","arrListTabs","Children","toArray","tab","displayName","MidTabs","containerStyles","ItemTabs","isActive","isMouseEnter","setIsMouseEnter","isMouseDown","setIsMouseDown","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","BaseButton","leftIconStyles","rightIcon","rightIconStyles","ItemContent","prototype","PropTypes.number","propTypesExports","number","PropTypes.func","func","PropTypes.string","string","PropTypes.bool","bool"],"mappings":"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"}
+{"version":3,"file":"TableResponsive.js","sources":["../../../../src/components/Table/TableResponsive.tsx"],"sourcesContent":["import autoAnimate from '@formkit/auto-animate';\nimport classNames from 'classnames';\nimport * as PropTypes from 'prop-types';\nimport React, { Children, useEffect, useMemo, useRef, useState } from 'react';\nimport {\n  HeaderGroup,\n  TableCellProps,\n  useBlockLayout,\n  usePagination,\n  useRowSelect,\n  useSortBy,\n  useTable\n} from 'react-table';\nimport { useSticky } from 'react-table-sticky';\nimport styled, { css } from 'styled-components';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useDidMountEffect } from '../../hooks';\nimport { ColorBlue, ColorLight } from '../../styles/Colors';\nimport freezeColumn from '../../utils/freezeColumn';\nimport { getChildrenOnDisplayName } from '../../utils/getChildrenOnDisplayName';\nimport { BaseButton } from '../Button';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { BaseMenuDropdown } from '../Menu';\nimport { BasePagination } from '../Pagination';\nimport { BaseSwitchPicker } from '../SwitchPicker';\nimport { BaseText, fontFamilyMapper, Text, TextAlign } from '../Text';\nimport { TableHeaderInterface, TableResponsiveInterface, TableVariantInterface } from '.';\nimport { TableStyleInterface } from './Table.type';\nimport {\n  CellContainerContentStyled,\n  CellContainerHeaderStyled,\n  defaultPropGetter,\n  EmptyData,\n  getIsExcludedSortable,\n  SortIcon,\n  tableHooks,\n  tableSizeMapper\n} from './TableBase';\nimport {\n  TableResponsiveContainerStyledProps,\n  TableResponsiveItemContentInterface,\n  TableResponsiveItemTabsInterface,\n  TableResponsiveListTabsInterface,\n  TableResponsiveMidTabsInterface\n} from './TableResponsive.type';\n\nconst defaultValue: {\n  pageIndex: number;\n  pageSize: number;\n  textAlign: TextAlign;\n} = {\n  pageIndex: 0,\n  pageSize: 10,\n  textAlign: 'left'\n};\n\nconst TableResponsiveContainerStyled = styled.div`\n  bottom: 0;\n  display: flex;\n  flex-direction: column;\n  left: 0;\n  position: absolute;\n  right: 0;\n  top: 0;\n`;\n\nconst TableHeaderStyled = styled.thead<{ headerGroupsLength?: number }>`\n  tr {\n    box-shadow: 0px 1px 1px 0px rgb(0 0 0 / 25%);\n    clip-path: inset(-10px 0px);\n    margin-top: -2px;\n    :first-child {\n      th {\n        display: flex !important;\n      }\n    }\n    z-index: 4;\n  }\n  th {\n    box-sizing: border-box !important;\n    min-height: ${({ headerGroupsLength }) => `${headerGroupsLength * 28}px`} !important;\n    :last-child {\n      border-right: 0;\n      flex: 1;\n    }\n    p {\n      letter-spacing: 0px !important;\n      line-height: 12px !important;\n      width: auto;\n    }\n  }\n`;\n\nconst TableLoadingAndEmptyContainerStyled = styled.div`\n  align-items: center;\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  width: 100%;\n`;\n\nconst TableHeader = (props: TableHeaderInterface) => {\n  const isIdHasPlaceholder = (id: string) => {\n    return id.includes('placeholder');\n  };\n\n  const splitByPlaceholder = (id: string) => {\n    return id.split('_placeholder_');\n  };\n\n  useMemo(() => {\n    const hg = props.headerGroups.slice();\n    if (hg.length > 1) {\n      const dataHg: Array<HeaderGroup> = hg;\n      for (let i = 0; i !== dataHg.length; i++) {\n        if (dataHg[i].headers.length > 1) {\n          for (let j = 0; j < dataHg[i].headers.length; j++) {\n            if (isIdHasPlaceholder(dataHg[i].headers[j].id)) {\n              const index = splitByPlaceholder(dataHg[i].headers[j].id)[1];\n              dataHg[i].headers[j] = dataHg[i + 1].headers[parseInt(index)];\n            }\n          }\n        }\n      }\n\n      return dataHg;\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [props.headerGroups]);\n\n  const { key, ...headerGroupProps } = props.headerGroups[0].getHeaderGroupProps();\n\n  return (\n    <>\n      <TableHeaderStyled headerGroupsLength={props.headerGroups.length}>\n        <tr\n          {...headerGroupProps}\n          key={key}\n          style={{\n            display: 'flex',\n            width: 'auto',\n            backgroundColor: ColorLight.whiteSmoke,\n            minHeight: 28 * props.headerGroups.length\n          }}\n        >\n          {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n          {props.headerGroups[0].headers.map((column, indexHeaderGroups) => (\n            <th\n              {...column.getHeaderProps(\n                getIsExcludedSortable(column) && column.getSortByToggleProps()\n              )}\n              className={twMerge(\n                classNames(\n                  'flex flex-col',\n                  twMerge('bg-tableResponsive-header-background-colspan', props.headerStyles),\n                  column.columns &&\n                    'border border-t-0 border-b-0 border-solid border-dark-solitude',\n                  props.headerGroups[0].headers[indexHeaderGroups - 1] &&\n                    props.headerGroups[0].headers[indexHeaderGroups - 1].columns &&\n                    'border-l-0'\n                )\n              )}\n              key={column.id}\n            >\n              <CellContainerHeaderStyled\n                textAlign={column.textAlign || defaultValue.textAlign}\n                variant={props.variant}\n                style={{ minHeight: !column.columns ? 28 * props.headerGroups.length : 28 }}\n              >\n                <div className={classNames('flex flex-row items-center p-2')}>\n                  {typeof column.Header.valueOf() !== 'string' ? (\n                    column.render('Header')\n                  ) : (\n                    <>\n                      <BaseText\n                        label={column.Header.toString()}\n                        className={classNames(\n                          'text-[10px] font-normal text-center',\n                          column.isSorted\n                            ? twMerge(\n                                'text-tableResponsive-header-textAndIcon-active',\n                                props.textSortedStyles\n                              )\n                            : twMerge(\n                                'text-tableResponsive-header-textAndIcon-default',\n                                props.textUnsortedStyles\n                              )\n                        )}\n                      />\n                      {!column.columns && (\n                        <span\n                          style={{\n                            display: 'flex',\n                            justifyContent: 'center',\n                            alignItems: 'center'\n                          }}\n                        >\n                          {!column.disableSortBy && (\n                            <SortIcon\n                              isSorted={column.isSorted}\n                              isSortedDesc={column.isSortedDesc}\n                              iconSortedStyles={props.iconSortedStyles}\n                              iconUnsortedStyles={props.iconUnsortedStyles}\n                            />\n                          )}\n                        </span>\n                      )}\n                    </>\n                  )}\n                </div>\n              </CellContainerHeaderStyled>\n              {column.columns && (\n                <div\n                  className={twMerge(\n                    'flex flex-row bg-tableResponsive-header-background-underColspan',\n                    props.childHeaderStyles\n                  )}\n                >\n                  {column.columns.map((item) => {\n                    return (\n                      <CellContainerHeaderStyled\n                        key={item.Header.toString()}\n                        textAlign={item.textAlign || defaultValue.textAlign}\n                        variant={props.variant}\n                        style={{ minHeight: 28 }}\n                      >\n                        <div\n                          className={classNames('flex flex-row items-center p-2')}\n                          style={{ minHeight: 28, minWidth: item.width }}\n                        >\n                          <BaseText\n                            label={item.Header.toString()}\n                            className={classNames(\n                              'text-[10px] font-normal text-center',\n                              column.isSorted\n                                ? twMerge(\n                                    'text-tableResponsive-header-textAndIcon-default',\n                                    props.textSortedStyles\n                                  )\n                                : twMerge(\n                                    'text-tableResponsive-header-textAndIcon-default',\n                                    props.textUnsortedStyles\n                                  )\n                            )}\n                          />\n                          {!column.columns && (\n                            <span\n                              style={{\n                                display: 'flex',\n                                justifyContent: 'center',\n                                alignItems: 'center'\n                              }}\n                            >\n                              {!column.disableSortBy && (\n                                <SortIcon\n                                  isSorted={column.isSorted}\n                                  isSortedDesc={column.isSortedDesc}\n                                  iconSortedStyles={props.iconSortedStyles}\n                                  iconUnsortedStyles={props.iconUnsortedStyles}\n                                />\n                              )}\n                            </span>\n                          )}\n                        </div>\n                      </CellContainerHeaderStyled>\n                    );\n                  })}\n                </div>\n              )}\n            </th>\n          ))}\n        </tr>\n      </TableHeaderStyled>\n    </>\n  );\n};\n\nconst TableBodyStyled = styled.tbody`\n  tr {\n    cursor: pointer;\n    :hover {\n      p {\n        font-family: ${fontFamilyMapper['semi-bold']};\n      }\n    }\n    td {\n      box-sizing: border-box !important;\n      :last-child {\n        border-right: 0;\n      }\n    }\n    z-index: 10;\n  }\n`;\n\ninterface TableStyledInterface extends TableVariantInterface, TableStyleInterface {\n  freezeHeader?: boolean;\n}\n\ninterface CustomCellProps extends TableCellProps {\n  checkboxIsDisabled?: boolean;\n}\n\nconst TableStyled = styled.table<TableStyledInterface>`\n  border-spacing: 0;\n  thead:first-child {\n    ${({ freezeHeader }) =>\n      freezeHeader && 'position: sticky !important;  top: 0 !important; z-index: 35 !important'}\n  }\n  tbody:first-child {\n    ${({ freezeHeader }) => freezeHeader && 'height: (100% - 82px)'}\n  }\n  width: 100%;\n  td {\n    max-height: ${({ variant }) => tableSizeMapper[variant].tdMaxHeight};\n    min-height: ${({ variant }) => tableSizeMapper[variant].tdMinHeight};\n    :last-child {\n      border-right: 0;\n      flex: 1;\n    }\n  }\n  tr {\n    :nth-child(odd) {\n      background-color: ${({ rowEvenColor }) => rowEvenColor};\n    }\n    :nth-child(even) {\n      background-color: ${({ rowOddColor }) => rowOddColor};\n    }\n    :last-child {\n      td {\n        border-bottom: 0;\n      }\n    }\n  }\n`;\n\nconst TableContainerStyled = styled.div<TableResponsiveContainerStyledProps>`\n  overflow: hidden;\n  width: 100%;\n\n  ${({ $isLoading, $isEmpty }) => {\n    if ($isLoading) {\n      return css`\n        display: flex;\n        height: 0px;\n        opacity: 0.5;\n        overflow: hidden;\n        pointer-events: none;\n        width: 0px;\n      `;\n    }\n\n    if ($isEmpty) {\n      return css`\n        display: flex;\n        height: 60px;\n        width: 100%;\n      `;\n    }\n\n    return css`\n      display: flex;\n      flex: 1;\n      flex-direction: column;\n      height: 100%;\n      overflow: auto;\n    `;\n  }}\n\n  table {\n    tr {\n      :last-child {\n        td {\n          border-bottom: 0;\n        }\n      }\n      :nth-child(odd) {\n        td {\n          background-color: ${({ rowOddColor }) =>\n            rowOddColor || 'var(--tableResponsive-body-background-odd)'};\n        }\n      }\n      :nth-child(even) {\n        td {\n          background-color: ${({ rowEvenColor }) =>\n            rowEvenColor || 'var(--tableResponsive-body-background-even)'};\n        }\n      }\n    }\n\n    ${({ $isOverflowAuto }) => {\n      if (!$isOverflowAuto) {\n        return css`\n          [data-sticky-td] {\n            box-shadow: 4px 0px 6px -1px rgba(0, 0, 0, 0.16);\n            clip-path: inset(-1px -15px -1px 0px);\n          }\n        `;\n      }\n    }}\n  }\n`;\n\nconst TextStyled = styled(Text)<{ isEmpty: boolean }>`\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  color: ${({ isEmpty, color }) =>\n    color\n      ? color\n      : isEmpty\n      ? 'var(--tableResponsive-body-text-notSpecifiedAndNone)'\n      : 'var(--tableResponsive-body-text-default)'};\n  display: -webkit-inline-box;\n  overflow: hidden;\n  white-space: normal;\n`;\n\n// TableResponsive.defaultProps = {\n//   pageSize: defaultValue.pageSize,\n//   pageIndex: defaultValue.pageIndex,\n//   emptyTableHeight: 200,\n//   onClickRow: undefined,\n//   variant: 'regular',\n//   isSelectable: false,\n//   freezedColumn: 0,\n//   freezeHeader: false,\n//   hideRowIndex: false,\n//   tableHeight: 400\n// };\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst TableResponsive = ({\n  getCellProps = defaultPropGetter,\n  pageIndex: tablePageIndex = defaultValue.pageIndex,\n  pageSize: tablePageSize = defaultValue.pageSize,\n  emptyTableHeight = 200,\n  onClickRow = undefined,\n  variant = 'regular',\n  isSelectable = false,\n  freezedColumn = 0,\n  freezeHeader = false,\n  hideRowIndex = false,\n  tableHeight = 400,\n  ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nTableResponsiveInterface) => {\n  // FIXME: pindahin logic di component ke custom hooks\n  const {\n    onPageChange,\n    isHidePagination,\n    isHideTable,\n    isHideItemShownDropdown,\n    isHideShowColumnDropdown,\n    totalData,\n    totalPage,\n    isManualSort,\n    itemShownLabel,\n    itemShownLabelStyles,\n    itemShownDropdown,\n    showColumnDropdown,\n    onSort,\n    isRefetchData,\n    loadingContainerStyles\n  } = props;\n  const charTotal = tableSizeMapper[variant].charTotal;\n  const data = useMemo(() => props.data, [props.data]);\n  const columns = useMemo(\n    () => freezeColumn({ header: props.header, freezedColumn: freezedColumn }),\n    [freezedColumn, props.header]\n  );\n\n  const sortBy = useMemo(() => {\n    if (props.sortBy && isManualSort) return [props.sortBy];\n    return [];\n  }, [props.sortBy, isManualSort]);\n\n  const parentRef = useRef<HTMLDivElement>();\n  const tableRef = useRef<HTMLDivElement>();\n\n  const [totalWidthOfContainer, setTotalWidhtOfContainer] = useState<number>(0);\n\n  const totalWidthfColumn = useMemo(() => {\n    let temp;\n    if (props.header) {\n      temp = props.header.reduce((e, c) => {\n        return e + (c.width || 150);\n      }, 0);\n\n      if (props.rowActions) {\n        temp += 100;\n      }\n\n      if (!hideRowIndex) {\n        temp += 40;\n      }\n\n      if (!isSelectable) {\n        temp += 48;\n      }\n    }\n    return temp;\n  }, [props.header, hideRowIndex, props.rowActions, isSelectable]);\n\n  const [pageCountState, setPageCountState] = useState(\n    !isHidePagination ? Math.ceil(totalData / tablePageSize) : undefined\n  );\n  const [countCellSpan, setCountCellSpan] = useState<number>(0);\n\n  const selectedIdRows = () => {\n    const temp: { [key: string]: boolean } = {};\n    const rows = props.initialCheckedRows;\n    if (rows) {\n      rows.forEach((row) => {\n        const index = data.findIndex((e: { id: string }) => e.id === row);\n        temp[index.toString()] = true;\n      });\n    }\n    return temp;\n  };\n\n  useEffect(() => {\n    if (parentRef.current) {\n      autoAnimate(parentRef.current);\n    }\n  }, [parentRef]);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setTotalWidhtOfContainer(entry.contentRect.width);\n      }\n    });\n\n    if (tableRef.current) {\n      resizeObserver.observe(tableRef.current);\n    }\n\n    return () => {\n      if (tableRef.current) {\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        resizeObserver.unobserve(tableRef.current);\n      }\n    };\n  }, []);\n\n  const {\n    canNextPage,\n    canPreviousPage,\n    getTableProps,\n    getTableBodyProps,\n    gotoPage,\n    headerGroups,\n    nextPage,\n    page,\n    pageCount,\n    prepareRow,\n    previousPage,\n    selectedFlatRows,\n    setHiddenColumns,\n    state: {\n      pageIndex,\n      pageSize,\n      sortBy: [sortByState]\n    }\n  } = useTable(\n    {\n      columns,\n      data,\n      manualSortBy: isManualSort,\n      manualPagination: !isHidePagination,\n      pageCount: pageCountState,\n      initialState: {\n        sortBy,\n        pageIndex: !isHidePagination ? tablePageIndex : defaultValue.pageIndex,\n        pageSize: tablePageSize,\n        hiddenColumns: [],\n        selectedRowIds: props.initialCheckedRows ? selectedIdRows() : { '-1': true }\n      }\n    },\n    useBlockLayout,\n    useSortBy,\n    usePagination,\n    useRowSelect,\n    useSticky,\n    (hooks) =>\n      tableHooks({\n        hooks,\n        isSelectable: isSelectable,\n        hideRowIndex: hideRowIndex,\n        rowIndexAlign: props.rowIndexAlign,\n        variant: variant,\n        actionLabel: props.actionLabel,\n        rowActions: props.rowActions,\n        freezedColumn: freezedColumn,\n        checkedColor: props.checkedColor\n      })\n  );\n\n  const indexRowAddition = useMemo(() => {\n    if (isHidePagination) return 0;\n    return pageSize * pageIndex;\n  }, [isHidePagination, pageIndex, pageSize]);\n\n  useDidMountEffect(() => {\n    if (typeof props.onSelectedRow === 'function' && isSelectable) {\n      props.onSelectedRow(selectedFlatRows);\n    }\n  }, [props.onSelectedRow, selectedFlatRows]);\n\n  useEffect(() => {\n    if (selectedFlatRows) {\n      const temp = selectedFlatRows.map((item) => item.original.id);\n      props.onCheckedRow?.(temp);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedFlatRows]);\n\n  // FIXME: find better implementation for hidden columns\n  useEffect(() => {\n    if (props.hiddenColumns) setHiddenColumns(props.hiddenColumns || []);\n  }, [props.hiddenColumns, setHiddenColumns]);\n\n  useEffect(() => {\n    if (typeof onPageChange === 'function') {\n      onPageChange({ pageIndex, pageSize });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pageIndex, pageSize]);\n\n  useEffect(() => {\n    if (!isHidePagination) {\n      setPageCountState(Math.ceil(totalData / pageSize));\n    }\n  }, [pageSize, totalData, isHidePagination]);\n\n  useEffect(() => {\n    if (typeof onSort === 'function') {\n      onSort({ sortBy: sortByState });\n    }\n  }, [onSort, sortByState]);\n\n  useEffect(() => {\n    const filterHasArray: Array<number> = [];\n    page.forEach((row) => {\n      row.cells.forEach((item) => {\n        if (Array.isArray(item.value)) {\n          filterHasArray.push(item.value.length);\n        }\n      });\n    });\n    const countCellData = filterHasArray.length > 0 ? Math.max(...filterHasArray) : 0;\n    setCountCellSpan(countCellData);\n  }, [page]);\n\n  const isOverflowAuto =\n    (!!freezedColumn || !!freezeHeader) && totalWidthfColumn > totalWidthOfContainer;\n  const isEmpty = data.length === 0;\n\n  const listTabs = getChildrenOnDisplayName(props.children, 'ListTabs');\n  const midTabs = getChildrenOnDisplayName(props.children, 'MidTabs');\n  const itemContent = getChildrenOnDisplayName(props.children, 'ItemContent');\n\n  return (\n    <div className='flex flex-col w-full h-full'>\n      {/* Layout Header */}\n      <div\n        ref={parentRef}\n        className={twMerge(\n          'flex flex-col w-full bg-accordionTabs-container-background-default mb-3 rounded-lg p-2',\n          props.headerContainerStyles\n        )}\n      >\n        <div className='flex flex-row items-center w-full gap-x-1'>\n          <div className='flex flex-1'>{listTabs}</div>\n          {midTabs && <>{midTabs}</>}\n          {!isHidePagination && pageCount > 0 && (\n            <div>\n              <BasePagination\n                canPreviousPage={canPreviousPage}\n                canNextPage={canNextPage}\n                totalData={!isHidePagination ? totalData : data.length}\n                pageIndex={pageIndex}\n                onClickPage={{\n                  first: () => gotoPage(0),\n                  prev: previousPage,\n                  next: nextPage,\n                  last: () => gotoPage(pageCount - 1),\n                  gotoPage: (page) => gotoPage(page)\n                }}\n                totalPage={totalPage || pageCount}\n                isShowPagination={true}\n                {...props.pagination}\n              />\n            </div>\n          )}\n\n          {!isHideItemShownDropdown && !!itemShownDropdown && (\n            <div className='flex flex-row items-center gap-x-2'>\n              <BaseText\n                label={itemShownLabel || 'Item Shown'}\n                className={twMerge('font-normal text-dark-gumbo', itemShownLabelStyles)}\n              />\n              <BaseMenuDropdown {...itemShownDropdown} />\n            </div>\n          )}\n\n          {!isHideShowColumnDropdown && !!showColumnDropdown && (\n            <div>\n              <BaseSwitchPicker {...showColumnDropdown} />\n            </div>\n          )}\n        </div>\n\n        {itemContent}\n      </div>\n\n      {/* Layout Content/Body */}\n      <div\n        className={`${\n          isHideTable ? 'hidden' : 'flex'\n        } flex-1 relative w-full h-full overflow-auto z-10`}\n      >\n        <TableResponsiveContainerStyled>\n          <TableContainerStyled\n            ref={tableRef}\n            $isOverflowAuto={!isOverflowAuto}\n            $isLoading={props.isLoading}\n            $isEmpty={isEmpty}\n            tableHeight={tableHeight}\n            rowEvenColor={props.rowEvenColor}\n            rowOddColor={props.rowOddColor}\n            variant={variant}\n            className={twMerge('w-full h-full', props.tableContainerStyles)}\n          >\n            <TableStyled\n              {...getTableProps()}\n              freezeHeader={freezeHeader}\n              variant={variant}\n              data-test-id={props.dataTestId}\n              rowOddColor={props.rowOddColor}\n              rowEvenColor={props.rowEvenColor}\n            >\n              {isRefetchData && (\n                <div\n                  className={twMerge(\n                    'absolute top-0 flex flex-1 items-center justify-center w-full h-full bg-light-whiteSolid z-20',\n                    loadingContainerStyles\n                  )}\n                >\n                  <LoadingIndicator size='small' />\n                </div>\n              )}\n              <TableHeader\n                headerGroups={headerGroups}\n                variant={variant}\n                freezeHeader={freezeHeader}\n                textSortedStyles={props.textSortedStyles}\n                textUnsortedStyles={props.textUnsortedStyles}\n                iconSortedStyles={props.iconSortedStyles}\n                iconUnsortedStyles={props.iconUnsortedStyles}\n                headerStyles={props.headerStyles}\n                childHeaderStyles={props.childHeaderStyles}\n              />\n              <TableBodyStyled {...getTableBodyProps()}>\n                {\n                  // eslint-disable-next-line sonarjs/cognitive-complexity\n                  page.map((row, i) => {\n                    prepareRow(row);\n                    const onClick = () => onClickRow && onClickRow(row.original);\n                    const { key, ...rowProps } = row.getRowProps();\n\n                    return (\n                      <tr\n                        {...rowProps}\n                        key={key || i}\n                        style={{\n                          display: 'flex',\n                          width: 'auto'\n                        }}\n                      >\n                        {row.cells.map((cell, indexCell) => {\n                          const { key, checkboxIsDisabled, ...restCellProps } = cell.getCellProps(\n                            getCellProps(cell)\n                          ) as CustomCellProps;\n                          return (\n                            <td\n                              {...restCellProps}\n                              key={key || cell.row.id}\n                              className={twMerge(\n                                classNames(\n                                  !!cell.column.parent &&\n                                    'border border-t-0 border-b-0 border-solid border-dark-solitude',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !!row.cells[indexCell + 1].column.parent &&\n                                    !!row.cells[indexCell - 1].column.parent &&\n                                    'border-l-0',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !!row.cells[indexCell + 1].column.parent &&\n                                    !row.cells[indexCell - 1].column.parent &&\n                                    'border-r-0',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !row.cells[indexCell + 1].column.parent &&\n                                    !!row.cells[indexCell - 1].column.parent &&\n                                    'border-l-0',\n                                  row.cells[indexCell + 1] &&\n                                    row.cells[indexCell - 1] &&\n                                    !!row.cells[indexCell + 1].column.parent &&\n                                    !!row.cells[indexCell - 1].column.parent &&\n                                    row.cells[indexCell - 1].column.parent.id !==\n                                      cell.column.parent.id &&\n                                    'border-r-0',\n                                  !row.cells[indexCell + 1] && 'border-l-0'\n                                )\n                              )}\n                            >\n                              {cell.column.type === 'custom' ? (\n                                <CellContainerContentStyled\n                                  variant={variant}\n                                  isBaseline\n                                  onClick={cell.column.disableClick ? null : onClick}\n                                >\n                                  {cell.render('Cell', {\n                                    numberAddition: indexRowAddition,\n                                    ...(cell.column.accessor === 'selectable'\n                                      ? { checkboxIsDisabled }\n                                      : {})\n                                  })}\n                                </CellContainerContentStyled>\n                              ) : (\n                                <>\n                                  {Array.isArray(cell.value) ? (\n                                    cell.value.map((valueCell, index) => (\n                                      <CellContainerContentStyled\n                                        variant={variant}\n                                        key={index}\n                                        isBaseline\n                                        countArrayValue={countCellSpan}\n                                        isColSpan\n                                        onClick={cell.column.disableClick ? null : onClick}\n                                      >\n                                        <TextStyled\n                                          isEmpty={!valueCell}\n                                          textAlign={\n                                            cell.column.textAlign || defaultValue.textAlign\n                                          }\n                                          label={\n                                            cell.column.isCanShowEmptyCell\n                                              ? valueCell\n                                              : valueCell || '-'\n                                          }\n                                          variant='small'\n                                          ellipsis={\n                                            cell.value ? cell.value.length >= charTotal : false\n                                          }\n                                          {...cell.column.textStyle}\n                                        />\n                                      </CellContainerContentStyled>\n                                    ))\n                                  ) : (\n                                    <CellContainerContentStyled\n                                      variant={variant}\n                                      isBaseline\n                                      onClick={cell.column.disableClick ? null : onClick}\n                                    >\n                                      <TextStyled\n                                        isEmpty={!cell.value}\n                                        textAlign={cell.column.textAlign || defaultValue.textAlign}\n                                        label={\n                                          cell.column.isCanShowEmptyCell\n                                            ? cell.value\n                                            : cell.value || '-'\n                                        }\n                                        variant='small'\n                                        ellipsis={\n                                          cell.value ? cell.value.length >= charTotal : false\n                                        }\n                                        {...cell.column.textStyle}\n                                      />\n                                    </CellContainerContentStyled>\n                                  )}\n                                </>\n                              )}\n                            </td>\n                          );\n                        })}\n                      </tr>\n                    );\n                  })\n                }\n              </TableBodyStyled>\n            </TableStyled>\n          </TableContainerStyled>\n\n          {isEmpty && !props.isLoading && (\n            <TableLoadingAndEmptyContainerStyled>\n              <EmptyData\n                emptyTableHeight={emptyTableHeight}\n                noRecordLabel={props.noRecordLabel}\n                noRecordComponent={props.noRecordComponent}\n              />\n            </TableLoadingAndEmptyContainerStyled>\n          )}\n\n          {props.isLoading && (\n            <TableLoadingAndEmptyContainerStyled>\n              <LoadingIndicator\n                size='small'\n                color={props.loadingColor ? props.loadingColor : ColorBlue.yaleBlue}\n                secondaryColor={\n                  props.loadingSecondaryColor ? props.loadingSecondaryColor : ColorBlue.lapisLazuli\n                }\n              />\n            </TableLoadingAndEmptyContainerStyled>\n          )}\n        </TableResponsiveContainerStyled>\n      </div>\n    </div>\n  );\n};\n\nconst ListTabs = ({ children }: TableResponsiveListTabsInterface) => {\n  const arrListTabs = Children.toArray(children);\n  return (\n    <div className='flex flex-row w-full'>\n      {Children.map(arrListTabs, (item, index) => {\n        const tab = getChildrenOnDisplayName(item, 'ItemTabs');\n        return (\n          <div key={index} className='flex flex-row items-center'>\n            {tab}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nListTabs.displayName = 'ListTabs';\nTableResponsive.ListTabs = ListTabs;\n\nconst MidTabs = ({ children, containerStyles }: TableResponsiveMidTabsInterface) => {\n  return (\n    <>\n      {children ? (\n        <div className={twMerge('flex flex-row flex-1', containerStyles)}>{children}</div>\n      ) : null}\n    </>\n  );\n};\nMidTabs.displayName = 'MidTabs';\nTableResponsive.MidTabs = MidTabs;\n\nconst ItemTabs = ({ children, isActive, ...props }: TableResponsiveItemTabsInterface) => {\n  const [isMouseEnter, setIsMouseEnter] = useState<boolean>(false);\n  const [isMouseDown, setIsMouseDown] = useState<boolean>(false);\n\n  return (\n    <>\n      {children ? (\n        children\n      ) : (\n        <div\n          onMouseDown={() => setIsMouseDown(true)}\n          onMouseUp={() => setIsMouseDown(false)}\n          onMouseEnter={() => setIsMouseEnter(true)}\n          onMouseLeave={() => setIsMouseEnter(false)}\n        >\n          <BaseButton\n            {...props}\n            leftIconStyles={twMerge(\n              classNames(\n                'fill-accordionTabs-button-textAndIcon-default',\n                isMouseEnter && 'fill-accordionTabs-button-textAndIcon-hover',\n                (isMouseDown || isActive) && 'fill-accordionTabs-button-textAndIcon-active'\n              ),\n              props.leftIconStyles\n            )}\n            rightIcon={isActive ? 'chevronup' : props.rightIcon || 'chevrondown'}\n            rightIconStyles={twMerge(\n              classNames(\n                'fill-accordionTabs-button-textAndIcon-default',\n                isMouseEnter && 'fill-accordionTabs-button-textAndIcon-hover',\n                (isMouseDown || isActive) && 'fill-accordionTabs-button-textAndIcon-active'\n              ),\n              props.rightIconStyles\n            )}\n            className={twMerge(\n              classNames(\n                `\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            `,\n                isActive &&\n                  `\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              `\n              ),\n              props.className\n            )}\n          />\n        </div>\n      )}\n    </>\n  );\n};\nItemTabs.displayName = 'ItemTabs';\nTableResponsive.ItemTabs = ItemTabs;\n\nconst ItemContent = ({ children }: TableResponsiveItemContentInterface) => {\n  return <>{children}</>;\n};\nItemContent.displayName = 'ItemContent';\nTableResponsive.ItemContent = ItemContent;\n\nTableResponsive.prototype = {\n  pageSize: PropTypes.number,\n  emptyTableHeight: PropTypes.number,\n  onClickRow: PropTypes.func,\n  variant: PropTypes.string,\n  isSelectable: PropTypes.bool,\n  freezedColumn: PropTypes.number,\n  freezeHeader: PropTypes.bool,\n  hideRowIndex: PropTypes.bool,\n  tableHeight: PropTypes.number\n};\n\nexport default TableResponsive;\n"],"names":["defaultValue","pageIndex","pageSize","textAlign","TableResponsiveContainerStyled","styled","div","TableHeaderStyled","thead","headerGroupsLength","TableLoadingAndEmptyContainerStyled","TableHeader","props","splitByPlaceholder","id","split","useMemo","hg","headerGroups","slice","length","dataHg","i","headers","j","includes","index","parseInt","_a","getHeaderGroupProps","key","headerGroupProps","__rest","_jsx","jsx","children","_createElement","style","display","width","backgroundColor","ColorLight","whiteSmoke","minHeight","map","column","indexHeaderGroups","createElement","Object","assign","getHeaderProps","getIsExcludedSortable","getSortByToggleProps","className","twMerge","classNames","headerStyles","columns","CellContainerHeaderStyled","variant","Header","valueOf","render","_jsxs","_Fragment","Fragment","BaseText","label","toString","isSorted","textSortedStyles","textUnsortedStyles","justifyContent","alignItems","disableSortBy","SortIcon","isSortedDesc","iconSortedStyles","iconUnsortedStyles","childHeaderStyles","item","jsxs","minWidth","TableBodyStyled","tbody","fontFamilyMapper","TableStyled","table","freezeHeader","tableSizeMapper","tdMaxHeight","tdMinHeight","rowEvenColor","rowOddColor","TableContainerStyled","$isLoading","$isEmpty","css","$isOverflowAuto","TextStyled","Text","isEmpty","color","TableResponsive","getCellProps","defaultPropGetter","tablePageIndex","tablePageSize","emptyTableHeight","onClickRow","isSelectable","freezedColumn","hideRowIndex","tableHeight","onPageChange","isHidePagination","isHideTable","isHideItemShownDropdown","isHideShowColumnDropdown","totalData","totalPage","isManualSort","itemShownLabel","itemShownLabelStyles","itemShownDropdown","showColumnDropdown","onSort","isRefetchData","loadingContainerStyles","charTotal","data","freezeColumn","header","sortBy","parentRef","useRef","tableRef","totalWidthOfContainer","setTotalWidhtOfContainer","useState","totalWidthfColumn","temp","reduce","e","c","rowActions","pageCountState","setPageCountState","undefined","Math","ceil","countCellSpan","setCountCellSpan","useEffect","current","autoAnimate","resizeObserver","ResizeObserver","entries","entry","contentRect","observe","unobserve","canNextPage","canPreviousPage","getTableProps","getTableBodyProps","gotoPage","nextPage","page","pageCount","prepareRow","previousPage","selectedFlatRows","setHiddenColumns","state","sortByState","useTable","manualSortBy","manualPagination","initialState","hiddenColumns","selectedRowIds","initialCheckedRows","rows","forEach","row","findIndex","selectedIdRows","useBlockLayout","useSortBy","usePagination","reactTableExports","useRowSelect","useSticky","hooks","tableHooks","rowIndexAlign","actionLabel","checkedColor","indexRowAddition","useDidMountEffect","onSelectedRow","original","onCheckedRow","call","filterHasArray","cells","Array","isArray","value","push","countCellData","max","isOverflowAuto","listTabs","getChildrenOnDisplayName","midTabs","itemContent","ref","headerContainerStyles","BasePagination","onClickPage","first","prev","next","last","isShowPagination","pagination","BaseMenuDropdown","BaseSwitchPicker","isLoading","tableContainerStyles","dataTestId","LoadingIndicator","size","onClick","getRowProps","rowProps","cell","indexCell","checkboxIsDisabled","restCellProps","parent","type","CellContainerContentStyled","isBaseline","disableClick","numberAddition","accessor","valueCell","countArrayValue","isColSpan","isCanShowEmptyCell","ellipsis","textStyle","EmptyData","noRecordLabel","noRecordComponent","loadingColor","ColorBlue","yaleBlue","secondaryColor","loadingSecondaryColor","lapisLazuli","ListTabs","arrListTabs","Children","toArray","tab","displayName","MidTabs","containerStyles","ItemTabs","isActive","isMouseEnter","setIsMouseEnter","isMouseDown","setIsMouseDown","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","BaseButton","leftIconStyles","rightIcon","rightIconStyles","ItemContent","prototype","PropTypes.number","propTypesExports","number","PropTypes.func","func","PropTypes.string","string","PropTypes.bool","bool"],"mappings":"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"}

package/package.json

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