uangcermat-web-toolkit-v2 0.2.25 → 0.2.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/index.css +3 -0
- package/build/src/components/Preview/BasePreview.js +1 -1
- package/build/src/components/Preview/BasePreview.js.map +1 -1
- package/build/src/components/Table/TableBase.js +1 -1
- package/build/src/components/Table/TableBase.js.map +1 -1
- package/build/src/components/Table/TableResponsive.d.ts +1 -1
- package/build/src/components/Table/TableResponsive.js +11 -11
- package/build/src/components/Table/TableResponsive.js.map +1 -1
- package/build/src/components/Table/TableResponsive.type.d.ts +5 -0
- package/package.json +1 -1
package/build/index.css
CHANGED
|
@@ -351230,6 +351230,9 @@
|
|
|
351230
351230
|
.text-\[10px\] {
|
|
351231
351231
|
font-size: 10px;
|
|
351232
351232
|
}
|
|
351233
|
+
.text-\[12px\] {
|
|
351234
|
+
font-size: 12px;
|
|
351235
|
+
}
|
|
351233
351236
|
.text-\[6px\] {
|
|
351234
351237
|
font-size: 6px;
|
|
351235
351238
|
}
|
|
@@ -9,5 +9,5 @@
|
|
|
9
9
|
height: 100vh;
|
|
10
10
|
width: 100%;
|
|
11
11
|
}
|
|
12
|
-
`;m.GlobalWorkerOptions.workerSrc=new URL("pdfjs-dist/build/pdf.worker.min.js","undefined"==typeof document?new(require("url").URL)("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("src/components/Preview/BasePreview.js",document.baseURI).href).toString(),module.exports=function({files:n,isOpen:x,onClose:g,onClickDownload:w,containerFooterStyles:j,isShowPageIndicator:b=!0,ofLabel:p,indicatorLabelStyles:v,isDownloadable:y=!0,isRotateable:N=!0,isZoomable:S=!0,iconRotateLeftContainerStyles:k,iconRotateLeftStyles:M,iconRotateLeftName:C,iconRotateRightContainerStyles:q,iconRotateRightStyles:O,iconRotateRighttName:R,iconMinusContainerStyles:B,iconMinusStyles:P,iconMinusName:_,iconPlusContainerStyles:z,iconPlusStyles:L,iconPlusName:F,iconDownloadContainerStyles:I,iconDownloadStyles:D,iconDownloadName:T,containerPrevStyles:U,iconPrevStyles:$,iconPrevName:G,containerNextStyles:A,iconNextStyles:E,iconNextName:W,containerPreviewStyles:H,iconPreviewStyles:V,iconPreviewName:Z,previewLabel:J,overlayContainerStyles:K,headerContainerStyles:Q,footerContainerStyles:X,separatorStyles:Y}){const[ee,te]=i.useState(),[se,le]=i.useState(!1),ie=i.useRef(null),[re,ne]=i.useState(""),[ae,oe]=i.useState(!0),[ce,de]=i.useState(null),[ue,me]=i.useState(0),[fe,xe]=i.useState(0),[he,ge]=i.useState(1),we=i.useRef(null),je=()=>{ne("grabbing")},be=()=>{ne("grab")},pe=()=>{ne("grab"),oe(!1)},ve=()=>{ne("default"),oe(!0)},ye=()=>{var e;null===(e=we.current)||void 0===e||e.resetTransform(),te(void 0),ne(""),oe(!0),de(null),me(0),ge(1),g()};i.useEffect((()=>{if(ce){const e=ie.current;if(e){const t=1,s=e.getContext("2d");m.getDocument(n[0]).promise.then((l=>{l.getPage(he).then((l=>{const i=l.getViewport({scale:t});e.width=i.width,e.height=i.height,l.render({canvasContext:s,viewport:i})}))}))}}}),[ee,ce,he]),i.useEffect((()=>{const t=()=>e.__awaiter(this,void 0,void 0,(function*(){const t=new FileReader;t.onload=t=>e.__awaiter(this,void 0,void 0,(function*(){var e;const s=new Uint8Array(null===(e=t.target)||void 0===e?void 0:e.result);de(s)}));const s=yield fetch(n[0]).then((e=>e.blob()));t.readAsArrayBuffer(s)}));if(n&&x){const e=a.isImage(n[0])?"image":"document";if("image"===e)return te(e),n.map((e=>a.isImage(e)?"image":"document")).includes("document")&&le(!0),void me(n.length);t(),te("document"),m.getDocument(n[0]).promise.then((e=>{const t=e.numPages;me(t)}))}}),[n,x]);const Ne=e=>t.jsx(t.Fragment,{children:t.jsx(d.default,{label:`${he} ${p||"of"} ${e}`,className:f.twMerge("text-light-whiteSolid text-sm font-normal",v)})});return t.jsx(t.Fragment,{children:x&&ee?t.jsx("div",Object.assign({className:"flex flex-col fixed top-0 left-0 right-0 bottom-0 min-w-full min-h-screen z-[1000]"},{children:t.jsxs("div",Object.assign({className:"relative w-full h-full flex flex-col flex-grow"},{children:[t.jsx("div",{className:f.twMerge("fixed min-w-full min-h-screen bg-dark-blackCoral opacity-70 z-10",K)}),se?null:t.jsx(t.Fragment,{children:t.jsx(r.TransformWrapper,Object.assign({ref:we,disabled:ae,wheel:{smoothStep:.007}},{children:({zoomIn:e,zoomOut:i,resetTransform:a})=>t.jsxs(t.Fragment,{children:[t.jsx("div",Object.assign({className:"absolute top-0 left-0 flex flex-row w-full z-30"},{children:t.jsxs("div",Object.assign({className:f.twMerge("relative w-full min-h-[56px] flex flex-row py-3 px-4",Q)},{children:[t.jsx("div",{className:"absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10"}),t.jsx(o.default,{label:J||"Preview",leftIcon:Z||"arrowbackleft",leftIconStyles:f.twMerge("fill-light-whiteSolid w-4 h-4 mr-4",V),onClick:ye,className:f.twMerge("bg-transparent border-none font-semibold text-base px-2 h-8 z-30 hover:bg-transparent",H)})]}))})),t.jsx("div",Object.assign({className:"flex flex-1 items-center justify-center w-full z-20"},{children:t.jsx(h,{children:t.jsx(r.TransformComponent,{children:t.jsx("div",Object.assign({className:"flex items-center justify-center w-full h-hull",onClick:()=>{ae&&ye()}},{children:t.jsx("div",Object.assign({className:s.default("max-w-[480px] max-h-[580px] flex items-center justify-center origin-center"),onMouseDown:je,onMouseUp:be,onMouseEnter:pe,onMouseLeave:ve,style:{cursor:re,transform:`rotate(${fe}deg)`}},{children:"image"===ee?t.jsx("img",{src:n[he-1],className:"object-cover max-w-full h-auto"}):t.jsx("canvas",{ref:ie,className:"w-full h-auto"},he)}))}))})})})),(n.length>1||ue>1)&&t.jsxs(t.Fragment,{children:[t.jsx("div",Object.assign({className:f.twMerge("absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30",1!==he?"visible":"invisible")},{children:t.jsx(c.default,{variant:"secondary",iconName:G||"chevronleft",iconStyles:f.twMerge("w-2 h-2",$),className:f.twMerge("",U),onClick:()=>{a(),1!==he&&(xe(0),ge(he-1))},isDisabledRipple:!0})})),t.jsx("div",Object.assign({className:f.twMerge("absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30",he!==ue?"visible":"invisible")},{children:t.jsx(c.default,{variant:"secondary",iconName:W||"chevronright",iconStyles:f.twMerge("w-2 h-2",E),className:f.twMerge("",A),onClick:()=>{a(),he!==ue&&(xe(0),ge(he+1))},isDisabledRipple:!0})}))]}),t.jsx("div",Object.assign({className:f.twMerge("absolute bottom-4 left-[50%] translate-x-[-50%] flex flex-row items-center min-h-[40px] z-30 rounded-full overflow-hidden",X)},{children:t.jsxs("div",Object.assign({className:"relative w-full h-full flex flex-row"},{children:[t.jsx("div",{className:f.twMerge("absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10",j)}),t.jsxs("div",Object.assign({className:"flex flex-row w-full h-full items-center p-2 z-20"},{children:[b&&t.jsxs(t.Fragment,{children:["document"===ee&&ue>1&&Ne(ue),"image"===ee&&n.length>1&&Ne(n.length)]}),N?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",Y)}),t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-4"},{children:[t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",k),onClick:()=>{a(),xe((e=>e-90))}},{children:t.jsx(u,{name:C||"rotateLeft",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",M)})})),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",q),onClick:()=>{a(),xe((e=>e+90))}},{children:t.jsx(u,{name:R||"rotateRight",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",O)})}))]}))]}):null,S?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",Y)}),t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-4"},{children:[t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",B),onClick:()=>i()},{children:t.jsx(u,{name:_||"minus",className:f.twMerge("fill-light-whiteSolid w-3 h-3",P)})})),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",z),onClick:()=>e()},{children:t.jsx(u,{name:F||"plus",className:f.twMerge("fill-light-whiteSolid w-3 h-3",L)})}))]}))]}):null,y?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",Y)}),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",I),onClick:()=>{w?w("document"===ee?n[0]:n[he-1]):new l({url:"document"===ee?`${n[0]}?x-request=xhr`:`${n[he-1]}?x-request=xhr`}).catch((()=>{window.open(n[0],"_blank")}))}},{children:t.jsx(u,{name:T||"download",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",D)})}))]}):null]}))]}))}))]})}))})]}))})):null})};
|
|
12
|
+
`;m.GlobalWorkerOptions.workerSrc=new URL("pdfjs-dist/build/pdf.worker.min.js","undefined"==typeof document?new(require("url").URL)("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("src/components/Preview/BasePreview.js",document.baseURI).href).toString(),module.exports=function({files:n,isOpen:x,onClose:g,onClickDownload:w,containerFooterStyles:j,isShowPageIndicator:b=!0,ofLabel:p,indicatorLabelStyles:v,isDownloadable:y=!0,isRotateable:N=!0,isZoomable:S=!0,iconRotateLeftContainerStyles:k,iconRotateLeftStyles:M,iconRotateLeftName:C,iconRotateRightContainerStyles:q,iconRotateRightStyles:O,iconRotateRighttName:R,iconMinusContainerStyles:B,iconMinusStyles:P,iconMinusName:_,iconPlusContainerStyles:z,iconPlusStyles:L,iconPlusName:F,iconDownloadContainerStyles:I,iconDownloadStyles:D,iconDownloadName:T,containerPrevStyles:U,iconPrevStyles:$,iconPrevName:G,containerNextStyles:A,iconNextStyles:E,iconNextName:W,containerPreviewStyles:H,iconPreviewStyles:V,iconPreviewName:Z,previewLabel:J,overlayContainerStyles:K,headerContainerStyles:Q,footerContainerStyles:X,separatorStyles:Y}){const[ee,te]=i.useState(),[se,le]=i.useState(!1),ie=i.useRef(null),[re,ne]=i.useState(""),[ae,oe]=i.useState(!0),[ce,de]=i.useState(null),[ue,me]=i.useState(0),[fe,xe]=i.useState(0),[he,ge]=i.useState(1),we=i.useRef(null),je=()=>{ne("grabbing")},be=()=>{ne("grab")},pe=()=>{ne("grab"),oe(!1)},ve=()=>{ne("default"),oe(!0)},ye=()=>{var e;null===(e=we.current)||void 0===e||e.resetTransform(),te(void 0),ne(""),oe(!0),de(null),me(0),ge(1),g()};i.useEffect((()=>{if(ce){const e=ie.current;if(e){const t=1,s=e.getContext("2d");m.getDocument(n[0]).promise.then((l=>{l.getPage(he).then((l=>{const i=l.getViewport({scale:t});e.width=i.width,e.height=i.height,l.render({canvasContext:s,viewport:i})}))}))}}}),[ee,ce,he]),i.useEffect((()=>{const t=()=>e.__awaiter(this,void 0,void 0,(function*(){const t=new FileReader;t.onload=t=>e.__awaiter(this,void 0,void 0,(function*(){var e;const s=new Uint8Array(null===(e=t.target)||void 0===e?void 0:e.result);de(s)}));const s=yield fetch(n[0]).then((e=>e.blob()));t.readAsArrayBuffer(s)}));if(n&&x){const e=a.isImage(n[0])?"image":"document";if("image"===e)return te(e),n.map((e=>a.isImage(e)?"image":"document")).includes("document")&&le(!0),void me(n.length);t(),te("document"),m.getDocument(n[0]).promise.then((e=>{const t=e.numPages;me(t)}))}}),[n,x]);const Ne=e=>t.jsx(t.Fragment,{children:t.jsx(d.default,{label:`${he} ${p||"of"} ${e}`,className:f.twMerge("text-light-whiteSolid text-sm font-normal",v)})});return t.jsx(t.Fragment,{children:x&&ee?t.jsx("div",Object.assign({className:"flex flex-col fixed top-0 left-0 right-0 bottom-0 min-w-full min-h-screen z-[1000]"},{children:t.jsxs("div",Object.assign({className:"relative w-full h-full flex flex-col flex-grow"},{children:[t.jsx("div",{className:f.twMerge("fixed min-w-full min-h-screen bg-dark-blackCoral opacity-70 z-10",K)}),se?null:t.jsx(t.Fragment,{children:t.jsx(r.TransformWrapper,Object.assign({ref:we,disabled:ae,wheel:{smoothStep:.007}},{children:({zoomIn:e,zoomOut:i,resetTransform:a})=>t.jsxs(t.Fragment,{children:[t.jsx("div",Object.assign({className:"absolute top-0 left-0 flex flex-row w-full z-30"},{children:t.jsxs("div",Object.assign({className:f.twMerge("relative w-full min-h-[56px] flex flex-row py-3 px-4",Q)},{children:[t.jsx("div",{className:"absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10"}),t.jsx(o.default,{label:J||"Preview",leftIcon:Z||"arrowbackleft",leftIconStyles:f.twMerge("fill-light-whiteSolid w-4 h-4 mr-4",V),onClick:ye,className:f.twMerge("bg-transparent border-none font-semibold text-base px-2 h-8 z-30 hover:bg-transparent",H)})]}))})),t.jsx("div",Object.assign({className:"flex flex-1 items-center justify-center w-full z-20"},{children:t.jsx(h,{children:t.jsx(r.TransformComponent,{children:t.jsx("div",Object.assign({className:"flex items-center justify-center w-full h-hull",onClick:()=>{ae&&ye()}},{children:t.jsx("div",Object.assign({className:s.default("max-w-[480px] max-h-[580px] flex items-center justify-center origin-center"),onMouseDown:je,onMouseUp:be,onMouseEnter:pe,onMouseLeave:ve,style:{cursor:re,transform:`rotate(${fe}deg)`}},{children:"image"===ee?t.jsx("img",{src:n[he-1],className:"object-cover max-w-full h-auto"}):t.jsx("canvas",{ref:ie,className:"w-full h-auto"},he)}))}))})})})),(n.length>1||ue>1)&&t.jsxs(t.Fragment,{children:[t.jsx("div",Object.assign({className:f.twMerge("absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30",1!==he?"visible":"invisible")},{children:t.jsx(c.default,{variant:"secondary",iconName:G||"chevronleft",iconStyles:f.twMerge("w-2 h-2",$),className:f.twMerge("",U),onClick:()=>{a(),1!==he&&(xe(0),ge(he-1))},isDisabledRipple:!0})})),t.jsx("div",Object.assign({className:f.twMerge("absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30",he!==ue?"visible":"invisible")},{children:t.jsx(c.default,{variant:"secondary",iconName:W||"chevronright",iconStyles:f.twMerge("w-2 h-2",E),className:f.twMerge("",A),onClick:()=>{a(),he!==ue&&(xe(0),ge(he+1))},isDisabledRipple:!0})}))]}),t.jsx("div",Object.assign({className:f.twMerge("absolute bottom-4 left-[50%] translate-x-[-50%] flex flex-row items-center min-h-[40px] z-30 rounded-full overflow-hidden",X)},{children:t.jsxs("div",Object.assign({className:"relative w-full h-full flex flex-row"},{children:[t.jsx("div",{className:f.twMerge("absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10",j)}),t.jsxs("div",Object.assign({className:"flex flex-row w-full h-full items-center p-2 z-20"},{children:[b&&t.jsxs(t.Fragment,{children:["document"===ee&&ue>1&&Ne(ue),"image"===ee&&n.length>1&&Ne(n.length)]}),N?t.jsxs(t.Fragment,{children:[("document"===ee&&ue>1||"image"===ee&&n.length>1)&&t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",Y)}),t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-4"},{children:[t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",k),onClick:()=>{a(),xe((e=>e-90))}},{children:t.jsx(u,{name:C||"rotateLeft",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",M)})})),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",q),onClick:()=>{a(),xe((e=>e+90))}},{children:t.jsx(u,{name:R||"rotateRight",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",O)})}))]}))]}):null,S?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",Y)}),t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-4"},{children:[t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",B),onClick:()=>i()},{children:t.jsx(u,{name:_||"minus",className:f.twMerge("fill-light-whiteSolid w-3 h-3",P)})})),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",z),onClick:()=>e()},{children:t.jsx(u,{name:F||"plus",className:f.twMerge("fill-light-whiteSolid w-3 h-3",L)})}))]}))]}):null,y?t.jsxs(t.Fragment,{children:[t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",Y)}),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",I),onClick:()=>{w?w("document"===ee?n[0]:n[he-1]):new l({url:"document"===ee?`${n[0]}?x-request=xhr`:`${n[he-1]}?x-request=xhr`}).catch((()=>{window.open(n[0],"_blank")}))}},{children:t.jsx(u,{name:T||"download",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",D)})}))]}):null]}))]}))}))]})}))})]}))})):null})};
|
|
13
13
|
//# sourceMappingURL=BasePreview.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasePreview.js","sources":["../../../../src/components/Preview/BasePreview.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport JsFileDownloader from 'js-file-downloader';\nimport { useEffect, useRef, useState } from 'react';\nimport { pdfjs } from 'react-pdf';\nimport { TransformComponent, TransformWrapper } from 'react-zoom-pan-pinch';\nimport styled from 'styled-components';\nimport { twMerge } from 'tailwind-merge';\n\nimport { isImage } from '../../utils/isImage';\nimport { BaseButton, BaseButtonIcon } from '../Button';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport type { BasePreviewInterface } from './BasePreview.type';\n\nconst CustomWrapper = styled.div`\n align-items: center;\n display: flex;\n height: 100vh;\n justify-content: center;\n width: 100%;\n\n div:first-child {\n height: 100vh;\n width: 100%;\n }\n`;\n\npdfjs.GlobalWorkerOptions.workerSrc = new URL(\n 'pdfjs-dist/build/pdf.worker.min.js',\n import.meta.url\n).toString();\n\ntype FileType = 'image' | 'document';\n\nfunction BasePreview({\n files,\n isOpen,\n onClose,\n onClickDownload,\n containerFooterStyles,\n isShowPageIndicator = true,\n ofLabel,\n indicatorLabelStyles,\n isDownloadable = true,\n isRotateable = true,\n isZoomable = true,\n iconRotateLeftContainerStyles,\n iconRotateLeftStyles,\n iconRotateLeftName,\n iconRotateRightContainerStyles,\n iconRotateRightStyles,\n iconRotateRighttName,\n iconMinusContainerStyles,\n iconMinusStyles,\n iconMinusName,\n iconPlusContainerStyles,\n iconPlusStyles,\n iconPlusName,\n iconDownloadContainerStyles,\n iconDownloadStyles,\n iconDownloadName,\n containerPrevStyles,\n iconPrevStyles,\n iconPrevName,\n containerNextStyles,\n iconNextStyles,\n iconNextName,\n containerPreviewStyles,\n iconPreviewStyles,\n iconPreviewName,\n previewLabel,\n overlayContainerStyles,\n headerContainerStyles,\n footerContainerStyles,\n separatorStyles\n}: BasePreviewInterface) {\n const [type, setType] = useState<FileType | undefined>();\n const [isFileNotValid, setIsFielNotValid] = useState<boolean>(false);\n\n // state and red for type document\n const canvasRef = useRef(null);\n const [cursorStyle, setCursorStyle] = useState('');\n const [isDisabled, setIsDisabled] = useState<boolean>(true);\n const [pdfData, setPdfData] = useState<Uint8Array | null>(null);\n const [totalPages, setTotalPages] = useState<number>(0);\n const [rotateDeg, setRotateDeg] = useState<number>(0);\n\n const [indexNum, setIndexNum] = useState<number>(1);\n const previewRef = useRef(null);\n\n const resetState = () => {\n setType(undefined);\n setCursorStyle('');\n setIsDisabled(true);\n setPdfData(null);\n setTotalPages(0);\n setIndexNum(1);\n };\n\n const handleMouseDown = () => {\n setCursorStyle('grabbing');\n };\n\n const handleMouseUp = () => {\n setCursorStyle('grab');\n };\n\n const handleMouseEnter = () => {\n setCursorStyle('grab');\n setIsDisabled(false);\n };\n\n const handleMouseLeave = () => {\n setCursorStyle('default');\n setIsDisabled(true);\n };\n\n const onDownloadFile = () => {\n if (onClickDownload) {\n if (type === 'document') {\n onClickDownload(files[0]);\n } else {\n onClickDownload(files[indexNum - 1]);\n }\n } else {\n new JsFileDownloader({\n url:\n type === 'document' ? `${files[0]}?x-request=xhr` : `${files[indexNum - 1]}?x-request=xhr`\n }).catch(() => {\n window.open(files[0], '_blank');\n });\n }\n };\n\n const handlePrev = () => {\n if (indexNum === 1) return;\n\n setRotateDeg(0);\n setIndexNum(indexNum - 1);\n };\n\n const handleNext = () => {\n if (indexNum === totalPages) return;\n\n setRotateDeg(0);\n setIndexNum(indexNum + 1);\n };\n\n const handleClose = () => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (previewRef.current as any)?.resetTransform();\n resetState();\n onClose();\n };\n\n useEffect(() => {\n if (pdfData) {\n const canvas = canvasRef.current;\n if (canvas) {\n const scale = 1;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const context = (canvas as any).getContext('2d');\n pdfjs.getDocument(files[0]).promise.then((pdf) => {\n pdf.getPage(indexNum).then((page) => {\n const viewport = page.getViewport({ scale });\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (canvas as any).width = viewport.width;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (canvas as any).height = viewport.height;\n page.render({\n canvasContext: context,\n viewport: viewport\n });\n });\n });\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [type, pdfData, indexNum]);\n\n useEffect(() => {\n const getDocument = async () => {\n const reader = new FileReader();\n reader.onload = async (event) => {\n const pdfData = new Uint8Array(event.target?.result as ArrayBufferLike);\n setPdfData(pdfData);\n };\n const blob = await fetch(files[0]).then((r) => r.blob());\n reader.readAsArrayBuffer(blob);\n };\n\n const getImage = () => {\n const tempFiles = files.map((file) => (isImage(file) ? 'image' : 'document'));\n\n if (tempFiles.includes('document')) {\n setIsFielNotValid(true);\n }\n\n setTotalPages(files.length);\n };\n\n if (files && isOpen) {\n const tempType = isImage(files[0]) ? 'image' : 'document';\n\n if (tempType === 'image') {\n setType(tempType);\n getImage();\n return;\n }\n\n getDocument();\n setType('document');\n\n pdfjs.getDocument(files[0]).promise.then((pdf) => {\n const totalPages = pdf.numPages;\n setTotalPages(totalPages);\n });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [files, isOpen]);\n\n const renderPageIndicator = (total: number) => (\n <>\n <BaseText\n label={`${indexNum} ${ofLabel || 'of'} ${total}`}\n className={twMerge('text-light-whiteSolid text-sm font-normal', indicatorLabelStyles)}\n />\n </>\n );\n\n return (\n <>\n {isOpen && type ? (\n <div className='flex flex-col fixed top-0 left-0 right-0 bottom-0 min-w-full min-h-screen z-[1000]'>\n <div className='relative w-full h-full flex flex-col flex-grow'>\n {/* Overlay */}\n <div\n className={twMerge(\n 'fixed min-w-full min-h-screen bg-dark-blackCoral opacity-70 z-10',\n overlayContainerStyles\n )}\n />\n\n {!isFileNotValid ? (\n <>\n {/* Body */}\n <TransformWrapper\n ref={previewRef}\n disabled={isDisabled}\n wheel={{ smoothStep: 0.007 }}\n >\n {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n {({ zoomIn, zoomOut, resetTransform }) => (\n <>\n {/* Header */}\n <div className='absolute top-0 left-0 flex flex-row w-full z-30'>\n <div\n className={twMerge(\n 'relative w-full min-h-[56px] flex flex-row py-3 px-4',\n headerContainerStyles\n )}\n >\n <div className='absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10' />\n <BaseButton\n label={previewLabel || 'Preview'}\n leftIcon={iconPreviewName || 'arrowbackleft'}\n leftIconStyles={twMerge(\n 'fill-light-whiteSolid w-4 h-4 mr-4',\n iconPreviewStyles\n )}\n onClick={handleClose}\n className={twMerge(\n 'bg-transparent border-none font-semibold text-base px-2 h-8 z-30 hover:bg-transparent',\n containerPreviewStyles\n )}\n />\n </div>\n </div>\n <div className='flex flex-1 items-center justify-center w-full z-20'>\n <CustomWrapper>\n <TransformComponent>\n <div\n className='flex items-center justify-center w-full h-hull'\n onClick={() => {\n if (isDisabled) handleClose();\n }}\n >\n <div\n className={classNames(\n 'max-w-[480px] max-h-[580px] flex items-center justify-center origin-center'\n )}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n style={{\n cursor: cursorStyle,\n transform: `rotate(${rotateDeg}deg)`\n }}\n >\n {type === 'image' ? (\n <img\n src={files[indexNum - 1]}\n className='object-cover max-w-full h-auto'\n />\n ) : (\n <canvas\n key={indexNum}\n ref={canvasRef}\n className='w-full h-auto'\n />\n )}\n </div>\n </div>\n </TransformComponent>\n </CustomWrapper>\n </div>\n\n {(files.length > 1 || totalPages > 1) && (\n <>\n <div\n className={twMerge(\n 'absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30',\n indexNum !== 1 ? 'visible' : 'invisible'\n )}\n >\n <BaseButtonIcon\n variant='secondary'\n iconName={iconPrevName || 'chevronleft'}\n iconStyles={twMerge('w-2 h-2', iconPrevStyles)}\n className={twMerge('', containerPrevStyles)}\n onClick={() => {\n resetTransform();\n handlePrev();\n }}\n isDisabledRipple\n />\n </div>\n <div\n className={twMerge(\n 'absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30',\n indexNum !== totalPages ? 'visible' : 'invisible'\n )}\n >\n <BaseButtonIcon\n variant='secondary'\n iconName={iconNextName || 'chevronright'}\n iconStyles={twMerge('w-2 h-2', iconNextStyles)}\n className={twMerge('', containerNextStyles)}\n onClick={() => {\n resetTransform();\n handleNext();\n }}\n isDisabledRipple\n />\n </div>\n </>\n )}\n\n {/* Footer */}\n <div\n className={twMerge(\n 'absolute bottom-4 left-[50%] translate-x-[-50%] flex flex-row items-center min-h-[40px] z-30 rounded-full overflow-hidden',\n footerContainerStyles\n )}\n >\n <div className='relative w-full h-full flex flex-row'>\n <div\n className={twMerge(\n 'absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10',\n containerFooterStyles\n )}\n />\n <div className='flex flex-row w-full h-full items-center p-2 z-20'>\n {isShowPageIndicator && (\n <>\n {type === 'document' &&\n totalPages > 1 &&\n renderPageIndicator(totalPages)}\n {type === 'image' &&\n files.length > 1 &&\n renderPageIndicator(files.length)}\n </>\n )}\n {isRotateable ? (\n <>\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n <div className='flex flex-row items-center gap-x-4'>\n <div\n className={twMerge(\n // eslint-disable-next-line sonarjs/no-duplicate-string\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconRotateLeftContainerStyles\n )}\n onClick={() => {\n resetTransform();\n setRotateDeg((prev) => prev - 90);\n }}\n >\n <Icon\n name={iconRotateLeftName || 'rotateLeft'}\n className={twMerge(\n 'fill-light-whiteSolid w-[15px] h-[15px]',\n iconRotateLeftStyles\n )}\n />\n </div>\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconRotateRightContainerStyles\n )}\n onClick={() => {\n resetTransform();\n setRotateDeg((prev) => prev + 90);\n }}\n >\n <Icon\n name={iconRotateRighttName || 'rotateRight'}\n className={twMerge(\n 'fill-light-whiteSolid w-[15px] h-[15px]',\n iconRotateRightStyles\n )}\n />\n </div>\n </div>\n </>\n ) : null}\n {isZoomable ? (\n <>\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n <div className='flex flex-row items-center gap-x-4'>\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconMinusContainerStyles\n )}\n onClick={() => zoomOut()}\n >\n <Icon\n name={iconMinusName || 'minus'}\n className={twMerge(\n 'fill-light-whiteSolid w-3 h-3',\n iconMinusStyles\n )}\n />\n </div>\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconPlusContainerStyles\n )}\n onClick={() => zoomIn()}\n >\n <Icon\n name={iconPlusName || 'plus'}\n className={twMerge(\n 'fill-light-whiteSolid w-3 h-3',\n iconPlusStyles\n )}\n />\n </div>\n </div>\n </>\n ) : null}\n {isDownloadable ? (\n <>\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconDownloadContainerStyles\n )}\n onClick={() => onDownloadFile()}\n >\n <Icon\n name={iconDownloadName || 'download'}\n className={twMerge(\n 'fill-light-whiteSolid w-[15px] h-[15px]',\n iconDownloadStyles\n )}\n />\n </div>\n </>\n ) : null}\n </div>\n </div>\n </div>\n </>\n )}\n </TransformWrapper>\n </>\n ) : null}\n </div>\n </div>\n ) : null}\n </>\n );\n}\n\nexport default BasePreview;\n"],"names":["CustomWrapper","styled","div","pdfjs","GlobalWorkerOptions","workerSrc","URL","document","require","__filename","href","currentScript","src","baseURI","toString","files","isOpen","onClose","onClickDownload","containerFooterStyles","isShowPageIndicator","ofLabel","indicatorLabelStyles","isDownloadable","isRotateable","isZoomable","iconRotateLeftContainerStyles","iconRotateLeftStyles","iconRotateLeftName","iconRotateRightContainerStyles","iconRotateRightStyles","iconRotateRighttName","iconMinusContainerStyles","iconMinusStyles","iconMinusName","iconPlusContainerStyles","iconPlusStyles","iconPlusName","iconDownloadContainerStyles","iconDownloadStyles","iconDownloadName","containerPrevStyles","iconPrevStyles","iconPrevName","containerNextStyles","iconNextStyles","iconNextName","containerPreviewStyles","iconPreviewStyles","iconPreviewName","previewLabel","overlayContainerStyles","headerContainerStyles","footerContainerStyles","separatorStyles","type","setType","useState","isFileNotValid","setIsFielNotValid","canvasRef","useRef","cursorStyle","setCursorStyle","isDisabled","setIsDisabled","pdfData","setPdfData","totalPages","setTotalPages","rotateDeg","setRotateDeg","indexNum","setIndexNum","previewRef","handleMouseDown","handleMouseUp","handleMouseEnter","handleMouseLeave","handleClose","_a","current","resetTransform","undefined","useEffect","canvas","scale","context","getContext","getDocument","promise","then","pdf","getPage","page","viewport","getViewport","width","height","render","canvasContext","__awaiter","this","reader","FileReader","onload","event","Uint8Array","target","result","blob","fetch","r","readAsArrayBuffer","tempType","isImage","map","file","includes","length","numPages","renderPageIndicator","total","_jsx","_Fragment","children","BaseText","label","className","twMerge","_jsxs","jsx","TransformWrapper","Object","assign","ref","disabled","wheel","smoothStep","zoomIn","zoomOut","Fragment","jsxs","BaseButton","leftIcon","leftIconStyles","onClick","TransformComponent","classNames","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","style","cursor","transform","BaseButtonIcon","variant","iconName","iconStyles","isDisabledRipple","prev","Icon","name","JsFileDownloader","url","catch","window","open"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BasePreview.js","sources":["../../../../src/components/Preview/BasePreview.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport JsFileDownloader from 'js-file-downloader';\nimport { useEffect, useRef, useState } from 'react';\nimport { pdfjs } from 'react-pdf';\nimport { TransformComponent, TransformWrapper } from 'react-zoom-pan-pinch';\nimport styled from 'styled-components';\nimport { twMerge } from 'tailwind-merge';\n\nimport { isImage } from '../../utils/isImage';\nimport { BaseButton, BaseButtonIcon } from '../Button';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport type { BasePreviewInterface } from './BasePreview.type';\n\nconst CustomWrapper = styled.div`\n align-items: center;\n display: flex;\n height: 100vh;\n justify-content: center;\n width: 100%;\n\n div:first-child {\n height: 100vh;\n width: 100%;\n }\n`;\n\npdfjs.GlobalWorkerOptions.workerSrc = new URL(\n 'pdfjs-dist/build/pdf.worker.min.js',\n import.meta.url\n).toString();\n\ntype FileType = 'image' | 'document';\n\nfunction BasePreview({\n files,\n isOpen,\n onClose,\n onClickDownload,\n containerFooterStyles,\n isShowPageIndicator = true,\n ofLabel,\n indicatorLabelStyles,\n isDownloadable = true,\n isRotateable = true,\n isZoomable = true,\n iconRotateLeftContainerStyles,\n iconRotateLeftStyles,\n iconRotateLeftName,\n iconRotateRightContainerStyles,\n iconRotateRightStyles,\n iconRotateRighttName,\n iconMinusContainerStyles,\n iconMinusStyles,\n iconMinusName,\n iconPlusContainerStyles,\n iconPlusStyles,\n iconPlusName,\n iconDownloadContainerStyles,\n iconDownloadStyles,\n iconDownloadName,\n containerPrevStyles,\n iconPrevStyles,\n iconPrevName,\n containerNextStyles,\n iconNextStyles,\n iconNextName,\n containerPreviewStyles,\n iconPreviewStyles,\n iconPreviewName,\n previewLabel,\n overlayContainerStyles,\n headerContainerStyles,\n footerContainerStyles,\n separatorStyles\n}: BasePreviewInterface) {\n const [type, setType] = useState<FileType | undefined>();\n const [isFileNotValid, setIsFielNotValid] = useState<boolean>(false);\n\n // state and red for type document\n const canvasRef = useRef(null);\n const [cursorStyle, setCursorStyle] = useState('');\n const [isDisabled, setIsDisabled] = useState<boolean>(true);\n const [pdfData, setPdfData] = useState<Uint8Array | null>(null);\n const [totalPages, setTotalPages] = useState<number>(0);\n const [rotateDeg, setRotateDeg] = useState<number>(0);\n\n const [indexNum, setIndexNum] = useState<number>(1);\n const previewRef = useRef(null);\n\n const resetState = () => {\n setType(undefined);\n setCursorStyle('');\n setIsDisabled(true);\n setPdfData(null);\n setTotalPages(0);\n setIndexNum(1);\n };\n\n const handleMouseDown = () => {\n setCursorStyle('grabbing');\n };\n\n const handleMouseUp = () => {\n setCursorStyle('grab');\n };\n\n const handleMouseEnter = () => {\n setCursorStyle('grab');\n setIsDisabled(false);\n };\n\n const handleMouseLeave = () => {\n setCursorStyle('default');\n setIsDisabled(true);\n };\n\n const onDownloadFile = () => {\n if (onClickDownload) {\n if (type === 'document') {\n onClickDownload(files[0]);\n } else {\n onClickDownload(files[indexNum - 1]);\n }\n } else {\n new JsFileDownloader({\n url:\n type === 'document' ? `${files[0]}?x-request=xhr` : `${files[indexNum - 1]}?x-request=xhr`\n }).catch(() => {\n window.open(files[0], '_blank');\n });\n }\n };\n\n const handlePrev = () => {\n if (indexNum === 1) return;\n\n setRotateDeg(0);\n setIndexNum(indexNum - 1);\n };\n\n const handleNext = () => {\n if (indexNum === totalPages) return;\n\n setRotateDeg(0);\n setIndexNum(indexNum + 1);\n };\n\n const handleClose = () => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (previewRef.current as any)?.resetTransform();\n resetState();\n onClose();\n };\n\n useEffect(() => {\n if (pdfData) {\n const canvas = canvasRef.current;\n if (canvas) {\n const scale = 1;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const context = (canvas as any).getContext('2d');\n pdfjs.getDocument(files[0]).promise.then((pdf) => {\n pdf.getPage(indexNum).then((page) => {\n const viewport = page.getViewport({ scale });\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (canvas as any).width = viewport.width;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (canvas as any).height = viewport.height;\n page.render({\n canvasContext: context,\n viewport: viewport\n });\n });\n });\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [type, pdfData, indexNum]);\n\n useEffect(() => {\n const getDocument = async () => {\n const reader = new FileReader();\n reader.onload = async (event) => {\n const pdfData = new Uint8Array(event.target?.result as ArrayBufferLike);\n setPdfData(pdfData);\n };\n const blob = await fetch(files[0]).then((r) => r.blob());\n reader.readAsArrayBuffer(blob);\n };\n\n const getImage = () => {\n const tempFiles = files.map((file) => (isImage(file) ? 'image' : 'document'));\n\n if (tempFiles.includes('document')) {\n setIsFielNotValid(true);\n }\n\n setTotalPages(files.length);\n };\n\n if (files && isOpen) {\n const tempType = isImage(files[0]) ? 'image' : 'document';\n\n if (tempType === 'image') {\n setType(tempType);\n getImage();\n return;\n }\n\n getDocument();\n setType('document');\n\n pdfjs.getDocument(files[0]).promise.then((pdf) => {\n const totalPages = pdf.numPages;\n setTotalPages(totalPages);\n });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [files, isOpen]);\n\n const renderPageIndicator = (total: number) => (\n <>\n <BaseText\n label={`${indexNum} ${ofLabel || 'of'} ${total}`}\n className={twMerge('text-light-whiteSolid text-sm font-normal', indicatorLabelStyles)}\n />\n </>\n );\n\n return (\n <>\n {isOpen && type ? (\n <div className='flex flex-col fixed top-0 left-0 right-0 bottom-0 min-w-full min-h-screen z-[1000]'>\n <div className='relative w-full h-full flex flex-col flex-grow'>\n {/* Overlay */}\n <div\n className={twMerge(\n 'fixed min-w-full min-h-screen bg-dark-blackCoral opacity-70 z-10',\n overlayContainerStyles\n )}\n />\n\n {!isFileNotValid ? (\n <>\n {/* Body */}\n <TransformWrapper\n ref={previewRef}\n disabled={isDisabled}\n wheel={{ smoothStep: 0.007 }}\n >\n {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n {({ zoomIn, zoomOut, resetTransform }) => (\n <>\n {/* Header */}\n <div className='absolute top-0 left-0 flex flex-row w-full z-30'>\n <div\n className={twMerge(\n 'relative w-full min-h-[56px] flex flex-row py-3 px-4',\n headerContainerStyles\n )}\n >\n <div className='absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10' />\n <BaseButton\n label={previewLabel || 'Preview'}\n leftIcon={iconPreviewName || 'arrowbackleft'}\n leftIconStyles={twMerge(\n 'fill-light-whiteSolid w-4 h-4 mr-4',\n iconPreviewStyles\n )}\n onClick={handleClose}\n className={twMerge(\n 'bg-transparent border-none font-semibold text-base px-2 h-8 z-30 hover:bg-transparent',\n containerPreviewStyles\n )}\n />\n </div>\n </div>\n <div className='flex flex-1 items-center justify-center w-full z-20'>\n <CustomWrapper>\n <TransformComponent>\n <div\n className='flex items-center justify-center w-full h-hull'\n onClick={() => {\n if (isDisabled) handleClose();\n }}\n >\n <div\n className={classNames(\n 'max-w-[480px] max-h-[580px] flex items-center justify-center origin-center'\n )}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n style={{\n cursor: cursorStyle,\n transform: `rotate(${rotateDeg}deg)`\n }}\n >\n {type === 'image' ? (\n <img\n src={files[indexNum - 1]}\n className='object-cover max-w-full h-auto'\n />\n ) : (\n <canvas\n key={indexNum}\n ref={canvasRef}\n className='w-full h-auto'\n />\n )}\n </div>\n </div>\n </TransformComponent>\n </CustomWrapper>\n </div>\n\n {(files.length > 1 || totalPages > 1) && (\n <>\n <div\n className={twMerge(\n 'absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30',\n indexNum !== 1 ? 'visible' : 'invisible'\n )}\n >\n <BaseButtonIcon\n variant='secondary'\n iconName={iconPrevName || 'chevronleft'}\n iconStyles={twMerge('w-2 h-2', iconPrevStyles)}\n className={twMerge('', containerPrevStyles)}\n onClick={() => {\n resetTransform();\n handlePrev();\n }}\n isDisabledRipple\n />\n </div>\n <div\n className={twMerge(\n 'absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30',\n indexNum !== totalPages ? 'visible' : 'invisible'\n )}\n >\n <BaseButtonIcon\n variant='secondary'\n iconName={iconNextName || 'chevronright'}\n iconStyles={twMerge('w-2 h-2', iconNextStyles)}\n className={twMerge('', containerNextStyles)}\n onClick={() => {\n resetTransform();\n handleNext();\n }}\n isDisabledRipple\n />\n </div>\n </>\n )}\n\n {/* Footer */}\n <div\n className={twMerge(\n 'absolute bottom-4 left-[50%] translate-x-[-50%] flex flex-row items-center min-h-[40px] z-30 rounded-full overflow-hidden',\n footerContainerStyles\n )}\n >\n <div className='relative w-full h-full flex flex-row'>\n <div\n className={twMerge(\n 'absolute top-0 left-0 w-full h-full bg-dark-blackCoral opacity-80 z-10',\n containerFooterStyles\n )}\n />\n <div className='flex flex-row w-full h-full items-center p-2 z-20'>\n {isShowPageIndicator && (\n <>\n {type === 'document' &&\n totalPages > 1 &&\n renderPageIndicator(totalPages)}\n {type === 'image' &&\n files.length > 1 &&\n renderPageIndicator(files.length)}\n </>\n )}\n {isRotateable ? (\n <>\n {((type === 'document' && totalPages > 1) ||\n (type === 'image' && files.length > 1)) && (\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n )}\n <div className='flex flex-row items-center gap-x-4'>\n <div\n className={twMerge(\n // eslint-disable-next-line sonarjs/no-duplicate-string\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconRotateLeftContainerStyles\n )}\n onClick={() => {\n resetTransform();\n setRotateDeg((prev) => prev - 90);\n }}\n >\n <Icon\n name={iconRotateLeftName || 'rotateLeft'}\n className={twMerge(\n 'fill-light-whiteSolid w-[15px] h-[15px]',\n iconRotateLeftStyles\n )}\n />\n </div>\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconRotateRightContainerStyles\n )}\n onClick={() => {\n resetTransform();\n setRotateDeg((prev) => prev + 90);\n }}\n >\n <Icon\n name={iconRotateRighttName || 'rotateRight'}\n className={twMerge(\n 'fill-light-whiteSolid w-[15px] h-[15px]',\n iconRotateRightStyles\n )}\n />\n </div>\n </div>\n </>\n ) : null}\n {isZoomable ? (\n <>\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n <div className='flex flex-row items-center gap-x-4'>\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconMinusContainerStyles\n )}\n onClick={() => zoomOut()}\n >\n <Icon\n name={iconMinusName || 'minus'}\n className={twMerge(\n 'fill-light-whiteSolid w-3 h-3',\n iconMinusStyles\n )}\n />\n </div>\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconPlusContainerStyles\n )}\n onClick={() => zoomIn()}\n >\n <Icon\n name={iconPlusName || 'plus'}\n className={twMerge(\n 'fill-light-whiteSolid w-3 h-3',\n iconPlusStyles\n )}\n />\n </div>\n </div>\n </>\n ) : null}\n {isDownloadable ? (\n <>\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer',\n iconDownloadContainerStyles\n )}\n onClick={() => onDownloadFile()}\n >\n <Icon\n name={iconDownloadName || 'download'}\n className={twMerge(\n 'fill-light-whiteSolid w-[15px] h-[15px]',\n iconDownloadStyles\n )}\n />\n </div>\n </>\n ) : null}\n </div>\n </div>\n </div>\n </>\n )}\n </TransformWrapper>\n </>\n ) : null}\n </div>\n </div>\n ) : null}\n </>\n );\n}\n\nexport default BasePreview;\n"],"names":["CustomWrapper","styled","div","pdfjs","GlobalWorkerOptions","workerSrc","URL","document","require","__filename","href","currentScript","src","baseURI","toString","files","isOpen","onClose","onClickDownload","containerFooterStyles","isShowPageIndicator","ofLabel","indicatorLabelStyles","isDownloadable","isRotateable","isZoomable","iconRotateLeftContainerStyles","iconRotateLeftStyles","iconRotateLeftName","iconRotateRightContainerStyles","iconRotateRightStyles","iconRotateRighttName","iconMinusContainerStyles","iconMinusStyles","iconMinusName","iconPlusContainerStyles","iconPlusStyles","iconPlusName","iconDownloadContainerStyles","iconDownloadStyles","iconDownloadName","containerPrevStyles","iconPrevStyles","iconPrevName","containerNextStyles","iconNextStyles","iconNextName","containerPreviewStyles","iconPreviewStyles","iconPreviewName","previewLabel","overlayContainerStyles","headerContainerStyles","footerContainerStyles","separatorStyles","type","setType","useState","isFileNotValid","setIsFielNotValid","canvasRef","useRef","cursorStyle","setCursorStyle","isDisabled","setIsDisabled","pdfData","setPdfData","totalPages","setTotalPages","rotateDeg","setRotateDeg","indexNum","setIndexNum","previewRef","handleMouseDown","handleMouseUp","handleMouseEnter","handleMouseLeave","handleClose","_a","current","resetTransform","undefined","useEffect","canvas","scale","context","getContext","getDocument","promise","then","pdf","getPage","page","viewport","getViewport","width","height","render","canvasContext","__awaiter","this","reader","FileReader","onload","event","Uint8Array","target","result","blob","fetch","r","readAsArrayBuffer","tempType","isImage","map","file","includes","length","numPages","renderPageIndicator","total","_jsx","_Fragment","children","BaseText","label","className","twMerge","_jsxs","jsx","TransformWrapper","Object","assign","ref","disabled","wheel","smoothStep","zoomIn","zoomOut","Fragment","jsxs","BaseButton","leftIcon","leftIconStyles","onClick","TransformComponent","classNames","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","style","cursor","transform","BaseButtonIcon","variant","iconName","iconStyles","isDisabledRipple","prev","Icon","name","JsFileDownloader","url","catch","window","open"],"mappings":"miCAcA,MAAMA,OAAgBC,QAAOC,GAAG;;;;;;;;;;;EAahCC,EAAMC,oBAAoBC,UAAY,IAAIC,IACxC,qCACe,oBAAAC,SAAA,IAAAC,QAAA,OAAA,KAAA,QAAAC,YAAAC,KAAAH,SAAAI,eAAAJ,SAAAI,cAAAC,KAAA,IAAAN,IAAA,wCAAAC,SAAAM,SAAAH,MACfI,0BAIF,UAAqBC,MACnBA,EAAKC,OACLA,EAAMC,QACNA,EAAOC,gBACPA,EAAeC,sBACfA,EAAqBC,oBACrBA,GAAsB,EAAIC,QAC1BA,EAAOC,qBACPA,EAAoBC,eACpBA,GAAiB,EAAIC,aACrBA,GAAe,EAAIC,WACnBA,GAAa,EAAIC,8BACjBA,EAA6BC,qBAC7BA,EAAoBC,mBACpBA,EAAkBC,+BAClBA,EAA8BC,sBAC9BA,EAAqBC,qBACrBA,EAAoBC,yBACpBA,EAAwBC,gBACxBA,EAAeC,cACfA,EAAaC,wBACbA,EAAuBC,eACvBA,EAAcC,aACdA,EAAYC,4BACZA,EAA2BC,mBAC3BA,EAAkBC,iBAClBA,EAAgBC,oBAChBA,EAAmBC,eACnBA,EAAcC,aACdA,EAAYC,oBACZA,EAAmBC,eACnBA,EAAcC,aACdA,EAAYC,uBACZA,EAAsBC,kBACtBA,EAAiBC,gBACjBA,EAAeC,aACfA,EAAYC,uBACZA,EAAsBC,sBACtBA,EAAqBC,sBACrBA,EAAqBC,gBACrBA,IAEA,MAAOC,GAAMC,IAAWC,EAAQA,YACzBC,GAAgBC,IAAqBF,EAAQA,UAAU,GAGxDG,GAAYC,SAAO,OAClBC,GAAaC,IAAkBN,EAAQA,SAAC,KACxCO,GAAYC,IAAiBR,EAAQA,UAAU,IAC/CS,GAASC,IAAcV,EAAQA,SAAoB,OACnDW,GAAYC,IAAiBZ,EAAQA,SAAS,IAC9Ca,GAAWC,IAAgBd,EAAQA,SAAS,IAE5Ce,GAAUC,IAAehB,EAAQA,SAAS,GAC3CiB,GAAab,SAAO,MAWpBc,GAAkB,KACtBZ,GAAe,WAAW,EAGtBa,GAAgB,KACpBb,GAAe,OAAO,EAGlBc,GAAmB,KACvBd,GAAe,QACfE,IAAc,EAAM,EAGhBa,GAAmB,KACvBf,GAAe,WACfE,IAAc,EAAK,EAkCfc,GAAc,WAEW,QAA7BC,EAACN,GAAWO,eAAiB,IAAAD,GAAAA,EAAAE,iBA3D7B1B,QAAQ2B,GACRpB,GAAe,IACfE,IAAc,GACdE,GAAW,MACXE,GAAc,GACdI,GAAY,GAwDZxD,GAAS,EAGXmE,EAAAA,WAAU,KACR,GAAIlB,GAAS,CACX,MAAMmB,EAASzB,GAAUqB,QACzB,GAAII,EAAQ,CACV,MAAMC,EAAQ,EAERC,EAAWF,EAAeG,WAAW,MAC3CrF,EAAMsF,YAAY1E,EAAM,IAAI2E,QAAQC,MAAMC,IACxCA,EAAIC,QAAQrB,IAAUmB,MAAMG,IAC1B,MAAMC,EAAWD,EAAKE,YAAY,CAAEV,UAEnCD,EAAeY,MAAQF,EAASE,MAEhCZ,EAAea,OAASH,EAASG,OAClCJ,EAAKK,OAAO,CACVC,cAAeb,EACfQ,SAAUA,GACV,GACF,GAEL,CACF,IAEA,CAACxC,GAAMW,GAASM,KAEnBY,EAAAA,WAAU,KACR,MAAMK,EAAc,IAAWY,YAAAC,UAAA,OAAA,GAAA,YAC7B,MAAMC,EAAS,IAAIC,WACnBD,EAAOE,OAAgBC,GAASL,EAAAA,UAAAC,UAAA,OAAA,GAAA,kBAC9B,MAAMpC,EAAU,IAAIyC,WAAuB,QAAZ3B,EAAA0B,EAAME,cAAM,IAAA5B,OAAA,EAAAA,EAAE6B,QAC7C1C,GAAWD,EACb,IACA,MAAM4C,QAAaC,MAAMhG,EAAM,IAAI4E,MAAMqB,GAAMA,EAAEF,SACjDP,EAAOU,kBAAkBH,EAC3B,IAYA,GAAI/F,GAASC,EAAQ,CACnB,MAAMkG,EAAWC,EAAAA,QAAQpG,EAAM,IAAM,QAAU,WAE/C,GAAiB,UAAbmG,EAGF,OAFA1D,GAAQ0D,GAbQnG,EAAMqG,KAAKC,GAAUF,UAAQE,GAAQ,QAAU,aAEnDC,SAAS,aACrB3D,IAAkB,QAGpBU,GAActD,EAAMwG,QAYpB9B,IACAjC,GAAQ,YAERrD,EAAMsF,YAAY1E,EAAM,IAAI2E,QAAQC,MAAMC,IACxC,MAAMxB,EAAawB,EAAI4B,SACvBnD,GAAcD,EAAW,GAE5B,IAEA,CAACrD,EAAOC,IAEX,MAAMyG,GAAuBC,GAC3BC,EAAAA,IAAAC,EAAAA,SAAA,CAAAC,SACEF,EAAAA,IAACG,EAAQ,QAAA,CACPC,MAAO,GAAGvD,MAAYnD,GAAW,QAAQqG,IACzCM,UAAWC,EAAOA,QAAC,4CAA6C3G,OAKtE,OACEqG,EAAAA,IAAAC,EAAAA,SAAA,CAAAC,SACG7G,GAAUuC,GACToE,2BAAKK,UAAU,sFAAoF,CAAAH,SACjGK,4BAAKF,UAAU,kDAAgD,CAAAH,SAAA,CAE7DF,EAAAA,IACE,MAAA,CAAAK,UAAWC,EAAOA,QAChB,mEACA9E,KAIFO,GA2QE,KA1QFiE,EAAAA,IAEEC,EAAAA,SAAA,CAAAC,SAAAF,EAAAQ,IAACC,EAAgBA,iBAAAC,OAAAC,OAAA,CACfC,IAAK7D,GACL8D,SAAUxE,GACVyE,MAAO,CAAEC,WAAY,OAGpB,CAAAb,SAAA,EAAGc,SAAQC,UAAS1D,oBACnBgD,EAAAA,KAAAN,EAAAiB,SAAA,CAAAhB,SAAA,CAEEF,EAAKQ,IAAA,MAAAE,OAAAC,OAAA,CAAAN,UAAU,oDAAkD,CAAAH,SAC/DK,EACEY,KAAA,MAAAT,OAAAC,OAAA,CAAAN,UAAWC,EAAAA,QACT,uDACA7E,IAGF,CAAAyE,SAAA,CAAAF,EAAAA,IAAA,MAAA,CAAKK,UAAU,2EACfL,EAAAA,IAACoB,EAAAA,QAAU,CACThB,MAAO7E,GAAgB,UACvB8F,SAAU/F,GAAmB,gBAC7BgG,eAAgBhB,EAAAA,QACd,qCACAjF,GAEFkG,QAASnE,GACTiD,UAAWC,EAAAA,QACT,wFACAlF,YAKR4E,EAAAA,IAAA,MAAAU,OAAAC,OAAA,CAAKN,UAAU,uDACb,CAAAH,SAAAF,EAAAA,IAAC3H,EAAa,CAAA6H,SACZF,MAACwB,EAAkBA,mBAAA,CAAAtB,SACjBF,EACEQ,IAAA,MAAAE,OAAAC,OAAA,CAAAN,UAAU,iDACVkB,QAAS,KACHlF,IAAYe,IAAa,GAC9B,CAAA8C,SAEDF,MACE,MAAAU,OAAAC,OAAA,CAAAN,UAAWoB,UACT,8EAEFC,YAAa1E,GACb2E,UAAW1E,GACX2E,aAAc1E,GACd2E,aAAc1E,GACd2E,MAAO,CACLC,OAAQ5F,GACR6F,UAAW,UAAUrF,WAGtB,CAAAuD,SAAS,UAATtE,GACCoE,EAAAQ,IAAA,MAAA,CACEvH,IAAKG,EAAMyD,GAAW,GACtBwD,UAAU,mCAGZL,EAAAQ,IAAA,SAAA,CAEEI,IAAK3E,GACLoE,UAAU,iBAFLxD,kBAWjBzD,EAAMwG,OAAS,GAAKnD,GAAa,IACjC8D,EACEY,KAAAlB,EAAAiB,SAAA,CAAAhB,SAAA,CAAAF,EAAAA,IAAA,MAAAU,OAAAC,OAAA,CACEN,UAAWC,EAAAA,QACT,4FACa,IAAbzD,GAAiB,UAAY,cAG/B,CAAAqD,SAAAF,EAAAQ,IAACyB,EAAc,QAAA,CACbC,QAAQ,YACRC,SAAUnH,GAAgB,cAC1BoH,WAAY9B,EAAAA,QAAQ,UAAWvF,GAC/BsF,UAAWC,EAAAA,QAAQ,GAAIxF,GACvByG,QAAS,KACPhE,IArMX,IAAbV,KAEJD,GAAa,GACbE,GAAYD,GAAW,GAmMiB,EAEdwF,kBAAgB,OAGpBrC,EACEQ,IAAA,MAAAE,OAAAC,OAAA,CAAAN,UAAWC,EAAOA,QAChB,6FACAzD,KAAaJ,GAAa,UAAY,cACvC,CAAAyD,SAEDF,EAACQ,IAAAyB,EAAc,QACb,CAAAC,QAAQ,YACRC,SAAUhH,GAAgB,eAC1BiH,WAAY9B,EAAOA,QAAC,UAAWpF,GAC/BmF,UAAWC,EAAAA,QAAQ,GAAIrF,GACvBsG,QAAS,KACPhE,IAhNxBV,KAAaJ,KAEjBG,GAAa,GACbE,GAAYD,GAAW,GA8MiB,EAEdwF,kBACA,UAMRrC,2BACEK,UAAWC,EAAOA,QAChB,4HACA5E,cAGF6E,EAAAA,KAAK,MAAAG,OAAAC,OAAA,CAAAN,UAAU,wCAAsC,CAAAH,SAAA,CACnDF,aACEK,UAAWC,EAAOA,QAChB,yEACA9G,KAGJ+G,EAAAY,KAAA,MAAAT,OAAAC,OAAA,CAAKN,UAAU,gEACZ5G,GACC8G,EACGY,KAAAlB,WAAA,CAAAC,SAAA,CAAS,aAATtE,IACCa,GAAa,GACbqD,GAAoBrD,IACZ,UAATb,IACCxC,EAAMwG,OAAS,GACfE,GAAoB1G,EAAMwG,WAG/B/F,EACC0G,EAAAA,KAAAN,EAAAA,SAAA,CAAAC,SAAA,EACc,aAATtE,IAAuBa,GAAa,GAC3B,UAATb,IAAoBxC,EAAMwG,OAAS,IACpCI,aACEK,UAAWC,EAAOA,QAChB,uCACA3E,KAIN4E,OAAK,MAAAG,OAAAC,OAAA,CAAAN,UAAU,sCAAoC,CAAAH,SAAA,CACjDF,EAAAA,IACE,MAAAU,OAAAC,OAAA,CAAAN,UAAWC,EAAOA,QAEhB,0FACAvG,GAEFwH,QAAS,KACPhE,IACAX,IAAc0F,GAASA,EAAO,IAAG,GAGnC,CAAApC,SAAAF,EAAAQ,IAAC+B,EAAI,CACHC,KAAMvI,GAAsB,aAC5BoG,UAAWC,UACT,0CACAtG,QAINgG,EAAAA,IACE,MAAAU,OAAAC,OAAA,CAAAN,UAAWC,EAAOA,QAChB,0FACApG,GAEFqH,QAAS,KACPhE,IACAX,IAAc0F,GAASA,EAAO,IAAG,GAClC,CAAApC,SAEDF,MAACuC,EAAI,CACHC,KAAMpI,GAAwB,cAC9BiG,UAAWC,EAAAA,QACT,0CACAnG,eAMR,KACHL,EACCyG,EAAAA,KAAAN,EAAAA,SAAA,CAAAC,SAAA,CACEF,MACE,MAAA,CAAAK,UAAWC,EAAAA,QACT,uCACA3E,KAGJ4E,4BAAKF,UAAU,sCAAoC,CAAAH,SAAA,CACjDF,EAAAA,IACE,MAAAU,OAAAC,OAAA,CAAAN,UAAWC,UACT,0FACAjG,GAEFkH,QAAS,IAAMN,KAAS,CAAAf,SAExBF,EAAAA,IAACuC,EACC,CAAAC,KAAMjI,GAAiB,QACvB8F,UAAWC,UACT,gCACAhG,QAIN0F,EAAAA,IAAA,MAAAU,OAAAC,OAAA,CACEN,UAAWC,EAAOA,QAChB,0FACA9F,GAEF+G,QAAS,IAAMP,KAEf,CAAAd,SAAAF,EAAAQ,IAAC+B,EACC,CAAAC,KAAM9H,GAAgB,OACtB2F,UAAWC,EAAAA,QACT,gCACA7F,eAMR,KACHb,EACC2G,EAAAA,KACEN,EAAAA,SAAA,CAAAC,SAAA,CAAAF,MAAA,MAAA,CACEK,UAAWC,EAAAA,QACT,uCACA3E,KAGJqE,EACEQ,IAAA,MAAAE,OAAAC,OAAA,CAAAN,UAAWC,EAAAA,QACT,0FACA3F,GAEF4G,QAAS,KArXnChI,EAEAA,EADW,aAATqC,GACcxC,EAAM,GAENA,EAAMyD,GAAW,IAGnC,IAAI4F,EAAiB,CACnBC,IACW,aAAT9G,GAAsB,GAAGxC,EAAM,mBAAqB,GAAGA,EAAMyD,GAAW,qBACzE8F,OAAM,KACPC,OAAOC,KAAKzJ,EAAM,GAAI,SAAS,GA0W0B,aAE/B4G,EAAAA,IAACuC,EACC,CAAAC,KAAM3H,GAAoB,WAC1BwF,UAAWC,EAAAA,QACT,0CACA1F,WAKN,+BAWtB,MAGV"}
|
|
@@ -16,5 +16,5 @@
|
|
|
16
16
|
`,y=g.default.div`
|
|
17
17
|
display: flex;
|
|
18
18
|
justify-content: center;
|
|
19
|
-
`;exports.CellContainerBaseStyled=h,exports.CellContainerContentStyled=b,exports.CellContainerHeaderStyled=m,exports.EmptyData=e=>t.jsx(v,Object.assign({},e,{children:e.noRecordComponent?t.jsx(t.Fragment,{children:e.noRecordComponent()}):t.jsxs(t.Fragment,{children:[t.jsx(a,{name:"norecord",size:"extra-large"}),t.jsx("div",Object.assign({style:{marginTop:i.MarginType["extra-small"]}},{children:t.jsx(c.default,{label:e.noRecordLabel||"No records found",fontWeight:"regular",variant:"medium"})}))]})})),exports.SortIcon=({isSorted:e,isSortedDesc:l,iconSortedStyles:n,iconUnsortedStyles:r})=>e?l?t.jsx(a,{name:"chevrondown",className:x.twMerge("fill-tableResponsive-header-textAndIcon-active h-3",n)}):t.jsx(a,{name:"chevronup",className:x.twMerge("fill-tableResponsive-header-textAndIcon-active h-3",n)}):t.jsx(a,{name:"sort",className:x.twMerge("fill-tableResponsive-header-textAndIcon-default h-3",r)}),exports.TableLoaderContainer=y,exports.contentAlignmentMapper=f,exports.defaultPropGetter=()=>({}),exports.getIsExcludedSortable=e=>{if(e.columns)return!1;switch(e.accessor){case"action":case"selectable":return!1;default:return!0}},exports.tableHooks=({hooks:e,actionLabel:l,isSelectable:n,hideRowIndex:r,rowIndexAlign:i,variant:s,rowActions:a,freezedColumn:x,checkedColor:u,totalMaxChecked:g})=>{const f="left";e.visibleColumns.push((e=>{const h=[];if(n){const e={id:"selection",width:
|
|
19
|
+
`;exports.CellContainerBaseStyled=h,exports.CellContainerContentStyled=b,exports.CellContainerHeaderStyled=m,exports.EmptyData=e=>t.jsx(v,Object.assign({},e,{children:e.noRecordComponent?t.jsx(t.Fragment,{children:e.noRecordComponent()}):t.jsxs(t.Fragment,{children:[t.jsx(a,{name:"norecord",size:"extra-large"}),t.jsx("div",Object.assign({style:{marginTop:i.MarginType["extra-small"]}},{children:t.jsx(c.default,{label:e.noRecordLabel||"No records found",fontWeight:"regular",variant:"medium"})}))]})})),exports.SortIcon=({isSorted:e,isSortedDesc:l,iconSortedStyles:n,iconUnsortedStyles:r})=>e?l?t.jsx(a,{name:"chevrondown",className:x.twMerge("fill-tableResponsive-header-textAndIcon-active h-3",n)}):t.jsx(a,{name:"chevronup",className:x.twMerge("fill-tableResponsive-header-textAndIcon-active h-3",n)}):t.jsx(a,{name:"sort",className:x.twMerge("fill-tableResponsive-header-textAndIcon-default h-3",r)}),exports.TableLoaderContainer=y,exports.contentAlignmentMapper=f,exports.defaultPropGetter=()=>({}),exports.getIsExcludedSortable=e=>{if(e.columns)return!1;switch(e.accessor){case"action":case"selectable":return!1;default:return!0}},exports.tableHooks=({hooks:e,actionLabel:l,isSelectable:n,hideRowIndex:r,rowIndexAlign:i,variant:s,rowActions:a,freezedColumn:x,checkedColor:u,totalMaxChecked:g})=>{const f="left";e.visibleColumns.push((e=>{const h=[];if(n){const e={id:"selection",width:28,type:"custom",accessor:"selectable",disableClick:!0,disableSortBy:!0,textAlign:"center",Header:({getToggleAllRowsSelectedProps:e,rows:l})=>{const n=l,r=n.filter((e=>{var t;return!(null===(t=e.original)||void 0===t?void 0:t.disableSelect)})),i=n&&n.length?n.filter((e=>!0===e.isSelected)).length:0;return t.jsx(j,Object.assign({},e(),{indeterminate:!0,checked:!!i||!1,color:u||o.ColorBlue.buttonBlue,onChange:()=>{i>g?r.forEach(((e,t)=>{var l;null===(l=e.toggleRowSelected)||void 0===l||l.call(e,t<g)})):i>0?r.forEach((e=>{var t;return null===(t=e.toggleRowSelected)||void 0===t?void 0:t.call(e,!1)})):r.slice(0,g).forEach((e=>{var t;return null===(t=e.toggleRowSelected)||void 0===t?void 0:t.call(e,!0)}))}}))},Cell:({row:e,checkboxIsDisabled:l,selectedFlatRows:n})=>{const r=l||n.length>=g&&!e.isSelected;return t.jsx(j,Object.assign({},e.getToggleRowSelectedProps(),{color:u||o.ColorBlue.buttonBlue,isDisabled:r}))}};x&&(e.sticky="left"),h.push(e)}if(!r){const e={Header:()=>t.jsx(d.default,{label:"No.",className:"text-[10px] font-normal w-full text-left text-tableResponsive-header-textAndIcon-default"}),id:"index",width:40,disableSortBy:!0,type:"custom",accessor:"index",textAlign:i||f,Cell:({row:e,rows:l,numberAddition:n=0})=>{const r=l.findIndex((t=>t.index===e.index));return t.jsx(d.default,{label:r+1+n,className:"text-xs leading-[14px] font-normal w-full text-left "})}};x&&(e.sticky="left"),h.push(e)}if(a){const e={Header:()=>t.jsx(c.default,{label:null!=l?l:"Action",variant:p[s].fontSize,fontWeight:"semi-bold",textAlign:i||f}),id:"actionRow",width:100,accessor:"action",type:"custom",disableClick:!0,disableSortBy:!0,Cell:({row:e})=>a({rowData:e.original,index:e.index})};x&&(e.sticky="left"),h.push(e)}return[...h,...e]}))},exports.tableSizeMapper=p;
|
|
20
20
|
//# sourceMappingURL=TableBase.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableBase.js","sources":["../../../../src/components/Table/TableBase.tsx"],"sourcesContent":["// FIXME NEW : fix hiderowindex not working\nimport React, { ChangeEvent, forwardRef, useEffect, useRef } from 'react';\nimport { Column, HeaderGroup, Hooks } from 'react-table';\nimport styled from 'styled-components';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useCombinedRefs } from '../../hooks/useCombinedRefs';\nimport { ColorBlue, MarginType, PaddingType } from '../../styles/index';\nimport { Checkbox } from '../Checkbox';\nimport { Icon } from '../Icon';\nimport { BaseText, Text, TextAlign, TextVariantType } from '../Text';\nimport {\n EmptyDataInterface,\n RowActionsInterface,\n TableHooksBaseInterface,\n TableVariantInterface,\n TableVariantType\n} from './Table.type';\n\nexport const contentAlignmentMapper = {\n left: 'flex-start',\n center: 'center',\n right: 'flex-end'\n};\n\nexport const tableSizeMapper: Record<\n string,\n {\n tdHeight: string;\n tdMinHeight: string;\n tdMaxHeight: string;\n tdPadding: string;\n tdPadding68: string;\n thHeight: string;\n charTotal: number;\n fontSize: TextVariantType;\n }\n> = {\n small: {\n tdMinHeight: '32px',\n tdMaxHeight: '48px',\n tdHeight: '48px',\n tdPadding: '8px',\n tdPadding68: '6px 8px',\n thHeight: '42px',\n charTotal: 40,\n fontSize: 'large'\n },\n regular: {\n tdMinHeight: '30px',\n tdMaxHeight: 'max-content',\n tdHeight: '56px',\n tdPadding: '8px',\n tdPadding68: '6px 8px',\n thHeight: '50px',\n charTotal: 77,\n fontSize: 'large'\n }\n};\n\ninterface CellContainerInterface {\n textAlign?: TextAlign;\n isBaseline?: boolean;\n countArrayValue?: number;\n variant: TableVariantType;\n isColSpan?: boolean;\n}\n\nexport const CellContainerBaseStyled = styled.div`\n align-items: ${({ isBaseline }: CellContainerInterface) => (isBaseline ? 'baseline' : 'center')};\n display: flex;\n flex: 1;\n height: ${({ countArrayValue }: CellContainerInterface) =>\n countArrayValue ? `${countArrayValue * 10}px` : '100%'};\n justify-content: ${({ textAlign }: CellContainerInterface) =>\n contentAlignmentMapper[textAlign] || 'center'};\n`;\n\nexport const CellContainerHeaderStyled = styled(CellContainerBaseStyled)``;\n\nexport const CellContainerContentStyled = styled(CellContainerBaseStyled)`\n padding: ${({ variant }: CellContainerInterface) => tableSizeMapper[variant].tdPadding68};\n`;\n\nexport const SortIcon = ({\n isSorted,\n isSortedDesc,\n iconSortedStyles,\n iconUnsortedStyles\n}: {\n isSorted: boolean;\n isSortedDesc: boolean;\n iconSortedStyles?: string;\n iconUnsortedStyles?: string;\n}) => {\n if (!isSorted)\n return (\n <Icon\n name='sort'\n className={twMerge(\n 'fill-tableResponsive-header-textAndIcon-default h-3',\n iconUnsortedStyles\n )}\n />\n );\n\n if (isSortedDesc) {\n return (\n <Icon\n name='chevrondown'\n className={twMerge('fill-tableResponsive-header-textAndIcon-active h-3', iconSortedStyles)}\n />\n );\n } else {\n return (\n <Icon\n name='chevronup'\n className={twMerge('fill-tableResponsive-header-textAndIcon-active h-3', iconSortedStyles)}\n />\n );\n }\n};\n\nexport const getIsExcludedSortable = (column: HeaderGroup) => {\n if (column.columns) return false;\n\n switch (column.accessor) {\n case 'action':\n return false;\n case 'selectable':\n return false;\n default:\n return true;\n }\n};\n\nconst IndeterminateCheckbox = forwardRef(\n (\n {\n onChange,\n indeterminate,\n checked,\n color,\n ...rest\n }: {\n onChange?: (e: ChangeEvent<Element>) => void;\n children?: React.ReactNode;\n indeterminate?: boolean;\n checked?: boolean;\n color?: string;\n isDisabled?: boolean;\n },\n ref: React.Ref<HTMLInputElement>\n ) => {\n const defaultRef = useRef();\n const resolvedRef = useCombinedRefs(ref, defaultRef);\n\n useEffect(() => {\n resolvedRef.current.indeterminate = indeterminate;\n }, [resolvedRef, indeterminate]);\n\n return (\n <Checkbox\n {...rest}\n ref={resolvedRef}\n checked={checked}\n variant='small'\n indeterminate={indeterminate}\n onChange={onChange}\n color={color}\n />\n );\n }\n);\nIndeterminateCheckbox.displayName = 'Checkbox';\n\ninterface TableHooksInterface extends TableHooksBaseInterface, TableVariantInterface {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n hooks: Hooks<any>;\n rowActions?: ({ rowData, index }: RowActionsInterface) => React.ReactNode;\n checkedColor?: string;\n totalMaxChecked?: number;\n}\n\nexport const tableHooks = ({\n hooks,\n actionLabel,\n isSelectable,\n hideRowIndex,\n rowIndexAlign,\n variant,\n rowActions,\n freezedColumn,\n checkedColor,\n totalMaxChecked\n}: TableHooksInterface) => {\n const defaultValue: {\n textAlign: TextAlign;\n } = {\n textAlign: 'left'\n };\n // eslint-disable-next-line sonarjs/cognitive-complexity\n hooks.visibleColumns.push((visibleColumns) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const newColumns: Array<Column<any>> = [];\n\n if (isSelectable) {\n const columnTmp: Column = {\n id: 'selection',\n width: 48,\n type: 'custom',\n accessor: 'selectable',\n disableClick: true,\n disableSortBy: true,\n textAlign: 'center',\n // FIXME: this issue is expected from current react-table lib\n // eslint-disable-next-line react/prop-types,react/display-name\n Header: ({ getToggleAllRowsSelectedProps, rows }) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const currentRows = rows as Array<Record<any, any>>;\n const changeableRows = currentRows.filter((row) => !row.original?.disableSelect);\n const totalChecked =\n currentRows && currentRows.length\n ? currentRows.filter((row) => row.isSelected === true).length\n : 0;\n\n return (\n <IndeterminateCheckbox\n {...getToggleAllRowsSelectedProps()}\n // indeterminate={totalChecked !== changeableRows.length}\n indeterminate\n checked={!!totalChecked || false}\n color={checkedColor || ColorBlue.buttonBlue}\n onChange={() => {\n if (totalChecked > totalMaxChecked) {\n changeableRows.forEach((row, index) => {\n row.toggleRowSelected?.(index < totalMaxChecked);\n });\n } else if (totalChecked > 0) {\n changeableRows.forEach((row) => row.toggleRowSelected?.(false));\n } else {\n changeableRows\n .slice(0, totalMaxChecked)\n .forEach((row) => row.toggleRowSelected?.(true));\n }\n }}\n />\n );\n },\n // eslint-disable-next-line react/prop-types,react/display-name\n Cell: ({ row, checkboxIsDisabled, selectedFlatRows }) => {\n const isDisabled =\n // eslint-disable-next-line react/prop-types\n checkboxIsDisabled || (selectedFlatRows.length >= totalMaxChecked && !row.isSelected);\n return (\n <IndeterminateCheckbox\n // eslint-disable-next-line react/prop-types\n {...row.getToggleRowSelectedProps()}\n color={checkedColor || ColorBlue.buttonBlue}\n isDisabled={isDisabled}\n />\n );\n }\n };\n if (freezedColumn) columnTmp.sticky = 'left';\n newColumns.push(columnTmp);\n }\n if (!hideRowIndex) {\n const columnTmp: Column = {\n // eslint-disable-next-line react/display-name\n Header: () => (\n <BaseText\n label={'No.'}\n className='text-[10px] font-normal w-full text-left text-tableResponsive-header-textAndIcon-default'\n />\n ),\n id: 'index',\n width: 40,\n disableSortBy: true,\n type: 'custom',\n accessor: 'index',\n textAlign: rowIndexAlign || defaultValue.textAlign,\n // eslint-disable-next-line react/display-name, react/prop-types\n Cell: ({ row, rows, numberAddition = 0 }) => {\n // eslint-disable-next-line react/prop-types\n const index = rows.findIndex((data) => data.index === row.index);\n return (\n <BaseText\n label={index + 1 + numberAddition}\n className='text-xs leading-[14px] font-normal w-full text-left '\n />\n );\n }\n };\n if (freezedColumn) columnTmp.sticky = 'left';\n newColumns.push(columnTmp);\n }\n if (rowActions) {\n const columnTmp: Column = {\n // eslint-disable-next-line react/display-name\n Header: () => (\n <Text\n label={actionLabel ?? 'Action'}\n variant={tableSizeMapper[variant].fontSize}\n fontWeight='semi-bold'\n textAlign={rowIndexAlign || defaultValue.textAlign}\n />\n ),\n id: 'actionRow',\n width: 100,\n accessor: 'action',\n type: 'custom',\n disableClick: true,\n disableSortBy: true,\n // FIXME NEW : change any to proper type\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n Cell: ({ row }) => rowActions({ rowData: row.original, index: row.index }) as any\n };\n if (freezedColumn) columnTmp.sticky = 'left';\n newColumns.push(columnTmp);\n }\n return [...newColumns, ...visibleColumns];\n });\n};\n\nconst EmptyDataStyled = styled.div`\n align-items: center;\n display: flex;\n flex-direction: column;\n height: ${(props: EmptyDataInterface) => `${props.emptyTableHeight}px` || '300px'};\n justify-content: center;\n padding: ${PaddingType.large};\n`;\n\nexport const EmptyData = (props: EmptyDataInterface) => {\n return (\n <EmptyDataStyled {...props}>\n {props.noRecordComponent ? (\n <>{props.noRecordComponent()}</>\n ) : (\n <>\n <Icon name='norecord' size='extra-large' />\n <div style={{ marginTop: MarginType['extra-small'] }}>\n <Text\n label={props.noRecordLabel || 'No records found'}\n fontWeight='regular'\n variant='medium'\n />\n </div>\n </>\n )}\n </EmptyDataStyled>\n );\n};\n\nexport const TableLoaderContainer = styled.div`\n display: flex;\n justify-content: center;\n`;\n\nexport const defaultPropGetter = () => ({});\n"],"names":["contentAlignmentMapper","left","center","right","tableSizeMapper","small","tdMinHeight","tdMaxHeight","tdHeight","tdPadding","tdPadding68","thHeight","charTotal","fontSize","regular","CellContainerBaseStyled","styled","div","isBaseline","countArrayValue","textAlign","CellContainerHeaderStyled","CellContainerContentStyled","variant","IndeterminateCheckbox","forwardRef","_a","ref","onChange","indeterminate","checked","color","rest","__rest","defaultRef","useRef","resolvedRef","useCombinedRefs","useEffect","current","_jsx","jsx","Checkbox","Object","assign","displayName","EmptyDataStyled","props","emptyTableHeight","PaddingType","large","TableLoaderContainer","children","noRecordComponent","_Fragment","_jsxs","Icon","name","size","style","marginTop","MarginType","Text","label","noRecordLabel","fontWeight","isSorted","isSortedDesc","iconSortedStyles","iconUnsortedStyles","className","twMerge","column","columns","accessor","hooks","actionLabel","isSelectable","hideRowIndex","rowIndexAlign","rowActions","freezedColumn","checkedColor","totalMaxChecked","defaultValue","visibleColumns","push","newColumns","columnTmp","id","width","type","disableClick","disableSortBy","Header","getToggleAllRowsSelectedProps","rows","currentRows","changeableRows","filter","row","original","disableSelect","totalChecked","length","isSelected","ColorBlue","buttonBlue","forEach","index","toggleRowSelected","call","slice","Cell","checkboxIsDisabled","selectedFlatRows","isDisabled","getToggleRowSelectedProps","sticky","BaseText","numberAddition","findIndex","data","rowData"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TableBase.js","sources":["../../../../src/components/Table/TableBase.tsx"],"sourcesContent":["// FIXME NEW : fix hiderowindex not working\nimport React, { ChangeEvent, forwardRef, useEffect, useRef } from 'react';\nimport { Column, HeaderGroup, Hooks } from 'react-table';\nimport styled from 'styled-components';\nimport { twMerge } from 'tailwind-merge';\n\nimport { useCombinedRefs } from '../../hooks/useCombinedRefs';\nimport { ColorBlue, MarginType, PaddingType } from '../../styles/index';\nimport { Checkbox } from '../Checkbox';\nimport { Icon } from '../Icon';\nimport { BaseText, Text, TextAlign, TextVariantType } from '../Text';\nimport {\n EmptyDataInterface,\n RowActionsInterface,\n TableHooksBaseInterface,\n TableVariantInterface,\n TableVariantType\n} from './Table.type';\n\nexport const contentAlignmentMapper = {\n left: 'flex-start',\n center: 'center',\n right: 'flex-end'\n};\n\nexport const tableSizeMapper: Record<\n string,\n {\n tdHeight: string;\n tdMinHeight: string;\n tdMaxHeight: string;\n tdPadding: string;\n tdPadding68: string;\n thHeight: string;\n charTotal: number;\n fontSize: TextVariantType;\n }\n> = {\n small: {\n tdMinHeight: '32px',\n tdMaxHeight: '48px',\n tdHeight: '48px',\n tdPadding: '8px',\n tdPadding68: '6px 8px',\n thHeight: '42px',\n charTotal: 40,\n fontSize: 'large'\n },\n regular: {\n tdMinHeight: '30px',\n tdMaxHeight: 'max-content',\n tdHeight: '56px',\n tdPadding: '8px',\n tdPadding68: '6px 8px',\n thHeight: '50px',\n charTotal: 77,\n fontSize: 'large'\n }\n};\n\ninterface CellContainerInterface {\n textAlign?: TextAlign;\n isBaseline?: boolean;\n countArrayValue?: number;\n variant: TableVariantType;\n isColSpan?: boolean;\n}\n\nexport const CellContainerBaseStyled = styled.div`\n align-items: ${({ isBaseline }: CellContainerInterface) => (isBaseline ? 'baseline' : 'center')};\n display: flex;\n flex: 1;\n height: ${({ countArrayValue }: CellContainerInterface) =>\n countArrayValue ? `${countArrayValue * 10}px` : '100%'};\n justify-content: ${({ textAlign }: CellContainerInterface) =>\n contentAlignmentMapper[textAlign] || 'center'};\n`;\n\nexport const CellContainerHeaderStyled = styled(CellContainerBaseStyled)``;\n\nexport const CellContainerContentStyled = styled(CellContainerBaseStyled)`\n padding: ${({ variant }: CellContainerInterface) => tableSizeMapper[variant].tdPadding68};\n`;\n\nexport const SortIcon = ({\n isSorted,\n isSortedDesc,\n iconSortedStyles,\n iconUnsortedStyles\n}: {\n isSorted: boolean;\n isSortedDesc: boolean;\n iconSortedStyles?: string;\n iconUnsortedStyles?: string;\n}) => {\n if (!isSorted)\n return (\n <Icon\n name='sort'\n className={twMerge(\n 'fill-tableResponsive-header-textAndIcon-default h-3',\n iconUnsortedStyles\n )}\n />\n );\n\n if (isSortedDesc) {\n return (\n <Icon\n name='chevrondown'\n className={twMerge('fill-tableResponsive-header-textAndIcon-active h-3', iconSortedStyles)}\n />\n );\n } else {\n return (\n <Icon\n name='chevronup'\n className={twMerge('fill-tableResponsive-header-textAndIcon-active h-3', iconSortedStyles)}\n />\n );\n }\n};\n\nexport const getIsExcludedSortable = (column: HeaderGroup) => {\n if (column.columns) return false;\n\n switch (column.accessor) {\n case 'action':\n return false;\n case 'selectable':\n return false;\n default:\n return true;\n }\n};\n\nconst IndeterminateCheckbox = forwardRef(\n (\n {\n onChange,\n indeterminate,\n checked,\n color,\n ...rest\n }: {\n onChange?: (e: ChangeEvent<Element>) => void;\n children?: React.ReactNode;\n indeterminate?: boolean;\n checked?: boolean;\n color?: string;\n isDisabled?: boolean;\n },\n ref: React.Ref<HTMLInputElement>\n ) => {\n const defaultRef = useRef();\n const resolvedRef = useCombinedRefs(ref, defaultRef);\n\n useEffect(() => {\n resolvedRef.current.indeterminate = indeterminate;\n }, [resolvedRef, indeterminate]);\n\n return (\n <Checkbox\n {...rest}\n ref={resolvedRef}\n checked={checked}\n variant='small'\n indeterminate={indeterminate}\n onChange={onChange}\n color={color}\n />\n );\n }\n);\nIndeterminateCheckbox.displayName = 'Checkbox';\n\ninterface TableHooksInterface extends TableHooksBaseInterface, TableVariantInterface {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n hooks: Hooks<any>;\n rowActions?: ({ rowData, index }: RowActionsInterface) => React.ReactNode;\n checkedColor?: string;\n totalMaxChecked?: number;\n}\n\nexport const tableHooks = ({\n hooks,\n actionLabel,\n isSelectable,\n hideRowIndex,\n rowIndexAlign,\n variant,\n rowActions,\n freezedColumn,\n checkedColor,\n totalMaxChecked\n}: TableHooksInterface) => {\n const defaultValue: {\n textAlign: TextAlign;\n } = {\n textAlign: 'left'\n };\n // eslint-disable-next-line sonarjs/cognitive-complexity\n hooks.visibleColumns.push((visibleColumns) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const newColumns: Array<Column<any>> = [];\n\n if (isSelectable) {\n const columnTmp: Column = {\n id: 'selection',\n width: 28,\n type: 'custom',\n accessor: 'selectable',\n disableClick: true,\n disableSortBy: true,\n textAlign: 'center',\n // FIXME: this issue is expected from current react-table lib\n // eslint-disable-next-line react/prop-types,react/display-name\n Header: ({ getToggleAllRowsSelectedProps, rows }) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const currentRows = rows as Array<Record<any, any>>;\n const changeableRows = currentRows.filter((row) => !row.original?.disableSelect);\n const totalChecked =\n currentRows && currentRows.length\n ? currentRows.filter((row) => row.isSelected === true).length\n : 0;\n\n return (\n <IndeterminateCheckbox\n {...getToggleAllRowsSelectedProps()}\n // indeterminate={totalChecked !== changeableRows.length}\n indeterminate\n checked={!!totalChecked || false}\n color={checkedColor || ColorBlue.buttonBlue}\n onChange={() => {\n if (totalChecked > totalMaxChecked) {\n changeableRows.forEach((row, index) => {\n row.toggleRowSelected?.(index < totalMaxChecked);\n });\n } else if (totalChecked > 0) {\n changeableRows.forEach((row) => row.toggleRowSelected?.(false));\n } else {\n changeableRows\n .slice(0, totalMaxChecked)\n .forEach((row) => row.toggleRowSelected?.(true));\n }\n }}\n />\n );\n },\n // eslint-disable-next-line react/prop-types,react/display-name\n Cell: ({ row, checkboxIsDisabled, selectedFlatRows }) => {\n const isDisabled =\n // eslint-disable-next-line react/prop-types\n checkboxIsDisabled || (selectedFlatRows.length >= totalMaxChecked && !row.isSelected);\n return (\n <IndeterminateCheckbox\n // eslint-disable-next-line react/prop-types\n {...row.getToggleRowSelectedProps()}\n color={checkedColor || ColorBlue.buttonBlue}\n isDisabled={isDisabled}\n />\n );\n }\n };\n if (freezedColumn) columnTmp.sticky = 'left';\n newColumns.push(columnTmp);\n }\n if (!hideRowIndex) {\n const columnTmp: Column = {\n // eslint-disable-next-line react/display-name\n Header: () => (\n <BaseText\n label={'No.'}\n className='text-[10px] font-normal w-full text-left text-tableResponsive-header-textAndIcon-default'\n />\n ),\n id: 'index',\n width: 40,\n disableSortBy: true,\n type: 'custom',\n accessor: 'index',\n textAlign: rowIndexAlign || defaultValue.textAlign,\n // eslint-disable-next-line react/display-name, react/prop-types\n Cell: ({ row, rows, numberAddition = 0 }) => {\n // eslint-disable-next-line react/prop-types\n const index = rows.findIndex((data) => data.index === row.index);\n return (\n <BaseText\n label={index + 1 + numberAddition}\n className='text-xs leading-[14px] font-normal w-full text-left '\n />\n );\n }\n };\n if (freezedColumn) columnTmp.sticky = 'left';\n newColumns.push(columnTmp);\n }\n if (rowActions) {\n const columnTmp: Column = {\n // eslint-disable-next-line react/display-name\n Header: () => (\n <Text\n label={actionLabel ?? 'Action'}\n variant={tableSizeMapper[variant].fontSize}\n fontWeight='semi-bold'\n textAlign={rowIndexAlign || defaultValue.textAlign}\n />\n ),\n id: 'actionRow',\n width: 100,\n accessor: 'action',\n type: 'custom',\n disableClick: true,\n disableSortBy: true,\n // FIXME NEW : change any to proper type\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n Cell: ({ row }) => rowActions({ rowData: row.original, index: row.index }) as any\n };\n if (freezedColumn) columnTmp.sticky = 'left';\n newColumns.push(columnTmp);\n }\n return [...newColumns, ...visibleColumns];\n });\n};\n\nconst EmptyDataStyled = styled.div`\n align-items: center;\n display: flex;\n flex-direction: column;\n height: ${(props: EmptyDataInterface) => `${props.emptyTableHeight}px` || '300px'};\n justify-content: center;\n padding: ${PaddingType.large};\n`;\n\nexport const EmptyData = (props: EmptyDataInterface) => {\n return (\n <EmptyDataStyled {...props}>\n {props.noRecordComponent ? (\n <>{props.noRecordComponent()}</>\n ) : (\n <>\n <Icon name='norecord' size='extra-large' />\n <div style={{ marginTop: MarginType['extra-small'] }}>\n <Text\n label={props.noRecordLabel || 'No records found'}\n fontWeight='regular'\n variant='medium'\n />\n </div>\n </>\n )}\n </EmptyDataStyled>\n );\n};\n\nexport const TableLoaderContainer = styled.div`\n display: flex;\n justify-content: center;\n`;\n\nexport const defaultPropGetter = () => ({});\n"],"names":["contentAlignmentMapper","left","center","right","tableSizeMapper","small","tdMinHeight","tdMaxHeight","tdHeight","tdPadding","tdPadding68","thHeight","charTotal","fontSize","regular","CellContainerBaseStyled","styled","div","isBaseline","countArrayValue","textAlign","CellContainerHeaderStyled","CellContainerContentStyled","variant","IndeterminateCheckbox","forwardRef","_a","ref","onChange","indeterminate","checked","color","rest","__rest","defaultRef","useRef","resolvedRef","useCombinedRefs","useEffect","current","_jsx","jsx","Checkbox","Object","assign","displayName","EmptyDataStyled","props","emptyTableHeight","PaddingType","large","TableLoaderContainer","children","noRecordComponent","_Fragment","_jsxs","Icon","name","size","style","marginTop","MarginType","Text","label","noRecordLabel","fontWeight","isSorted","isSortedDesc","iconSortedStyles","iconUnsortedStyles","className","twMerge","column","columns","accessor","hooks","actionLabel","isSelectable","hideRowIndex","rowIndexAlign","rowActions","freezedColumn","checkedColor","totalMaxChecked","defaultValue","visibleColumns","push","newColumns","columnTmp","id","width","type","disableClick","disableSortBy","Header","getToggleAllRowsSelectedProps","rows","currentRows","changeableRows","filter","row","original","disableSelect","totalChecked","length","isSelected","ColorBlue","buttonBlue","forEach","index","toggleRowSelected","call","slice","Cell","checkboxIsDisabled","selectedFlatRows","isDisabled","getToggleRowSelectedProps","sticky","BaseText","numberAddition","findIndex","data","rowData"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { TableResponsiveInterface } from '
|
|
1
|
+
import { TableResponsiveInterface } from './';
|
|
2
2
|
import { TableResponsiveItemContentInterface, TableResponsiveItemTabsInterface, TableResponsiveListTabsInterface, TableResponsiveMidTabsInterface } from './TableResponsive.type';
|
|
3
3
|
declare const TableResponsive: {
|
|
4
4
|
({ getCellProps, pageIndex: tablePageIndex, pageSize: tablePageSize, emptyTableHeight, onClickRow, variant, isSelectable, freezedColumn, freezeHeader, hideRowIndex, tableHeight, ...props }: TableResponsiveInterface): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),o=require("../../../node_modules/@formkit/auto-animate/index.mjs.js"),n=require("../../../node_modules/classnames/index.js"),a=require("../../../node_modules/prop-types/index.js"),s=require("../../../node_modules/react-table/index.js");require("../../../node_modules/react-table-sticky/build/index.js");var l=require("styled-components"),i=require("../../hooks/useDidMountEffect.js");require("../../../node_modules/react-query/es/react/setBatchUpdatesFn.js"),require("../../../node_modules/react-query/es/react/setLogger.js");var d=require("../../styles/Colors.js"),c=require("../../utils/freezeColumn.js"),u=require("../../utils/getChildrenOnDisplayName.js");require("../Badge/Badge.js");var b=require("../Badge/BaseBadge.js"),h=require("../Text/BaseText.js"),g=require("../Text/Text.js");require("../Button/ButtonHyperlink.js");var p=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js");var x=require("../LoadingIndicator/LoadingIndicator.js");require("../LoadingIndicator/LoadingIndicatorBox.js");var m=require("../Menu/BaseMenuDropdown.js"),f=require("../Pagination/BasePagination.js"),y=require("../SwitchPicker/BaseSwitchPicker.js"),v=require("./TableBase.js"),j=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),S=require("../../../_virtual/index5.js");function w(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var C=w(l);const k={pageIndex:0,pageSize:10,textAlign:"left"},I=C.default.div`
|
|
2
2
|
bottom: 0;
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
position: absolute;
|
|
7
7
|
right: 0;
|
|
8
8
|
top: 0;
|
|
9
|
-
`,
|
|
9
|
+
`,T=C.default.thead`
|
|
10
10
|
tr {
|
|
11
11
|
box-shadow: 0px 1px 1px 0px rgb(0 0 0 / 25%);
|
|
12
12
|
clip-path: inset(-10px 0px);
|
|
@@ -31,18 +31,18 @@
|
|
|
31
31
|
width: auto;
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
|
-
`,
|
|
34
|
+
`,O=C.default.div`
|
|
35
35
|
align-items: center;
|
|
36
36
|
display: flex;
|
|
37
37
|
height: 100%;
|
|
38
38
|
justify-content: center;
|
|
39
39
|
width: 100%;
|
|
40
|
-
`,
|
|
40
|
+
`,A=o=>{const a=e=>e.split("_placeholder_");r.useMemo((()=>{const e=o.headerGroups.slice();if(e.length>1){const t=e;for(let e=0;e!==t.length;e++)if(t[e].headers.length>1)for(let r=0;r<t[e].headers.length;r++)if(t[e].headers[r].id.includes("placeholder")){const o=a(t[e].headers[r].id)[1];t[e].headers[r]=t[e+1].headers[parseInt(o)]}return t}}),[o.headerGroups]);const s=o.headerGroups[0].getHeaderGroupProps(),{key:l}=s,i=e.__rest(s,["key"]);return t.jsx(t.Fragment,{children:t.jsx(T,Object.assign({headerGroupsLength:o.headerGroups.length},{children:r.createElement("tr",Object.assign({},i,{key:l,style:{display:"flex",width:"auto",backgroundColor:d.ColorLight.whiteSmoke,minHeight:28*o.headerGroups.length}}),o.headerGroups[0].headers.map(((e,a)=>r.createElement("th",Object.assign({},e.getHeaderProps(v.getIsExcludedSortable(e)&&e.getSortByToggleProps()),{className:j.twMerge(n.default("flex flex-col",j.twMerge("bg-tableResponsive-header-background-colspan",o.headerStyles),e.columns&&"border border-t-0 border-b-0 border-solid border-dark-solitude",o.headerGroups[0].headers[a-1]&&o.headerGroups[0].headers[a-1].columns&&"border-l-0")),key:e.id}),t.jsx(v.CellContainerHeaderStyled,Object.assign({textAlign:e.textAlign||k.textAlign,variant:o.variant,style:{minHeight:e.columns?28:28*o.headerGroups.length}},{children:t.jsx("div",Object.assign({className:n.default("flex flex-row items-center p-2")},{children:"string"!=typeof e.Header.valueOf()?e.render("Header"):t.jsxs(t.Fragment,{children:[t.jsx(h.default,{label:e.Header.toString(),className:n.default("text-xs font-normal text-center",e.isSorted?j.twMerge("text-tableResponsive-header-textAndIcon-active",o.textSortedStyles):j.twMerge("text-tableResponsive-header-textAndIcon-default",o.textUnsortedStyles))}),!e.columns&&t.jsx("span",Object.assign({style:{display:"flex",justifyContent:"center",alignItems:"center"}},{children:!e.disableSortBy&&t.jsx(v.SortIcon,{isSorted:e.isSorted,isSortedDesc:e.isSortedDesc,iconSortedStyles:o.iconSortedStyles,iconUnsortedStyles:o.iconUnsortedStyles})}))]})}))})),e.columns&&t.jsx("div",Object.assign({className:j.twMerge("flex flex-row bg-tableResponsive-header-background-underColspan",o.childHeaderStyles)},{children:e.columns.map((r=>t.jsx(v.CellContainerHeaderStyled,Object.assign({textAlign:r.textAlign||k.textAlign,variant:o.variant,style:{minHeight:28}},{children:t.jsxs("div",Object.assign({className:n.default("flex flex-row items-center p-2"),style:{minHeight:28,minWidth:r.width}},{children:[t.jsx(h.default,{label:r.Header.toString(),className:n.default("text-[10px] font-normal text-center",e.isSorted?j.twMerge("text-tableResponsive-header-textAndIcon-default",o.textSortedStyles):j.twMerge("text-tableResponsive-header-textAndIcon-default",o.textUnsortedStyles))}),!e.columns&&t.jsx("span",Object.assign({style:{display:"flex",justifyContent:"center",alignItems:"center"}},{children:!e.disableSortBy&&t.jsx(v.SortIcon,{isSorted:e.isSorted,isSortedDesc:e.isSortedDesc,iconSortedStyles:o.iconSortedStyles,iconUnsortedStyles:o.iconUnsortedStyles})}))]}))}),r.Header.toString())))}))))))}))})},E=C.default.tbody`
|
|
41
41
|
tr {
|
|
42
42
|
cursor: pointer;
|
|
43
43
|
:hover {
|
|
44
44
|
p {
|
|
45
|
-
font-family: ${
|
|
45
|
+
font-family: ${g.fontFamilyMapper["semi-bold"]};
|
|
46
46
|
}
|
|
47
47
|
}
|
|
48
48
|
td {
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
}
|
|
54
54
|
z-index: 10;
|
|
55
55
|
}
|
|
56
|
-
`,
|
|
56
|
+
`,B=C.default.table`
|
|
57
57
|
border-spacing: 0;
|
|
58
58
|
thead:first-child {
|
|
59
59
|
${({freezeHeader:e})=>e&&"position: sticky !important; top: 0 !important; z-index: 35 !important"}
|
|
@@ -63,8 +63,8 @@
|
|
|
63
63
|
}
|
|
64
64
|
width: 100%;
|
|
65
65
|
td {
|
|
66
|
-
max-height: ${({variant:e})=>
|
|
67
|
-
min-height: ${({variant:e})=>
|
|
66
|
+
max-height: ${({variant:e})=>v.tableSizeMapper[e].tdMaxHeight};
|
|
67
|
+
min-height: ${({variant:e})=>v.tableSizeMapper[e].tdMinHeight};
|
|
68
68
|
:last-child {
|
|
69
69
|
border-right: 0;
|
|
70
70
|
flex: 1;
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
}
|
|
84
84
|
}
|
|
85
85
|
}
|
|
86
|
-
`,M=
|
|
86
|
+
`,M=C.default.div`
|
|
87
87
|
overflow: hidden;
|
|
88
88
|
width: 100%;
|
|
89
89
|
|
|
@@ -132,7 +132,7 @@
|
|
|
132
132
|
}
|
|
133
133
|
`}}
|
|
134
134
|
}
|
|
135
|
-
`,
|
|
135
|
+
`,H=C.default(g.default)`
|
|
136
136
|
-webkit-box-orient: vertical;
|
|
137
137
|
-webkit-line-clamp: 2;
|
|
138
138
|
color: ${({isEmpty:e,color:t})=>t||(e?"var(--tableResponsive-body-text-notSpecifiedAndNone)":"var(--tableResponsive-body-text-default)")};
|
|
@@ -140,5 +140,5 @@
|
|
|
140
140
|
line-height: 16px;
|
|
141
141
|
overflow: hidden;
|
|
142
142
|
white-space: normal;
|
|
143
|
-
`,H=s=>{var{getCellProps:l=y.defaultPropGetter,pageIndex:h=C.pageIndex,pageSize:b=C.pageSize,emptyTableHeight:S=200,onClickRow:w,variant:I="regular",isSelectable:H=!1,freezedColumn:R=0,freezeHeader:z=!1,hideRowIndex:q=!1,tableHeight:N=400}=s,P=e.__rest(s,["getCellProps","pageIndex","pageSize","emptyTableHeight","onClickRow","variant","isSelectable","freezedColumn","freezeHeader","hideRowIndex","tableHeight"]);const{onPageChange:L,isHidePagination:_,isHideTable:D,isHideItemShownDropdown:$,isHideShowColumnDropdown:G,totalData:U,totalPage:F,isManualSort:V,itemShownLabel:W,itemShownLabelStyles:J,itemShownDropdown:K,showColumnDropdown:Q,onSort:X,isRefetchData:Y,loadingContainerStyles:Z}=P,ee=y.tableSizeMapper[I].charTotal,te=o.useMemo((()=>P.data),[P.data]),oe=o.useMemo((()=>c({header:P.header,freezedColumn:R})),[R,P.header]),re=o.useMemo((()=>P.sortBy&&V?[P.sortBy]:[]),[P.sortBy,V]),ne=o.useRef(),se=o.useRef(),[ae,le]=o.useState(0),ie=o.useMemo((()=>{let e;return P.header&&(e=P.header.reduce(((e,t)=>e+(t.width||150)),0),P.rowActions&&(e+=100),q||(e+=40),H||(e+=48)),e}),[P.header,q,P.rowActions,H]),[de,ce]=o.useState(_?void 0:Math.ceil(U/b)),[ue,he]=o.useState(0);o.useEffect((()=>{ne.current&&r.default(ne.current)}),[ne]),o.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)le(t.contentRect.width)}));return se.current&&e.observe(se.current),()=>{se.current&&e.unobserve(se.current)}}),[]);const{canNextPage:pe,canPreviousPage:be,getTableProps:ge,getTableBodyProps:xe,gotoPage:me,headerGroups:fe,nextPage:ye,page:ve,pageCount:je,prepareRow:Se,previousPage:we,selectedFlatRows:Ce,setHiddenColumns:ke,state:{pageIndex:Ie,pageSize:Te,sortBy:[Oe]}}=a.reactTableExports.useTable({columns:oe,data:te,manualSortBy:V,manualPagination:!_,pageCount:de,initialState:{sortBy:re,pageIndex:_?C.pageIndex:h,pageSize:b,hiddenColumns:[],selectedRowIds:P.initialCheckedRows?(()=>{const e={},t=P.initialCheckedRows;return t&&t.forEach((t=>{const o=te.findIndex((e=>e.id===t));e[o.toString()]=!0})),e})():{"-1":!0}}},a.reactTableExports.useBlockLayout,a.reactTableExports.useSortBy,a.reactTableExports.usePagination,a.reactTableExports.useRowSelect,j.__exports.useSticky,(e=>y.tableHooks({hooks:e,isSelectable:H,hideRowIndex:q,rowIndexAlign:P.rowIndexAlign,variant:I,actionLabel:P.actionLabel,rowActions:P.rowActions,freezedColumn:R,checkedColor:P.checkedColor,totalMaxChecked:P.totalMaxChecked}))),Ee=o.useMemo((()=>_?0:Te*Ie),[_,Ie,Te]);i.useDidMountEffect((()=>{"function"==typeof P.onSelectedRow&&H&&P.onSelectedRow(Ce)}),[P.onSelectedRow,Ce]),o.useEffect((()=>{var e;if(Ce){const t=Ce.map((e=>e.original.id));null===(e=P.onCheckedRow)||void 0===e||e.call(P,t)}}),[Ce]),o.useEffect((()=>{P.hiddenColumns&&ke(P.hiddenColumns||[])}),[P.hiddenColumns,ke]),o.useEffect((()=>{"function"==typeof L&&L({pageIndex:Ie,pageSize:Te})}),[Ie,Te]),o.useEffect((()=>{_||ce(Math.ceil(U/Te))}),[Te,U,_]),o.useEffect((()=>{"function"==typeof X&&X({sortBy:Oe})}),[X,Oe]),o.useEffect((()=>{const e=[];ve.forEach((t=>{t.cells.forEach((t=>{Array.isArray(t.value)&&e.push(t.value.length)}))}));const t=e.length>0?Math.max(...e):0;he(t)}),[ve]);const Ae=(!!R||!!z)&&ie>ae,Me=0===te.length,Be=u.getChildrenOnDisplayName(P.children,"ListTabs"),He=u.getChildrenOnDisplayName(P.children,"MidTabs"),Re=u.getChildrenOnDisplayName(P.children,"ItemContent");return t.jsxs("div",Object.assign({className:"flex flex-col w-full h-full"},{children:[t.jsxs("div",Object.assign({ref:ne,className:v.twMerge("flex flex-col w-full bg-accordionTabs-container-background-default mb-3 rounded-lg p-2",P.headerContainerStyles)},{children:[t.jsxs("div",Object.assign({className:"flex flex-row items-center w-full gap-x-1"},{children:[t.jsx("div",Object.assign({className:"flex flex-1"},{children:Be})),He&&t.jsx(t.Fragment,{children:He}),!_&&je>0&&t.jsx("div",{children:t.jsx(m,Object.assign({canPreviousPage:be,canNextPage:pe,totalData:_?te.length:U,pageIndex:Ie,onClickPage:{first:()=>me(0),prev:we,next:ye,last:()=>me(je-1),gotoPage:e=>me(e)},totalPage:F||je,isShowPagination:!0},P.pagination))}),!$&&!!K&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(p.default,{label:W||"Item Shown",className:v.twMerge("font-normal text-dark-gumbo",J)}),t.jsx(x,Object.assign({},K))]})),!G&&!!Q&&t.jsx("div",{children:t.jsx(f,Object.assign({},Q))})]})),Re]})),t.jsx("div",Object.assign({className:(D?"hidden":"flex")+" flex-1 relative w-full h-full overflow-auto z-10"},{children:t.jsxs(k,{children:[t.jsx(M,Object.assign({ref:se,$isOverflowAuto:!Ae,$isLoading:P.isLoading,$isEmpty:Me,tableHeight:N,rowEvenColor:P.rowEvenColor,rowOddColor:P.rowOddColor,variant:I,className:v.twMerge("w-full h-full",P.tableContainerStyles)},{children:t.jsxs(A,Object.assign({},ge(),{freezeHeader:z,variant:I,"data-test-id":P.dataTestId,rowOddColor:P.rowOddColor,rowEvenColor:P.rowEvenColor},{children:[Y&&t.jsx("div",Object.assign({className:v.twMerge("absolute top-0 flex flex-1 items-center justify-center w-full h-full bg-light-whiteSolid z-20",Z)},{children:t.jsx(g,{size:"small"})})),t.jsx(O,{headerGroups:fe,variant:I,freezeHeader:z,textSortedStyles:P.textSortedStyles,textUnsortedStyles:P.textUnsortedStyles,iconSortedStyles:P.iconSortedStyles,iconUnsortedStyles:P.iconUnsortedStyles,headerStyles:P.headerStyles,childHeaderStyles:P.childHeaderStyles}),t.jsx(E,Object.assign({},xe(),{children:ve.map(((r,s)=>{Se(r);const a=()=>w&&w(r.original),i=r.getRowProps(),{key:d}=i,c=e.__rest(i,["key"]);return o.createElement("tr",Object.assign({},c,{key:d||s,style:{display:"flex",width:"auto"}}),r.cells.map(((s,i)=>{const d=s.getCellProps(l(s)),{key:c,checkboxIsDisabled:u}=d,h=e.__rest(d,["key","checkboxIsDisabled"]);return o.createElement("td",Object.assign({},h,{key:c||s.row.id,className:v.twMerge(n.default(!!s.column.parent&&"border border-t-0 border-b-0 border-solid border-dark-solitude",r.cells[i+1]&&r.cells[i-1]&&!!r.cells[i+1].column.parent&&!!r.cells[i-1].column.parent&&"border-l-0",r.cells[i+1]&&r.cells[i-1]&&!!r.cells[i+1].column.parent&&!r.cells[i-1].column.parent&&"border-r-0",r.cells[i+1]&&r.cells[i-1]&&!r.cells[i+1].column.parent&&!!r.cells[i-1].column.parent&&"border-l-0",r.cells[i+1]&&r.cells[i-1]&&!!r.cells[i+1].column.parent&&!!r.cells[i-1].column.parent&&r.cells[i-1].column.parent.id!==s.column.parent.id&&"border-r-0",!r.cells[i+1]&&"border-l-0"))}),"custom"===s.column.type?t.jsx(y.CellContainerContentStyled,Object.assign({variant:I,isBaseline:!0,onClick:s.column.disableClick?null:a},{children:s.render("Cell",Object.assign({numberAddition:Ee},"selectable"===s.column.accessor?{checkboxIsDisabled:u}:{}))})):t.jsx(t.Fragment,{children:Array.isArray(s.value)?s.value.map(((e,o)=>t.jsx(y.CellContainerContentStyled,Object.assign({variant:I,isBaseline:!0,countArrayValue:ue,isColSpan:!0,onClick:s.column.disableClick?null:a},{children:t.jsx(B,Object.assign({isEmpty:!e,textAlign:s.column.textAlign||C.textAlign,label:s.column.isCanShowEmptyCell?e:e||"-",variant:"small",ellipsis:!!s.value&&s.value.length>=ee},s.column.textStyle))}),o))):t.jsx(y.CellContainerContentStyled,Object.assign({variant:I,isBaseline:!0,onClick:s.column.disableClick?null:a},{children:t.jsx(B,Object.assign({isEmpty:!s.value,textAlign:s.column.textAlign||C.textAlign,label:s.column.isCanShowEmptyCell?s.value:s.value||"-",variant:"small",ellipsis:!!s.value&&s.value.length>=ee},s.column.textStyle))}))}))})))}))}))]}))})),Me&&!P.isLoading&&t.jsx(T,{children:t.jsx(y.EmptyData,{emptyTableHeight:S,noRecordLabel:P.noRecordLabel,noRecordComponent:P.noRecordComponent})}),P.isLoading&&t.jsx(T,{children:t.jsx(g,{size:"small",color:P.loadingColor?P.loadingColor:d.ColorBlue.yaleBlue,secondaryColor:P.loadingSecondaryColor?P.loadingSecondaryColor:d.ColorBlue.lapisLazuli})})]})}))]}))},R=({children:e})=>{const r=o.Children.toArray(e);return t.jsx("div",Object.assign({className:"flex flex-row w-full"},{children:o.Children.map(r,((e,o)=>{const r=u.getChildrenOnDisplayName(e,"ItemTabs");return t.jsx("div",Object.assign({className:"flex flex-row items-center"},{children:r}),o)}))}))};R.displayName="ListTabs",H.ListTabs=R;const z=({children:e,containerStyles:o})=>t.jsx(t.Fragment,{children:e?t.jsx("div",Object.assign({className:v.twMerge("flex flex-row flex-1",o)},{children:e})):null});z.displayName="MidTabs",H.MidTabs=z;const q=r=>{var{children:s,isActive:a}=r,l=e.__rest(r,["children","isActive"]);const[i,d]=o.useState(!1),[c,u]=o.useState(!1),p=o.useRef(null);return o.useEffect((()=>{const e=()=>{u(!1),p.current&&!p.current.matches(":hover")&&d(!1)};return c&&document.addEventListener("mouseup",e),()=>{document.removeEventListener("mouseup",e)}}),[c]),t.jsx(t.Fragment,{children:s||t.jsx("div",Object.assign({ref:p,onMouseDown:()=>u(!0),onMouseEnter:()=>d(!0),onMouseLeave:()=>{c||d(!1)}},{children:t.jsx(h.default,Object.assign({},l,{leftIconStyles:v.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||a)&&"fill-accordionTabs-button-textAndIcon-active"),l.leftIconStyles),rightIcon:a?"chevronup":l.rightIcon||"chevrondown",rightIconStyles:v.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||a)&&"fill-accordionTabs-button-textAndIcon-active"),l.rightIconStyles),className:v.twMerge(n.default("\n bg-accordionTabs-button-background-default active:bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-hover \n border-accordionTabs-button-border-default active:border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-hover \n text-accordionTabs-button-textAndIcon-default active:text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-hover\n ",a&&"\n bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-active \n border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-active \n text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-active\n "),l.className)}))}))})};q.displayName="ItemTabs",H.ItemTabs=q;const N=({children:e})=>t.jsx(t.Fragment,{children:e});N.displayName="ItemContent",H.ItemContent=N,H.prototype={pageSize:s.propTypesExports.number,emptyTableHeight:s.propTypesExports.number,onClickRow:s.propTypesExports.func,variant:s.propTypesExports.string,isSelectable:s.propTypesExports.bool,freezedColumn:s.propTypesExports.number,freezeHeader:s.propTypesExports.bool,hideRowIndex:s.propTypesExports.bool,tableHeight:s.propTypesExports.number},module.exports=H;
|
|
143
|
+
`,R=a=>{var{getCellProps:l=v.defaultPropGetter,pageIndex:g=k.pageIndex,pageSize:p=k.pageSize,emptyTableHeight:w=200,onClickRow:C,variant:T="regular",isSelectable:R=!1,freezedColumn:q=0,freezeHeader:z=!1,hideRowIndex:N=!1,tableHeight:P=400}=a,L=e.__rest(a,["getCellProps","pageIndex","pageSize","emptyTableHeight","onClickRow","variant","isSelectable","freezedColumn","freezeHeader","hideRowIndex","tableHeight"]);const{onPageChange:_,isHidePagination:D,isHideTable:$,isHideItemShownDropdown:G,isHideShowColumnDropdown:U,isHideSelectedAmount:F,totalData:V,totalPage:W,isManualSort:J,itemShownLabel:K,selectedAmountValue:Q,selectedAmountLabel:X,selectedAmountLabelStyles:Y,selectedAmountBadgeStyles:Z,itemShownLabelStyles:ee,itemShownDropdown:te,showColumnDropdown:re,onSort:oe,isRefetchData:ne,loadingContainerStyles:ae}=L,se=v.tableSizeMapper[T].charTotal,le=r.useMemo((()=>L.data),[L.data]),ie=r.useMemo((()=>c({header:L.header,freezedColumn:q})),[q,L.header]),de=r.useMemo((()=>L.sortBy&&J?[L.sortBy]:[]),[L.sortBy,J]),ce=r.useRef(),ue=r.useRef(),[be,he]=r.useState(0),ge=r.useMemo((()=>{let e;return L.header&&(e=L.header.reduce(((e,t)=>e+(t.width||150)),0),L.rowActions&&(e+=100),N||(e+=40),R||(e+=48)),e}),[L.header,N,L.rowActions,R]),[pe,xe]=r.useState(D?void 0:Math.ceil(V/p)),[me,fe]=r.useState(0);r.useEffect((()=>{ce.current&&o.default(ce.current)}),[ce]),r.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)he(t.contentRect.width)}));return ue.current&&e.observe(ue.current),()=>{ue.current&&e.unobserve(ue.current)}}),[]);const{canNextPage:ye,canPreviousPage:ve,getTableProps:je,getTableBodyProps:Se,gotoPage:we,headerGroups:Ce,nextPage:ke,page:Ie,pageCount:Te,prepareRow:Oe,previousPage:Ae,selectedFlatRows:Ee,setHiddenColumns:Be,state:{pageIndex:Me,pageSize:He,sortBy:[Re]}}=s.reactTableExports.useTable({columns:ie,data:le,manualSortBy:J,manualPagination:!D,pageCount:pe,initialState:{sortBy:de,pageIndex:D?k.pageIndex:g,pageSize:p,hiddenColumns:[],selectedRowIds:L.initialCheckedRows?(()=>{const e={},t=L.initialCheckedRows;return t&&t.forEach((t=>{const r=le.findIndex((e=>e.id===t));e[r.toString()]=!0})),e})():{"-1":!0}}},s.reactTableExports.useBlockLayout,s.reactTableExports.useSortBy,s.reactTableExports.usePagination,s.reactTableExports.useRowSelect,S.__exports.useSticky,(e=>v.tableHooks({hooks:e,isSelectable:R,hideRowIndex:N,rowIndexAlign:L.rowIndexAlign,variant:T,actionLabel:L.actionLabel,rowActions:L.rowActions,freezedColumn:q,checkedColor:L.checkedColor,totalMaxChecked:L.totalMaxChecked}))),qe=r.useMemo((()=>D?0:He*Me),[D,Me,He]);i.useDidMountEffect((()=>{"function"==typeof L.onSelectedRow&&R&&L.onSelectedRow(Ee)}),[L.onSelectedRow,Ee]),r.useEffect((()=>{var e;if(Ee){const t=Ee.map((e=>e.original.id));null===(e=L.onCheckedRow)||void 0===e||e.call(L,t)}}),[Ee]),r.useEffect((()=>{L.hiddenColumns&&Be(L.hiddenColumns||[])}),[L.hiddenColumns,Be]),r.useEffect((()=>{"function"==typeof _&&_({pageIndex:Me,pageSize:He})}),[Me,He]),r.useEffect((()=>{D||xe(Math.ceil(V/He))}),[He,V,D]),r.useEffect((()=>{"function"==typeof oe&&oe({sortBy:Re})}),[oe,Re]),r.useEffect((()=>{const e=[];Ie.forEach((t=>{t.cells.forEach((t=>{Array.isArray(t.value)&&e.push(t.value.length)}))}));const t=e.length>0?Math.max(...e):0;fe(t)}),[Ie]);const ze=(!!q||!!z)&&ge>be,Ne=0===le.length,Pe=u.getChildrenOnDisplayName(L.children,"ListTabs"),Le=u.getChildrenOnDisplayName(L.children,"MidTabs"),_e=u.getChildrenOnDisplayName(L.children,"ItemContent");return t.jsxs("div",Object.assign({className:"flex flex-col w-full h-full"},{children:[t.jsxs("div",Object.assign({ref:ce,className:j.twMerge("flex flex-col w-full bg-accordionTabs-container-background-default mb-3 rounded-lg p-2",L.headerContainerStyles)},{children:[t.jsxs("div",Object.assign({className:"flex flex-row items-center w-full gap-x-1"},{children:[t.jsx("div",Object.assign({className:"flex flex-1"},{children:Pe})),Le&&t.jsx(t.Fragment,{children:Le}),!D&&Te>0&&t.jsx("div",{children:t.jsx(f,Object.assign({canPreviousPage:ve,canNextPage:ye,totalData:D?le.length:V,pageIndex:Me,onClickPage:{first:()=>we(0),prev:Ae,next:ke,last:()=>we(Te-1),gotoPage:e=>we(e)},totalPage:W||Te,isShowPagination:!0},L.pagination))}),!G&&!!te&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(h.default,{label:K||"Item Shown",className:j.twMerge("font-normal text-dark-gumbo",ee)}),t.jsx(m,Object.assign({},te))]})),!U&&!!re&&t.jsx("div",{children:t.jsx(y,Object.assign({},re))}),!F&&R&&t.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[t.jsx(h.default,{label:X||"Selected Items",className:j.twMerge("font-normal text-dark-gumbo",Y)}),t.jsx(b,{label:`${Q}`,containerStyles:j.twMerge("bg-dark-bermudaGray",Z)})]}))]})),_e]})),t.jsx("div",Object.assign({className:($?"hidden":"flex")+" flex-1 relative w-full h-full overflow-auto z-10"},{children:t.jsxs(I,{children:[t.jsx(M,Object.assign({ref:ue,$isOverflowAuto:!ze,$isLoading:L.isLoading,$isEmpty:Ne,tableHeight:P,rowEvenColor:L.rowEvenColor,rowOddColor:L.rowOddColor,variant:T,className:j.twMerge("w-full h-full",L.tableContainerStyles)},{children:t.jsxs(B,Object.assign({},je(),{freezeHeader:z,variant:T,"data-test-id":L.dataTestId,rowOddColor:L.rowOddColor,rowEvenColor:L.rowEvenColor},{children:[ne&&t.jsx("div",Object.assign({className:j.twMerge("absolute top-0 flex flex-1 items-center justify-center w-full h-full bg-light-whiteSolid z-20",ae)},{children:t.jsx(x,{size:"small"})})),t.jsx(A,{headerGroups:Ce,variant:T,freezeHeader:z,textSortedStyles:L.textSortedStyles,textUnsortedStyles:L.textUnsortedStyles,iconSortedStyles:L.iconSortedStyles,iconUnsortedStyles:L.iconUnsortedStyles,headerStyles:L.headerStyles,childHeaderStyles:L.childHeaderStyles}),t.jsx(E,Object.assign({},Se(),{children:Ie.map(((o,a)=>{Oe(o);const s=()=>C&&C(o.original),i=o.getRowProps(),{key:d}=i,c=e.__rest(i,["key"]);return r.createElement("tr",Object.assign({},c,{key:d||a,style:{display:"flex",width:"auto"}}),o.cells.map(((a,i)=>{const d=a.getCellProps(l(a)),{key:c,checkboxIsDisabled:u}=d,b=e.__rest(d,["key","checkboxIsDisabled"]);return r.createElement("td",Object.assign({},b,{key:c||a.row.id,className:j.twMerge(n.default(!!a.column.parent&&"border border-t-0 border-b-0 border-solid border-dark-solitude",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&"border-l-0",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!o.cells[i-1].column.parent&&"border-r-0",o.cells[i+1]&&o.cells[i-1]&&!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&"border-l-0",o.cells[i+1]&&o.cells[i-1]&&!!o.cells[i+1].column.parent&&!!o.cells[i-1].column.parent&&o.cells[i-1].column.parent.id!==a.column.parent.id&&"border-r-0",!o.cells[i+1]&&"border-l-0"))}),"custom"===a.column.type?t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,onClick:a.column.disableClick?null:s},{children:a.render("Cell",Object.assign({numberAddition:qe},"selectable"===a.column.accessor?{checkboxIsDisabled:u}:{}))})):t.jsx(t.Fragment,{children:Array.isArray(a.value)?a.value.map(((e,r)=>t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,countArrayValue:me,isColSpan:!0,onClick:a.column.disableClick?null:s},{children:t.jsx(H,Object.assign({isEmpty:!e,textAlign:a.column.textAlign||k.textAlign,label:a.column.isCanShowEmptyCell?e:e||"-",variant:"small",ellipsis:!!a.value&&a.value.length>=se},a.column.textStyle))}),r))):t.jsx(v.CellContainerContentStyled,Object.assign({variant:T,isBaseline:!0,onClick:a.column.disableClick?null:s},{children:t.jsx(H,Object.assign({isEmpty:!a.value,textAlign:a.column.textAlign||k.textAlign,label:a.column.isCanShowEmptyCell?a.value:a.value||"-",variant:"small",ellipsis:!!a.value&&a.value.length>=se},a.column.textStyle))}))}))})))}))}))]}))})),Ne&&!L.isLoading&&t.jsx(O,{children:t.jsx(v.EmptyData,{emptyTableHeight:w,noRecordLabel:L.noRecordLabel,noRecordComponent:L.noRecordComponent})}),L.isLoading&&t.jsx(O,{children:t.jsx(x,{size:"small",color:L.loadingColor?L.loadingColor:d.ColorBlue.yaleBlue,secondaryColor:L.loadingSecondaryColor?L.loadingSecondaryColor:d.ColorBlue.lapisLazuli})})]})}))]}))},q=({children:e})=>{const o=r.Children.toArray(e);return t.jsx("div",Object.assign({className:"flex flex-row w-full"},{children:r.Children.map(o,((e,r)=>{const o=u.getChildrenOnDisplayName(e,"ItemTabs");return t.jsx("div",Object.assign({className:"flex flex-row items-center"},{children:o}),r)}))}))};q.displayName="ListTabs",R.ListTabs=q;const z=({children:e,containerStyles:r})=>t.jsx(t.Fragment,{children:e?t.jsx("div",Object.assign({className:j.twMerge("flex flex-row flex-1",r)},{children:e})):null});z.displayName="MidTabs",R.MidTabs=z;const N=o=>{var{children:a,isActive:s}=o,l=e.__rest(o,["children","isActive"]);const[i,d]=r.useState(!1),[c,u]=r.useState(!1),b=r.useRef(null);return r.useEffect((()=>{const e=()=>{u(!1),b.current&&!b.current.matches(":hover")&&d(!1)};return c&&document.addEventListener("mouseup",e),()=>{document.removeEventListener("mouseup",e)}}),[c]),t.jsx(t.Fragment,{children:a||t.jsx("div",Object.assign({ref:b,onMouseDown:()=>u(!0),onMouseEnter:()=>d(!0),onMouseLeave:()=>{c||d(!1)}},{children:t.jsx(p.default,Object.assign({},l,{leftIconStyles:j.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||s)&&"fill-accordionTabs-button-textAndIcon-active"),l.leftIconStyles),rightIcon:s?"chevronup":l.rightIcon||"chevrondown",rightIconStyles:j.twMerge(n.default("fill-accordionTabs-button-textAndIcon-default",i&&"fill-accordionTabs-button-textAndIcon-hover",(c||s)&&"fill-accordionTabs-button-textAndIcon-active"),l.rightIconStyles),className:j.twMerge(n.default("\n bg-accordionTabs-button-background-default active:bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-hover \n border-accordionTabs-button-border-default active:border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-hover \n text-accordionTabs-button-textAndIcon-default active:text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-hover\n ",s&&"\n bg-accordionTabs-button-background-active hover:bg-accordionTabs-button-background-active \n border-accordionTabs-button-border-active hover:border-accordionTabs-button-border-active \n text-accordionTabs-button-textAndIcon-active hover:text-accordionTabs-button-textAndIcon-active\n "),l.className)}))}))})};N.displayName="ItemTabs",R.ItemTabs=N;const P=({children:e})=>t.jsx(t.Fragment,{children:e});P.displayName="ItemContent",R.ItemContent=P,R.prototype={pageSize:a.propTypesExports.number,emptyTableHeight:a.propTypesExports.number,onClickRow:a.propTypesExports.func,variant:a.propTypesExports.string,isSelectable:a.propTypesExports.bool,freezedColumn:a.propTypesExports.number,freezeHeader:a.propTypesExports.bool,hideRowIndex:a.propTypesExports.bool,tableHeight:a.propTypesExports.number},module.exports=R;
|
|
144
144
|
//# sourceMappingURL=TableResponsive.js.map
|
|
@@ -1 +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-xs 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-box;\n line-height: 16px;\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 totalMaxChecked: props.totalMaxChecked\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 const containerRef = useRef(null);\n\n useEffect(() => {\n const handleMouseUp = () => {\n setIsMouseDown(false);\n if (containerRef.current && !containerRef.current.matches(':hover')) {\n setIsMouseEnter(false);\n }\n };\n\n if (isMouseDown) {\n document.addEventListener('mouseup', handleMouseUp);\n }\n return () => {\n document.removeEventListener('mouseup', handleMouseUp);\n };\n }, [isMouseDown]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div\n ref={containerRef}\n onMouseDown={() => setIsMouseDown(true)}\n onMouseEnter={() => setIsMouseEnter(true)}\n onMouseLeave={() => {\n if (!isMouseDown) {\n setIsMouseEnter(false);\n }\n }}\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","totalMaxChecked","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","containerRef","handleMouseUp","matches","document","addEventListener","removeEventListener","onMouseDown","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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"}
|
|
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 { 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 { BaseBadge } from '../Badge';\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-xs 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-box;\n line-height: 16px;\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 isHideSelectedAmount,\n totalData,\n totalPage,\n isManualSort,\n itemShownLabel,\n selectedAmountValue,\n selectedAmountLabel,\n selectedAmountLabelStyles,\n selectedAmountBadgeStyles,\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 totalMaxChecked: props.totalMaxChecked\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\n {!isHideSelectedAmount && isSelectable && (\n <div className='flex flex-row items-center gap-x-2'>\n <BaseText\n label={selectedAmountLabel || 'Selected Items'}\n className={twMerge('font-normal text-dark-gumbo', selectedAmountLabelStyles)}\n />\n <BaseBadge\n label={`${selectedAmountValue}`}\n containerStyles={twMerge('bg-dark-bermudaGray', selectedAmountBadgeStyles)}\n />\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 const containerRef = useRef(null);\n\n useEffect(() => {\n const handleMouseUp = () => {\n setIsMouseDown(false);\n if (containerRef.current && !containerRef.current.matches(':hover')) {\n setIsMouseEnter(false);\n }\n };\n\n if (isMouseDown) {\n document.addEventListener('mouseup', handleMouseUp);\n }\n return () => {\n document.removeEventListener('mouseup', handleMouseUp);\n };\n }, [isMouseDown]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div\n ref={containerRef}\n onMouseDown={() => setIsMouseDown(true)}\n onMouseEnter={() => setIsMouseEnter(true)}\n onMouseLeave={() => {\n if (!isMouseDown) {\n setIsMouseEnter(false);\n }\n }}\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","isHideSelectedAmount","totalData","totalPage","isManualSort","itemShownLabel","selectedAmountValue","selectedAmountLabel","selectedAmountLabelStyles","selectedAmountBadgeStyles","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","totalMaxChecked","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","BaseBadge","containerStyles","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","ItemTabs","isActive","isMouseEnter","setIsMouseEnter","isMouseDown","setIsMouseDown","containerRef","handleMouseUp","matches","document","addEventListener","removeEventListener","onMouseDown","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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"}
|
|
@@ -27,11 +27,15 @@ export interface TableResponsiveInterface extends TableInterface {
|
|
|
27
27
|
isHideTable?: boolean;
|
|
28
28
|
isHideItemShownDropdown?: boolean;
|
|
29
29
|
isHideShowColumnDropdown?: boolean;
|
|
30
|
+
isHideSelectedAmount?: boolean;
|
|
30
31
|
isRefetchData?: boolean;
|
|
32
|
+
selectedAmountValue?: number;
|
|
31
33
|
onPageChange?: PageChangeHandler;
|
|
32
34
|
loadingColor?: string;
|
|
33
35
|
loadingSecondaryColor?: string;
|
|
34
36
|
itemShownLabel?: string;
|
|
37
|
+
selectedAmountLabel?: string;
|
|
38
|
+
selectedAmountBadgeStyles?: string;
|
|
35
39
|
itemShownLabelStyles?: string;
|
|
36
40
|
itemShownDropdown?: BaseMenuDropdownInterface;
|
|
37
41
|
showColumnDropdown?: BaseSwitchPickerInterface;
|
|
@@ -42,6 +46,7 @@ export interface TableResponsiveInterface extends TableInterface {
|
|
|
42
46
|
headerContainerStyles?: string;
|
|
43
47
|
headerStyles?: string;
|
|
44
48
|
childHeaderStyles?: string;
|
|
49
|
+
selectedAmountLabelStyles?: string;
|
|
45
50
|
}
|
|
46
51
|
export type TableResponsiveListTabsInterface = {
|
|
47
52
|
children?: React.ReactNode;
|