uangcermat-web-toolkit-v2 0.2.4 → 0.2.5
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/node_modules/date-fns/esm/subMonths/index.js +2 -0
- package/build/node_modules/date-fns/esm/subMonths/index.js.map +1 -0
- package/build/src/components/CheckPicker/BaseCheckPicker.js +1 -1
- package/build/src/components/CheckPicker/BaseCheckPicker.js.map +1 -1
- package/build/src/components/DatePicker/BaseDatePicker.js +1 -1
- package/build/src/components/DatePicker/BaseDatePicker.js.map +1 -1
- package/build/src/components/DatePicker/DatePicker.js +9 -9
- package/build/src/components/DatePicker/DatePicker.js.map +1 -1
- package/build/src/components/Preview/BasePreview.d.ts +1 -1
- package/build/src/components/Preview/BasePreview.js +1 -1
- package/build/src/components/Preview/BasePreview.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../node_modules/date-fns/esm/subMonths/index.js"],"sourcesContent":["import toInteger from \"../_lib/toInteger/index.js\";\nimport addMonths from \"../addMonths/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name subMonths\n * @category Month Helpers\n * @summary Subtract the specified number of months from the given date.\n *\n * @description\n * Subtract the specified number of months from the given date.\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} amount - the amount of months to be subtracted. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.\n * @returns {Date} the new date with the months subtracted\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Subtract 5 months from 1 February 2015:\n * const result = subMonths(new Date(2015, 1, 1), 5)\n * //=> Mon Sep 01 2014 00:00:00\n */\nexport default function subMonths(dirtyDate, dirtyAmount) {\n requiredArgs(2, arguments);\n var amount = toInteger(dirtyAmount);\n return addMonths(dirtyDate, -amount);\n}"],"names":["dirtyDate","dirtyAmount","requiredArgs","arguments","amount","toInteger","addMonths"],"mappings":"sJAqBe,SAAmBA,EAAWC,GAC3CC,EAAa,EAAGC,WAChB,IAAIC,EAASC,EAAUJ,GACvB,OAAOK,EAAUN,GAAYI,EAC/B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),l=require("../../../node_modules/classnames/index.js"),r=require("react"),s=require("../../../node_modules/react-window/dist/index.esm.js"),a=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var n=require("../Text/BaseText.js");require("../Text/Text.js");var i=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var o=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js");var d=require("../Checkbox/Checkbox.js"),c=require("../Icon/Icon.js"),u=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),x=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=({value:f,valueStyles:
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/@headlessui-float/react/dist/headlessui-float.mjs.js"),l=require("../../../node_modules/classnames/index.js"),r=require("react"),s=require("../../../node_modules/react-window/dist/index.esm.js"),a=require("../../utils/extractClasses.js");require("../Badge/Badge.js");var n=require("../Text/BaseText.js");require("../Text/Text.js");var i=require("../Badge/BaseBadgeRequired.js");require("../Button/ButtonHyperlink.js");var o=require("../Button/BaseButton.js");require("../Button/BaseButtonIcon.js"),require("../Button/Button.js"),require("../Button/ButtonConfirmation.js"),require("../Button/ButtonLink.js"),require("../Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js");var d=require("../Checkbox/Checkbox.js"),c=require("../Icon/Icon.js"),u=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js"),x=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),b=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.js");module.exports=({value:f,valueStyles:g,label:m,labelStyles:j,placeholder:h,placeholderStyles:w,containerStyles:p,activeContainerStyles:v,iconStyles:y,itemsContainerStyles:S,itemContainerStyles:k,oddBgColor:C,evenBgColor:N,isDisabled:q=!1,position:M="bottom-start",isAutoFlip:O,onSelectItem:B,onClean:R,isCleanable:L,isError:T,errorMessage:E,errorMessageStyles:F,helperMessage:G,helperMessageStyles:_,isSearchable:D,searchContainerStyles:I,activeSearchStyles:A,searchPlaceholder:z,searchStyles:P,iconSearchStyles:$,isShowFooterButton:H,footerButtonContainerStyles:K,footerButtonLabel:V,onClickFooterButton:W,noResultsLabel:J,noResultsLabelStyles:Q,badgeContainerStyles:U,badgeLabelStyles:X,variant:Y="box",data:Z,isRequired:ee,labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:re,onSearch:se,selectedAllText:ae,selectedAllTextStyles:ne,activeCheckboxColor:ie,itemTextStyles:oe,listContainerStyles:de,isClearSearchOnClose:ce,selectedItemTextStyles:ue,activeItemTextStyles:xe,maxSelected:be})=>{const fe=r.useRef(null),ge=r.useRef(null),me=r.useRef({}),[je,he]=r.useState(""),[we,pe]=r.useState(0),[ve,ye]=r.useState(!1),Se=e=>me.current[e]||32,ke=r.useCallback(((e,t)=>{me.current=Object.assign(Object.assign({},me.current),{[e]:t}),ge.current&&ge.current.resetAfterIndex(e)}),[]),Ce=r.useMemo((()=>{const e=Z;return""!==je&&je?e.filter((e=>e.label.toLowerCase().includes(je.toLowerCase()))):e}),[je,Z]),Ne=r.useMemo((()=>{let e=0;return Ce.length>0&&(e=34*Ce.length),e}),[Ce.length,je]);r.useEffect((()=>{const e=null==f?void 0:f.filter((e=>e));(null==e?void 0:e.length)>=be?ye(!0):ye(!1)}),[f,be]);const qe=({data:t,index:s,style:i,windowWidth:o})=>{const c=r.useRef(null);return r.useEffect((()=>{c.current&&ke(s,c.current.getBoundingClientRect().height)}),[c,o]),e.jsx("div",Object.assign({className:x.twMerge(l.default("w-full flex items-center !min-h-[32px]",k,(!!a(k,"p-")||!!a(k,"px-")||!!a(k,"py-"))&&"p-0")),style:Object.assign(Object.assign({},i),{backgroundColor:s%2==0?C||"var(--dropdownList-background-odd)":N||"var(--dropdownList-background-even)"})},{children:e.jsx("div",Object.assign({ref:c,className:"w-full"},{children:e.jsx(u.ListboxOption,Object.assign({className:x.twMerge(l.default("relative cursor-default select-none p-2 bg-transparent list-none",a(k,"p-"),a(k,"px-"),a(k,"py-"))),value:t[s]},{children:({active:r})=>{const a=f.some((e=>e===t[s].value));return e.jsxs("div",Object.assign({className:x.twMerge("flex flex-row items-center gap-x-2 cursor-pointer",ve&&!a?"cursor-not-allowed":""),onClick:e=>{if(e.preventDefault(),ve&&!a)return;let l=f.slice();l=a?l.filter((e=>e!==t[s].value)):l.concat(t[s].value),null==B||B(l.filter((e=>""!==e))),l.length===be?ye(!0):ye(!1)}},{children:[e.jsx(d,{checked:a,variant:"small",color:ie||void 0,isDisabled:ve&&!a}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:t[s].label,className:x.twMerge(l.default("text-xs text-dropdownList-text-default leading-[14px]",`${r&&!ve?x.twMerge("font-semibold text-dropdownList-text-hover",xe):"font-normal"}`),a&&ue,oe)})}))]}))}}),s)}),s)}))};r.useEffect((()=>{se&&se(je)}),[je]),r.useEffect((()=>{se&&se(je)}),[je]),r.useEffect((()=>{const e=new ResizeObserver((e=>{for(const t of e)pe(t.contentRect.width)}));return fe.current&&e.observe(fe.current),()=>{fe.current&&e.unobserve(fe.current)}}),[]);const Me=!a(p,"w-")||"w-full"===a(p,"w-")||!a(S,"w-")||"w-full"===a(S,"w-");return e.jsx(u.Listbox,Object.assign({multiple:!0},{children:e.jsxs("div",Object.assign({ref:fe,className:"flex flex-col gap-y-1"},{children:[e.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!m&&e.jsx(n.default,{label:m,className:x.twMerge("font-normal text-dark-gumbo text-[10px]",j)}),ee&&e.jsx(i,{labelRequired:te,labelRequiredStyles:le,containerRequiredStyles:re})]})),e.jsx("div",Object.assign({className:"relative inline-block"},{children:e.jsxs(t.Float,Object.assign({placement:M,flip:O},{children:[e.jsx(u.ListboxButton,Object.assign({className:x.twMerge(l.default("p-0 bg-transparent",q&&"cursor-not-allowed"),re?a(p,"w-"):void 0),onClick:e=>{q&&e.preventDefault()}},{children:({open:t})=>e.jsxs("div",Object.assign({className:x.twMerge(l.default(x.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid",p),"line"===Y&&"border-b border-t-0 border-x-0 rounded-none",t&&v?v:t?"border-fields-border-focus":void 0,q&&"border-dark-bermudaGray bg-light-whiteSmoke",T&&"border-red-fireEngineRed"))},{children:[e.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!h&&""===f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-full"},{children:e.jsx(n.default,{label:h,variant:"small",className:x.twMerge(l.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),w)})})),""!==f[0]&&e.jsx("div",Object.assign({className:"flex flex-1 w-[calc(100%-52px)]"},{children:f.length===Z.length?e.jsx(n.default,{label:ae||"All",variant:"small",className:x.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),ne)}):e.jsx(n.default,{label:Z.filter((e=>f.includes(e.value))).map((e=>e.label)).join(", "),variant:"small",className:x.twMerge(l.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]"),g)})}))]})),""!==f[0]&&e.jsx("div",Object.assign({className:x.twMerge("flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]",U)},{children:e.jsx(n.default,{label:f.length.toString(),className:x.twMerge(l.default("font-normal text-[8px] leading-3"),X)})})),L&&""!==f[0]&&e.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-1",onClick:e=>{e.preventDefault(),null==B||B([]),he(""),ye(!1),null==R||R()}},{children:e.jsx(c,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),e.jsx(c,{name:t?"chevronup":"chevrondown",className:x.twMerge(l.default("fill-dark-bermudaGray w-3 h-3",`${q&&"fill-dark-bermudaGray"}`),y)})]}))})),e.jsx(b.Transition,Object.assign({as:r.Fragment,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0"},{children:e.jsx(u.ListboxOptions,Object.assign({className:x.twMerge(l.default("rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver z-50",p?a(p,"w-"):void 0),S),style:{width:Me?we:void 0}},{children:({open:t})=>(r.useEffect((()=>{!t&&ce&&he("")}),[t]),e.jsxs(e.Fragment,{children:[D&&e.jsx("div",Object.assign({className:"p-2 bg-light-whiteSolid w-full"},{children:e.jsxs("div",Object.assign({className:x.twMerge(l.default(x.twMerge("flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1",I),t&&A?A:t?"border-fields-border-focus":void 0))},{children:[e.jsx("input",{placeholder:z||"Search",className:x.twMerge("flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs",P),onChange:e=>{he(e.target.value)},onKeyDown:e=>e.stopPropagation(),value:je}),e.jsx(c,{name:"search",className:x.twMerge("fill-dark-bermudaGray w-3 h-3",$)})]}))})),e.jsx("div",Object.assign({className:x.twMerge(l.default("p-0 overflow-hidden",a(S,"w-")?a(S,"w-"):a(p,"w-"))),style:{width:Me?we:void 0}},{children:Ce.length>0?e.jsx(s.VariableSizeList,Object.assign({ref:ge,height:Ne>320?320:Ne,itemCount:Ce.length,itemSize:Se,width:"100%",className:x.twMerge("max-h-80 scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude",de),itemData:Ce},{children:qe})):e.jsx("div",Object.assign({className:"py-2 px-4 w-full"},{children:e.jsx(n.default,{label:J||"No Results Found",className:x.twMerge("text-dark-bermudaGray font-normal text-sm",Q)})}))})),H&&e.jsx(o.default,{variant:"tertiary",onClick:()=>{null==W||W()},label:V||"Footer Button",className:x.twMerge("",K)})]}))}))}))]}))})),G&&!T&&e.jsx(n.default,{label:G,className:x.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",_)}),T&&!!E&&e.jsx(n.default,{label:E,className:x.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",F)})]}))}))};
|
|
2
2
|
//# sourceMappingURL=BaseCheckPicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseCheckPicker.js","sources":["../../../../src/components/CheckPicker/BaseCheckPicker.tsx"],"sourcesContent":["import {\n Listbox,\n ListboxButton,\n ListboxOption,\n ListboxOptions,\n Transition\n} from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport classNames from 'classnames';\nimport { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { ListChildComponentProps, VariableSizeList as List } from 'react-window';\nimport { twMerge } from 'tailwind-merge';\n\nimport extractClasses from '../../utils/extractClasses';\nimport { BaseBadgeRequired } from '../Badge';\nimport { BaseButton } from '../Button';\nimport { Checkbox } from '../Checkbox';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport { BaseCheckPickerDataInterface, BaseCheckPickerInterface } from './BaseCheckPicker.type';\n\ninterface RowProps extends ListChildComponentProps {\n setSize: (index: number, size: number) => void;\n windowWidth: number;\n}\nconst BaseCheckPicker = ({\n value,\n valueStyles,\n label,\n labelStyles,\n placeholder,\n placeholderStyles,\n containerStyles,\n activeContainerStyles,\n iconStyles,\n itemsContainerStyles,\n itemContainerStyles,\n oddBgColor,\n evenBgColor,\n isDisabled = false,\n position = 'bottom-start',\n isAutoFlip,\n onSelectItem,\n onClean,\n isCleanable,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isSearchable,\n searchContainerStyles,\n activeSearchStyles,\n searchPlaceholder,\n searchStyles,\n iconSearchStyles,\n isShowFooterButton,\n footerButtonContainerStyles,\n footerButtonLabel,\n onClickFooterButton,\n noResultsLabel,\n noResultsLabelStyles,\n badgeContainerStyles,\n badgeLabelStyles,\n variant = 'box',\n data,\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n onSearch,\n selectedAllText,\n selectedAllTextStyles,\n activeCheckboxColor,\n itemTextStyles,\n listContainerStyles,\n isClearSearchOnClose,\n selectedItemTextStyles,\n activeItemTextStyles,\n maxSelected\n}: BaseCheckPickerInterface) => {\n const rowHeight = 34;\n const dafaultScrollbarStyles =\n 'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n const containerRef = useRef<HTMLDivElement>(null);\n const listRef = useRef<List>(null);\n const sizeMap = useRef<{ [key: number]: number }>({});\n\n const [search, setSearch] = useState<string>('');\n const [buttonWidth, setButtonWidth] = useState<number>(0);\n const [isDisableSelected, setIsDisableSelected] = useState<boolean>(false);\n\n const getSize = (index: number) => sizeMap.current[index] || 32;\n const setSize = useCallback((index: number, size: number) => {\n sizeMap.current = { ...sizeMap.current, [index]: size };\n if (listRef.current) {\n listRef.current.resetAfterIndex(index);\n }\n }, []);\n\n const dataPicker: Array<BaseCheckPickerDataInterface> = useMemo(() => {\n const temp: Array<BaseCheckPickerDataInterface> = data;\n return search === '' || !search\n ? temp\n : temp.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()));\n }, [search, data]);\n\n const dropdownListHeight = useMemo(() => {\n let temp = 0;\n if (dataPicker.length > 0) {\n temp = rowHeight * dataPicker.length;\n }\n return temp;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [dataPicker.length, search]);\n\n // eslint-disable-next-line sonarjs/cognitive-complexity\n const RenderRow: React.FC = ({ data, index, style, windowWidth }: RowProps) => {\n const rowRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (rowRef.current) {\n setSize(index, rowRef.current.getBoundingClientRect().height);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [rowRef, windowWidth]);\n\n return (\n <div\n className={twMerge(\n classNames(\n 'w-full flex items-center !min-h-[32px]',\n itemContainerStyles,\n (!!extractClasses(itemContainerStyles, 'p-') ||\n !!extractClasses(itemContainerStyles, 'px-') ||\n !!extractClasses(itemContainerStyles, 'py-')) &&\n 'p-0'\n )\n )}\n style={{\n ...style,\n backgroundColor:\n index % 2 === 0\n ? oddBgColor || 'var(--dropdownList-background-odd)'\n : evenBgColor || 'var(--dropdownList-background-even)'\n }}\n >\n <div ref={rowRef} key={index} className='w-full'>\n <ListboxOption\n key={index}\n className={twMerge(\n classNames(\n 'relative cursor-default select-none p-2 bg-transparent list-none',\n extractClasses(itemContainerStyles, 'p-'),\n extractClasses(itemContainerStyles, 'px-'),\n extractClasses(itemContainerStyles, 'py-')\n )\n )}\n value={data[index]}\n >\n {({ active }) => {\n const selected = value.some((i) => i === data[index].value);\n return (\n <div\n className={twMerge(\n 'flex flex-row items-center gap-x-2 cursor-pointer',\n isDisableSelected && !selected ? 'cursor-not-allowed' : ''\n )}\n onClick={(e) => {\n e.preventDefault();\n\n if (isDisableSelected && !selected) return;\n\n let temp = value.slice();\n if (selected) {\n temp = temp.filter((i) => i !== data[index].value);\n } else {\n temp = temp.concat(data[index].value);\n }\n\n onSelectItem?.(temp.filter((i) => i !== ''));\n\n if (temp.length === maxSelected) {\n setIsDisableSelected(true);\n } else {\n setIsDisableSelected(false);\n }\n }}\n >\n <Checkbox\n checked={selected}\n variant='small'\n color={activeCheckboxColor || undefined}\n isDisabled={isDisableSelected && !selected}\n />\n\n <div className='flex flex-1'>\n <BaseText\n label={data[index].label}\n className={twMerge(\n classNames(\n 'text-xs text-dropdownList-text-default leading-[14px]',\n `${\n active && !isDisableSelected\n ? twMerge(\n 'font-semibold text-dropdownList-text-hover',\n activeItemTextStyles\n )\n : 'font-normal'\n }`\n ),\n selected && selectedItemTextStyles,\n itemTextStyles\n )}\n />\n </div>\n </div>\n );\n }}\n </ListboxOption>\n </div>\n </div>\n );\n };\n\n useEffect(() => {\n if (onSearch) onSearch(search);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [search]);\n\n useEffect(() => {\n if (onSearch) onSearch(search);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [search]);\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setButtonWidth(entry.contentRect.width);\n }\n });\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n resizeObserver.unobserve(containerRef.current);\n }\n };\n }, []);\n\n const isWidthFull =\n !extractClasses(containerStyles, 'w-') ||\n extractClasses(containerStyles, 'w-') === 'w-full' ||\n !extractClasses(itemsContainerStyles, 'w-') ||\n extractClasses(itemsContainerStyles, 'w-') === 'w-full';\n\n return (\n <Listbox multiple>\n <div ref={containerRef} className='flex flex-col gap-y-1'>\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <div className='relative inline-block'>\n <Float placement={position} flip={isAutoFlip}>\n <ListboxButton\n className={twMerge(\n classNames('p-0 bg-transparent', isDisabled && 'cursor-not-allowed'),\n containerRequiredStyles ? extractClasses(containerStyles, 'w-') : undefined\n )}\n onClick={(e) => {\n if (isDisabled) {\n e.preventDefault();\n }\n }}\n >\n {({ open }) => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n open && activeContainerStyles\n ? activeContainerStyles\n : open\n ? 'border-fields-border-focus'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n >\n <div className='flex flex-1'>\n {!!placeholder && value[0] === '' && (\n <div className='flex flex-1 w-full'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {value[0] !== '' && (\n <div className='flex flex-1 w-[calc(100%-52px)]'>\n {value.length === data.length ? (\n <BaseText\n label={selectedAllText || 'All'}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n ),\n selectedAllTextStyles\n )}\n />\n ) : (\n <BaseText\n label={data\n .filter((i: BaseCheckPickerDataInterface) => value.includes(i.value))\n .map((i) => i.label)\n .join(', ')}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n ),\n valueStyles\n )}\n />\n )}\n </div>\n )}\n </div>\n\n {value[0] !== '' && (\n <div\n className={twMerge(\n 'flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]',\n badgeContainerStyles\n )}\n >\n <BaseText\n label={value.length.toString()}\n className={twMerge(\n classNames('font-normal text-[8px] leading-3'),\n badgeLabelStyles\n )}\n />\n </div>\n )}\n\n {isCleanable && value[0] !== '' && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-1'\n onClick={(e) => {\n e.preventDefault();\n\n onSelectItem?.([]);\n setSearch('');\n setIsDisableSelected(false);\n onClean?.();\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={open ? 'chevronup' : 'chevrondown'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )}\n </ListboxButton>\n <Transition\n as={Fragment}\n leave='transition ease-in duration-100'\n leaveFrom='opacity-100'\n leaveTo='opacity-0'\n >\n <ListboxOptions\n className={twMerge(\n classNames(\n 'rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver z-50',\n containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n ),\n itemsContainerStyles\n )}\n style={{ width: isWidthFull ? buttonWidth : undefined }}\n >\n {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n {({ open }) => {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (!open && isClearSearchOnClose) setSearch('');\n }, [open]);\n\n return (\n <>\n {isSearchable && (\n <div className='p-2 bg-light-whiteSolid w-full'>\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1',\n searchContainerStyles\n ),\n open && activeSearchStyles\n ? activeSearchStyles\n : open\n ? 'border-fields-border-focus'\n : undefined\n )\n )}\n >\n <input\n placeholder={searchPlaceholder || 'Search'}\n className={twMerge(\n 'flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs',\n searchStyles\n )}\n onChange={(e) => {\n setSearch(e.target.value);\n }}\n onKeyDown={(e) => e.stopPropagation()}\n value={search}\n />\n <Icon\n name='search'\n className={twMerge('fill-dark-bermudaGray w-3 h-3', iconSearchStyles)}\n />\n </div>\n </div>\n )}\n <div\n className={twMerge(\n classNames(\n 'p-0 overflow-hidden',\n extractClasses(itemsContainerStyles, 'w-')\n ? extractClasses(itemsContainerStyles, 'w-')\n : extractClasses(containerStyles, 'w-')\n )\n )}\n style={{ width: isWidthFull ? buttonWidth : undefined }}\n >\n {dataPicker.length > 0 ? (\n <List\n ref={listRef}\n height={dropdownListHeight > 320 ? 320 : dropdownListHeight}\n itemCount={dataPicker.length}\n itemSize={getSize}\n width={'100%'}\n className={twMerge(\n `max-h-80 ${dafaultScrollbarStyles}`,\n listContainerStyles\n )}\n itemData={dataPicker}\n >\n {RenderRow}\n </List>\n ) : (\n <div className='py-2 px-4 w-full'>\n <BaseText\n label={noResultsLabel || 'No Results Found'}\n className={twMerge(\n 'text-dark-bermudaGray font-normal text-sm',\n noResultsLabelStyles\n )}\n />\n </div>\n )}\n </div>\n {isShowFooterButton && (\n <BaseButton\n variant='tertiary'\n onClick={() => {\n onClickFooterButton?.();\n }}\n label={footerButtonLabel || 'Footer Button'}\n className={twMerge('', footerButtonContainerStyles)}\n />\n )}\n </>\n );\n }}\n </ListboxOptions>\n </Transition>\n </Float>\n </div>\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n </Listbox>\n );\n};\n\nexport default BaseCheckPicker;\n"],"names":["value","valueStyles","label","labelStyles","placeholder","placeholderStyles","containerStyles","activeContainerStyles","iconStyles","itemsContainerStyles","itemContainerStyles","oddBgColor","evenBgColor","isDisabled","position","isAutoFlip","onSelectItem","onClean","isCleanable","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isSearchable","searchContainerStyles","activeSearchStyles","searchPlaceholder","searchStyles","iconSearchStyles","isShowFooterButton","footerButtonContainerStyles","footerButtonLabel","onClickFooterButton","noResultsLabel","noResultsLabelStyles","badgeContainerStyles","badgeLabelStyles","variant","data","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","selectedAllText","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","maxSelected","containerRef","useRef","listRef","sizeMap","search","setSearch","useState","buttonWidth","setButtonWidth","isDisableSelected","setIsDisableSelected","getSize","index","current","setSize","useCallback","size","Object","assign","resetAfterIndex","dataPicker","useMemo","temp","filter","item","toLowerCase","includes","dropdownListHeight","length","RenderRow","style","windowWidth","rowRef","useEffect","getBoundingClientRect","height","_jsx","className","twMerge","classNames","extractClasses","backgroundColor","children","ref","ListboxOption","active","selected","some","i","_jsxs","onClick","e","preventDefault","slice","concat","jsx","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","observe","unobserve","isWidthFull","Listbox","multiple","jsxs","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","join","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","_Fragment","onChange","target","onKeyDown","stopPropagation","List","itemCount","itemSize","itemData","BaseButton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseCheckPicker.js","sources":["../../../../src/components/CheckPicker/BaseCheckPicker.tsx"],"sourcesContent":["import {\n Listbox,\n ListboxButton,\n ListboxOption,\n ListboxOptions,\n Transition\n} from '@headlessui/react';\nimport { Float } from '@headlessui-float/react';\nimport classNames from 'classnames';\nimport { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { ListChildComponentProps, VariableSizeList as List } from 'react-window';\nimport { twMerge } from 'tailwind-merge';\n\nimport extractClasses from '../../utils/extractClasses';\nimport { BaseBadgeRequired } from '../Badge';\nimport { BaseButton } from '../Button';\nimport { Checkbox } from '../Checkbox';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport { BaseCheckPickerDataInterface, BaseCheckPickerInterface } from './BaseCheckPicker.type';\n\ninterface RowProps extends ListChildComponentProps {\n setSize: (index: number, size: number) => void;\n windowWidth: number;\n}\nconst BaseCheckPicker = ({\n value,\n valueStyles,\n label,\n labelStyles,\n placeholder,\n placeholderStyles,\n containerStyles,\n activeContainerStyles,\n iconStyles,\n itemsContainerStyles,\n itemContainerStyles,\n oddBgColor,\n evenBgColor,\n isDisabled = false,\n position = 'bottom-start',\n isAutoFlip,\n onSelectItem,\n onClean,\n isCleanable,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isSearchable,\n searchContainerStyles,\n activeSearchStyles,\n searchPlaceholder,\n searchStyles,\n iconSearchStyles,\n isShowFooterButton,\n footerButtonContainerStyles,\n footerButtonLabel,\n onClickFooterButton,\n noResultsLabel,\n noResultsLabelStyles,\n badgeContainerStyles,\n badgeLabelStyles,\n variant = 'box',\n data,\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n onSearch,\n selectedAllText,\n selectedAllTextStyles,\n activeCheckboxColor,\n itemTextStyles,\n listContainerStyles,\n isClearSearchOnClose,\n selectedItemTextStyles,\n activeItemTextStyles,\n maxSelected\n}: BaseCheckPickerInterface) => {\n const rowHeight = 34;\n const dafaultScrollbarStyles =\n 'scrollbar scrollbar-thumb-dark-blackCoral scrollbar-thumb-rounded-full scrollbar-w-2 scrollbar-h-2 scrollbar-track-dark-solitude';\n\n const containerRef = useRef<HTMLDivElement>(null);\n const listRef = useRef<List>(null);\n const sizeMap = useRef<{ [key: number]: number }>({});\n\n const [search, setSearch] = useState<string>('');\n const [buttonWidth, setButtonWidth] = useState<number>(0);\n const [isDisableSelected, setIsDisableSelected] = useState<boolean>(false);\n\n const getSize = (index: number) => sizeMap.current[index] || 32;\n const setSize = useCallback((index: number, size: number) => {\n sizeMap.current = { ...sizeMap.current, [index]: size };\n if (listRef.current) {\n listRef.current.resetAfterIndex(index);\n }\n }, []);\n\n const dataPicker: Array<BaseCheckPickerDataInterface> = useMemo(() => {\n const temp: Array<BaseCheckPickerDataInterface> = data;\n return search === '' || !search\n ? temp\n : temp.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()));\n }, [search, data]);\n\n const dropdownListHeight = useMemo(() => {\n let temp = 0;\n if (dataPicker.length > 0) {\n temp = rowHeight * dataPicker.length;\n }\n return temp;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [dataPicker.length, search]);\n\n useEffect(() => {\n const filteredValue = value?.filter((item) => item);\n if (filteredValue?.length >= maxSelected) {\n setIsDisableSelected(true);\n } else {\n setIsDisableSelected(false);\n }\n }, [value, maxSelected]);\n\n // eslint-disable-next-line sonarjs/cognitive-complexity\n const RenderRow: React.FC = ({ data, index, style, windowWidth }: RowProps) => {\n const rowRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (rowRef.current) {\n setSize(index, rowRef.current.getBoundingClientRect().height);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [rowRef, windowWidth]);\n\n return (\n <div\n className={twMerge(\n classNames(\n 'w-full flex items-center !min-h-[32px]',\n itemContainerStyles,\n (!!extractClasses(itemContainerStyles, 'p-') ||\n !!extractClasses(itemContainerStyles, 'px-') ||\n !!extractClasses(itemContainerStyles, 'py-')) &&\n 'p-0'\n )\n )}\n style={{\n ...style,\n backgroundColor:\n index % 2 === 0\n ? oddBgColor || 'var(--dropdownList-background-odd)'\n : evenBgColor || 'var(--dropdownList-background-even)'\n }}\n >\n <div ref={rowRef} key={index} className='w-full'>\n <ListboxOption\n key={index}\n className={twMerge(\n classNames(\n 'relative cursor-default select-none p-2 bg-transparent list-none',\n extractClasses(itemContainerStyles, 'p-'),\n extractClasses(itemContainerStyles, 'px-'),\n extractClasses(itemContainerStyles, 'py-')\n )\n )}\n value={data[index]}\n >\n {({ active }) => {\n const selected = value.some((i) => i === data[index].value);\n return (\n <div\n className={twMerge(\n 'flex flex-row items-center gap-x-2 cursor-pointer',\n isDisableSelected && !selected ? 'cursor-not-allowed' : ''\n )}\n onClick={(e) => {\n e.preventDefault();\n\n if (isDisableSelected && !selected) return;\n\n let temp = value.slice();\n if (selected) {\n temp = temp.filter((i) => i !== data[index].value);\n } else {\n temp = temp.concat(data[index].value);\n }\n\n onSelectItem?.(temp.filter((i) => i !== ''));\n\n if (temp.length === maxSelected) {\n setIsDisableSelected(true);\n } else {\n setIsDisableSelected(false);\n }\n }}\n >\n <Checkbox\n checked={selected}\n variant='small'\n color={activeCheckboxColor || undefined}\n isDisabled={isDisableSelected && !selected}\n />\n\n <div className='flex flex-1'>\n <BaseText\n label={data[index].label}\n className={twMerge(\n classNames(\n 'text-xs text-dropdownList-text-default leading-[14px]',\n `${\n active && !isDisableSelected\n ? twMerge(\n 'font-semibold text-dropdownList-text-hover',\n activeItemTextStyles\n )\n : 'font-normal'\n }`\n ),\n selected && selectedItemTextStyles,\n itemTextStyles\n )}\n />\n </div>\n </div>\n );\n }}\n </ListboxOption>\n </div>\n </div>\n );\n };\n\n useEffect(() => {\n if (onSearch) onSearch(search);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [search]);\n\n useEffect(() => {\n if (onSearch) onSearch(search);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [search]);\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setButtonWidth(entry.contentRect.width);\n }\n });\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n resizeObserver.unobserve(containerRef.current);\n }\n };\n }, []);\n\n const isWidthFull =\n !extractClasses(containerStyles, 'w-') ||\n extractClasses(containerStyles, 'w-') === 'w-full' ||\n !extractClasses(itemsContainerStyles, 'w-') ||\n extractClasses(itemsContainerStyles, 'w-') === 'w-full';\n\n return (\n <Listbox multiple>\n <div ref={containerRef} className='flex flex-col gap-y-1'>\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <div className='relative inline-block'>\n <Float placement={position} flip={isAutoFlip}>\n <ListboxButton\n className={twMerge(\n classNames('p-0 bg-transparent', isDisabled && 'cursor-not-allowed'),\n containerRequiredStyles ? extractClasses(containerStyles, 'w-') : undefined\n )}\n onClick={(e) => {\n if (isDisabled) {\n e.preventDefault();\n }\n }}\n >\n {({ open }) => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n open && activeContainerStyles\n ? activeContainerStyles\n : open\n ? 'border-fields-border-focus'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n >\n <div className='flex flex-1'>\n {!!placeholder && value[0] === '' && (\n <div className='flex flex-1 w-full'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {value[0] !== '' && (\n <div className='flex flex-1 w-[calc(100%-52px)]'>\n {value.length === data.length ? (\n <BaseText\n label={selectedAllText || 'All'}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n ),\n selectedAllTextStyles\n )}\n />\n ) : (\n <BaseText\n label={data\n .filter((i: BaseCheckPickerDataInterface) => value.includes(i.value))\n .map((i) => i.label)\n .join(', ')}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 w-full leading-[14px]'\n ),\n valueStyles\n )}\n />\n )}\n </div>\n )}\n </div>\n\n {value[0] !== '' && (\n <div\n className={twMerge(\n 'flex flex-row justify-center w-3 h-3 bg-fields-badge-background-default text-fields-badge-text-default rounded-full pt-[1px] pl-[0.5px]',\n badgeContainerStyles\n )}\n >\n <BaseText\n label={value.length.toString()}\n className={twMerge(\n classNames('font-normal text-[8px] leading-3'),\n badgeLabelStyles\n )}\n />\n </div>\n )}\n\n {isCleanable && value[0] !== '' && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-1'\n onClick={(e) => {\n e.preventDefault();\n\n onSelectItem?.([]);\n setSearch('');\n setIsDisableSelected(false);\n onClean?.();\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={open ? 'chevronup' : 'chevrondown'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )}\n </ListboxButton>\n <Transition\n as={Fragment}\n leave='transition ease-in duration-100'\n leaveFrom='opacity-100'\n leaveTo='opacity-0'\n >\n <ListboxOptions\n className={twMerge(\n classNames(\n 'rounded p-0 min-w-full flex flex-col overflow-hidden border border-solid border-dark-silver z-50',\n containerStyles ? extractClasses(containerStyles, 'w-') : undefined\n ),\n itemsContainerStyles\n )}\n style={{ width: isWidthFull ? buttonWidth : undefined }}\n >\n {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n {({ open }) => {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (!open && isClearSearchOnClose) setSearch('');\n }, [open]);\n\n return (\n <>\n {isSearchable && (\n <div className='p-2 bg-light-whiteSolid w-full'>\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 border border-solid border-dark-gumbo rounded gap-x-1',\n searchContainerStyles\n ),\n open && activeSearchStyles\n ? activeSearchStyles\n : open\n ? 'border-fields-border-focus'\n : undefined\n )\n )}\n >\n <input\n placeholder={searchPlaceholder || 'Search'}\n className={twMerge(\n 'flex flex-1 line-clamp-1 placeholder:text-dark-bermudaGray p-0 bg-transparent border-none outline-none font-poppins text-dark-blackCoral text-xs',\n searchStyles\n )}\n onChange={(e) => {\n setSearch(e.target.value);\n }}\n onKeyDown={(e) => e.stopPropagation()}\n value={search}\n />\n <Icon\n name='search'\n className={twMerge('fill-dark-bermudaGray w-3 h-3', iconSearchStyles)}\n />\n </div>\n </div>\n )}\n <div\n className={twMerge(\n classNames(\n 'p-0 overflow-hidden',\n extractClasses(itemsContainerStyles, 'w-')\n ? extractClasses(itemsContainerStyles, 'w-')\n : extractClasses(containerStyles, 'w-')\n )\n )}\n style={{ width: isWidthFull ? buttonWidth : undefined }}\n >\n {dataPicker.length > 0 ? (\n <List\n ref={listRef}\n height={dropdownListHeight > 320 ? 320 : dropdownListHeight}\n itemCount={dataPicker.length}\n itemSize={getSize}\n width={'100%'}\n className={twMerge(\n `max-h-80 ${dafaultScrollbarStyles}`,\n listContainerStyles\n )}\n itemData={dataPicker}\n >\n {RenderRow}\n </List>\n ) : (\n <div className='py-2 px-4 w-full'>\n <BaseText\n label={noResultsLabel || 'No Results Found'}\n className={twMerge(\n 'text-dark-bermudaGray font-normal text-sm',\n noResultsLabelStyles\n )}\n />\n </div>\n )}\n </div>\n {isShowFooterButton && (\n <BaseButton\n variant='tertiary'\n onClick={() => {\n onClickFooterButton?.();\n }}\n label={footerButtonLabel || 'Footer Button'}\n className={twMerge('', footerButtonContainerStyles)}\n />\n )}\n </>\n );\n }}\n </ListboxOptions>\n </Transition>\n </Float>\n </div>\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n </Listbox>\n );\n};\n\nexport default BaseCheckPicker;\n"],"names":["value","valueStyles","label","labelStyles","placeholder","placeholderStyles","containerStyles","activeContainerStyles","iconStyles","itemsContainerStyles","itemContainerStyles","oddBgColor","evenBgColor","isDisabled","position","isAutoFlip","onSelectItem","onClean","isCleanable","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isSearchable","searchContainerStyles","activeSearchStyles","searchPlaceholder","searchStyles","iconSearchStyles","isShowFooterButton","footerButtonContainerStyles","footerButtonLabel","onClickFooterButton","noResultsLabel","noResultsLabelStyles","badgeContainerStyles","badgeLabelStyles","variant","data","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","onSearch","selectedAllText","selectedAllTextStyles","activeCheckboxColor","itemTextStyles","listContainerStyles","isClearSearchOnClose","selectedItemTextStyles","activeItemTextStyles","maxSelected","containerRef","useRef","listRef","sizeMap","search","setSearch","useState","buttonWidth","setButtonWidth","isDisableSelected","setIsDisableSelected","getSize","index","current","setSize","useCallback","size","Object","assign","resetAfterIndex","dataPicker","useMemo","temp","filter","item","toLowerCase","includes","dropdownListHeight","length","useEffect","filteredValue","RenderRow","style","windowWidth","rowRef","getBoundingClientRect","height","_jsx","className","twMerge","classNames","extractClasses","backgroundColor","children","ref","ListboxOption","active","selected","some","i","_jsxs","onClick","e","preventDefault","slice","concat","jsx","Checkbox","checked","color","undefined","BaseText","resizeObserver","ResizeObserver","entries","entry","contentRect","width","observe","unobserve","isWidthFull","Listbox","multiple","jsxs","BaseBadgeRequired","Float","placement","flip","ListboxButton","open","map","join","toString","Icon","name","Transition","as","Fragment","leave","leaveFrom","leaveTo","ListboxOptions","_Fragment","onChange","target","onKeyDown","stopPropagation","List","itemCount","itemSize","itemData","BaseButton"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),a=require("../../../node_modules/classnames/index.js"),
|
|
1
|
+
"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),a=require("../../../node_modules/classnames/index.js"),s=require("react"),r=require("../../constants/dateLocale.js"),l=require("../../utils/dateFormatter.js");require("../Badge/Badge.js");var n=require("../Text/BaseText.js");require("../Text/Text.js");var i=require("../Badge/BaseBadgeRequired.js"),o=require("../Icon/Icon.js"),d=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js"),u=require("../../../node_modules/rsuite/esm/DatePicker/DatePicker.js"),m=require("../../../node_modules/date-fns/esm/setYear/index.js"),c=require("../../../node_modules/date-fns/esm/getDate/index.js"),g=require("../../../node_modules/date-fns/esm/subMonths/index.js"),x=require("../../../node_modules/date-fns/esm/isBefore/index.js"),b=require("../../../node_modules/date-fns/esm/isAfter/index.js"),f=require("../../../node_modules/date-fns/esm/addDays/index.js"),h=require("../../../node_modules/date-fns/esm/setMonth/index.js"),j=require("../../../node_modules/date-fns/esm/getMonth/index.js"),p=require("../../../node_modules/date-fns/esm/getYear/index.js"),S=require("../../../node_modules/date-fns/esm/setDate/index.js"),y=require("../../../node_modules/date-fns/esm/addMonths/index.js");module.exports=q=>{var{value:w,format:v,position:D,onChange:M,onSelect:k,isError:R,errorMessage:_,errorMessageStyles:O,helperMessage:N,helperMessageStyles:B,isDisabled:C,containerStyles:E,activeContainerStyles:T,placeholder:G,placeholderStyles:H,valueStyles:Y,isCleanable:A,onClean:P,onOpen:F,icon:I,iconStyles:L,hideHours:z,hideMinutes:K,hideSeconds:$,language:J="english",label:Q,labelStyles:U,variant:V="box",isHideRangesOption:W,customRangesOption:X,isRequired:Z,labelRequired:ee,labelRequiredStyles:te,containerRequiredStyles:ae,isShowButtonToday:se=!0,isShowButtonYesterday:re=!0,toggleAs:le}=q,ne=e.__rest(q,["value","format","position","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isHideRangesOption","customRangesOption","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","isShowButtonToday","isShowButtonYesterday","toggleAs"]);const[ie,oe]=s.useState(!1),de={english:"en",bahasa:"id"};return s.useEffect((()=>{w||oe(!1)}),[w]),t.jsxs("div",Object.assign({className:"relative flex flex-col gap-y-1"},{children:[(ie||C)&&t.jsx("div",{className:"absolute top-0 left-0 w-full h-full gap-y-1 z-20 cursor-pointer"}),t.jsxs("div",Object.assign({className:"flex flex-row items-end gap-x-1"},{children:[!!Q&&t.jsx(n.default,{label:Q,className:d.twMerge("font-normal text-dark-gumbo text-[10px]",U)}),Z&&t.jsx(i,{labelRequired:ee,labelRequiredStyles:te,containerRequiredStyles:ae})]})),t.jsx(u,{value:w,locale:r.dateLocale[J],oneTap:ne.isOneTap,onChange:e=>{const{maxDate:t,minDate:a}=ne;let s=e;t&&b(e,new Date(t))&&(s=((e,t)=>{let a=h(m(e,p(t)),j(t));return a=S(a,c(e)),b(a,t)&&(a=g(a,1)),a})(e,new Date(t)),a&&x(s,new Date(a)))||a&&x(e,new Date(a))&&(s=((e,t)=>{let a=h(m(e,p(t)),j(t));return a=S(a,c(e)),x(a,t)&&(a=y(a,1)),a})(e,new Date(a)),x(s,new Date(a)))||(oe(!1),M(s))},onSelect:k,onClose:()=>oe(!1),onOk:()=>oe(!1),onBlur:()=>{null==P||P(void 0),oe(!1)},onOpen:F,placement:{"top-start":"topStart","top-center":"top","top-end":"topEnd","right-start":"rightStart","right-center":"right","right-end":"rightEnd","bottom-start":"bottomStart","bottom-center":"bottom","bottom-end":"bottomEnd","left-start":"leftStart","left-center":"left","left-end":"leftEnd"}[D],shouldDisableDate:e=>ne.isDisableBefore?x(e,new Date):ne.minDate||ne.maxDate?x(e,ne.minDate?new Date(ne.minDate):void 0)||b(e,ne.maxDate?new Date(ne.maxDate):void 0):void 0,editable:!1,cleanable:A,ranges:W?[]:null!=X?X:[se&&{label:"english"===J?"Today":"Hari ini",value:new Date,placement:"bottom"},re&&{label:"english"===J?"Yesterday":"Kemarin",value:f(new Date,-1),placement:"bottom"}],hideHours:z,hideMinutes:K,hideSeconds:$,toggleAs:le||(()=>t.jsxs("div",Object.assign({className:d.twMerge(a.default(d.twMerge("flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer",E),"line"===V&&"border-b border-t-0 border-x-0 rounded-none",ie&&T?T:ie?"border-fields-border-focus":void 0,C&&"border-dark-bermudaGray bg-light-whiteSmoke",R&&"border-red-fireEngineRed")),onClick:()=>{C||oe(!ie)}},{children:[t.jsxs("div",Object.assign({className:"flex flex-1"},{children:[!!G&&!w&&t.jsx("div",Object.assign({className:"flex flex-1"},{children:t.jsx(n.default,{label:G,variant:"small",className:d.twMerge(a.default("font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]"),H)})})),!!w&&t.jsx("div",Object.assign({className:"flex flex-1"},{children:t.jsx(n.default,{label:l.dateFormatter(w,v,{locale:de[J]}),variant:"small",className:d.twMerge(a.default("font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]"),Y)})}))]})),A&&!!w&&t.jsx("div",Object.assign({className:"cursor-pointer h-3 w-3 flex items-center justify-center -mr-",onClick:e=>{e.stopPropagation(),oe(!1),null==P||P(void 0)}},{children:t.jsx(o,{name:"close",className:"fill-dark-bermudaGray w-3 h-3"})})),t.jsx(o,{name:I||"caretDate",className:d.twMerge(a.default("fill-dark-bermudaGray w-3 h-3",`${C&&"fill-dark-bermudaGray"}`),L)})]})))}),N&&!R&&t.jsx(n.default,{label:N,className:d.twMerge("font-normal text-dark-bermudaGray text-[10px] inline-block",B)}),R&&!!_&&t.jsx(n.default,{label:_,className:d.twMerge("font-normal text-red-fireEngineRed text-[10px] inline-block",O)})]}))};
|
|
2
2
|
//# sourceMappingURL=BaseDatePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseDatePicker.js","sources":["../../../../src/components/DatePicker/BaseDatePicker.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string */\nimport classNames from 'classnames';\nimport * as dateFns from 'date-fns';\nimport { useEffect, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport { TypeAttributes } from 'rsuite/esm/@types/common';\nimport { twMerge } from 'tailwind-merge';\n\nimport { dateLocale } from '../../constants/dateLocale';\nimport { dateFormatter } from '../../utils/dateFormatter';\nimport { BaseBadgeRequired } from '../Badge';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n BaseDatePickerInterface,\n DatePickerLocalType,\n PickerPosition\n} from './BaseDatePicker.type';\n\nconst BaseDatePicker = ({\n value,\n format,\n position,\n onChange,\n onSelect,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isDisabled,\n containerStyles,\n activeContainerStyles,\n placeholder,\n placeholderStyles,\n valueStyles,\n isCleanable,\n onClean,\n onOpen,\n icon,\n iconStyles,\n hideHours,\n hideMinutes,\n hideSeconds,\n language = 'english',\n label,\n labelStyles,\n variant = 'box',\n isHideRangesOption,\n customRangesOption,\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n isShowButtonToday = true,\n isShowButtonYesterday = true,\n toggleAs,\n ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nBaseDatePickerInterface) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const PlacementMapper: Record<PickerPosition, TypeAttributes.Placement> = {\n 'top-start': 'topStart',\n 'top-center': 'top',\n 'top-end': 'topEnd',\n 'right-start': 'rightStart',\n 'right-center': 'right',\n 'right-end': 'rightEnd',\n 'bottom-start': 'bottomStart',\n 'bottom-center': 'bottom',\n 'bottom-end': 'bottomEnd',\n 'left-start': 'leftStart',\n 'left-center': 'left',\n 'left-end': 'leftEnd'\n };\n\n const LanguageMapper: Record<DatePickerLocalType, 'en' | 'id'> = {\n english: 'en',\n bahasa: 'id'\n };\n\n useEffect(() => {\n if (!value) {\n setIsOpen(false);\n }\n }, [value]);\n\n return (\n <div className='relative flex flex-col gap-y-1'>\n {(isOpen || isDisabled) && (\n <div className='absolute top-0 left-0 w-full h-full gap-y-1 z-20 cursor-pointer'></div>\n )}\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <DatePickerRsuite\n value={value}\n locale={dateLocale[language]}\n oneTap={props.isOneTap}\n onChange={(date: Date) => {\n setIsOpen(false);\n onChange(date);\n }}\n onSelect={onSelect}\n onClose={() => setIsOpen(false)}\n onOk={() => setIsOpen(false)}\n onBlur={() => {\n onClean?.(undefined);\n setIsOpen(false);\n }}\n onOpen={onOpen}\n placement={PlacementMapper[position]}\n shouldDisableDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n editable={false}\n cleanable={isCleanable}\n ranges={\n isHideRangesOption\n ? []\n : customRangesOption ?? [\n isShowButtonToday && {\n label: language === 'english' ? 'Today' : 'Hari ini',\n value: new Date(),\n placement: 'bottom'\n },\n isShowButtonYesterday && {\n label: language === 'english' ? 'Yesterday' : 'Kemarin',\n value: dateFns.addDays(new Date(), -1),\n placement: 'bottom'\n }\n ]\n }\n hideHours={hideHours}\n hideMinutes={hideMinutes}\n hideSeconds={hideSeconds}\n toggleAs={\n toggleAs\n ? toggleAs\n : // eslint-disable-next-line sonarjs/cognitive-complexity\n () => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n isOpen && activeContainerStyles\n ? activeContainerStyles\n : isOpen\n ? 'border-fields-border-focus'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n onClick={() => {\n if (!isDisabled) setIsOpen(!isOpen);\n }}\n >\n <div className='flex flex-1'>\n {!!placeholder && !value && (\n <div className='flex flex-1'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {!!value && (\n <div className='flex flex-1'>\n <BaseText\n label={dateFormatter(value, format, { locale: LanguageMapper[language] })}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]'\n ),\n valueStyles\n )}\n />\n </div>\n )}\n </div>\n\n {isCleanable && !!value && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-'\n onClick={(e) => {\n e.stopPropagation();\n\n setIsOpen(false);\n onClean?.(undefined);\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={icon || 'caretDate'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )\n }\n />\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n );\n};\n\nexport default BaseDatePicker;\n"],"names":["_a","value","format","position","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isHideRangesOption","customRangesOption","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","isShowButtonToday","isShowButtonYesterday","toggleAs","props","__rest","isOpen","setIsOpen","useState","LanguageMapper","english","bahasa","useEffect","_jsxs","className","children","_jsx","Object","assign","jsx","BaseText","twMerge","BaseBadgeRequired","DatePickerRsuite","locale","dateLocale","oneTap","isOneTap","date","onClose","onOk","onBlur","undefined","placement","shouldDisableDate","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","editable","cleanable","ranges","dateFns.addDays","classNames","onClick","dateFormatter","e","stopPropagation","Icon","name"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseDatePicker.js","sources":["../../../../src/components/DatePicker/BaseDatePicker.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string */\nimport classNames from 'classnames';\nimport * as dateFns from 'date-fns';\nimport { useEffect, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport { TypeAttributes } from 'rsuite/esm/@types/common';\nimport { twMerge } from 'tailwind-merge';\n\nimport { dateLocale } from '../../constants/dateLocale';\nimport { dateFormatter } from '../../utils/dateFormatter';\nimport { BaseBadgeRequired } from '../Badge';\nimport { Icon } from '../Icon';\nimport { BaseText } from '../Text';\nimport {\n BaseDatePickerInterface,\n DatePickerLocalType,\n PickerPosition\n} from './BaseDatePicker.type';\n\nconst BaseDatePicker = ({\n value,\n format,\n position,\n onChange,\n onSelect,\n isError,\n errorMessage,\n errorMessageStyles,\n helperMessage,\n helperMessageStyles,\n isDisabled,\n containerStyles,\n activeContainerStyles,\n placeholder,\n placeholderStyles,\n valueStyles,\n isCleanable,\n onClean,\n onOpen,\n icon,\n iconStyles,\n hideHours,\n hideMinutes,\n hideSeconds,\n language = 'english',\n label,\n labelStyles,\n variant = 'box',\n isHideRangesOption,\n customRangesOption,\n isRequired,\n labelRequired,\n labelRequiredStyles,\n containerRequiredStyles,\n isShowButtonToday = true,\n isShowButtonYesterday = true,\n toggleAs,\n ...props\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nBaseDatePickerInterface) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const PlacementMapper: Record<PickerPosition, TypeAttributes.Placement> = {\n 'top-start': 'topStart',\n 'top-center': 'top',\n 'top-end': 'topEnd',\n 'right-start': 'rightStart',\n 'right-center': 'right',\n 'right-end': 'rightEnd',\n 'bottom-start': 'bottomStart',\n 'bottom-center': 'bottom',\n 'bottom-end': 'bottomEnd',\n 'left-start': 'leftStart',\n 'left-center': 'left',\n 'left-end': 'leftEnd'\n };\n\n const LanguageMapper: Record<DatePickerLocalType, 'en' | 'id'> = {\n english: 'en',\n bahasa: 'id'\n };\n\n const adjustDateToMax = (date: Date, maxDate: Date): Date => {\n let adjustedDate = dateFns.setMonth(\n dateFns.setYear(date, dateFns.getYear(maxDate)),\n dateFns.getMonth(maxDate)\n );\n adjustedDate = dateFns.setDate(adjustedDate, dateFns.getDate(date));\n\n if (dateFns.isAfter(adjustedDate, maxDate)) {\n adjustedDate = dateFns.subMonths(adjustedDate, 1);\n }\n\n return adjustedDate;\n };\n\n const adjustDateToMin = (date: Date, minDate: Date): Date => {\n let adjustedDate = dateFns.setMonth(\n dateFns.setYear(date, dateFns.getYear(minDate)),\n dateFns.getMonth(minDate)\n );\n adjustedDate = dateFns.setDate(adjustedDate, dateFns.getDate(date));\n if (dateFns.isBefore(adjustedDate, minDate)) {\n adjustedDate = dateFns.addMonths(adjustedDate, 1);\n }\n\n return adjustedDate;\n };\n\n const onChangeHandler = (date: Date): void => {\n const { maxDate, minDate } = props;\n let adjustedDate = date;\n\n if (maxDate && dateFns.isAfter(date, new Date(maxDate))) {\n adjustedDate = adjustDateToMax(date, new Date(maxDate));\n\n if (minDate && dateFns.isBefore(adjustedDate, new Date(minDate))) {\n return;\n }\n }\n\n if (minDate && dateFns.isBefore(date, new Date(minDate))) {\n adjustedDate = adjustDateToMin(date, new Date(minDate));\n\n if (dateFns.isBefore(adjustedDate, new Date(minDate))) {\n return;\n }\n }\n\n setIsOpen(false);\n onChange(adjustedDate);\n };\n\n useEffect(() => {\n if (!value) {\n setIsOpen(false);\n }\n }, [value]);\n\n return (\n <div className='relative flex flex-col gap-y-1'>\n {(isOpen || isDisabled) && (\n <div className='absolute top-0 left-0 w-full h-full gap-y-1 z-20 cursor-pointer'></div>\n )}\n <div className='flex flex-row items-end gap-x-1'>\n {!!label && (\n <BaseText\n label={label}\n className={twMerge('font-normal text-dark-gumbo text-[10px]', labelStyles)}\n />\n )}\n {isRequired && (\n <BaseBadgeRequired\n labelRequired={labelRequired}\n labelRequiredStyles={labelRequiredStyles}\n containerRequiredStyles={containerRequiredStyles}\n />\n )}\n </div>\n <DatePickerRsuite\n value={value}\n locale={dateLocale[language]}\n oneTap={props.isOneTap}\n onChange={onChangeHandler}\n onSelect={onSelect}\n onClose={() => setIsOpen(false)}\n onOk={() => setIsOpen(false)}\n onBlur={() => {\n onClean?.(undefined);\n setIsOpen(false);\n }}\n onOpen={onOpen}\n placement={PlacementMapper[position]}\n shouldDisableDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n editable={false}\n cleanable={isCleanable}\n ranges={\n isHideRangesOption\n ? []\n : customRangesOption ?? [\n isShowButtonToday && {\n label: language === 'english' ? 'Today' : 'Hari ini',\n value: new Date(),\n placement: 'bottom'\n },\n isShowButtonYesterday && {\n label: language === 'english' ? 'Yesterday' : 'Kemarin',\n value: dateFns.addDays(new Date(), -1),\n placement: 'bottom'\n }\n ]\n }\n hideHours={hideHours}\n hideMinutes={hideMinutes}\n hideSeconds={hideSeconds}\n toggleAs={\n toggleAs\n ? toggleAs\n : // eslint-disable-next-line sonarjs/cognitive-complexity\n () => (\n <div\n className={twMerge(\n classNames(\n twMerge(\n 'flex flex-row items-center p-2 rounded gap-x-1 border border-solid border-dark-gumbo bg-light-whiteSolid w-full cursor-pointer',\n containerStyles\n ),\n variant === 'line' && 'border-b border-t-0 border-x-0 rounded-none',\n isOpen && activeContainerStyles\n ? activeContainerStyles\n : isOpen\n ? 'border-fields-border-focus'\n : undefined,\n isDisabled && 'border-dark-bermudaGray bg-light-whiteSmoke',\n isError && 'border-red-fireEngineRed'\n )\n )}\n onClick={() => {\n if (!isDisabled) setIsOpen(!isOpen);\n }}\n >\n <div className='flex flex-1'>\n {!!placeholder && !value && (\n <div className='flex flex-1'>\n <BaseText\n label={placeholder}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-bermudaGray text-xs text-left line-clamp-1 leading-[14px]'\n ),\n placeholderStyles\n )}\n />\n </div>\n )}\n\n {!!value && (\n <div className='flex flex-1'>\n <BaseText\n label={dateFormatter(value, format, { locale: LanguageMapper[language] })}\n variant='small'\n className={twMerge(\n classNames(\n 'font-normal text-dark-blackCoral text-xs text-left line-clamp-1 leading-[14px]'\n ),\n valueStyles\n )}\n />\n </div>\n )}\n </div>\n\n {isCleanable && !!value && (\n <div\n className='cursor-pointer h-3 w-3 flex items-center justify-center -mr-'\n onClick={(e) => {\n e.stopPropagation();\n\n setIsOpen(false);\n onClean?.(undefined);\n }}\n >\n <Icon name='close' className='fill-dark-bermudaGray w-3 h-3' />\n </div>\n )}\n <Icon\n name={icon || 'caretDate'}\n className={twMerge(\n classNames(\n 'fill-dark-bermudaGray w-3 h-3',\n `${isDisabled && 'fill-dark-bermudaGray'}`\n ),\n iconStyles\n )}\n />\n </div>\n )\n }\n />\n\n {helperMessage && !isError && (\n <BaseText\n label={helperMessage}\n className={twMerge(\n 'font-normal text-dark-bermudaGray text-[10px] inline-block',\n helperMessageStyles\n )}\n />\n )}\n\n {isError && !!errorMessage && (\n <BaseText\n label={errorMessage}\n className={twMerge(\n 'font-normal text-red-fireEngineRed text-[10px] inline-block',\n errorMessageStyles\n )}\n />\n )}\n </div>\n );\n};\n\nexport default BaseDatePicker;\n"],"names":["_a","value","format","position","onChange","onSelect","isError","errorMessage","errorMessageStyles","helperMessage","helperMessageStyles","isDisabled","containerStyles","activeContainerStyles","placeholder","placeholderStyles","valueStyles","isCleanable","onClean","onOpen","icon","iconStyles","hideHours","hideMinutes","hideSeconds","language","label","labelStyles","variant","isHideRangesOption","customRangesOption","isRequired","labelRequired","labelRequiredStyles","containerRequiredStyles","isShowButtonToday","isShowButtonYesterday","toggleAs","props","__rest","isOpen","setIsOpen","useState","LanguageMapper","english","bahasa","useEffect","_jsxs","Object","assign","className","children","_jsx","BaseText","twMerge","BaseBadgeRequired","jsx","DatePickerRsuite","locale","dateLocale","oneTap","isOneTap","date","maxDate","minDate","adjustedDate","dateFns.isAfter","Date","dateFns.setMonth","dateFns.setYear","dateFns.getYear","dateFns.getMonth","dateFns.setDate","dateFns.getDate","dateFns.subMonths","adjustDateToMax","dateFns.isBefore","dateFns.addMonths","adjustDateToMin","onClose","onOk","onBlur","undefined","placement","shouldDisableDate","isDisableBefore","editable","cleanable","ranges","dateFns.addDays","classNames","onClick","dateFormatter","e","stopPropagation","Icon","name"],"mappings":"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"}
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../node_modules/prop-types/index.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../node_modules/prop-types/index.js"),t=require("react"),o=require("styled-components"),s=require("../../constants/dateLocale.js"),a=require("../../styles/BorderRadius.js"),i=require("../../styles/Colors.js"),n=require("../../../node_modules/rsuite/esm/DatePicker/DatePicker.js"),d=require("../../../node_modules/date-fns/esm/isBefore/index.js"),l=require("../../../node_modules/date-fns/esm/isAfter/index.js"),p=require("../../../node_modules/date-fns/esm/setMonth/index.js"),u=require("../../../node_modules/date-fns/esm/getMonth/index.js"),m=require("../../../node_modules/date-fns/esm/setYear/index.js"),x=require("../../../node_modules/date-fns/esm/getYear/index.js"),b=require("../../../node_modules/date-fns/esm/setDate/index.js"),c=require("../../../node_modules/date-fns/esm/getDate/index.js"),D=require("../../../node_modules/date-fns/esm/subMonths/index.js"),f=require("../../../node_modules/date-fns/esm/addMonths/index.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const y=g(o).default(n)`
|
|
2
2
|
width: ${({width:e})=>e};
|
|
3
3
|
.rs-picker-toggle {
|
|
4
|
-
${({variant:e,iserror:r,isDisabled:
|
|
4
|
+
${({variant:e,iserror:r,isDisabled:t})=>{const s=r?i.ColorRed.fireEngineRed:t?i.ColorDark.bermudaGray:i.ColorDark.gumbo;return"line"===e?o.css`
|
|
5
5
|
border: 0px !important;
|
|
6
|
-
border-bottom: 1px solid ${
|
|
6
|
+
border-bottom: 1px solid ${s} !important;
|
|
7
7
|
border-radius: ${a.BorderRadiusType.none} !important;
|
|
8
|
-
`:
|
|
9
|
-
border: 1px solid ${
|
|
8
|
+
`:o.css`
|
|
9
|
+
border: 1px solid ${s} !important;
|
|
10
10
|
border-radius: ${a.BorderRadiusType.medium} !important;
|
|
11
11
|
`}}
|
|
12
12
|
}
|
|
13
13
|
.rs-picker-toggle-active,
|
|
14
14
|
.rs-picker.rs-picker-focused {
|
|
15
|
-
${({variant:e})=>{if("line"===e)return
|
|
15
|
+
${({variant:e})=>{if("line"===e)return o.css`
|
|
16
16
|
-webkit-box-shadow: 0 0 0 0;
|
|
17
17
|
-webkit-box-shadow: 0 0 0 0;
|
|
18
18
|
border: 0px !important;
|
|
19
|
-
border-bottom: 1px solid ${
|
|
20
|
-
border-color: ${
|
|
19
|
+
border-bottom: 1px solid ${i.ColorDark.gumbo} !important;
|
|
20
|
+
border-color: ${i.ColorBlue.buttonBlue} !important;
|
|
21
21
|
border-radius: 4px !important;
|
|
22
22
|
border-radius: ${a.BorderRadiusType.none} !important;
|
|
23
23
|
box-shadow: 0 0 0 0;
|
|
24
24
|
box-shadow: 0 0 0 0;
|
|
25
25
|
`}}
|
|
26
26
|
}
|
|
27
|
-
`,
|
|
27
|
+
`,h=r=>{const[o,a]=t.useState(!1),i=t.useRef(null);return e.jsx("div",Object.assign({ref:r.isDisabledFloating?i:void 0,style:r.isDisabledFloating?{position:"relative",width:"100%"}:{width:r.isFullWidth?"100%":void 0}},{children:e.jsx(y,{container:r.isDisabledFloating?()=>i.current:void 0,locale:s.dateLocale[r.language],oneTap:r.isOneTap,disabled:r.isDisabled,open:r.isOpen,disabledDate:e=>r.isDisableBefore?d(e,new Date):r.minDate||r.maxDate?d(e,r.minDate?new Date(r.minDate):void 0)||l(e,r.maxDate?new Date(r.maxDate):void 0):void 0,placeholder:r.placeholder,"data-test-id":r.dataTestId,value:r.value,onSelect:r.onSelect,onChange:e=>{const{maxDate:t,minDate:o}=r;let s=e;t&&l(e,new Date(t))&&(s=((e,r)=>{let t=p(m(e,x(r)),u(r));return t=b(t,c(e)),l(t,r)&&(t=D(t,1)),t})(e,new Date(t)),o&&d(s,new Date(o)))||o&&d(e,new Date(o))&&(s=((e,r)=>{let t=p(m(e,x(r)),u(r));return t=b(t,c(e)),d(t,r)&&(t=f(t,1)),t})(e,new Date(o)),d(s,new Date(o)))||r.onChange(s)},defaultValue:r.defaultValue,format:o&&"dd MMM"===r.format?"dd MMM yyyy":r.format,ranges:r.isHideRangesOption?[]:void 0,placement:r.placement,variant:r.variant,iserror:r.isError?"error":void 0,onBlur:r.onBlur,width:r.isFullWidth?"100%":r.width,onOpen:()=>{"dd MMM"===r.format&&a(!0)},onClose:()=>{"dd MMM"===r.format&&a(!1)},cleanable:r.isCleanable,onClean:r.onClean,editable:!1})}))};h.prototype={placeholder:r.propTypesExports.string,isOneTap:r.propTypesExports.bool,variant:r.propTypesExports.string,isDisableBefore:r.propTypesExports.bool,format:r.propTypesExports.string,language:r.propTypesExports.string,width:r.propTypesExports.string,minDate:r.propTypesExports.string,maxDate:r.propTypesExports.string,isHideRangesOption:r.propTypesExports.bool},h.defaultProps={placeholder:"Select Date",isOneTap:!1,variant:"box",isDisableBefore:!1,format:"dd MMMM yyyy",language:"english",width:"200px",minDate:"",maxDate:"",isHideRangesOption:!1,isCleanable:!0},exports.DatePickerRsuiteStyled=y,exports.default=h;
|
|
28
28
|
//# sourceMappingURL=DatePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as dateFns from 'date-fns';\nimport * as PropTypes from 'prop-types';\nimport { useRef, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport styled, { css } from 'styled-components';\n\nimport { FormVariantType } from '../../blocks/Form/Form.type';\nimport { dateLocale } from '../../constants/dateLocale';\nimport { BorderRadiusType } from '../../styles/BorderRadius';\nimport { ColorBlue, ColorDark, ColorRed } from '../../styles/Colors';\nimport { DatePickerInterface } from './DatePicker.type';\n\ninterface DatePickerStyleInterface {\n iserror?: string;\n variant?: FormVariantType;\n disabled?: boolean;\n}\n\nexport const DatePickerRsuiteStyled = styled(DatePickerRsuite)`\n width: ${({ width }: DatePickerInterface) => width};\n .rs-picker-toggle {\n ${({ variant, iserror, isDisabled }: DatePickerStyleInterface & DatePickerInterface) => {\n const borderColor = iserror\n ? ColorRed.fireEngineRed\n : isDisabled\n ? ColorDark.bermudaGray\n : ColorDark.gumbo;\n\n if (variant === 'line') {\n return css`\n border: 0px !important;\n border-bottom: 1px solid ${borderColor} !important;\n border-radius: ${BorderRadiusType.none} !important;\n `;\n } else {\n return css`\n border: 1px solid ${borderColor} !important;\n border-radius: ${BorderRadiusType.medium} !important;\n `;\n }\n }}\n }\n .rs-picker-toggle-active,\n .rs-picker.rs-picker-focused {\n ${({ variant }: DatePickerStyleInterface) => {\n if (variant === 'line') {\n return css`\n -webkit-box-shadow: 0 0 0 0;\n -webkit-box-shadow: 0 0 0 0;\n border: 0px !important;\n border-bottom: 1px solid ${ColorDark.gumbo} !important;\n border-color: ${ColorBlue.buttonBlue} !important;\n border-radius: 4px !important;\n border-radius: ${BorderRadiusType.none} !important;\n box-shadow: 0 0 0 0;\n box-shadow: 0 0 0 0;\n `;\n }\n }}\n }\n`;\n\n// FIXME: Warning: Received `false` for a non-boolean attribute `iserror`.\n// FIXME: rsuite change to pure component\nconst DatePicker = (props: DatePickerInterface) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const containerRef = useRef(null);\n\n return (\n <div\n ref={props.isDisabledFloating ? containerRef : undefined}\n style={\n props.isDisabledFloating\n ? { position: 'relative', width: '100%' }\n : { width: props.isFullWidth ? '100%' : undefined }\n }\n >\n <DatePickerRsuiteStyled\n container={props.isDisabledFloating ? () => containerRef.current : undefined}\n // FIXME: date format on month select still with format value\n locale={dateLocale[props.language]}\n oneTap={props.isOneTap}\n disabled={props.isDisabled}\n open={props.isOpen}\n disabledDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n placeholder={props.placeholder}\n data-test-id={props.dataTestId}\n value={props.value}\n onSelect={props.onSelect}\n onChange={props.onChange}\n defaultValue={props.defaultValue}\n format={isOpen && props.format === 'dd MMM' ? 'dd MMM yyyy' : props.format}\n ranges={props.isHideRangesOption ? [] : undefined}\n placement={props.placement}\n variant={props.variant}\n iserror={props.isError ? 'error' : undefined}\n onBlur={props.onBlur}\n width={props.isFullWidth ? '100%' : props.width}\n onOpen={() => {\n if (props.format === 'dd MMM') {\n setIsOpen(true);\n }\n }}\n onClose={() => {\n if (props.format === 'dd MMM') {\n setIsOpen(false);\n }\n }}\n cleanable={props.isCleanable}\n onClean={props.onClean}\n editable={false}\n />\n </div>\n );\n};\n\nDatePicker.prototype = {\n placeholder: PropTypes.string,\n isOneTap: PropTypes.bool,\n variant: PropTypes.string,\n isDisableBefore: PropTypes.bool,\n format: PropTypes.string,\n language: PropTypes.string,\n width: PropTypes.string,\n minDate: PropTypes.string,\n maxDate: PropTypes.string,\n isHideRangesOption: PropTypes.bool\n};\n\nDatePicker.defaultProps = {\n placeholder: 'Select Date',\n isOneTap: false,\n variant: 'box',\n isDisableBefore: false,\n format: 'dd MMMM yyyy',\n language: 'english',\n width: '200px',\n minDate: '',\n maxDate: '',\n isHideRangesOption: false,\n isCleanable: true\n};\n\nexport default DatePicker;\n"],"names":["DatePickerRsuiteStyled","styled","DatePickerRsuite","width","variant","iserror","isDisabled","borderColor","ColorRed","fireEngineRed","ColorDark","bermudaGray","gumbo","css","BorderRadiusType","none","medium","ColorBlue","buttonBlue","DatePicker","props","isOpen","setIsOpen","useState","containerRef","useRef","_jsx","ref","isDisabledFloating","undefined","style","position","isFullWidth","children","jsx","container","current","locale","dateLocale","language","oneTap","isOneTap","disabled","open","disabledDate","date","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","placeholder","dataTestId","value","onSelect","onChange","defaultValue","format","ranges","isHideRangesOption","placement","isError","onBlur","onOpen","onClose","cleanable","isCleanable","onClean","editable","prototype","PropTypes.string","propTypesExports","string","PropTypes.bool","bool","defaultProps"],"mappings":"imBAkBaA,OAAyBC,QAAOC,EAAiB;WACnD,EAAGC,WAAiCA;;MAEzC,EAAGC,UAASC,UAASC,iBACrB,MAAMC,EAAcF,EAChBG,EAAAA,SAASC,cACTH,EACAI,EAAAA,UAAUC,YACVD,EAAAA,UAAUE,MAEd,MAAgB,SAAZR,EACKS,EAAGA,GAAA;;qCAEmBN;2BACVO,EAAAA,iBAAiBC;UAG7BF,EAAGA,GAAA;8BACYN;2BACHO,EAAAA,iBAAiBE;SAErC;;;;MAKD,EAAGZ,cACH,GAAgB,SAAZA,EACF,OAAOS,EAAGA,GAAA;;;;qCAImBH,EAAAA,UAAUE;0BACrBK,EAAAA,UAAUC;;2BAETJ,EAAAA,iBAAiBC;;;SAIrC;;EAODI,EAAcC,IAClB,MAAOC,EAAQC,GAAaC,EAAQA,UAAU,GACxCC,EAAeC,SAAO,MAE5B,OACEC,2BACEC,IAAKP,EAAMQ,mBAAqBJ,OAAeK,EAC/CC,MACEV,EAAMQ,mBACF,CAAEG,SAAU,WAAY5B,MAAO,QAC/B,CAAEA,MAAOiB,EAAMY,YAAc,YAASH,IAG5C,CAAAI,SAAAP,EAAAQ,IAAClC,EAAsB,CACrBmC,UAAWf,EAAMQ,mBAAqB,IAAMJ,EAAaY,aAAUP,EAEnEQ,OAAQC,EAAUA,WAAClB,EAAMmB,UACzBC,OAAQpB,EAAMqB,SACdC,SAAUtB,EAAMd,WAChBqC,KAAMvB,EAAMC,OACZuB,aAAeC,GACbzB,EAAM0B,gBACFC,EAAiBF,EAAM,IAAIG,MAC3B5B,EAAM6B,SAAW7B,EAAM8B,QACvBH,EAAiBF,EAAMzB,EAAM6B,QAAU,IAAID,KAAK5B,EAAM6B,cAAWpB,IACjEsB,EAAgBN,EAAMzB,EAAM8B,QAAU,IAAIF,KAAK5B,EAAM8B,cAAWrB,QAChEA,EAENuB,YAAahC,EAAMgC,YAAW,eAChBhC,EAAMiC,WACpBC,MAAOlC,EAAMkC,MACbC,SAAUnC,EAAMmC,SAChBC,SAAUpC,EAAMoC,SAChBC,aAAcrC,EAAMqC,aACpBC,OAAQrC,GAA2B,WAAjBD,EAAMsC,OAAsB,cAAgBtC,EAAMsC,OACpEC,OAAQvC,EAAMwC,mBAAqB,QAAK/B,EACxCgC,UAAWzC,EAAMyC,UACjBzD,QAASgB,EAAMhB,QACfC,QAASe,EAAM0C,QAAU,aAAUjC,EACnCkC,OAAQ3C,EAAM2C,OACd5D,MAAOiB,EAAMY,YAAc,OAASZ,EAAMjB,MAC1C6D,OAAQ,KACe,WAAjB5C,EAAMsC,QACRpC,GAAU,EACX,EAEH2C,QAAS,KACc,WAAjB7C,EAAMsC,QACRpC,GAAU,EACX,EAEH4C,UAAW9C,EAAM+C,YACjBC,QAAShD,EAAMgD,QACfC,UAAU,MAGd,EAGJlD,EAAWmD,UAAY,CACrBlB,YAAamB,EAAgBC,iBAAAC,OAC7BhC,SAAUiC,EAAcF,iBAAAG,KACxBvE,QAASmE,EAAgBC,iBAAAC,OACzB3B,gBAAiB4B,EAAcF,iBAAAG,KAC/BjB,OAAQa,EAAgBC,iBAAAC,OACxBlC,SAAUgC,EAAgBC,iBAAAC,OAC1BtE,MAAOoE,EAAgBC,iBAAAC,OACvBxB,QAASsB,EAAgBC,iBAAAC,OACzBvB,QAASqB,EAAgBC,iBAAAC,OACzBb,mBAAoBc,EAAcF,iBAAAG,MAGpCxD,EAAWyD,aAAe,CACxBxB,YAAa,cACbX,UAAU,EACVrC,QAAS,MACT0C,iBAAiB,EACjBY,OAAQ,eACRnB,SAAU,UACVpC,MAAO,QACP8C,QAAS,GACTC,QAAS,GACTU,oBAAoB,EACpBO,aAAa"}
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as dateFns from 'date-fns';\nimport * as PropTypes from 'prop-types';\nimport { useRef, useState } from 'react';\nimport { DatePicker as DatePickerRsuite } from 'rsuite';\nimport styled, { css } from 'styled-components';\n\nimport { FormVariantType } from '../../blocks/Form/Form.type';\nimport { dateLocale } from '../../constants/dateLocale';\nimport { BorderRadiusType } from '../../styles/BorderRadius';\nimport { ColorBlue, ColorDark, ColorRed } from '../../styles/Colors';\nimport { DatePickerInterface } from './DatePicker.type';\n\ninterface DatePickerStyleInterface {\n iserror?: string;\n variant?: FormVariantType;\n disabled?: boolean;\n}\n\nexport const DatePickerRsuiteStyled = styled(DatePickerRsuite)`\n width: ${({ width }: DatePickerInterface) => width};\n .rs-picker-toggle {\n ${({ variant, iserror, isDisabled }: DatePickerStyleInterface & DatePickerInterface) => {\n const borderColor = iserror\n ? ColorRed.fireEngineRed\n : isDisabled\n ? ColorDark.bermudaGray\n : ColorDark.gumbo;\n\n if (variant === 'line') {\n return css`\n border: 0px !important;\n border-bottom: 1px solid ${borderColor} !important;\n border-radius: ${BorderRadiusType.none} !important;\n `;\n } else {\n return css`\n border: 1px solid ${borderColor} !important;\n border-radius: ${BorderRadiusType.medium} !important;\n `;\n }\n }}\n }\n .rs-picker-toggle-active,\n .rs-picker.rs-picker-focused {\n ${({ variant }: DatePickerStyleInterface) => {\n if (variant === 'line') {\n return css`\n -webkit-box-shadow: 0 0 0 0;\n -webkit-box-shadow: 0 0 0 0;\n border: 0px !important;\n border-bottom: 1px solid ${ColorDark.gumbo} !important;\n border-color: ${ColorBlue.buttonBlue} !important;\n border-radius: 4px !important;\n border-radius: ${BorderRadiusType.none} !important;\n box-shadow: 0 0 0 0;\n box-shadow: 0 0 0 0;\n `;\n }\n }}\n }\n`;\n\n// FIXME: Warning: Received `false` for a non-boolean attribute `iserror`.\n// FIXME: rsuite change to pure component\nconst DatePicker = (props: DatePickerInterface) => {\n const [isOpen, setIsOpen] = useState<boolean>(false);\n const containerRef = useRef(null);\n\n const adjustDateToMax = (date: Date, maxDate: Date): Date => {\n let adjustedDate = dateFns.setMonth(\n dateFns.setYear(date, dateFns.getYear(maxDate)),\n dateFns.getMonth(maxDate)\n );\n adjustedDate = dateFns.setDate(adjustedDate, dateFns.getDate(date));\n\n if (dateFns.isAfter(adjustedDate, maxDate)) {\n adjustedDate = dateFns.subMonths(adjustedDate, 1);\n }\n\n return adjustedDate;\n };\n\n const adjustDateToMin = (date: Date, minDate: Date): Date => {\n let adjustedDate = dateFns.setMonth(\n dateFns.setYear(date, dateFns.getYear(minDate)),\n dateFns.getMonth(minDate)\n );\n adjustedDate = dateFns.setDate(adjustedDate, dateFns.getDate(date));\n if (dateFns.isBefore(adjustedDate, minDate)) {\n adjustedDate = dateFns.addMonths(adjustedDate, 1);\n }\n\n return adjustedDate;\n };\n\n const onChangeHandler = (date: Date): void => {\n const { maxDate, minDate } = props;\n let adjustedDate = date;\n\n if (maxDate && dateFns.isAfter(date, new Date(maxDate))) {\n adjustedDate = adjustDateToMax(date, new Date(maxDate));\n\n if (minDate && dateFns.isBefore(adjustedDate, new Date(minDate))) {\n return;\n }\n }\n\n if (minDate && dateFns.isBefore(date, new Date(minDate))) {\n adjustedDate = adjustDateToMin(date, new Date(minDate));\n\n if (dateFns.isBefore(adjustedDate, new Date(minDate))) {\n return;\n }\n }\n\n props.onChange(adjustedDate);\n };\n\n return (\n <div\n ref={props.isDisabledFloating ? containerRef : undefined}\n style={\n props.isDisabledFloating\n ? { position: 'relative', width: '100%' }\n : { width: props.isFullWidth ? '100%' : undefined }\n }\n >\n <DatePickerRsuiteStyled\n container={props.isDisabledFloating ? () => containerRef.current : undefined}\n // FIXME: date format on month select still with format value\n locale={dateLocale[props.language]}\n oneTap={props.isOneTap}\n disabled={props.isDisabled}\n open={props.isOpen}\n disabledDate={(date: Date) =>\n props.isDisableBefore\n ? dateFns.isBefore(date, new Date())\n : props.minDate || props.maxDate\n ? dateFns.isBefore(date, props.minDate ? new Date(props.minDate) : undefined) ||\n dateFns.isAfter(date, props.maxDate ? new Date(props.maxDate) : undefined)\n : undefined\n }\n placeholder={props.placeholder}\n data-test-id={props.dataTestId}\n value={props.value}\n onSelect={props.onSelect}\n onChange={onChangeHandler}\n defaultValue={props.defaultValue}\n format={isOpen && props.format === 'dd MMM' ? 'dd MMM yyyy' : props.format}\n ranges={props.isHideRangesOption ? [] : undefined}\n placement={props.placement}\n variant={props.variant}\n iserror={props.isError ? 'error' : undefined}\n onBlur={props.onBlur}\n width={props.isFullWidth ? '100%' : props.width}\n onOpen={() => {\n if (props.format === 'dd MMM') {\n setIsOpen(true);\n }\n }}\n onClose={() => {\n if (props.format === 'dd MMM') {\n setIsOpen(false);\n }\n }}\n cleanable={props.isCleanable}\n onClean={props.onClean}\n editable={false}\n />\n </div>\n );\n};\n\nDatePicker.prototype = {\n placeholder: PropTypes.string,\n isOneTap: PropTypes.bool,\n variant: PropTypes.string,\n isDisableBefore: PropTypes.bool,\n format: PropTypes.string,\n language: PropTypes.string,\n width: PropTypes.string,\n minDate: PropTypes.string,\n maxDate: PropTypes.string,\n isHideRangesOption: PropTypes.bool\n};\n\nDatePicker.defaultProps = {\n placeholder: 'Select Date',\n isOneTap: false,\n variant: 'box',\n isDisableBefore: false,\n format: 'dd MMMM yyyy',\n language: 'english',\n width: '200px',\n minDate: '',\n maxDate: '',\n isHideRangesOption: false,\n isCleanable: true\n};\n\nexport default DatePicker;\n"],"names":["DatePickerRsuiteStyled","styled","DatePickerRsuite","width","variant","iserror","isDisabled","borderColor","ColorRed","fireEngineRed","ColorDark","bermudaGray","gumbo","css","BorderRadiusType","none","medium","ColorBlue","buttonBlue","DatePicker","props","isOpen","setIsOpen","useState","containerRef","useRef","_jsx","ref","isDisabledFloating","undefined","style","position","isFullWidth","children","jsx","container","current","locale","dateLocale","language","oneTap","isOneTap","disabled","open","disabledDate","date","isDisableBefore","dateFns.isBefore","Date","minDate","maxDate","dateFns.isAfter","placeholder","dataTestId","value","onSelect","onChange","adjustedDate","dateFns.setMonth","dateFns.setYear","dateFns.getYear","dateFns.getMonth","dateFns.setDate","dateFns.getDate","dateFns.subMonths","adjustDateToMax","dateFns.addMonths","adjustDateToMin","defaultValue","format","ranges","isHideRangesOption","placement","isError","onBlur","onOpen","onClose","cleanable","isCleanable","onClean","editable","prototype","PropTypes.string","propTypesExports","string","PropTypes.bool","bool","defaultProps"],"mappings":"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"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { BasePreviewInterface } from './BasePreview.type';
|
|
2
|
-
declare function BasePreview({ files, isOpen, onClose, onClickDownload, containerFooterStyles, isShowPageIndicator,
|
|
2
|
+
declare function BasePreview({ files, isOpen, onClose, onClickDownload, containerFooterStyles, isShowPageIndicator, ofLabel, indicatorLabelStyles, isRotateable, 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 }: BasePreviewInterface): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default BasePreview;
|
|
@@ -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,
|
|
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,isRotateable:y=!0,iconRotateLeftContainerStyles:N,iconRotateLeftStyles:S,iconRotateLeftName:k,iconRotateRightContainerStyles:C,iconRotateRightStyles:M,iconRotateRighttName:q,iconMinusContainerStyles:O,iconMinusStyles:R,iconMinusName:B,iconPlusContainerStyles:P,iconPlusStyles:_,iconPlusName:z,iconDownloadContainerStyles:L,iconDownloadStyles:I,iconDownloadName:D,containerPrevStyles:F,iconPrevStyles:T,iconPrevName:U,containerNextStyles:$,iconNextStyles:G,iconNextName:A,containerPreviewStyles:E,iconPreviewStyles:W,iconPreviewName:H,previewLabel:V,overlayContainerStyles:J,headerContainerStyles:K,footerContainerStyles:Q,separatorStyles:X}){const[Y,Z]=l.useState(),[ee,te]=l.useState(!1),se=l.useRef(null),[re,le]=l.useState(""),[ie,ne]=l.useState(!0),[ae,oe]=l.useState(null),[ce,de]=l.useState(0),[ue,me]=l.useState(0),[fe,xe]=l.useState(1),he=l.useRef(null),ge=()=>{le("grabbing")},we=()=>{le("grab")},je=()=>{le("grab"),ne(!1)},be=()=>{le("default"),ne(!0)},pe=()=>{he.current.resetTransform(),Z(void 0),le(""),ne(!0),oe(null),de(0),xe(1),g()};l.useEffect((()=>{if(ae){const e=se.current;if(e){const t=1,s=e.getContext("2d");m.getDocument(n[0]).promise.then((r=>{r.getPage(fe).then((r=>{const l=r.getViewport({scale:t});e.width=l.width,e.height=l.height,r.render({canvasContext:s,viewport:l})}))}))}}}),[Y,ae,fe]),l.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*(){const e=new Uint8Array(t.target.result);oe(e)}));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 Z(e),n.map((e=>a.isImage(e)?"image":"document")).includes("document")&&te(!0),void de(n.length);t(),Z("document"),m.getDocument(n[0]).promise.then((e=>{const t=e.numPages;de(t)}))}}),[n,x]);const ve=e=>t.jsxs(t.Fragment,{children:[t.jsx(d.default,{label:`${fe} ${p||"of"} ${e}`,className:f.twMerge("text-light-whiteSolid text-sm font-normal",v)}),t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",X)})]});return t.jsx(t.Fragment,{children:x&&Y?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",J)}),ee?null:t.jsx(t.Fragment,{children:t.jsx(i.TransformWrapper,Object.assign({ref:he,disabled:ie,wheel:{smoothStep:.007}},{children:({zoomIn:e,zoomOut:l,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",K)},{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:V||"Preview",leftIcon:H||"arrowbackleft",leftIconStyles:f.twMerge("fill-light-whiteSolid w-4 h-4 mr-4",W),onClick:pe,className:f.twMerge("bg-transparent border-none font-semibold text-base px-2 h-8 z-30 hover:bg-transparent",E)})]}))})),t.jsx("div",Object.assign({className:"flex flex-1 items-center justify-center w-full z-20"},{children:t.jsx(h,{children:t.jsx(i.TransformComponent,{children:t.jsx("div",Object.assign({className:"flex items-center justify-center w-full h-hull",onClick:()=>{ie&&pe()}},{children:t.jsx("div",Object.assign({className:s.default("max-w-[480px] max-h-[580px] flex items-center justify-center origin-center"),onMouseDown:ge,onMouseUp:we,onMouseEnter:je,onMouseLeave:be,style:{cursor:re,transform:`rotate(${ue}deg)`}},{children:"image"===Y?t.jsx("img",{src:n[fe-1],className:"object-cover max-w-full h-auto"}):t.jsx("canvas",{ref:se,className:"w-full h-auto"},fe)}))}))})})})),(n.length>1||ce>1)&&t.jsxs(t.Fragment,{children:[1!==fe&&t.jsx("div",Object.assign({className:"absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30"},{children:t.jsx(c.default,{variant:"secondary",iconName:U||"chevronleft",iconStyles:f.twMerge("w-2 h-2",T),className:f.twMerge("",F),onClick:()=>{a(),1!==fe&&(me(0),xe(fe-1))},isDisabledRipple:!0})})),fe!==ce&&t.jsx("div",Object.assign({className:"absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30"},{children:t.jsx(c.default,{variant:"secondary",iconName:A||"chevronright",iconStyles:f.twMerge("w-2 h-2",G),className:f.twMerge("",$),onClick:()=>{a(),fe!==ce&&(me(0),xe(fe+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",Q)},{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"===Y&&ce>1&&ve(ce),"image"===Y&&n.length>1&&ve(n.length)]}),y&&t.jsxs(t.Fragment,{children:[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",N),onClick:()=>{a(),me((e=>e-90))}},{children:t.jsx(u,{name:k||"rotateLeft",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",S)})})),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",C),onClick:()=>{a(),me((e=>e+90))}},{children:t.jsx(u,{name:q||"rotateRight",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",M)})}))]})),t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",X)})]}),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",O),onClick:()=>l()},{children:t.jsx(u,{name:B||"minus",className:f.twMerge("fill-light-whiteSolid w-3 h-3",R)})})),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",P),onClick:()=>e()},{children:t.jsx(u,{name:z||"plus",className:f.twMerge("fill-light-whiteSolid w-3 h-3",_)})}))]})),t.jsx("div",{className:f.twMerge("w-[1px] h-8 bg-dark-bermudaGray mx-3",X)}),t.jsx("div",Object.assign({className:f.twMerge("flex items-center justify-center w-6 h-6 bg-dark-blackCoral rounded-full cursor-pointer",L),onClick:()=>{w?w("document"===Y?n[0]:n[fe-1]):new r({url:"document"===Y?`${n[0]}?x-request=xhr`:`${n[fe-1]}?x-request=xhr`}).catch((()=>{window.open(n[0],"_blank")}))}},{children:t.jsx(u,{name:D||"download",className:f.twMerge("fill-light-whiteSolid w-[15px] h-[15px]",I)})}))]}))]}))}))]})}))})]}))})):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 { 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,\n pageLabel,\n ofLabel,\n indicatorLabelStyles,\n isRotateable = 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(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 previewRef.current.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 const context = canvas.getContext('2d');\n pdfjs.getDocument(files[0]).promise.then((pdf) => {\n pdf.getPage(indexNum).then((page) => {\n const viewport = page.getViewport({ scale });\n canvas.width = viewport.width;\n canvas.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 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 || type === 'document') && (\n <>\n {indexNum !== 1 && (\n <div className='absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30'>\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 )}\n\n {indexNum !== totalPages && (\n <div className='absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30'>\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\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 (type === 'document' && (\n <>\n <BaseText\n label={`${pageLabel || 'Page'} ${indexNum} ${\n ofLabel || 'of'\n } ${totalPages}`}\n className={twMerge(\n 'text-light-whiteSolid text-sm font-normal',\n indicatorLabelStyles\n )}\n />\n\n <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\n </>\n ))}\n {isRotateable && (\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 <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\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 <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 </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","pageLabel","ofLabel","indicatorLabelStyles","isRotateable","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","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","_jsx","_Fragment","children","className","_jsxs","twMerge","jsx","TransformWrapper","Object","assign","ref","disabled","wheel","smoothStep","zoomIn","zoomOut","Fragment","jsxs","BaseButton","label","leftIcon","leftIconStyles","onClick","TransformComponent","classNames","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","style","cursor","transform","BaseButtonIcon","variant","iconName","iconStyles","isDisabledRipple","BaseText","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 { 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\n ofLabel,\n indicatorLabelStyles,\n isRotateable = 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(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 previewRef.current.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 const context = canvas.getContext('2d');\n pdfjs.getDocument(files[0]).promise.then((pdf) => {\n pdf.getPage(indexNum).then((page) => {\n const viewport = page.getViewport({ scale });\n canvas.width = viewport.width;\n canvas.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 <div className={twMerge('w-[1px] h-8 bg-dark-bermudaGray mx-3', separatorStyles)} />\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 {indexNum !== 1 && (\n <div className='absolute left-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30'>\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 )}\n\n {indexNum !== totalPages && (\n <div className='absolute right-2 top-[50%] translate-y-[-50%] flex flex-row items-center min-h-[40px] z-30'>\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\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 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 <div\n className={twMerge(\n 'w-[1px] h-8 bg-dark-bermudaGray mx-3',\n separatorStyles\n )}\n />\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 <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 </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","isRotateable","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","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","_jsxs","jsxs","_Fragment","Fragment","children","_jsx","BaseText","label","className","twMerge","jsx","TransformWrapper","Object","assign","ref","disabled","wheel","smoothStep","zoomIn","zoomOut","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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"}
|