@jenesei-software/jenesei-kit-react 1.3.8 → 1.3.10

package/build/{component.styles-CKLd9UoP.cjs.map → component.styles-iHE8mmya.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"component.styles-CKLd9UoP.cjs","sources":["../src/components/image-select/component.styles.ts","../src/components/image-select/component.tsx","../src/hooks/use-image-view/use.tsx"],"sourcesContent":["import { motion } from 'framer-motion'\nimport styled, { css } from 'styled-components'\n\nimport { addError } from '@local/styles/error'\nimport { addSX } from '@local/styles/sx'\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme'\n\nimport { ImageSelectWrapperProps } from '.'\n\nconst ImageSelectListGenre = css<ImageSelectWrapperProps>`\n  ${props => css`\n    background: ${props.theme.colors.imageSelect[props.$genre].background.rest};\n    color: ${props.theme.colors.imageSelect[props.$genre].color.rest};\n    &:active {\n      background: ${props.theme.colors.imageSelect[props.$genre].background.rest};\n      color: ${props.theme.colors.imageSelect[props.$genre].color.rest};\n    }\n    &:focus-visible {\n      background: ${props.theme.colors.imageSelect[props.$genre].background.rest};\n      color: ${props.theme.colors.imageSelect[props.$genre].color.rest};\n    }\n  `};\n`\n/****************************************** Size *************************************************/\nexport const ImageSelectListSize = css<ImageSelectWrapperProps>`\n  ${props => ImageSelectListSizeConstructor(KEY_SIZE_DATA[props.$size])};\n`\nexport const ImageSelectListSizeConstructor = (props: IThemeSizePropertyDefault) => css`\n  padding: ${props.padding}px;\n  border-radius: ${props.radius}px;\n`\nexport const ImageSelectSize = css<ImageSelectWrapperProps>`\n  ${props => ImageSelectSizeConstructor(KEY_SIZE_DATA[props.$size])};\n`\nexport const ImageSelectSizeConstructor = (props: IThemeSizePropertyDefault) => css`\n  gap: ${props.padding - 2}px;\n`\nexport const ImageSelectWrapper = styled.div<ImageSelectWrapperProps>`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  ${ImageSelectSize};\n  ${addError};\n  ${addSX};\n`\nexport const ImageSelectListWrapper = styled(motion.div)<ImageSelectWrapperProps>`\n  border: 2px dashed;\n\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  ${ImageSelectListGenre}\n  ${ImageSelectListSize}\n`\n","import { ImageSupportedFormatsForInput } from '@local/consts';\nimport { useImageCrop } from '@local/hooks/use-image-crop';\nimport { useImageView } from '@local/hooks/use-image-view';\nimport { ErrorMessage } from '@local/styles/error';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { motion } from 'framer-motion';\nimport { DragEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { Button } from '../button';\nimport { Image } from '../image';\nimport { Stack } from '../stack';\nimport { Typography } from '../typography';\nimport { ImageSelectItemProps, ImageSelectListWrapper, ImageSelectProps, ImageSelectWrapper } from '.';\n\nexport const ImageSelect = (props: ImageSelectProps) => {\n  const { onChange } = props;\n\n  const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size]);\n\n  const [images, setImages] = useState<ImageSelectItemProps[]>(props.images || []);\n\n  const [isDraggingOver, setIsDraggingOver] = useState(false);\n\n  const refInput = useRef<HTMLInputElement | null>(null);\n\n  const theme = useTheme();\n\n  const handleDrop = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    if (e.dataTransfer.files?.length) {\n      handleAddFilesCrop(e.dataTransfer.files);\n    }\n  };\n\n  const handleDelete = (id: number) => {\n    setImages((prev) => {\n      const finalImages = prev.filter((img) => img.id !== id);\n      onChange?.(finalImages);\n      return finalImages;\n    });\n  };\n\n  const handleOnSave = useCallback(\n    (files: ImageSelectItemProps[] | null) => {\n      if (files) {\n        setImages((prev) => {\n          const newImages = files.map((file, idx) => ({\n            ...file,\n            index: prev.length + idx,\n          }));\n          const finalImages = [...prev, ...newImages];\n          onChange?.(finalImages);\n          return finalImages;\n        });\n      }\n    },\n    [onChange],\n  );\n\n  const openFileDialog = () => {\n    refInput.current?.click();\n  };\n\n  const resetImages = () => {\n    setImages(props.defaultImages || []);\n    onChange?.(props.defaultImages || []);\n  };\n\n  const { handleAddFiles: handleAddFilesCrop } = useImageCrop({\n    onSave: handleOnSave,\n    locale: props.locale,\n    dialog: {\n      button: {\n        genre: props.propsButton.default.genre,\n        size: props.propsButton.default.size,\n      },\n      buttonDelete: {\n        genre: props.propsButton.delete.genre,\n        size: props.propsButton.delete.size,\n      },\n    },\n    imageSettings: {\n      maxSize: props.imageSettings.maxSize,\n      maxCount: props.imageSettings.maxCount - images.length,\n      aspect: props.imageSettings.aspect,\n    },\n    refInput: refInput,\n  });\n\n  const { handleAdd } = useImageView({\n    size: props.size,\n    locale: props.locale,\n    imageSettings: props.imageSettings,\n    genre: props.genre,\n  });\n\n  useEffect(() => {\n    setImages(props.images || []);\n  }, [props.images]);\n\n  return (\n    <>\n      <ImageSelectWrapper $genre={props.genre} $size={props.size} id={props.id} $sx={props.sx} $error={props.error}>\n        <ImageSelectListWrapper\n          onDrop={(e) => {\n            handleDrop(e);\n            setIsDraggingOver(false);\n          }}\n          onDragOver={(e) => e.preventDefault()}\n          onDragEnter={() => setIsDraggingOver(true)}\n          onDragLeave={() => setIsDraggingOver(false)}\n          animate={{\n            borderColor: isDraggingOver\n              ? theme.colors.imageSelect[props.genre].border.hover\n              : theme.colors.imageSelect[props.genre].border.rest,\n          }}\n          transition={{ duration: 0.3 }}\n          $genre={props.genre}\n          $size={props.size}\n        >\n          <motion.div\n            transition={{\n              layout: {\n                duration: 0.3,\n                ease: 'easeInOut',\n                type: 'spring',\n              },\n            }}\n            layout\n            style={{ display: 'flex', flexWrap: 'wrap', gap: `${size.padding - 2}px` }}\n          >\n            {images.map(\n              (img) =>\n                img.url && (\n                  <motion.div\n                    key={img.id}\n                    style={{\n                      position: 'relative',\n                      width: `${props.imageSettings.width}px`,\n                      height: `${props.imageSettings.height}px`,\n                      userSelect: 'none',\n                      overflow: 'hidden',\n                      borderRadius: `${size.radius}px`,\n                      flexGrow: 1,\n                    }}\n                    layout\n                    transition={{\n                      layout: {\n                        duration: 0.3,\n                        ease: 'easeInOut',\n                        type: 'spring',\n                      },\n                    }}\n                  >\n                    <Image\n                      sxStack={(theme) => ({\n                        default: {\n                          width: '100%',\n                          height: '100%',\n                          alignItems: 'center',\n                          justifyContent: 'center',\n                          backgroundColor: theme.palette.black10,\n                          position: 'absolute',\n                          pointerEvents: 'none',\n                        },\n                      })}\n                      isShowBeforeImage={props.isContain}\n                      sxImage={{\n                        default: {\n                          objectFit: props.isContain ? 'contain' : 'cover',\n                        },\n                      }}\n                      alt={img.name || 'image'}\n                      src={img.url}\n                      componentFallback={\n                        <Typography\n                          sx={{\n                            default: {\n                              variant: 'h6',\n                            },\n                          }}\n                        >\n                          {props.locale.imageFallback}\n                        </Typography>\n                      }\n                    />\n                    <Button\n                      sx={{\n                        default: {\n                          position: 'absolute',\n                          top: 5,\n                          right: 5,\n                        },\n                      }}\n                      genre={props.genre}\n                      size='small'\n                      icons={[\n                        {\n                          type: 'id',\n                          name: 'Close',\n                        },\n                      ]}\n                      isWidthAsHeight\n                      isHiddenBorder\n                      isRadius\n                      onClick={() => handleDelete(img.id)}\n                    />\n                    <Button\n                      sx={{\n                        default: {\n                          position: 'absolute',\n                          bottom: 5,\n                          right: 5,\n                        },\n                      }}\n                      genre={props.genre}\n                      size='small'\n                      icons={[\n                        {\n                          type: 'id',\n                          name: 'Activity',\n                        },\n                      ]}\n                      isWidthAsHeight\n                      isHiddenBorder\n                      isRadius\n                      onClick={() => img.url && handleAdd({ id: img.id, imageSrc: img.url })}\n                    />\n                  </motion.div>\n                ),\n            )}\n            {images.length === 0 ? (\n              <div\n                onClick={openFileDialog}\n                key='empty'\n                style={{\n                  position: 'relative',\n                  width: `${props.imageSettings.width}px`,\n                  height: `${props.imageSettings.height}px`,\n                  userSelect: 'none',\n                  overflow: 'hidden',\n                  borderRadius: `${size.radius}px`,\n                  flexGrow: 1,\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  textAlign: 'center',\n                  cursor: 'pointer',\n                }}\n              >\n                <Typography\n                  style={{\n                    color: theme.colors.imageSelect[props.genre].color.rest,\n                  }}\n                  sx={{\n                    default: {},\n                  }}\n                >\n                  {props.locale.dragAndDrop}\n                </Typography>\n              </div>\n            ) : null}\n          </motion.div>\n\n          <input\n            ref={refInput}\n            type='file'\n            accept={ImageSupportedFormatsForInput}\n            multiple\n            style={{ display: 'none' }}\n            onChange={(e) => {\n              if (e.target.files) handleAddFilesCrop(e.target.files);\n            }}\n          />\n        </ImageSelectListWrapper>\n        <Stack sx={{ default: { flexGrow: 1, gap: `${size.padding - 2}px` } }}>\n          <Button\n            type='button'\n            genre={props.genre}\n            size={props.size}\n            sx={{\n              default: {\n                flexGrow: 3,\n              },\n            }}\n            isRadius\n            onClick={openFileDialog}\n          >\n            {props.locale.buttonAdd}\n          </Button>\n          <Button\n            isRadius\n            type='button'\n            sx={{\n              default: {\n                flexGrow: 1,\n              },\n            }}\n            onClick={resetImages}\n            genre={props.genre}\n            size={props.size}\n          >\n            {props.locale.buttonReset}\n          </Button>\n        </Stack>\n      </ImageSelectWrapper>\n      {props?.error ? <ErrorMessage {...props.error} size={props?.error.size ?? props.size} /> : null}\n    </>\n  );\n};\n","import { Button } from '@local/components/button'\nimport { Image } from '@local/components/image'\nimport { SliderImageProps } from '@local/components/image-slider'\nimport { Stack } from '@local/components/stack'\nimport { Typography } from '@local/components/typography'\nimport { useDialog } from '@local/contexts/context-dialog'\nimport { KEY_SIZE_DATA } from '@local/theme'\n\nimport { useCallback, useMemo } from 'react'\n\nimport { useImageViewProps } from '.'\n\nexport const useImageView = (props: useImageViewProps) => {\n  const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size])\n  const br = useMemo(() => `${size.radius}px`, [size.radius])\n\n  const { add } = useDialog<{\n    br?: string\n  }>({\n    br: br,\n    propsDialog: {\n      borderRadius: br,\n      padding: '0',\n      background: 'whiteStandard'\n    }\n  })\n  const handleAdd = useCallback(\n    (image: SliderImageProps) => {\n      add({\n        content: (params, remove) => (\n          <Stack\n            sx={{\n              default: {\n                position: 'relative',\n                overflow: 'hidden',\n                aspectRatio: `${props.imageSettings.aspect * 2} / 2`,\n                width: 'auto',\n                maxWidth: '70dvw',\n                height: '85dvh',\n                borderRadius: params?.br\n              },\n              tablet: {\n                maxWidth: '95dvw'\n              }\n            }}\n          >\n            <Image\n              sxStack={theme => ({\n                default: {\n                  width: '100%',\n                  height: '100%',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  backgroundColor: theme.palette.black10,\n                  position: 'absolute',\n                  pointerEvents: 'none'\n                }\n              })}\n              isShowBeforeImage\n              sxImage={{\n                default: {\n                  objectFit: 'contain'\n                }\n              }}\n              alt={image?.imageSrc}\n              src={image?.imageSrc}\n              componentFallback={\n                <Typography\n                  sx={{\n                    default: {\n                      variant: 'h6'\n                    }\n                  }}\n                >\n                  {props.locale.imageFallback}\n                </Typography>\n              }\n            />\n            <Button\n              sx={{\n                default: {\n                  position: 'absolute',\n                  bottom: 15,\n                  right: 15\n                }\n              }}\n              genre=\"realebail-white\"\n              size=\"small\"\n              icons={[\n                {\n                  type: 'id',\n                  name: 'Arrow4'\n                }\n              ]}\n              isWidthAsHeight\n              isHiddenBorder\n              isRadius\n              onClick={() => remove?.()}\n            />\n          </Stack>\n        )\n      })\n    },\n    [add, props.imageSettings.aspect, props.locale.imageFallback]\n  )\n  return { handleAdd }\n}\n"],"names":["ImageSelectListGenre","css","props","theme","colors","imageSelect","$genre","background","rest","color","ImageSelectListSize","ImageSelectListSizeConstructor","KEY_SIZE_DATA","$size","padding","radius","ImageSelectSize","ImageSelectSizeConstructor","ImageSelectWrapper","styled","div","addError","addSX","ImageSelectListWrapper","motion","onChange","size","useMemo","images","setImages","useState","isDraggingOver","setIsDraggingOver","refInput","useRef","useTheme","handleOnSave","useCallback","files","prev","newImages","map","file","idx","index","length","finalImages","openFileDialog","_a","current","click","handleAddFiles","handleAddFilesCrop","useImageCrop","onSave","locale","dialog","button","genre","propsButton","default","buttonDelete","delete","imageSettings","maxSize","maxCount","aspect","handleAdd","br","add","useDialog","propsDialog","borderRadius","image","content","params","remove","jsxs","Stack","sx","position","overflow","aspectRatio","width","maxWidth","height","tablet","children","jsx","Image","sxStack","alignItems","justifyContent","backgroundColor","palette","black10","pointerEvents","isShowBeforeImage","sxImage","objectFit","alt","imageSrc","src","componentFallback","Typography","variant","imageFallback","Button","bottom","right","icons","type","name","isWidthAsHeight","isHiddenBorder","isRadius","onClick","useImageView","useEffect","Fragment","id","$sx","$error","error","onDrop","e","preventDefault","dataTransfer","handleDrop","onDragOver","onDragEnter","onDragLeave","animate","borderColor","border","hover","transition","duration","layout","ease","style","display","flexWrap","gap","img","url","userSelect","flexGrow","isContain","top","handleDelete","filter","textAlign","cursor","dragAndDrop","ref","accept","ImageSupportedFormatsForInput","multiple","target","buttonAdd","defaultImages","buttonReset","ErrorMessage"],"mappings":"+fASMA,EAAuBC,EAAAA,GAAAA;IACzBC,GAASD,EAAAA,GAAAA;kBACKC,EAAMC,MAAMC,OAAOC,YAAYH,EAAMI,QAAQC,WAAWC;aAC7DN,EAAMC,MAAMC,OAAOC,YAAYH,EAAMI,QAAQG,MAAMD;;oBAE5CN,EAAMC,MAAMC,OAAOC,YAAYH,EAAMI,QAAQC,WAAWC;eAC7DN,EAAMC,MAAMC,OAAOC,YAAYH,EAAMI,QAAQG,MAAMD;;;oBAG9CN,EAAMC,MAAMC,OAAOC,YAAYH,EAAMI,QAAQC,WAAWC;eAC7DN,EAAMC,MAAMC,OAAOC,YAAYH,EAAMI,QAAQG,MAAMD;;;EAKrDE,EAAsBT,EAAAA,GAAAA;OACtBU,EAA+BC,EAAAA,cAAcV,EAAMW;EAEnDF,EAAkCT,GAAqCD,EAAAA,GAAAA;aACvEC,EAAMY;mBACAZ,EAAMa;EAEZC,EAAkBf,EAAAA,GAAAA;OAClBgB,EAA2BL,EAAAA,cAAcV,EAAMW;EAE/CI,EAA8Bf,GAAqCD,EAAAA,GAAAA;SACvEC,EAAMY,QAAU;EAEZI,EAAqBC,EAAOC,GAAA;;;;IAIrCJ;IACAK;IACAC;EAESC,EAAyBJ,EAAOK,EAAAA,OAAOJ,IAAG;;;;;;IAMnDpB;IACAU;sBCpCwBR,IAC1B,MAAMuB,SAAEA,GAAavB,EAEfwB,EAAOC,UAAQ,IAAMf,gBAAcV,EAAMwB,MAAO,CAACxB,EAAMwB,QAEtDE,EAAQC,GAAaC,EAAAA,SAAiC5B,EAAM0B,QAAU,KAEtEG,EAAgBC,GAAqBF,EAAAA,UAAS,GAE/CG,EAAWC,EAAAA,OAAgC,MAE3C/B,EAAQgC,EAAAA,WAiBRC,EAAeC,EAAAA,YAClBC,IACKA,GACFT,EAAWU,IACT,MAAMC,EAAYF,EAAMG,IAAI,CAACC,EAAMC,KAAA,IAC9BD,EACHE,MAAOL,EAAKM,OAASF,KAEjBG,EAAc,IAAIP,KAASC,GAEjC,OADA,MAAAf,GAAAA,EAAWqB,GACJA,KAIb,CAACrB,IAGGsB,EAAiB,WACrB,OAAAC,EAAAf,EAASgB,UAATD,EAAkBE,UAQZC,eAAgBC,GAAuBC,eAAa,CAC1DC,OAAQlB,EACRmB,OAAQrD,EAAMqD,OACdC,OAAQ,CACNC,OAAQ,CACNC,MAAOxD,EAAMyD,YAAYC,QAAQF,MACjChC,KAAMxB,EAAMyD,YAAYC,QAAQlC,MAElCmC,aAAc,CACZH,MAAOxD,EAAMyD,YAAYG,OAAOJ,MAChChC,KAAMxB,EAAMyD,YAAYG,OAAOpC,OAGnCqC,cAAe,CACbC,QAAS9D,EAAM6D,cAAcC,QAC7BC,SAAU/D,EAAM6D,cAAcE,SAAWrC,EAAOiB,OAChDqB,OAAQhE,EAAM6D,cAAcG,QAE9BjC,cAGIkC,UAAEA,GC/EkB,CAACjE,IAC3B,MAAMwB,EAAOC,UAAQ,IAAMf,gBAAcV,EAAMwB,MAAO,CAACxB,EAAMwB,OACvD0C,EAAKzC,EAAAA,QAAQ,IAAM,GAAGD,EAAKX,WAAY,CAACW,EAAKX,UAE7CsD,IAAEA,GAAQC,YAEb,CACDF,KACAG,YAAa,CACXC,aAAcJ,EACdtD,QAAS,IACTP,WAAY,mBAkFhB,MAAO,CAAE4D,UA/ES9B,EAAAA,YACfoC,IACCJ,EAAI,CACFK,QAAS,CAACC,EAAQC,MAChBC,kBAAAA,KAACC,EAAAA,MAAA,CACCC,GAAI,CACFnB,QAAS,CACPoB,SAAU,WACVC,SAAU,SACVC,YAA6C,EAA7BhF,EAAM6D,cAAcG,OAAvB,OACbiB,MAAO,OACPC,SAAU,QACVC,OAAQ,QACRb,aAAc,MAAAG,OAAA,EAAAA,EAAQP,IAExBkB,OAAQ,CACNF,SAAU,UAIdG,SAAA,GAAAC,kBAAAA,IAACC,EAAAA,MAAA,CACCC,QAASvF,IAAA,CACPyD,QAAS,CACPuB,MAAO,OACPE,OAAQ,OACRM,WAAY,SACZC,eAAgB,SAChBC,gBAAiB1F,EAAM2F,QAAQC,QAC/Bf,SAAU,WACVgB,cAAe,UAGnBC,mBAAiB,EACjBC,QAAS,CACPtC,QAAS,CACPuC,UAAW,YAGfC,IAAK,MAAA3B,OAAA,EAAAA,EAAO4B,SACZC,IAAK,MAAA7B,OAAA,EAAAA,EAAO4B,SACZE,oBACEf,kBAAAA,IAACgB,EAAAA,WAAA,CACCzB,GAAI,CACFnB,QAAS,CACP6C,QAAS,OAIZlB,WAAMhC,OAAOmD,oBAIpBlB,kBAAAA,IAACmB,EAAAA,OAAA,CACC5B,GAAI,CACFnB,QAAS,CACPoB,SAAU,WACV4B,OAAQ,GACRC,MAAO,KAGXnD,MAAM,kBACNhC,KAAK,QACLoF,MAAO,CACL,CACEC,KAAM,KACNC,KAAM,WAGVC,iBAAe,EACfC,gBAAc,EACdC,UAAQ,EACRC,QAAS,IAAM,MAAAxC,OAAA,EAAAA,YAMzB,CAACP,EAAKnE,EAAM6D,cAAcG,OAAQhE,EAAMqD,OAAOmD,kBDZ3BW,CAAa,CACjC3F,KAAMxB,EAAMwB,KACZ6B,OAAQrD,EAAMqD,OACdQ,cAAe7D,EAAM6D,cACrBL,MAAOxD,EAAMwD,QAOf,OAJA4D,EAAAA,UAAU,KACRzF,EAAU3B,EAAM0B,QAAU,KACzB,CAAC1B,EAAM0B,WAGRiD,kBAAAA,KAAA0C,6BAAA,CACEhC,SAAA,CAAAV,yBAAC3D,EAAA,CAAmBZ,OAAQJ,EAAMwD,MAAO7C,MAAOX,EAAMwB,KAAM8F,GAAItH,EAAMsH,GAAIC,IAAKvH,EAAM6E,GAAI2C,OAAQxH,EAAMyH,MACrGpC,SAAA,GAAAV,kBAAAA,KAACtD,EAAA,CACCqG,OAASC,IA7EE,CAACA,UAClBA,EAAEC,kBACE,OAAA9E,EAAA6E,EAAEE,aAAazF,YAAf,EAAAU,EAAsBH,SACxBO,EAAmByE,EAAEE,aAAazF,QA2E5B0F,CAAWH,GACX7F,GAAkB,IAEpBiG,WAAaJ,GAAMA,EAAEC,iBACrBI,YAAa,IAAMlG,GAAkB,GACrCmG,YAAa,IAAMnG,GAAkB,GACrCoG,QAAS,CACPC,YAAatG,EACT5B,EAAMC,OAAOC,YAAYH,EAAMwD,OAAO4E,OAAOC,MAC7CpI,EAAMC,OAAOC,YAAYH,EAAMwD,OAAO4E,OAAO9H,MAEnDgI,WAAY,CAAEC,SAAU,IACxBnI,OAAQJ,EAAMwD,MACd7C,MAAOX,EAAMwB,KAEb6D,SAAA,GAAAV,kBAAAA,KAACrD,EAAAA,OAAOJ,IAAP,CACCoH,WAAY,CACVE,OAAQ,CACND,SAAU,GACVE,KAAM,YACN5B,KAAM,WAGV2B,QAAM,EACNE,MAAO,CAAEC,QAAS,OAAQC,SAAU,OAAQC,IAAQrH,EAAKZ,QAAU,EAAlB,MAEhDyE,SAAA,CAAA3D,EAAOa,IACLuG,GACCA,EAAIC,OACFpE,kBAAAA,KAACrD,EAAAA,OAAOJ,IAAP,CAECwH,MAAO,CACL5D,SAAU,WACVG,MAAO,GAAGjF,EAAM6D,cAAcoB,UAC9BE,OAAQ,GAAGnF,EAAM6D,cAAcsB,WAC/B6D,WAAY,OACZjE,SAAU,SACVT,aAAc,GAAG9C,EAAKX,WACtBoI,SAAU,GAEZT,QAAM,EACNF,WAAY,CACVE,OAAQ,CACND,SAAU,GACVE,KAAM,YACN5B,KAAM,WAIVxB,SAAA,GAAAC,kBAAAA,IAACC,EAAAA,MAAA,CACCC,QAAUvF,IAAAA,CACRyD,QAAS,CACPuB,MAAO,OACPE,OAAQ,OACRM,WAAY,SACZC,eAAgB,SAChBC,gBAAiB1F,EAAM2F,QAAQC,QAC/Bf,SAAU,WACVgB,cAAe,UAGnBC,kBAAmB/F,EAAMkJ,UACzBlD,QAAS,CACPtC,QAAS,CACPuC,UAAWjG,EAAMkJ,UAAY,UAAY,UAG7ChD,IAAK4C,EAAIhC,MAAQ,QACjBV,IAAK0C,EAAIC,IACT1C,oBACEf,kBAAAA,IAACgB,EAAAA,WAAA,CACCzB,GAAI,CACFnB,QAAS,CACP6C,QAAS,OAIZlB,WAAMhC,OAAOmD,oBAIpBlB,kBAAAA,IAACmB,EAAAA,OAAA,CACC5B,GAAI,CACFnB,QAAS,CACPoB,SAAU,WACVqE,IAAK,EACLxC,MAAO,IAGXnD,MAAOxD,EAAMwD,MACbhC,KAAK,QACLoF,MAAO,CACL,CACEC,KAAM,KACNC,KAAM,UAGVC,iBAAe,EACfC,gBAAc,EACdC,UAAQ,EACRC,QAAS,KAAMkC,OA3Kb9B,EA2K0BwB,EAAIxB,QA1KlD3F,EAAWU,IACT,MAAMO,EAAcP,EAAKgH,OAAQP,GAAQA,EAAIxB,KAAOA,GAEpD,OADA,MAAA/F,GAAAA,EAAWqB,GACJA,IAJU,IAAC0E,OA6KJhC,kBAAAA,IAACmB,EAAAA,OAAA,CACC5B,GAAI,CACFnB,QAAS,CACPoB,SAAU,WACV4B,OAAQ,EACRC,MAAO,IAGXnD,MAAOxD,EAAMwD,MACbhC,KAAK,QACLoF,MAAO,CACL,CACEC,KAAM,KACNC,KAAM,aAGVC,iBAAe,EACfC,gBAAc,EACdC,UAAQ,EACRC,QAAS,IAAM4B,EAAIC,KAAO9E,EAAU,CAAEqD,GAAIwB,EAAIxB,GAAInB,SAAU2C,EAAIC,UA3F7DD,EAAIxB,KAgGE,IAAlB5F,EAAOiB,OACN2C,EAAAA,kBAAAA,IAAC,MAAA,CACC4B,QAASrE,EAET6F,MAAO,CACL5D,SAAU,WACVG,MAAO,GAAGjF,EAAM6D,cAAcoB,UAC9BE,OAAQ,GAAGnF,EAAM6D,cAAcsB,WAC/B6D,WAAY,OACZjE,SAAU,SACVT,aAAc,GAAG9C,EAAKX,WACtBoI,SAAU,EACVN,QAAS,OACTlD,WAAY,SACZC,eAAgB,SAChB4D,UAAW,SACXC,OAAQ,WAGVlE,WAAAC,kBAAAA,IAACgB,EAAAA,WAAA,CACCoC,MAAO,CACLnI,MAAON,EAAMC,OAAOC,YAAYH,EAAMwD,OAAOjD,MAAMD,MAErDuE,GAAI,CACFnB,QAAS,CAAA,GAGV2B,WAAMhC,OAAOmG,eAxBZ,SA2BJ,UAGNlE,kBAAAA,IAAC,QAAA,CACCmE,IAAK1H,EACL8E,KAAK,OACL6C,OAAQC,EAAAA,8BACRC,UAAQ,EACRlB,MAAO,CAAEC,QAAS,QAClBpH,SAAWoG,IACLA,EAAEkC,OAAOzH,OAAOc,EAAmByE,EAAEkC,OAAOzH,aAItDuC,EAAAA,kBAAAA,KAACC,EAAAA,MAAA,CAAMC,GAAI,CAAEnB,QAAS,CAAEuF,SAAU,EAAGJ,IAAQrH,EAAKZ,QAAU,EAAlB,OACxCyE,SAAA,GAAAC,kBAAAA,IAACmB,EAAAA,OAAA,CACCI,KAAK,SACLrD,MAAOxD,EAAMwD,MACbhC,KAAMxB,EAAMwB,KACZqD,GAAI,CACFnB,QAAS,CACPuF,SAAU,IAGdhC,UAAQ,EACRC,QAASrE,EAERwC,WAAMhC,OAAOyG,cAEhBxE,kBAAAA,IAACmB,EAAAA,OAAA,CACCQ,UAAQ,EACRJ,KAAK,SACLhC,GAAI,CACFnB,QAAS,CACPuF,SAAU,IAGd/B,QA3OU,KAClBvF,EAAU3B,EAAM+J,eAAiB,IACjC,MAAAxI,GAAAA,EAAWvB,EAAM+J,eAAiB,KA0O1BvG,MAAOxD,EAAMwD,MACbhC,KAAMxB,EAAMwB,KAEX6D,WAAMhC,OAAO2G,2BAInBhK,WAAOyH,OAAQnC,EAAAA,kBAAAA,IAAC2E,EAAAA,aAAA,IAAiBjK,EAAMyH,MAAOjG,MAAM,MAAAxB,OAAA,EAAAA,EAAOyH,MAAMjG,OAAQxB,EAAMwB,OAAW"}
+{"version":3,"file":"component.styles-iHE8mmya.cjs","sources":["../src/components/image-select/component.styles.ts","../src/components/image-select/component.tsx","../src/hooks/use-image-view/use.tsx"],"sourcesContent":["import { motion } from 'framer-motion'\nimport styled, { css } from 'styled-components'\n\nimport { addError } from '@local/styles/error'\nimport { addSX } from '@local/styles/sx'\nimport { IThemeSizePropertyDefault, KEY_SIZE_DATA } from '@local/theme'\n\nimport { ImageSelectWrapperProps } from '.'\n\nconst ImageSelectListGenre = css<ImageSelectWrapperProps>`\n  ${props => css`\n    background: ${props.theme.colors.imageSelect[props.$genre].background.rest};\n    color: ${props.theme.colors.imageSelect[props.$genre].color.rest};\n    &:active {\n      background: ${props.theme.colors.imageSelect[props.$genre].background.rest};\n      color: ${props.theme.colors.imageSelect[props.$genre].color.rest};\n    }\n    &:focus-visible {\n      background: ${props.theme.colors.imageSelect[props.$genre].background.rest};\n      color: ${props.theme.colors.imageSelect[props.$genre].color.rest};\n    }\n  `};\n`\n/****************************************** Size *************************************************/\nexport const ImageSelectListSize = css<ImageSelectWrapperProps>`\n  ${props => ImageSelectListSizeConstructor(KEY_SIZE_DATA[props.$size])};\n`\nexport const ImageSelectListSizeConstructor = (props: IThemeSizePropertyDefault) => css`\n  padding: ${props.padding}px;\n  border-radius: ${props.radius}px;\n`\nexport const ImageSelectSize = css<ImageSelectWrapperProps>`\n  ${props => ImageSelectSizeConstructor(KEY_SIZE_DATA[props.$size])};\n`\nexport const ImageSelectSizeConstructor = (props: IThemeSizePropertyDefault) => css`\n  gap: ${props.padding - 2}px;\n`\nexport const ImageSelectWrapper = styled.div<ImageSelectWrapperProps>`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  ${ImageSelectSize};\n  ${addError};\n  ${addSX};\n`\nexport const ImageSelectListWrapper = styled(motion.div)<ImageSelectWrapperProps>`\n  border: 2px dashed;\n\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  ${ImageSelectListGenre}\n  ${ImageSelectListSize}\n`\n","import { ImageSupportedFormatsForInput } from '@local/consts';\nimport { useImageCrop } from '@local/hooks/use-image-crop';\nimport { useImageView } from '@local/hooks/use-image-view';\nimport { ErrorMessage } from '@local/styles/error';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { motion } from 'framer-motion';\nimport { DragEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { Button } from '../button';\nimport { Image } from '../image';\nimport { Stack } from '../stack';\nimport { Typography } from '../typography';\nimport { ImageSelectItemProps, ImageSelectListWrapper, ImageSelectProps, ImageSelectWrapper } from '.';\n\nexport const ImageSelect = (props: ImageSelectProps) => {\n  const { onChange } = props;\n\n  const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size]);\n\n  const [images, setImages] = useState<ImageSelectItemProps[]>(props.images || []);\n\n  const [isDraggingOver, setIsDraggingOver] = useState(false);\n\n  const refInput = useRef<HTMLInputElement | null>(null);\n\n  const theme = useTheme();\n\n  const handleDrop = (e: DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n    if (e.dataTransfer.files?.length) {\n      handleAddFilesCrop(e.dataTransfer.files);\n    }\n  };\n\n  const handleDelete = (id: number) => {\n    setImages((prev) => {\n      const finalImages = prev.filter((img) => img.id !== id);\n      onChange?.(finalImages);\n      return finalImages;\n    });\n  };\n\n  const handleOnSave = useCallback(\n    (files: ImageSelectItemProps[] | null) => {\n      if (files) {\n        setImages((prev) => {\n          const newImages = files.map((file, idx) => ({\n            ...file,\n            index: prev.length + idx,\n          }));\n          const finalImages = [...prev, ...newImages];\n          onChange?.(finalImages);\n          return finalImages;\n        });\n      }\n    },\n    [onChange],\n  );\n\n  const openFileDialog = () => {\n    refInput.current?.click();\n  };\n\n  const resetImages = () => {\n    setImages(props.defaultImages || []);\n    onChange?.(props.defaultImages || []);\n  };\n\n  const { handleAddFiles: handleAddFilesCrop } = useImageCrop({\n    onSave: handleOnSave,\n    locale: props.locale,\n    dialog: {\n      button: {\n        genre: props.propsButton.default.genre,\n        size: props.propsButton.default.size,\n      },\n      buttonDelete: {\n        genre: props.propsButton.delete.genre,\n        size: props.propsButton.delete.size,\n      },\n    },\n    imageSettings: {\n      maxSize: props.imageSettings.maxSize,\n      maxCount: props.imageSettings.maxCount - images.length,\n      aspect: props.imageSettings.aspect,\n    },\n    refInput: refInput,\n  });\n\n  const { handleAdd } = useImageView({\n    size: props.size,\n    locale: props.locale,\n    imageSettings: props.imageSettings,\n    genre: props.genre,\n  });\n\n  useEffect(() => {\n    setImages(props.images || []);\n  }, [props.images]);\n\n  return (\n    <>\n      <ImageSelectWrapper $genre={props.genre} $size={props.size} id={props.id} $sx={props.sx} $error={props.error}>\n        <ImageSelectListWrapper\n          onDrop={(e) => {\n            handleDrop(e);\n            setIsDraggingOver(false);\n          }}\n          onDragOver={(e) => e.preventDefault()}\n          onDragEnter={() => setIsDraggingOver(true)}\n          onDragLeave={() => setIsDraggingOver(false)}\n          animate={{\n            borderColor: isDraggingOver\n              ? theme.colors.imageSelect[props.genre].border.hover\n              : theme.colors.imageSelect[props.genre].border.rest,\n          }}\n          transition={{ duration: 0.3 }}\n          $genre={props.genre}\n          $size={props.size}\n        >\n          <motion.div\n            transition={{\n              layout: {\n                duration: 0.3,\n                ease: 'easeInOut',\n                type: 'spring',\n              },\n            }}\n            layout\n            style={{ display: 'flex', flexWrap: 'wrap', gap: `${size.padding - 2}px` }}\n          >\n            {images.map(\n              (img) =>\n                img.url && (\n                  <motion.div\n                    key={img.id}\n                    style={{\n                      position: 'relative',\n                      width: `${props.imageSettings.width}px`,\n                      height: `${props.imageSettings.height}px`,\n                      userSelect: 'none',\n                      overflow: 'hidden',\n                      borderRadius: `${size.radius}px`,\n                      flexGrow: 1,\n                    }}\n                    layout\n                    transition={{\n                      layout: {\n                        duration: 0.3,\n                        ease: 'easeInOut',\n                        type: 'spring',\n                      },\n                    }}\n                  >\n                    <Image\n                      sxStack={(theme) => ({\n                        default: {\n                          width: '100%',\n                          height: '100%',\n                          alignItems: 'center',\n                          justifyContent: 'center',\n                          backgroundColor: theme.palette.black10,\n                          position: 'absolute',\n                          pointerEvents: 'none',\n                        },\n                      })}\n                      isShowBeforeImage={props.isContain}\n                      sxImage={{\n                        default: {\n                          objectFit: props.isContain ? 'contain' : 'cover',\n                        },\n                      }}\n                      alt={img.name || 'image'}\n                      src={img.url}\n                      componentFallback={\n                        <Typography\n                          sx={{\n                            default: {\n                              variant: 'h6',\n                            },\n                          }}\n                        >\n                          {props.locale.imageFallback}\n                        </Typography>\n                      }\n                    />\n                    <Button\n                      sx={{\n                        default: {\n                          position: 'absolute',\n                          top: 5,\n                          right: 5,\n                        },\n                      }}\n                      genre={props.genre}\n                      size='small'\n                      icons={[\n                        {\n                          type: 'id',\n                          name: 'Close',\n                        },\n                      ]}\n                      isWidthAsHeight\n                      isHiddenBorder\n                      isRadius\n                      onClick={() => handleDelete(img.id)}\n                    />\n                    <Button\n                      sx={{\n                        default: {\n                          position: 'absolute',\n                          bottom: 5,\n                          right: 5,\n                        },\n                      }}\n                      genre={props.genre}\n                      size='small'\n                      icons={[\n                        {\n                          type: 'id',\n                          name: 'Activity',\n                        },\n                      ]}\n                      isWidthAsHeight\n                      isHiddenBorder\n                      isRadius\n                      onClick={() => img.url && handleAdd({ id: img.id, imageSrc: img.url })}\n                    />\n                  </motion.div>\n                ),\n            )}\n            {images.length === 0 ? (\n              <div\n                onClick={openFileDialog}\n                key='empty'\n                style={{\n                  position: 'relative',\n                  width: `${props.imageSettings.width}px`,\n                  height: `${props.imageSettings.height}px`,\n                  userSelect: 'none',\n                  overflow: 'hidden',\n                  borderRadius: `${size.radius}px`,\n                  flexGrow: 1,\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  textAlign: 'center',\n                  cursor: 'pointer',\n                }}\n              >\n                <Typography\n                  style={{\n                    color: theme.colors.imageSelect[props.genre].color.rest,\n                  }}\n                  sx={{\n                    default: {},\n                  }}\n                >\n                  {props.locale.dragAndDrop}\n                </Typography>\n              </div>\n            ) : null}\n          </motion.div>\n\n          <input\n            ref={refInput}\n            type='file'\n            accept={ImageSupportedFormatsForInput}\n            multiple\n            style={{ display: 'none' }}\n            onChange={(e) => {\n              if (e.target.files) handleAddFilesCrop(e.target.files);\n            }}\n          />\n        </ImageSelectListWrapper>\n        <Stack sx={{ default: { flexGrow: 1, gap: `${size.padding - 2}px` } }}>\n          <Button\n            type='button'\n            genre={props.genre}\n            size={props.size}\n            sx={{\n              default: {\n                flexGrow: 3,\n              },\n            }}\n            isRadius\n            onClick={openFileDialog}\n          >\n            {props.locale.buttonAdd}\n          </Button>\n          <Button\n            isRadius\n            type='button'\n            sx={{\n              default: {\n                flexGrow: 1,\n              },\n            }}\n            onClick={resetImages}\n            genre={props.genre}\n            size={props.size}\n          >\n            {props.locale.buttonReset}\n          </Button>\n        </Stack>\n      </ImageSelectWrapper>\n      {props?.error ? (\n        <ErrorMessage\n          {...props.error}\n          size={props?.error.size ?? props.size}\n          font={{\n            size: 12,\n            weight: 400,\n            family: theme.font.family,\n          }}\n        />\n      ) : null}\n    </>\n  );\n};\n","import { Button } from '@local/components/button'\nimport { Image } from '@local/components/image'\nimport { SliderImageProps } from '@local/components/image-slider'\nimport { Stack } from '@local/components/stack'\nimport { Typography } from '@local/components/typography'\nimport { useDialog } from '@local/contexts/context-dialog'\nimport { KEY_SIZE_DATA } from '@local/theme'\n\nimport { useCallback, useMemo } from 'react'\n\nimport { useImageViewProps } from '.'\n\nexport const useImageView = (props: useImageViewProps) => {\n  const size = useMemo(() => KEY_SIZE_DATA[props.size], [props.size])\n  const br = useMemo(() => `${size.radius}px`, [size.radius])\n\n  const { add } = useDialog<{\n    br?: string\n  }>({\n    br: br,\n    propsDialog: {\n      borderRadius: br,\n      padding: '0',\n      background: 'whiteStandard'\n    }\n  })\n  const handleAdd = useCallback(\n    (image: SliderImageProps) => {\n      add({\n        content: (params, remove) => (\n          <Stack\n            sx={{\n              default: {\n                position: 'relative',\n                overflow: 'hidden',\n                aspectRatio: `${props.imageSettings.aspect * 2} / 2`,\n                width: 'auto',\n                maxWidth: '70dvw',\n                height: '85dvh',\n                borderRadius: params?.br\n              },\n              tablet: {\n                maxWidth: '95dvw'\n              }\n            }}\n          >\n            <Image\n              sxStack={theme => ({\n                default: {\n                  width: '100%',\n                  height: '100%',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  backgroundColor: theme.palette.black10,\n                  position: 'absolute',\n                  pointerEvents: 'none'\n                }\n              })}\n              isShowBeforeImage\n              sxImage={{\n                default: {\n                  objectFit: 'contain'\n                }\n              }}\n              alt={image?.imageSrc}\n              src={image?.imageSrc}\n              componentFallback={\n                <Typography\n                  sx={{\n                    default: {\n                      variant: 'h6'\n                    }\n                  }}\n                >\n                  {props.locale.imageFallback}\n                </Typography>\n              }\n            />\n            <Button\n              sx={{\n                default: {\n                  position: 'absolute',\n                  bottom: 15,\n                  right: 15\n                }\n              }}\n              genre=\"realebail-white\"\n              size=\"small\"\n              icons={[\n                {\n                  type: 'id',\n                  name: 'Arrow4'\n                }\n              ]}\n              isWidthAsHeight\n              isHiddenBorder\n              isRadius\n              onClick={() => remove?.()}\n            />\n          </Stack>\n        )\n      })\n    },\n    [add, props.imageSettings.aspect, props.locale.imageFallback]\n  )\n  return { handleAdd }\n}\n"],"names":["ImageSelectListGenre","css","props","theme","colors","imageSelect","$genre","background","rest","color","ImageSelectListSize","ImageSelectListSizeConstructor","KEY_SIZE_DATA","$size","padding","radius","ImageSelectSize","ImageSelectSizeConstructor","ImageSelectWrapper","styled","div","addError","addSX","ImageSelectListWrapper","motion","onChange","size","useMemo","images","setImages","useState","isDraggingOver","setIsDraggingOver","refInput","useRef","useTheme","handleOnSave","useCallback","files","prev","newImages","map","file","idx","index","length","finalImages","openFileDialog","_a","current","click","handleAddFiles","handleAddFilesCrop","useImageCrop","onSave","locale","dialog","button","genre","propsButton","default","buttonDelete","delete","imageSettings","maxSize","maxCount","aspect","handleAdd","br","add","useDialog","propsDialog","borderRadius","image","content","params","remove","jsxs","Stack","sx","position","overflow","aspectRatio","width","maxWidth","height","tablet","children","jsx","Image","sxStack","alignItems","justifyContent","backgroundColor","palette","black10","pointerEvents","isShowBeforeImage","sxImage","objectFit","alt","imageSrc","src","componentFallback","Typography","variant","imageFallback","Button","bottom","right","icons","type","name","isWidthAsHeight","isHiddenBorder","isRadius","onClick","useImageView","useEffect","Fragment","id","$sx","$error","error","onDrop","e","preventDefault","dataTransfer","handleDrop","onDragOver","onDragEnter","onDragLeave","animate","borderColor","border","hover","transition","duration","layout","ease","style","display","flexWrap","gap","img","url","userSelect","flexGrow","isContain","top","handleDelete","filter","textAlign","cursor","dragAndDrop","ref","accept","ImageSupportedFormatsForInput","multiple","target","buttonAdd","defaultImages","buttonReset","ErrorMessage","font","weight","family"],"mappings":"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"}

package/build/component.styles-mhkAuWyU.cjs

@@ -0,0 +1,225 @@
+"use strict";const e=require("./jsx-runtime-BcGej2Kr.cjs"),o=require("./consts.cjs.js"),t=require("./style-D3Lbn1EL.cjs"),s=require("./theme.global-CcoD5bPP.cjs"),r=require("./floating-ui.react--v70Xky9.cjs"),i=require("@tanstack/react-virtual"),l=require("moment"),n=require("react"),a=require("styled-components"),c=require("./component-B1bvPlyB.cjs"),u=require("./component.styles-BKnUDWqO.cjs"),d=require("./component-C67KboOB.cjs"),p=require("./style-Df37KnoJ.cjs"),h=require("./style-fRZ6xrVp.cjs"),$=require("framer-motion"),g=require("./component.styles-CsB9986a.cjs"),x=e=>`+${e} more`,m=e=>`Add "${e}" option`,S=o=>{var l;const p=n.useMemo(()=>s.KEY_SIZE_DATA[o.size].height,[o.size]),h=n.useMemo(()=>s.KEY_SIZE_DATA[o.size].padding,[o.size]),$=n.useMemo(()=>s.KEY_SIZE_DATA[o.size].radius,[o.size]),{isOpen:g,close:S,open:b,refReference:w,refFloating:C,floatingStyles:z,toggle:j}=d.usePopover({placement:"bottom-start",offset:h,mode:"independence",isClickOutside:!0,isWidthAsContent:!0,isDisabled:null==o?void 0:o.isDisabled,onBlur:o.onBlur,onFocus:o.onFocus}),D=n.useRef(null),O=n.useRef(null),R=r.useMergeRefs([o.refReference,w]),L=r.useMergeRefs([o.refFloating,C]),T=n.useMemo(()=>o.labelSelectAll??"Select all option",[o.labelSelectAll]),Y=n.useMemo(()=>o.labelPlaceholder??"Select an option",[o.labelPlaceholder]),H=n.useMemo(()=>o.labelEmptyOption??"No options available",[o.labelEmptyOption]),Z=n.useMemo(()=>o.labelAndMore??x,[o.labelAndMore]),N=n.useMemo(()=>o.labelAddOption??m,[o.labelAddOption]),B=n.useMemo(()=>o.maxViewSelect??2,[o.maxViewSelect]),W=n.useMemo(()=>o.maxViewDropdown??5,[o.maxViewDropdown]),F=n.useMemo(()=>o.minViewDropdown??1,[o.minViewDropdown]),q=n.useMemo(()=>o.value.length===o.option.length||o.value.length===o.optionAllLength,[o.option.length,o.optionAllLength,o.value.length]),V=n.useMemo(()=>!!o.option.length,[o.option.length]),P=n.useMemo(()=>!!o.value.length,[o.value.length]),U=n.useMemo(()=>o.valueSearch&&o.isShowAddOption,[o.valueSearch,o.isShowAddOption]),[J,Q]=n.useState(!1),X=n.useMemo(()=>o.isNotShowDisabledOptions?o.option.filter(e=>!e.isDisabled).length:o.option.length,[o.option,o.isNotShowDisabledOptions]),G=n.useMemo(()=>p*(X<W?X:W),[p,X,W,F]),ee=n.useMemo(()=>{const e=o.isShowSelectAll&&V?p:0,t=V?0:p,s=V?G:0,r=U?p:0,i=(0!==e?1:0)+(0!==t?1:0)+(0!==s?1:0)+(0!==r?1:0);return e+t+s+r+(i<=1?0:h/2.8*(i-1))},[o.isShowSelectAll,p,V,h,G,U]),oe=n.useMemo(()=>o.value.length>B,[B,o.value.length]),te=n.useMemo(()=>o.isShowIconSearchClear&&o.valueSearch,[o.isShowIconSearchClear,o.valueSearch]),se=n.useMemo(()=>te||o.isShowIconToggle||o.isShowIconFetching&&o.isFetching,[te,o.isShowIconToggle,o.isShowIconFetching,o.isFetching]),re=n.useMemo(()=>X>W,[W,X]),ie=n.useCallback(e=>q||o.value.some(o=>o.value===e.value),[q,o.value]),le=n.useMemo(()=>U||o.isShowSelectAll&&V||!V,[V,U,o.isShowSelectAll]),ne=i.useVirtualizer({count:X,estimateSize:o.getEstimateSize?o.getEstimateSize:()=>p,getScrollElement:()=>O.current,overscan:1,paddingEnd:0}),ae=n.useCallback(e=>{o.isSearch&&!o.isDisabled?Q(e):Q(!1)},[o.isDisabled,o.isSearch]),ce=n.useCallback(e=>{let t=[];const s=e.value,r=o.value.findIndex(e=>e.value===s),i=-1!==r;t=o.isMulti?i?[...o.value.slice(0,r),...o.value.slice(r+1)]:[...o.value,e]:i&&!o.isStayValueAfterSelect?[...o.value.slice(0,r),...o.value.slice(r+1)]:[e],o.onChange(t),ae(!!o.isStaySearchAfterSelect),o.isOnClickOptionClose&&S()},[S,ae,o]),ue=n.useCallback(()=>{var e;null==(e=o.onChangeAll)||e.call(o,q?[]:o.option,!q),ae(!!o.isStaySearchAfterSelect),o.isOnClickOptionClose&&S()},[S,q,ae,o]),de=n.useCallback(()=>{var e;null==(e=o.onChangeSearch)||e.call(o,"")},[o]),pe=n.useCallback(e=>{if(e){const{scrollHeight:t,scrollTop:s,clientHeight:r}=e;t-s-r<G&&!o.isFetching&&o.fetchNextPage&&o.fetchNextPage()}},[G,o]),he=n.useCallback(e=>{var t,s;null==(t=o.onAddOption)||t.call(o,e),null==(s=o.onChangeSearch)||s.call(o,"")},[o]);n.useEffect(()=>{ae(!1)},[ae,o.isDisabled]),n.useEffect(()=>{P||ae(!0)},[P,ae]),n.useEffect(()=>{!g&&P&&ae(!1)},[P,g,ae]);const $e=a.useTheme(),ge=n.useMemo(()=>{var e,t,s,r;return{size:(null==(e=o.font)?void 0:e.size)??16,weight:(null==(t=o.font)?void 0:t.weight)??(o.isBold?500:400),family:(null==(s=o.font)?void 0:s.family)??$e.font.family,height:null==(r=o.font)?void 0:r.height}},[o.font,$e.font.family,o.isBold]);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(E,{tabIndex:0,$error:null==o?void 0:o.error,$isNotShowHoverStyle:null==o?void 0:o.isNotShowHoverStyle,$size:o.size,$genre:o.genre,$isCenter:o.isCenter,$sx:o.sx,$isOpen:g,ref:R,onClick:()=>{b(),ae(!0)},onFocus:()=>{b()},children:[J&&e.jsxRuntimeExports.jsx(K,{ref:D,genre:o.genre,size:o.size,minRows:1,maxRows:5,isAutoHeight:!0,onChange:e=>{var t;null==(t=null==o?void 0:o.onChangeSearch)||t.call(o,e)},value:o.valueSearch,placeholder:Y}),!P||o.isShowSelectAllLabel&&q?null:e.jsxRuntimeExports.jsx(_,{$size:o.size,tabIndex:-1,$isWrapSelectOption:o.isWrapSelectOption,onMouseDown:e=>{e.preventDefault()},onClick:e=>{e.preventDefault()},children:o.value.map((t,s)=>{if(s>=B)return null;const r=ie(t);return e.jsxRuntimeExports.jsx(f,{isChecked:r,onClick:()=>o.isClearWhenClickSelectListOption&&ce(t),item:t,genre:o.genre,size:o.size,isBold:o.isBold,isOnlyColorInSelectListOption:o.isOnlyColorInSelectListOption,isClearWhenClickSelectListOption:o.isClearWhenClickSelectListOption,isWrapSelectOption:o.isWrapSelectOption,isNotShowHoverStyle:o.isNotShowHoverStyle,isCenter:o.isCenter},`${t.value}-${s}`)})}),P&&o.isShowSelectAllLabel&&q?e.jsxRuntimeExports.jsx(d.Typography,{sxStandard:{default:{padding:`${h/2.8}px 0px ${h/2.8}px ${h/2.8}px`}},sx:{default:{size:16,line:1,isNoUserSelect:!0}},children:T}):null,P||o.isSearch?null:e.jsxRuntimeExports.jsx(d.Typography,{sxStandard:e=>({default:{color:e.colors.input[o.genre].color.placeholder,padding:`${h/2.8}px 0px ${h/2.8}px ${h/2.8}px`}}),sx:{default:{size:16,line:1,isNoUserSelect:!0}},children:Y}),!oe||!P||o.isShowSelectAllLabel&&q?null:e.jsxRuntimeExports.jsx(d.Typography,{sxStandard:{default:{padding:`${h/2.8}px 0px ${h/2.8}px ${h/2.8}px`}},sx:{default:{size:16,line:1,isNoUserSelect:!0}},children:Z(o.value.length-B)}),se?e.jsxRuntimeExports.jsxs(M,{$size:o.size,onMouseDown:e=>{e.preventDefault()},children:[te&&e.jsxRuntimeExports.jsx(c.Button,{genre:o.genre,size:"small",isWidthAsHeight:!0,isFullSize:!0,isRadius:!0,isOnlyIcon:!0,icons:[{name:"Close",type:"id"}],onClick:e=>{e.preventDefault(),e.stopPropagation(),de()}}),o.isShowIconToggle&&e.jsxRuntimeExports.jsx(c.Button,{genre:o.genre,size:"small",isWidthAsHeight:!0,isFullSize:!0,isRadius:!0,isOnlyIcon:!0,icons:[{name:"Select",type:"id"}],onClick:e=>{e.preventDefault(),e.stopPropagation(),j()}}),o.isShowIconFetching&&o.isFetching&&e.jsxRuntimeExports.jsx(c.Button,{tabIndex:-1,genre:o.genre,size:"small",isWidthAsHeight:!0,isFullSize:!0,isRadius:!0,isHiddenBorder:!0,isDisabledRipple:!0,isNotHoverEffect:!0,children:e.jsxRuntimeExports.jsx(u.Icon,{type:"loading",name:"Circle",size:o.size})})]}):null]}),e.jsxRuntimeExports.jsx(d.Popover,{sx:e=>({default:{background:e.colors.input[o.genre].background.rest,borderRadius:`${$}px`,padding:"0px",maxHeight:`${ee}px`}}),isShowAlwaysOutline:!0,size:o.size,genre:o.genre,floatingStyles:z,ref:L,isOpen:g,children:e.jsxRuntimeExports.jsxs(y,{tabIndex:-1,ref:O,$size:o.size,onScroll:e=>pe(e.target),children:[le&&e.jsxRuntimeExports.jsxs(A,{style:{position:"sticky",top:0,zIndex:1},children:[U?e.jsxRuntimeExports.jsx(k,{tabIndex:0,onClick:()=>o.valueSearch&&he(o.valueSearch),onKeyDown:e=>{"Enter"===e.key&&o.valueSearch&&he(o.valueSearch)},$isCenter:o.isCenter,$isNotShowHoverStyle:o.isNotShowHoverStyle,$genre:o.genre,$size:o.size,$font:ge,$isBold:o.isBold,$isChecked:q,style:{position:"relative",minHeight:`${p}px`},children:o.valueSearch&&N(o.valueSearch)}):null,o.isShowSelectAll&&V?e.jsxRuntimeExports.jsxs(k,{tabIndex:0,onClick:()=>ue(),onKeyDown:e=>{"Enter"===e.key&&ue()},$isCenter:o.isCenter,$isNotShowHoverStyle:o.isNotShowHoverStyle,$genre:o.genre,$size:o.size,$font:ge,$isBold:o.isBold,$isChecked:q,$isShowScroll:re,style:{position:"relative",minHeight:`${p}px`},children:[T,o.isShowDropdownOptionIcon&&e.jsxRuntimeExports.jsx(I,{tabIndex:-1,size:o.size,type:"checkbox",name:"Arrow",$genre:o.genre,$checked:q,$size:o.size})]}):null,V?null:e.jsxRuntimeExports.jsx(k,{tabIndex:-1,$isCenter:o.isCenter,$isNotShowHoverStyle:o.isNotShowHoverStyle,$genre:o.genre,$size:o.size,$font:ge,$isBold:o.isBold,$isChecked:q,$isShowScroll:re,style:{position:"relative",minHeight:`${p}px`},children:e.jsxRuntimeExports.jsx(d.Typography,{sx:{default:{size:16,line:1}},children:H})})]}),V?e.jsxRuntimeExports.jsx(A,{tabIndex:-1,style:{height:`${ne.getTotalSize()}px`,minHeight:`${G}px`},children:ne.getVirtualItems().map(t=>{const s=o.option[t.index],r=ie(s);return e.jsxRuntimeExports.jsx(v,{virtualRowSize:t.size,virtualRowStart:t.start,isChecked:r,onClick:()=>ce(s),item:s,genre:o.genre,size:o.size,font:ge,isBold:o.isBold,isNotShowHoverStyle:o.isNotShowHoverStyle,isCenter:o.isCenter,isShowScroll:re,isShowDropdownOptionIcon:o.isShowDropdownOptionIcon},t.index)})}):null]})}),(null==o?void 0:o.error)?e.jsxRuntimeExports.jsx(t.ErrorMessage,{...o.error,size:(null==o?void 0:o.error.size)??o.size,font:{size:12,weight:400,family:(null==(l=o.font)?void 0:l.family)??$e.font.family}}):null]})},v=n.memo(o=>e.jsxRuntimeExports.jsxs(k,{tabIndex:0,onClick:()=>{!o.item.isDisabled&&o.onClick()},onKeyDown:e=>{o.item.isDisabled||"Enter"===e.key&&o.onClick()},style:{position:"absolute",height:`${o.virtualRowSize}px`,transform:`translateY(${o.virtualRowStart}px)`},$isCenter:o.isCenter,$isNotShowHoverStyle:o.isNotShowHoverStyle,$item:o.item,$genre:o.genre,$size:o.size,$font:o.font,$isBold:o.isBold,$isChecked:o.isChecked,$isShowScroll:o.isShowScroll,children:[o.item.label,o.isShowDropdownOptionIcon&&e.jsxRuntimeExports.jsx(I,{tabIndex:-1,size:o.size,type:"checkbox",name:"Arrow",$genre:o.genre,$checked:o.isChecked,$size:o.size})]})),f=n.memo(o=>e.jsxRuntimeExports.jsx(Y,{tabIndex:-1,onClick:o.onClick,$isOnlyColorInSelectListOption:o.isOnlyColorInSelectListOption,$isClearWhenClickSelectListOption:o.isClearWhenClickSelectListOption,$isWrapSelectOption:o.isWrapSelectOption,$isCenter:o.isCenter,$isNotShowHoverStyle:o.isNotShowHoverStyle,$item:o.item,$genre:o.genre,$size:o.size,$isBold:o.isBold,$isChecked:o.isChecked,children:e.jsxRuntimeExports.jsx(d.Typography,{sx:{default:{size:16,line:1}},children:o.item.label})})),b=a.css`
+  ${e=>a.css`
+    background: ${e.theme.colors.input[e.$genre].background.rest};
+    border-color: ${e.theme.colors.input[e.$genre].border.rest};
+    color: ${e.theme.colors.input[e.$genre].color.rest};
+    ${!e.$isNotShowHoverStyle&&a.css`
+      &:hover {
+        background: ${e.theme.colors.input[e.$genre].background.hover};
+        border-color: ${e.theme.colors.input[e.$genre].border.hover};
+        color: ${e.theme.colors.input[e.$genre].color.hover};
+      }
+    `}
+      ${e.$isOpen&&a.css`
+      background: ${e.theme.colors.input[e.$genre].background.rest};
+      border-color: ${e.theme.colors.input[e.$genre].border.rest};
+      color: ${e.theme.colors.input[e.$genre].color.rest};
+    `}
+  `};
+`,w=a.css`
+  border: 1px solid;
+  width: 100%;
+  padding: ${e=>s.KEY_SIZE_DATA[e.$size].padding/4}px
+    ${e=>s.KEY_SIZE_DATA[e.$size].padding-s.KEY_SIZE_DATA[e.$size].padding/2.8}px;
+  gap: ${e=>s.KEY_SIZE_DATA[e.$size].padding/2.8}px;
+  height: fit-content;
+  min-height: ${e=>s.KEY_SIZE_DATA[e.$size].height}px;
+  border-radius: ${e=>s.KEY_SIZE_DATA[e.$size].radius}px;
+  justify-content: ${e=>e.$isCenter?"center":"flex-start"};
+  ${e=>e.$isOpen&&a.css`
+      outline: 2px ${e=>e.theme.states.focus} solid;
+      outline-offset: 1px;
+    `}
+`,E=a($.motion.div)`
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: center;
+  align-content: center;
+  flex-wrap: wrap;
+  ${b};
+  ${w};
+  ${t.addError};
+  ${h.addSX};
+`,C=a.css`
+  gap: ${e=>s.KEY_SIZE_DATA[e.$size].padding/2.8}px;
+`,y=a($.motion.div)`
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+  overflow-y: auto;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  ${C};
+`,A=a.ul`
+  list-style: none;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  transform: translateZ(0);
+  flex-shrink: 0;
+`,z=a.css`
+  ${e=>a.css`
+    background: ${e.theme.colors.select[e.$genre].background.rest};
+    border-color: ${e.theme.colors.select[e.$genre].border.rest};
+    color: ${e.theme.colors.select[e.$genre].color.rest};
+    &:active {
+      background: ${e.theme.colors.select[e.$genre].background.rest};
+      border-color: ${e.theme.colors.select[e.$genre].border.rest};
+      color: ${e.theme.colors.select[e.$genre].color.rest};
+    }
+    ${!e.$isNotShowHoverStyle&&a.css`
+      &:hover {
+        background: ${e.theme.colors.select[e.$genre].background.hover};
+        border-color: ${e.theme.colors.select[e.$genre].border.hover};
+        color: ${e.theme.colors.select[e.$genre].color.hover};
+      }
+    `}
+    &:focus-visible {
+      background: ${e.theme.colors.select[e.$genre].background.rest};
+      border-color: ${e.theme.colors.select[e.$genre].border.rest};
+      color: ${e.theme.colors.select[e.$genre].color.rest};
+    }
+  `};
+`,j=a.css`
+  padding: 0px ${e=>s.KEY_SIZE_DATA[e.$size].padding}px;
+  width: 100%;
+  border: 1px solid;
+  border-radius: 0;
+  justify-content: ${e=>e.$isCenter?"center":"flex-start"};
+  &:first-child {
+    ${e=>e.$isShowScroll?a.css`
+            border-radius: ${s.KEY_SIZE_DATA[e.$size].radius}px 0px 0px 0px;
+          `:a.css`
+            border-radius: ${s.KEY_SIZE_DATA[e.$size].radius}px ${s.KEY_SIZE_DATA[e.$size].radius}px 0px 0px;
+          `}
+  }
+  &:last-child {
+    ${e=>e.$isShowScroll?a.css`
+            border-radius: 0px 0px 0px ${s.KEY_SIZE_DATA[e.$size].radius}px;
+          `:a.css`
+            border-radius: 0px 0px ${s.KEY_SIZE_DATA[e.$size].radius}px ${s.KEY_SIZE_DATA[e.$size].radius}px;
+          `}
+  }
+  &:not(:first-child):not(:last-child) {
+    border-radius: 0px;
+  }
+  &:first-child:last-child {
+    ${e=>e.$isShowScroll?a.css`
+            border-radius: ${s.KEY_SIZE_DATA[e.$size].radius}px 0px 0px ${s.KEY_SIZE_DATA[e.$size].radius}px;
+          `:a.css`
+            border-radius: ${s.KEY_SIZE_DATA[e.$size].radius}px;
+          `}
+  }
+`,k=a.li`
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  user-select: none;
+  flex-shrink: 0;
+  opacity: ${e=>{var o;return(null==(o=e.$item)?void 0:o.isDisabled)?.5:1}};
+  ${p.addFont};
+  ${z};
+  ${j};
+  ${p.addRemoveOutline};
+`,D=a.css`
+  right: ${e=>s.KEY_SIZE_DATA[e.$size].padding-6}px;
+  height: ${e=>s.KEY_SIZE_DATA[e.$size].height}px;
+`,I=a(u.Icon)`
+  position: absolute;
+  right: 0;
+  height: 100%;
+  align-items: center;
+  ${D};
+  ${p.addRemoveOutline};
+  color: ${e=>e.$checked?e.theme.colors.select[e.$genre].border.select:e.theme.colors.input[e.$genre].border.rest};
+`,O=a.css`
+  display: flex;
+  flex-direction: row;
+  flex-wrap: ${e=>e.$isWrapSelectOption?"wrap":"nowrap"};
+  gap: ${e=>s.KEY_SIZE_DATA[e.$size].padding/2.8}px;
+`,_=a.ul`
+  list-style: none;
+  position: relative;
+  overflow: hidden;
+  ${O};
+`,R=a.css`
+  display: flex;
+  flex-direction: row;
+  gap: ${e=>s.KEY_SIZE_DATA[e.$size].padding/2.8}px;
+  padding: ${e=>s.KEY_SIZE_DATA[e.$size].padding/2.8}px ${e=>s.KEY_SIZE_DATA[e.$size].padding}px;
+`,M=a.div`
+  position: absolute;
+  right: 0;
+  ${R};
+`,L=a.css`
+${e=>e.$isOnlyColorInSelectListOption?a.css`
+      border: 0px solid;
+      border-color: transparent;
+      background-color: transparent;
+      color: ${e.theme.colors.select[e.$genre].color.rest};
+      &:active {
+        color: ${e.theme.colors.select[e.$genre].color.rest};
+      }
+      ${!e.$isNotShowHoverStyle&&a.css`
+        &:hover {
+          color: ${e.theme.colors.select[e.$genre].color.hover};
+        }
+      `}
+      &:focus-visible {
+        color: ${e.theme.colors.select[e.$genre].color.rest};
+      }
+    `:a.css`
+      border: 1px solid;
+      background: ${e.theme.colors.select[e.$genre].background.rest};
+      border-color: ${e.theme.colors.select[e.$genre].border.rest};
+      color: ${e.theme.colors.select[e.$genre].color.rest};
+      &:active {
+        background: ${e.theme.colors.select[e.$genre].background.rest};
+        border-color: ${e.theme.colors.select[e.$genre].border.rest};
+        color: ${e.theme.colors.select[e.$genre].color.rest};
+      }
+      ${!e.$isNotShowHoverStyle&&a.css`
+        &:hover {
+          background: ${e.theme.colors.select[e.$genre].background.hover};
+          border-color: ${e.theme.colors.select[e.$genre].border.hover};
+          color: ${e.theme.colors.select[e.$genre].color.hover};
+        }
+      `}
+      &:focus-visible {
+        background: ${e.theme.colors.select[e.$genre].background.rest};
+        border-color: ${e.theme.colors.select[e.$genre].border.rest};
+        color: ${e.theme.colors.select[e.$genre].color.rest};
+      }
+    `}
+`,T=a.css`
+  padding: ${e=>s.KEY_SIZE_DATA[e.$size].padding/2.8}px;
+  border-radius: ${e=>s.KEY_SIZE_DATA[e.$size].radius}px;
+`,Y=a($.motion.li)`
+  display: flex;
+  align-items: center;
+  opacity: 1;
+  cursor: ${e=>e.$isClearWhenClickSelectListOption?"pointer":"default"};
+  flex-shrink: 0;
+  overflow: hidden;
+  width: fit-content;
+  ${L};
+  ${T};
+  ${p.addRemoveOutline};
+`,K=a(g.TextArea)`
+  border: 0 !important;
+  background-color: transparent !important;
+  min-height: initial !important;
+  width: 100%;
+  max-width: 100%;
+  flex-grow: 1;
+  padding: ${e=>s.KEY_SIZE_DATA[e.size].padding/2.8}px 0px ${e=>s.KEY_SIZE_DATA[e.size].padding/2.8}px ${e=>s.KEY_SIZE_DATA[e.size].padding/2.8}px;
+  ${p.addRemoveOutline};
+`;exports.ButtonList=M,exports.ContainerDropdownListOption=v,exports.ContainerSelectListOption=f,exports.DropdownList=A,exports.DropdownListOption=k,exports.DropdownListOptionIcon=I,exports.DropdownListParent=y,exports.Select=S,exports.SelectLanguage=t=>{const{value:s,onChange:r}=t,i=o.ListLanguage,[l]=n.useState(i),a=n.useMemo(()=>{const e=i.find(e=>e.value===s);return e?[e]:[]},[i,s]);return e.jsxRuntimeExports.jsx(S,{...t,option:l,value:a,onChange:e=>{0===e.length&&r(null),r(e[0].value.toString())}})},exports.SelectList=_,exports.SelectListOption=Y,exports.SelectMapTheme=t=>{const{value:s,onChange:r}=t,i=n.useMemo(()=>o.MapThemeList.map(e=>({label:e.name,value:e.name,placeholder:e.name})),[]),[l,a]=n.useState(i);n.useEffect(()=>{a(i)},[i]);const c=n.useMemo(()=>{const e=i.find(e=>e.value===s.name);return e?[e]:[]},[s,i]),[u,d]=n.useState(""),p=n.useCallback(e=>{if(d(e),""===e)a(i);else{const o=i.filter(o=>Object.values(o).some(o=>null==o?void 0:o.toString().toLowerCase().includes(e.toLowerCase())));a(o)}},[i]);return e.jsxRuntimeExports.jsx(S,{...t,option:l,value:c,onChange:e=>{0===e.length&&r(null);const t=o.MapThemeList.find(o=>o.name===e[0].value);r(t??null)},valueSearch:u,onChangeSearch:p})},exports.SelectMonth=o=>{const{value:t,onChange:s,dateMin:r,dateMax:i,monthsLocale:a,isShortLabel:c}=o,u=l(t).utc().year(),d=n.useMemo(()=>a.map(e=>{const o=l().month(e.value).month(),t=l.utc().year(u).month(o).startOf("month"),s=r&&t.isBefore(l.utc(r),"month")||i&&t.isAfter(l.utc(i),"month");return{value:t.valueOf(),label:c?e.localeShort:e.localeLong,placeholder:c?e.localeShort:e.localeLong,search:`${e.localeLong.toLowerCase()}, ${o+1}`,isDisabled:!!s,monthValue:e.value}}),[a,u,r,i,c]),p=n.useMemo(()=>{const e=d.find(e=>e.value===t);return e?[e]:[]},[t,d]);return e.jsxRuntimeExports.jsx(S,{...o,option:d,value:p,onChange:e=>{0===e.length&&s(null),s(+e[0].value)}})},exports.SelectMonths=o=>{const{value:t,onChange:s,dateMin:r,dateMax:i,monthsLocale:a,isShortLabel:c}=o,u=l(t).utc().year(),d=n.useMemo(()=>a.map(e=>{const o=l().month(e.value).month(),t=l.utc().year(u).month(o).startOf("month"),s=r&&t.isBefore(l.utc(r),"month")||i&&t.isAfter(l.utc(i),"month");return{value:t.valueOf(),label:c?e.localeShort:e.localeLong,placeholder:c?e.localeShort:e.localeLong,search:`${e.localeLong.toLowerCase()}, ${o+1}`,isDisabled:!!s,monthValue:e.value}}),[a,u,r,i,c]),[p,h]=n.useState(d);n.useEffect(()=>{h(d)},[d]);const $=n.useMemo(()=>t&&0!==t.length?t.map(e=>d.find(o=>o.value===e)).filter(Boolean):[],[t,d]),[g,x]=n.useState(""),m=n.useCallback(e=>{if(x(e),""===e)h(d);else{const o=d.filter(o=>Object.values(o).some(o=>null==o?void 0:o.toString().toLowerCase().includes(e.toLowerCase())));h(o)}},[d]);return e.jsxRuntimeExports.jsx(S,{...o,valueSearch:g,onChangeSearch:m,optionAllLength:d.length,option:p,minViewDropdown:1,isMulti:!0,value:$,onChange:e=>{0===e.length&&s([]),s(e.map(e=>+e.value))},onChangeAll:(e,o)=>{s(o?p.map(e=>+e.value):[])}})},exports.SelectTextArea=K,exports.SelectWrapper=E,exports.SelectYear=o=>{const{value:t,onChange:s,dateMin:r,dateMax:i,sortOrder:a="desc"}=o,c=l(r).utc().year(),u=l(i).utc().year(),d=n.useMemo(()=>{const e=Array.from({length:u-c+1},(e,o)=>{const t=c+o;return{value:l().year(t).utc().startOf("year").valueOf(),label:l().year(t).utc().format("YYYY"),placeholder:l().year(t).utc().format("YYYY"),search:`${l().year(t).utc().format("YYYY").toLowerCase()}`}});return"asc"===a?e.sort((e,o)=>e.value-o.value):e.sort((e,o)=>o.value-e.value)},[u,c,a]),p=n.useMemo(()=>{const e=d.find(e=>e.value===t);return e?[e]:[]},[t,d]);return e.jsxRuntimeExports.jsx(S,{...o,option:d,value:p,onChange:e=>{0===e.length&&s(null),s(+e[0].value)}})};
+//# sourceMappingURL=component.styles-mhkAuWyU.cjs.map

package/build/component.styles-mhkAuWyU.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.styles-mhkAuWyU.cjs","sources":["../src/components/select/component.tsx","../src/components/select/component.styles.ts"],"sourcesContent":["import { ListLanguage, MapThemeList } from '@local/consts';\nimport { ErrorMessage } from '@local/styles/error';\nimport { KEY_SIZE_DATA } from '@local/theme';\n\nimport { useMergeRefs } from '@floating-ui/react';\nimport { useVirtualizer } from '@tanstack/react-virtual';\nimport moment from 'moment';\nimport { FC, KeyboardEvent, memo, Ref, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { Popover, usePopover } from '../popover';\nimport { Typography } from '../typography';\nimport {\n  ButtonList,\n  ContainerDropdownListOptionProps,\n  ContainerSelectListOptionProps,\n  DropdownList,\n  DropdownListOption,\n  DropdownListOptionIcon,\n  DropdownListParent,\n  ISelectItem,\n  ISelectLanguageOption,\n  ISelectMapThemeOption,\n  SelectLanguageProps,\n  SelectList,\n  SelectListOption,\n  SelectMapThemeProps,\n  SelectMonthProps,\n  SelectMonthsProps,\n  SelectProps,\n  SelectTextArea,\n  SelectWrapper,\n  SelectYearProps,\n} from '.';\n\nconst DEFAULT_LABEL_SELECT_ALL = 'Select all option';\nconst DEFAULT_LABEL_PLACEHOLDER = 'Select an option';\nconst DEFAULT_LABEL_EMPTY_OPTION = 'No options available';\nconst DEFAULT_LABEL_AND_MORE = (count: number) => `+${count} more`;\nconst DEFAULT_LABEL_ADD_OPTION = (value: string) => `Add \"${value}\" option`;\n\nconst DEFAULT_MAX_VIEW_SELECT = 2;\nconst DEFAULT_MAX_VIEW_DROPDOWN = 5;\nconst DEFAULT_MIN_VIEW_DROPDOWN = 1;\nconst DEFAULT_OVERSCAN = 1;\n\nexport const Select = <T extends object & ISelectItem>(props: SelectProps<T>) => {\n  const sizeHeight = useMemo(() => KEY_SIZE_DATA[props.size].height, [props.size]);\n  const sizePadding = useMemo(() => KEY_SIZE_DATA[props.size].padding, [props.size]);\n  const sizeRadius = useMemo(() => KEY_SIZE_DATA[props.size].radius, [props.size]);\n\n  const {\n    isOpen,\n    close,\n    open,\n    refReference: refReferencePopover,\n    refFloating: refFloatingPopover,\n    floatingStyles,\n    toggle,\n  } = usePopover({\n    placement: 'bottom-start',\n    offset: sizePadding,\n    mode: 'independence',\n    isClickOutside: true,\n    isWidthAsContent: true,\n    isDisabled: props?.isDisabled,\n    onBlur: props.onBlur,\n    onFocus: props.onFocus,\n  });\n  const refTextArea = useRef<HTMLTextAreaElement>(null);\n  const refDropdownList = useRef<HTMLDivElement>(null);\n\n  const refReference = useMergeRefs([props.refReference, refReferencePopover]);\n  const refFloating = useMergeRefs([props.refFloating, refFloatingPopover]);\n\n  const labelSelectAll = useMemo(() => props.labelSelectAll ?? DEFAULT_LABEL_SELECT_ALL, [props.labelSelectAll]);\n  const labelPlaceholder = useMemo(() => props.labelPlaceholder ?? DEFAULT_LABEL_PLACEHOLDER, [props.labelPlaceholder]);\n  const labelEmptyOption = useMemo(\n    () => props.labelEmptyOption ?? DEFAULT_LABEL_EMPTY_OPTION,\n    [props.labelEmptyOption],\n  );\n  const labelAndMore = useMemo(() => props.labelAndMore ?? DEFAULT_LABEL_AND_MORE, [props.labelAndMore]);\n  const labelAddOption = useMemo(() => props.labelAddOption ?? DEFAULT_LABEL_ADD_OPTION, [props.labelAddOption]);\n\n  const maxViewSelect = useMemo(() => props.maxViewSelect ?? DEFAULT_MAX_VIEW_SELECT, [props.maxViewSelect]);\n  const maxViewDropdown = useMemo(() => props.maxViewDropdown ?? DEFAULT_MAX_VIEW_DROPDOWN, [props.maxViewDropdown]);\n  const minViewDropdown = useMemo(() => props.minViewDropdown ?? DEFAULT_MIN_VIEW_DROPDOWN, [props.minViewDropdown]);\n\n  const isAll = useMemo(\n    () => props.value.length === props.option.length || props.value.length === props.optionAllLength,\n    [props.option.length, props.optionAllLength, props.value.length],\n  );\n  const isHaveOption = useMemo(() => !!props.option.length, [props.option.length]);\n  const isHaveValue = useMemo(() => !!props.value.length, [props.value.length]);\n  const isShowAddOption = useMemo(\n    () => props.valueSearch && props.isShowAddOption,\n    [props.valueSearch, props.isShowAddOption],\n  );\n  const [isShowSearch, setIsShowSearch] = useState<boolean>(false);\n\n  const optionsLength = useMemo(() => {\n    if (props.isNotShowDisabledOptions) {\n      return props.option.filter((option) => !option.isDisabled).length;\n    } else {\n      return props.option.length;\n    }\n  }, [props.option, props.isNotShowDisabledOptions]);\n\n  const heightDropdownList = useMemo(\n    () =>\n      sizeHeight *\n      (optionsLength < maxViewDropdown\n        ? optionsLength < minViewDropdown\n          ? optionsLength\n          : optionsLength\n        : maxViewDropdown),\n    [sizeHeight, optionsLength, maxViewDropdown, minViewDropdown],\n  );\n  const heightPopover = useMemo(() => {\n    const selectAll = props.isShowSelectAll && isHaveOption ? sizeHeight : 0;\n    const selectNoOption = !isHaveOption ? sizeHeight : 0;\n    const selectList = isHaveOption ? heightDropdownList : 0;\n    const selectAdd = isShowAddOption ? sizeHeight : 0;\n    const sum =\n      (selectAll !== 0 ? 1 : 0) +\n      (selectNoOption !== 0 ? 1 : 0) +\n      (selectList !== 0 ? 1 : 0) +\n      (selectAdd !== 0 ? 1 : 0);\n    const padding = sum <= 1 ? 0 : (sum - 1) * (sizePadding / 2.8);\n    return selectAll + selectNoOption + selectList + selectAdd + padding;\n  }, [props.isShowSelectAll, sizeHeight, isHaveOption, sizePadding, heightDropdownList, isShowAddOption]);\n\n  const isValueMoreMaxViewSelect = useMemo(\n    () => props.value.length > maxViewSelect,\n    [maxViewSelect, props.value.length],\n  );\n  const isShowIconSearchClear = useMemo(\n    () => props.isShowIconSearchClear && props.valueSearch,\n    [props.isShowIconSearchClear, props.valueSearch],\n  );\n  const isShowButtonList = useMemo(\n    () => isShowIconSearchClear || props.isShowIconToggle || (props.isShowIconFetching && props.isFetching),\n    [isShowIconSearchClear, props.isShowIconToggle, props.isShowIconFetching, props.isFetching],\n  );\n  const isShowScroll = useMemo(() => optionsLength > maxViewDropdown, [maxViewDropdown, optionsLength]);\n  const isSelectedItem = useCallback(\n    (option: T): boolean => {\n      return isAll || props.value.some((val) => val.value === option.value);\n    },\n    [isAll, props.value],\n  );\n  const isShowDropdownSettingsList = useMemo(\n    () => isShowAddOption || (props.isShowSelectAll && isHaveOption) || !isHaveOption,\n    [isHaveOption, isShowAddOption, props.isShowSelectAll],\n  );\n  const listVirtualizer = useVirtualizer({\n    count: optionsLength,\n    estimateSize: props.getEstimateSize ? props.getEstimateSize : () => sizeHeight,\n    getScrollElement: () => refDropdownList.current,\n    overscan: DEFAULT_OVERSCAN,\n    paddingEnd: 0,\n  });\n\n  const onChangeShowSearch = useCallback(\n    (show: boolean) => {\n      if (props.isSearch && !props.isDisabled) {\n        setIsShowSearch(show);\n      } else {\n        setIsShowSearch(false);\n      }\n    },\n    [props.isDisabled, props.isSearch],\n  );\n  const onClick = useCallback(\n    (option: T) => {\n      let newValues: T[] = [];\n      const optionValue = option.value;\n\n      const findIndex = (val: T) => val.value === optionValue;\n      const index = props.value.findIndex(findIndex);\n      const isFind = index !== -1;\n\n      if (props.isMulti) {\n        if (isFind) {\n          newValues = [...props.value.slice(0, index), ...props.value.slice(index + 1)];\n        } else {\n          newValues = [...props.value, option];\n        }\n      } else {\n        if (isFind && !props.isStayValueAfterSelect) {\n          newValues = [...props.value.slice(0, index), ...props.value.slice(index + 1)];\n        } else {\n          newValues = [option];\n        }\n      }\n      props.onChange(newValues);\n      onChangeShowSearch(!!props.isStaySearchAfterSelect);\n      if (props.isOnClickOptionClose) {\n        close();\n      }\n    },\n    [close, onChangeShowSearch, props],\n  );\n  const onClickAll = useCallback(() => {\n    props.onChangeAll?.(isAll ? [] : props.option, !isAll);\n    onChangeShowSearch(!!props.isStaySearchAfterSelect);\n    if (props.isOnClickOptionClose) {\n      close();\n    }\n  }, [close, isAll, onChangeShowSearch, props]);\n  // const onClear = useCallback(() => {\n  //   props.onChange([]);\n  // }, [props]);\n  const onClearSearch = useCallback(() => {\n    props.onChangeSearch?.('');\n  }, [props]);\n  const onScroll = useCallback(\n    (containerRefElement?: HTMLDivElement | null) => {\n      if (containerRefElement) {\n        const { scrollHeight, scrollTop, clientHeight } = containerRefElement;\n        if (scrollHeight - scrollTop - clientHeight < heightDropdownList && !props.isFetching && props.fetchNextPage) {\n          props.fetchNextPage();\n        }\n      }\n    },\n    [heightDropdownList, props],\n  );\n  const onAddOption = useCallback(\n    (value: string) => {\n      props.onAddOption?.(value);\n      props.onChangeSearch?.('');\n    },\n    [props],\n  );\n  // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>\n  useEffect(() => {\n    onChangeShowSearch(false);\n  }, [onChangeShowSearch, props.isDisabled]);\n  useEffect(() => {\n    if (!isHaveValue) {\n      onChangeShowSearch(true);\n    }\n  }, [isHaveValue, onChangeShowSearch]);\n  useEffect(() => {\n    if (!isOpen && isHaveValue) {\n      onChangeShowSearch(false);\n    }\n  }, [isHaveValue, isOpen, onChangeShowSearch]);\n\n  const theme = useTheme();\n  const font = useMemo(() => {\n    return {\n      size: props.font?.size ?? 16,\n      weight: props.font?.weight ?? (props.isBold ? 500 : 400),\n      family: props.font?.family ?? theme.font.family,\n      height: props.font?.height,\n    };\n  }, [props.font, theme.font.family, props.isBold]);\n  return (\n    <>\n      <SelectWrapper\n        tabIndex={0}\n        $error={props?.error}\n        $isNotShowHoverStyle={props?.isNotShowHoverStyle}\n        $size={props.size}\n        $genre={props.genre}\n        $isCenter={props.isCenter}\n        $sx={props.sx}\n        $isOpen={isOpen}\n        ref={refReference as Ref<HTMLDivElement | null>}\n        onClick={() => {\n          open();\n          onChangeShowSearch(true);\n        }}\n        onFocus={() => {\n          open();\n        }}\n      >\n        {isShowSearch && (\n          <SelectTextArea\n            ref={refTextArea}\n            genre={props.genre}\n            size={props.size}\n            minRows={1}\n            maxRows={5}\n            isAutoHeight\n            onChange={(value) => {\n              props?.onChangeSearch?.(value);\n            }}\n            value={props.valueSearch}\n            placeholder={labelPlaceholder}\n          />\n        )}\n        {isHaveValue && (props.isShowSelectAllLabel ? !isAll : true) ? (\n          <SelectList\n            $size={props.size}\n            tabIndex={-1}\n            $isWrapSelectOption={props.isWrapSelectOption}\n            onMouseDown={(e) => {\n              e.preventDefault();\n            }}\n            onClick={(e) => {\n              e.preventDefault();\n            }}\n          >\n            {props.value.map((value, index) => {\n              if (index >= maxViewSelect) return null;\n\n              const isChecked = isSelectedItem(value);\n              return (\n                <ContainerSelectListOption\n                  key={`${value.value}-${index}`}\n                  isChecked={isChecked}\n                  onClick={() => props.isClearWhenClickSelectListOption && onClick(value)}\n                  item={value}\n                  genre={props.genre}\n                  size={props.size}\n                  isBold={props.isBold}\n                  isOnlyColorInSelectListOption={props.isOnlyColorInSelectListOption}\n                  isClearWhenClickSelectListOption={props.isClearWhenClickSelectListOption}\n                  isWrapSelectOption={props.isWrapSelectOption}\n                  isNotShowHoverStyle={props.isNotShowHoverStyle}\n                  isCenter={props.isCenter}\n                />\n              );\n            })}\n          </SelectList>\n        ) : null}\n        {isHaveValue && (props.isShowSelectAllLabel ? isAll : false) ? (\n          <Typography\n            sxStandard={{\n              default: { padding: `${sizePadding / 2.8}px 0px ${sizePadding / 2.8}px ${sizePadding / 2.8}px` },\n            }}\n            sx={{ default: { size: 16, line: 1, isNoUserSelect: true } }}\n          >\n            {labelSelectAll}\n          </Typography>\n        ) : null}\n        {!isHaveValue && !props.isSearch ? (\n          <Typography\n            sxStandard={(theme) => ({\n              default: {\n                color: theme.colors.input[props.genre].color.placeholder,\n                padding: `${sizePadding / 2.8}px 0px ${sizePadding / 2.8}px ${sizePadding / 2.8}px`,\n              },\n            })}\n            sx={{ default: { size: 16, line: 1, isNoUserSelect: true } }}\n          >\n            {labelPlaceholder}\n          </Typography>\n        ) : null}\n\n        {isValueMoreMaxViewSelect && isHaveValue && (props.isShowSelectAllLabel ? !isAll : true) ? (\n          <Typography\n            sxStandard={{\n              default: { padding: `${sizePadding / 2.8}px 0px ${sizePadding / 2.8}px ${sizePadding / 2.8}px` },\n            }}\n            sx={{ default: { size: 16, line: 1, isNoUserSelect: true } }}\n          >\n            {labelAndMore(props.value.length - maxViewSelect)}\n          </Typography>\n        ) : null}\n        {isShowButtonList ? (\n          <ButtonList\n            $size={props.size}\n            onMouseDown={(e) => {\n              e.preventDefault();\n            }}\n          >\n            {isShowIconSearchClear && (\n              <Button\n                genre={props.genre}\n                size='small'\n                isWidthAsHeight\n                isFullSize\n                isRadius\n                isOnlyIcon\n                icons={[{ name: 'Close', type: 'id' }]}\n                onClick={(e) => {\n                  e.preventDefault();\n                  e.stopPropagation();\n                  onClearSearch();\n                }}\n              />\n            )}\n            {props.isShowIconToggle && (\n              <Button\n                genre={props.genre}\n                size='small'\n                isWidthAsHeight\n                isFullSize\n                isRadius\n                isOnlyIcon\n                icons={[{ name: 'Select', type: 'id' }]}\n                onClick={(e) => {\n                  e.preventDefault();\n                  e.stopPropagation();\n                  toggle();\n                }}\n              />\n            )}\n            {props.isShowIconFetching && props.isFetching && (\n              <Button\n                tabIndex={-1}\n                genre={props.genre}\n                size='small'\n                isWidthAsHeight\n                isFullSize\n                isRadius\n                isHiddenBorder\n                isDisabledRipple\n                isNotHoverEffect\n              >\n                <Icon type={'loading'} name={'Circle'} size={props.size} />\n              </Button>\n            )}\n          </ButtonList>\n        ) : null}\n      </SelectWrapper>\n      <Popover\n        sx={(theme) => ({\n          default: {\n            background: theme.colors.input[props.genre].background.rest,\n            borderRadius: `${sizeRadius}px`,\n            padding: '0px',\n            maxHeight: `${heightPopover}px`,\n          },\n        })}\n        isShowAlwaysOutline\n        size={props.size}\n        genre={props.genre}\n        floatingStyles={floatingStyles}\n        ref={refFloating}\n        isOpen={isOpen}\n      >\n        <DropdownListParent\n          tabIndex={-1}\n          ref={refDropdownList}\n          $size={props.size}\n          onScroll={(e) => onScroll(e.target as HTMLDivElement)}\n        >\n          {isShowDropdownSettingsList && (\n            <DropdownList style={{ position: 'sticky', top: 0, zIndex: 1 }}>\n              {isShowAddOption ? (\n                <DropdownListOption\n                  tabIndex={0}\n                  onClick={() => props.valueSearch && onAddOption(props.valueSearch)}\n                  onKeyDown={(e) => {\n                    if (e.key === 'Enter' && props.valueSearch) onAddOption(props.valueSearch);\n                  }}\n                  $isCenter={props.isCenter}\n                  $isNotShowHoverStyle={props.isNotShowHoverStyle}\n                  $genre={props.genre}\n                  $size={props.size}\n                  $font={font}\n                  $isBold={props.isBold}\n                  $isChecked={isAll}\n                  style={{ position: 'relative', minHeight: `${sizeHeight}px` }}\n                >\n                  {props.valueSearch && labelAddOption(props.valueSearch)}\n                </DropdownListOption>\n              ) : null}\n              {props.isShowSelectAll && isHaveOption ? (\n                <DropdownListOption\n                  tabIndex={0}\n                  onClick={() => onClickAll()}\n                  onKeyDown={(e) => {\n                    if (e.key === 'Enter') onClickAll();\n                  }}\n                  $isCenter={props.isCenter}\n                  $isNotShowHoverStyle={props.isNotShowHoverStyle}\n                  $genre={props.genre}\n                  $size={props.size}\n                  $font={font}\n                  $isBold={props.isBold}\n                  $isChecked={isAll}\n                  $isShowScroll={isShowScroll}\n                  style={{ position: 'relative', minHeight: `${sizeHeight}px` }}\n                >\n                  {labelSelectAll}\n                  {props.isShowDropdownOptionIcon && (\n                    <DropdownListOptionIcon\n                      tabIndex={-1}\n                      size={props.size}\n                      type='checkbox'\n                      name='Arrow'\n                      $genre={props.genre}\n                      $checked={isAll}\n                      $size={props.size}\n                    />\n                  )}\n                </DropdownListOption>\n              ) : null}\n              {!isHaveOption ? (\n                <DropdownListOption\n                  tabIndex={-1}\n                  $isCenter={props.isCenter}\n                  $isNotShowHoverStyle={props.isNotShowHoverStyle}\n                  $genre={props.genre}\n                  $size={props.size}\n                  $font={font}\n                  $isBold={props.isBold}\n                  $isChecked={isAll}\n                  $isShowScroll={isShowScroll}\n                  style={{ position: 'relative', minHeight: `${sizeHeight}px` }}\n                >\n                  <Typography sx={{ default: { size: 16, line: 1 } }}>{labelEmptyOption}</Typography>\n                </DropdownListOption>\n              ) : null}\n            </DropdownList>\n          )}\n\n          {isHaveOption ? (\n            <DropdownList\n              tabIndex={-1}\n              style={{ height: `${listVirtualizer.getTotalSize()}px`, minHeight: `${heightDropdownList}px` }}\n            >\n              {listVirtualizer.getVirtualItems().map((virtualRow) => {\n                const item = props.option[virtualRow.index];\n                const isChecked = isSelectedItem(item);\n                return (\n                  <ContainerDropdownListOption\n                    key={virtualRow.index}\n                    virtualRowSize={virtualRow.size}\n                    virtualRowStart={virtualRow.start}\n                    isChecked={isChecked}\n                    onClick={() => onClick(item)}\n                    item={item}\n                    genre={props.genre}\n                    size={props.size}\n                    font={font}\n                    isBold={props.isBold}\n                    isNotShowHoverStyle={props.isNotShowHoverStyle}\n                    isCenter={props.isCenter}\n                    isShowScroll={isShowScroll}\n                    isShowDropdownOptionIcon={props.isShowDropdownOptionIcon}\n                  />\n                );\n              })}\n            </DropdownList>\n          ) : null}\n        </DropdownListParent>\n      </Popover>\n      {props?.error ? (\n        <ErrorMessage\n          {...props.error}\n          size={props?.error.size ?? props.size}\n          font={{\n            size: 12,\n            weight: 400,\n            family: props.font?.family ?? theme.font.family,\n          }}\n        />\n      ) : null}\n    </>\n  );\n};\n\nconst ContainerDropdownListOptionComponent = <T extends object & ISelectItem>(\n  props: ContainerDropdownListOptionProps<T>,\n) => {\n  const handleKeyDown = (event: KeyboardEvent<HTMLLIElement>) => {\n    if (props.item.isDisabled) return;\n    if (event.key === 'Enter') {\n      props.onClick();\n    }\n  };\n\n  return (\n    <DropdownListOption\n      tabIndex={0}\n      onClick={() => {\n        !props.item.isDisabled && props.onClick();\n      }}\n      onKeyDown={handleKeyDown}\n      style={{\n        position: 'absolute',\n        height: `${props.virtualRowSize}px`,\n        transform: `translateY(${props.virtualRowStart}px)`,\n      }}\n      $isCenter={props.isCenter}\n      $isNotShowHoverStyle={props.isNotShowHoverStyle}\n      $item={props.item}\n      $genre={props.genre}\n      $size={props.size}\n      $font={props.font}\n      $isBold={props.isBold}\n      $isChecked={props.isChecked}\n      $isShowScroll={props.isShowScroll}\n    >\n      {props.item.label}\n      {props.isShowDropdownOptionIcon && (\n        <DropdownListOptionIcon\n          tabIndex={-1}\n          size={props.size}\n          type='checkbox'\n          name='Arrow'\n          $genre={props.genre}\n          $checked={props.isChecked}\n          $size={props.size}\n        />\n      )}\n    </DropdownListOption>\n  );\n};\n\nconst ContainerSelectListOptionComponent = <T extends object & ISelectItem>(\n  props: ContainerSelectListOptionProps<T>,\n) => {\n  return (\n    <SelectListOption\n      tabIndex={-1}\n      onClick={props.onClick}\n      $isOnlyColorInSelectListOption={props.isOnlyColorInSelectListOption}\n      $isClearWhenClickSelectListOption={props.isClearWhenClickSelectListOption}\n      $isWrapSelectOption={props.isWrapSelectOption}\n      $isCenter={props.isCenter}\n      $isNotShowHoverStyle={props.isNotShowHoverStyle}\n      $item={props.item}\n      $genre={props.genre}\n      $size={props.size}\n      $isBold={props.isBold}\n      $isChecked={props.isChecked}\n    >\n      <Typography sx={{ default: { size: 16, line: 1 } }}>{props.item.label}</Typography>\n    </SelectListOption>\n  );\n};\n\nexport const ContainerDropdownListOption = memo(ContainerDropdownListOptionComponent);\nexport const ContainerSelectListOption = memo(ContainerSelectListOptionComponent);\n\nexport const SelectLanguage: FC<SelectLanguageProps> = (props) => {\n  const { value, onChange } = props;\n\n  const option = ListLanguage;\n\n  const [viewOption] = useState<ISelectLanguageOption[]>(option);\n\n  const handleSelectChange = (value: ISelectLanguageOption[]) => {\n    if (value.length === 0) onChange(null);\n    onChange(value[0].value.toString());\n  };\n  const valueLocal = useMemo(() => {\n    const findOption = option.find((e) => e.value === value);\n    if (!findOption) return [];\n    return [findOption];\n  }, [option, value]);\n\n  return (\n    <Select<ISelectLanguageOption> {...props} option={viewOption} value={valueLocal} onChange={handleSelectChange} />\n  );\n};\nexport const SelectMonth: FC<SelectMonthProps> = (props) => {\n  const { value, onChange, dateMin, dateMax, monthsLocale, isShortLabel } = props;\n\n  const year = moment(value).utc().year();\n\n  const option = useMemo(() => {\n    return monthsLocale.map((monthItem) => {\n      const monthIndex = moment().month(monthItem.value).month();\n\n      const monthMoment = moment.utc().year(year).month(monthIndex).startOf('month');\n      const isDisabled =\n        (dateMin && monthMoment.isBefore(moment.utc(dateMin), 'month')) ||\n        (dateMax && monthMoment.isAfter(moment.utc(dateMax), 'month'));\n\n      return {\n        value: monthMoment.valueOf(),\n        label: isShortLabel ? monthItem.localeShort : monthItem.localeLong,\n        placeholder: isShortLabel ? monthItem.localeShort : monthItem.localeLong,\n        search: `${monthItem.localeLong.toLowerCase()}, ${monthIndex + 1}`,\n        isDisabled: !!isDisabled,\n        monthValue: monthItem.value,\n      };\n    });\n  }, [monthsLocale, year, dateMin, dateMax, isShortLabel]);\n\n  const handleSelectChange = (value: ISelectLanguageOption[]) => {\n    if (value.length === 0) onChange(null);\n    onChange(+value[0].value);\n  };\n  const valueLocal = useMemo(() => {\n    const findOption = option.find((e) => e.value === value);\n    if (!findOption) return [];\n    return [findOption];\n  }, [value, option]);\n\n  return <Select<ISelectLanguageOption> {...props} option={option} value={valueLocal} onChange={handleSelectChange} />;\n};\nexport const SelectMonths: FC<SelectMonthsProps> = (props) => {\n  const { value, onChange, dateMin, dateMax, monthsLocale, isShortLabel } = props;\n\n  const year = moment(value).utc().year();\n\n  const option = useMemo(() => {\n    return monthsLocale.map((monthItem) => {\n      const monthIndex = moment().month(monthItem.value).month();\n\n      const monthMoment = moment.utc().year(year).month(monthIndex).startOf('month');\n      const isDisabled =\n        (dateMin && monthMoment.isBefore(moment.utc(dateMin), 'month')) ||\n        (dateMax && monthMoment.isAfter(moment.utc(dateMax), 'month'));\n\n      return {\n        value: monthMoment.valueOf(),\n        label: isShortLabel ? monthItem.localeShort : monthItem.localeLong,\n        placeholder: isShortLabel ? monthItem.localeShort : monthItem.localeLong,\n        search: `${monthItem.localeLong.toLowerCase()}, ${monthIndex + 1}`,\n        isDisabled: !!isDisabled,\n        monthValue: monthItem.value,\n      };\n    });\n  }, [monthsLocale, year, dateMin, dateMax, isShortLabel]);\n  const [viewOption, setViewOption] = useState<ISelectLanguageOption[]>(option);\n\n  useEffect(() => {\n    setViewOption(option);\n  }, [option]);\n  const handleSelectChange = (value: ISelectLanguageOption[]) => {\n    if (value.length === 0) onChange([]);\n    onChange(value.map((e) => +e.value));\n  };\n  const valueLocal = useMemo(() => {\n    if (!value || value.length === 0) return [];\n    return value.map((val) => option.find((opt) => opt.value === val)).filter(Boolean) as ISelectLanguageOption[];\n  }, [value, option]);\n\n  const [search, setSearch] = useState<string>('');\n  const handleSearchChange = useCallback(\n    (value: string) => {\n      setSearch(value);\n\n      if (value === '') {\n        setViewOption(option);\n      } else {\n        const filteredOptions = option.filter((option) =>\n          Object.values(option).some((field) => field?.toString().toLowerCase().includes(value.toLowerCase())),\n        );\n        setViewOption(filteredOptions);\n      }\n    },\n    [option],\n  );\n  return (\n    <Select<ISelectLanguageOption>\n      {...props}\n      valueSearch={search}\n      onChangeSearch={handleSearchChange}\n      optionAllLength={option.length}\n      option={viewOption}\n      minViewDropdown={1}\n      isMulti\n      value={valueLocal}\n      onChange={handleSelectChange}\n      onChangeAll={(_value, isAll) => {\n        if (isAll) {\n          onChange(viewOption.map((e) => +e.value));\n        } else {\n          onChange([]);\n        }\n      }}\n    />\n  );\n};\nexport const SelectYear: FC<SelectYearProps> = (props) => {\n  const { value, onChange, dateMin, dateMax, sortOrder = 'desc' } = props;\n\n  const startYear = moment(dateMin).utc().year();\n  const endYear = moment(dateMax).utc().year();\n\n  const option = useMemo(() => {\n    const yearArray = Array.from({ length: endYear - startYear + 1 }, (_, index) => {\n      const year = startYear + index;\n      return {\n        value: moment().year(year).utc().startOf('year').valueOf(),\n        label: moment().year(year).utc().format('YYYY'),\n        placeholder: moment().year(year).utc().format('YYYY'),\n        search: `${moment().year(year).utc().format('YYYY').toLowerCase()}`,\n      };\n    });\n\n    return sortOrder === 'asc'\n      ? yearArray.sort((a, b) => a.value - b.value)\n      : yearArray.sort((a, b) => b.value - a.value);\n  }, [endYear, startYear, sortOrder]);\n\n  const handleSelectChange = (value: ISelectLanguageOption[]) => {\n    if (value.length === 0) onChange(null);\n    onChange(+value[0].value);\n  };\n  const valueLocal = useMemo(() => {\n    const findOption = option.find((e) => e.value === value);\n    if (!findOption) return [];\n    return [findOption];\n  }, [value, option]);\n\n  return <Select<ISelectLanguageOption> {...props} option={option} value={valueLocal} onChange={handleSelectChange} />;\n};\nexport const SelectMapTheme: FC<SelectMapThemeProps> = (props) => {\n  const { value, onChange } = props;\n\n  const option = useMemo(() => MapThemeList.map((e) => ({ label: e.name, value: e.name, placeholder: e.name })), []);\n\n  const [viewOption, setViewOption] = useState<ISelectMapThemeOption[]>(option);\n  useEffect(() => {\n    setViewOption(option);\n  }, [option]);\n  const handleSelectChange = (value: ISelectMapThemeOption[]) => {\n    if (value.length === 0) onChange(null);\n    const findOption = MapThemeList.find((e) => e.name === value[0].value);\n    onChange(findOption ?? null);\n  };\n  const valueLocal = useMemo(() => {\n    const findOption = option.find((e) => e.value === value.name);\n    if (!findOption) return [];\n    return [findOption];\n  }, [value, option]);\n\n  const [search, setSearch] = useState<string>('');\n  const handleSearchChange = useCallback(\n    (value: string) => {\n      setSearch(value);\n\n      if (value === '') {\n        setViewOption(option);\n      } else {\n        const filteredOptions = option.filter((option) =>\n          Object.values(option).some((field) => field?.toString().toLowerCase().includes(value.toLowerCase())),\n        );\n        setViewOption(filteredOptions);\n      }\n    },\n    [option],\n  );\n  return (\n    <Select<ISelectMapThemeOption>\n      {...props}\n      option={viewOption}\n      value={valueLocal}\n      onChange={handleSelectChange}\n      valueSearch={search}\n      onChangeSearch={handleSearchChange}\n    />\n  );\n};\n","import { Icon } from '@local/components/icon';\nimport { addFont, addRemoveOutline } from '@local/styles/add';\nimport { addError } from '@local/styles/error';\nimport { addSX } from '@local/styles/sx';\nimport { KEY_SIZE_DATA } from '@local/theme/theme';\n\nimport { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\n\nimport { TextArea } from '../textarea';\nimport {\n  ButtonListProps,\n  DropdownListOptionIconProps,\n  DropdownListOptionProps,\n  DropdownListParentProps,\n  SelectListOptionProps,\n  SelectListProps,\n  SelectWrapperProps,\n} from '.';\n\nconst addSelectWrapperGenre = css<SelectWrapperProps>`\n  ${(props) => css`\n    background: ${props.theme.colors.input[props.$genre].background.rest};\n    border-color: ${props.theme.colors.input[props.$genre].border.rest};\n    color: ${props.theme.colors.input[props.$genre].color.rest};\n    ${\n      !props.$isNotShowHoverStyle &&\n      css`\n      &:hover {\n        background: ${props.theme.colors.input[props.$genre].background.hover};\n        border-color: ${props.theme.colors.input[props.$genre].border.hover};\n        color: ${props.theme.colors.input[props.$genre].color.hover};\n      }\n    `\n    }\n      ${\n        props.$isOpen &&\n        css`\n      background: ${props.theme.colors.input[props.$genre].background.rest};\n      border-color: ${props.theme.colors.input[props.$genre].border.rest};\n      color: ${props.theme.colors.input[props.$genre].color.rest};\n    `\n      }\n  `};\n`;\nconst addSelectWrapperSize = css<SelectWrapperProps>`\n  border: 1px solid;\n  width: 100%;\n  padding: ${(props) => KEY_SIZE_DATA[props.$size].padding / 4}px\n    ${(props) => KEY_SIZE_DATA[props.$size].padding - KEY_SIZE_DATA[props.$size].padding / 2.8}px;\n  gap: ${(props) => KEY_SIZE_DATA[props.$size].padding / 2.8}px;\n  height: fit-content;\n  min-height: ${(props) => KEY_SIZE_DATA[props.$size].height}px;\n  border-radius: ${(props) => KEY_SIZE_DATA[props.$size].radius}px;\n  justify-content: ${(props) => (props.$isCenter ? 'center' : 'flex-start')};\n  ${(props) =>\n    props.$isOpen &&\n    css`\n      outline: 2px ${(props) => props.theme.states.focus} solid;\n      outline-offset: 1px;\n    `}\n`;\nexport const SelectWrapper = styled(motion.div)<SelectWrapperProps>`\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  align-items: center;\n  align-content: center;\n  flex-wrap: wrap;\n  ${addSelectWrapperGenre};\n  ${addSelectWrapperSize};\n  ${addError};\n  ${addSX};\n`;\nconst addDropdownListParentSize = css<DropdownListParentProps>`\n  gap: ${(props) => KEY_SIZE_DATA[props.$size].padding / 2.8}px;\n`;\nexport const DropdownListParent = styled(motion.div)<DropdownListParentProps>`\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  overflow-y: auto;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  ${addDropdownListParentSize};\n`;\nexport const DropdownList = styled.ul`\n  list-style: none;\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  transform: translateZ(0);\n  flex-shrink: 0;\n`;\n\nconst addDropdownListOptionGenre = css<DropdownListOptionProps>`\n  ${(props) => css`\n    background: ${props.theme.colors.select[props.$genre].background.rest};\n    border-color: ${props.theme.colors.select[props.$genre].border.rest};\n    color: ${props.theme.colors.select[props.$genre].color.rest};\n    &:active {\n      background: ${props.theme.colors.select[props.$genre].background.rest};\n      border-color: ${props.theme.colors.select[props.$genre].border.rest};\n      color: ${props.theme.colors.select[props.$genre].color.rest};\n    }\n    ${\n      !props.$isNotShowHoverStyle &&\n      css`\n      &:hover {\n        background: ${props.theme.colors.select[props.$genre].background.hover};\n        border-color: ${props.theme.colors.select[props.$genre].border.hover};\n        color: ${props.theme.colors.select[props.$genre].color.hover};\n      }\n    `\n    }\n    &:focus-visible {\n      background: ${props.theme.colors.select[props.$genre].background.rest};\n      border-color: ${props.theme.colors.select[props.$genre].border.rest};\n      color: ${props.theme.colors.select[props.$genre].color.rest};\n    }\n  `};\n`;\nconst addDropdownListOptionSize = css<DropdownListOptionProps>`\n  padding: 0px ${(props) => KEY_SIZE_DATA[props.$size].padding}px;\n  width: 100%;\n  border: 1px solid;\n  border-radius: 0;\n  justify-content: ${(props) => (props.$isCenter ? 'center' : 'flex-start')};\n  &:first-child {\n    ${(props) =>\n      props.$isShowScroll\n        ? css`\n            border-radius: ${KEY_SIZE_DATA[props.$size].radius}px 0px 0px 0px;\n          `\n        : css`\n            border-radius: ${KEY_SIZE_DATA[props.$size].radius}px ${KEY_SIZE_DATA[props.$size].radius}px 0px 0px;\n          `}\n  }\n  &:last-child {\n    ${(props) =>\n      props.$isShowScroll\n        ? css`\n            border-radius: 0px 0px 0px ${KEY_SIZE_DATA[props.$size].radius}px;\n          `\n        : css`\n            border-radius: 0px 0px ${KEY_SIZE_DATA[props.$size].radius}px ${KEY_SIZE_DATA[props.$size].radius}px;\n          `}\n  }\n  &:not(:first-child):not(:last-child) {\n    border-radius: 0px;\n  }\n  &:first-child:last-child {\n    ${(props) =>\n      props.$isShowScroll\n        ? css`\n            border-radius: ${KEY_SIZE_DATA[props.$size].radius}px 0px 0px ${KEY_SIZE_DATA[props.$size].radius}px;\n          `\n        : css`\n            border-radius: ${KEY_SIZE_DATA[props.$size].radius}px;\n          `}\n  }\n`;\nexport const DropdownListOption = styled.li<DropdownListOptionProps>`\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  user-select: none;\n  flex-shrink: 0;\n  opacity: ${(props) => (props.$item?.isDisabled ? 0.5 : 1)};\n  ${addFont};\n  ${addDropdownListOptionGenre};\n  ${addDropdownListOptionSize};\n  ${addRemoveOutline};\n`;\n\nconst addDropdownOptionIconSize = css<DropdownListOptionIconProps>`\n  right: ${(props) => KEY_SIZE_DATA[props.$size].padding - 6}px;\n  height: ${(props) => KEY_SIZE_DATA[props.$size].height}px;\n`;\nexport const DropdownListOptionIcon = styled(Icon)<DropdownListOptionIconProps>`\n  position: absolute;\n  right: 0;\n  height: 100%;\n  align-items: center;\n  ${addDropdownOptionIconSize};\n  ${addRemoveOutline};\n  color: ${(props) =>\n    props.$checked\n      ? props.theme.colors.select[props.$genre].border.select\n      : props.theme.colors.input[props.$genre].border.rest};\n`;\n\nconst addSelectListSize = css<SelectListProps>`\n  display: flex;\n  flex-direction: row;\n  flex-wrap: ${(props) => (props.$isWrapSelectOption ? 'wrap' : 'nowrap')};\n  gap: ${(props) => KEY_SIZE_DATA[props.$size].padding / 2.8}px;\n`;\nexport const SelectList = styled.ul<SelectListProps>`\n  list-style: none;\n  position: relative;\n  overflow: hidden;\n  ${addSelectListSize};\n`;\nconst addButtonListSize = css<ButtonListProps>`\n  display: flex;\n  flex-direction: row;\n  gap: ${(props) => KEY_SIZE_DATA[props.$size].padding / 2.8}px;\n  padding: ${(props) => KEY_SIZE_DATA[props.$size].padding / 2.8}px ${(props) => KEY_SIZE_DATA[props.$size].padding}px;\n`;\nexport const ButtonList = styled.div<ButtonListProps>`\n  position: absolute;\n  right: 0;\n  ${addButtonListSize};\n`;\nconst addSelectListOptionGenre = css<SelectListOptionProps>`\n${(props) =>\n  props.$isOnlyColorInSelectListOption\n    ? css`\n      border: 0px solid;\n      border-color: transparent;\n      background-color: transparent;\n      color: ${props.theme.colors.select[props.$genre].color.rest};\n      &:active {\n        color: ${props.theme.colors.select[props.$genre].color.rest};\n      }\n      ${\n        !props.$isNotShowHoverStyle &&\n        css`\n        &:hover {\n          color: ${props.theme.colors.select[props.$genre].color.hover};\n        }\n      `\n      }\n      &:focus-visible {\n        color: ${props.theme.colors.select[props.$genre].color.rest};\n      }\n    `\n    : css`\n      border: 1px solid;\n      background: ${props.theme.colors.select[props.$genre].background.rest};\n      border-color: ${props.theme.colors.select[props.$genre].border.rest};\n      color: ${props.theme.colors.select[props.$genre].color.rest};\n      &:active {\n        background: ${props.theme.colors.select[props.$genre].background.rest};\n        border-color: ${props.theme.colors.select[props.$genre].border.rest};\n        color: ${props.theme.colors.select[props.$genre].color.rest};\n      }\n      ${\n        !props.$isNotShowHoverStyle &&\n        css`\n        &:hover {\n          background: ${props.theme.colors.select[props.$genre].background.hover};\n          border-color: ${props.theme.colors.select[props.$genre].border.hover};\n          color: ${props.theme.colors.select[props.$genre].color.hover};\n        }\n      `\n      }\n      &:focus-visible {\n        background: ${props.theme.colors.select[props.$genre].background.rest};\n        border-color: ${props.theme.colors.select[props.$genre].border.rest};\n        color: ${props.theme.colors.select[props.$genre].color.rest};\n      }\n    `}\n`;\nconst addSelectListOptionSize = css<SelectListOptionProps>`\n  padding: ${(props) => KEY_SIZE_DATA[props.$size].padding / 2.8}px;\n  border-radius: ${(props) => KEY_SIZE_DATA[props.$size].radius}px;\n`;\nexport const SelectListOption = styled(motion.li)<SelectListOptionProps>`\n  display: flex;\n  align-items: center;\n  opacity: 1;\n  cursor: ${(props) => (props.$isClearWhenClickSelectListOption ? 'pointer' : 'default')};\n  flex-shrink: 0;\n  overflow: hidden;\n  width: fit-content;\n  ${addSelectListOptionGenre};\n  ${addSelectListOptionSize};\n  ${addRemoveOutline};\n`;\n\nexport const SelectTextArea = styled(TextArea)`\n  border: 0 !important;\n  background-color: transparent !important;\n  min-height: initial !important;\n  width: 100%;\n  max-width: 100%;\n  flex-grow: 1;\n  padding: ${(props) => KEY_SIZE_DATA[props.size].padding / 2.8}px 0px ${(props) => KEY_SIZE_DATA[props.size].padding / 2.8}px ${(props) => KEY_SIZE_DATA[props.size].padding / 2.8}px;\n  ${addRemoveOutline};\n`;\n"],"names":["DEFAULT_LABEL_AND_MORE","count","DEFAULT_LABEL_ADD_OPTION","value","Select","props","sizeHeight","useMemo","KEY_SIZE_DATA","size","height","sizePadding","padding","sizeRadius","radius","isOpen","close","open","refReference","refReferencePopover","refFloating","refFloatingPopover","floatingStyles","toggle","usePopover","placement","offset","mode","isClickOutside","isWidthAsContent","isDisabled","onBlur","onFocus","refTextArea","useRef","refDropdownList","useMergeRefs","labelSelectAll","labelPlaceholder","labelEmptyOption","labelAndMore","labelAddOption","maxViewSelect","maxViewDropdown","minViewDropdown","isAll","length","option","optionAllLength","isHaveOption","isHaveValue","isShowAddOption","valueSearch","isShowSearch","setIsShowSearch","useState","optionsLength","isNotShowDisabledOptions","filter","heightDropdownList","heightPopover","selectAll","isShowSelectAll","selectNoOption","selectList","selectAdd","sum","isValueMoreMaxViewSelect","isShowIconSearchClear","isShowButtonList","isShowIconToggle","isShowIconFetching","isFetching","isShowScroll","isSelectedItem","useCallback","some","val","isShowDropdownSettingsList","listVirtualizer","useVirtualizer","estimateSize","getEstimateSize","getScrollElement","current","overscan","paddingEnd","onChangeShowSearch","show","isSearch","onClick","newValues","optionValue","index","findIndex","isFind","isMulti","slice","isStayValueAfterSelect","onChange","isStaySearchAfterSelect","isOnClickOptionClose","onClickAll","_a","onChangeAll","call","onClearSearch","onChangeSearch","onScroll","containerRefElement","scrollHeight","scrollTop","clientHeight","fetchNextPage","onAddOption","_b","useEffect","theme","useTheme","font","weight","isBold","family","_c","_d","jsxs","Fragment","children","SelectWrapper","tabIndex","$error","error","$isNotShowHoverStyle","isNotShowHoverStyle","$size","$genre","genre","$isCenter","isCenter","$sx","sx","$isOpen","ref","jsx","SelectTextArea","minRows","maxRows","isAutoHeight","placeholder","isShowSelectAllLabel","SelectList","$isWrapSelectOption","isWrapSelectOption","onMouseDown","e","preventDefault","map","isChecked","ContainerSelectListOption","isClearWhenClickSelectListOption","item","isOnlyColorInSelectListOption","Typography","sxStandard","default","line","isNoUserSelect","color","colors","input","ButtonList","Button","isWidthAsHeight","isFullSize","isRadius","isOnlyIcon","icons","name","type","stopPropagation","isHiddenBorder","isDisabledRipple","isNotHoverEffect","Icon","Popover","background","rest","borderRadius","maxHeight","isShowAlwaysOutline","DropdownListParent","target","DropdownList","style","position","top","zIndex","DropdownListOption","onKeyDown","key","$font","$isBold","$isChecked","minHeight","$isShowScroll","isShowDropdownOptionIcon","DropdownListOptionIcon","$checked","getTotalSize","getVirtualItems","virtualRow","ContainerDropdownListOption","virtualRowSize","virtualRowStart","start","ErrorMessage","memo","event","transform","$item","label","SelectListOption","$isOnlyColorInSelectListOption","$isClearWhenClickSelectListOption","addSelectWrapperGenre","css","border","hover","addSelectWrapperSize","states","focus","styled","motion","div","addError","addSX","addDropdownListParentSize","ul","addDropdownListOptionGenre","select","addDropdownListOptionSize","li","addFont","addRemoveOutline","addDropdownOptionIconSize","addSelectListSize","addButtonListSize","addSelectListOptionGenre","addSelectListOptionSize","TextArea","ListLanguage","viewOption","valueLocal","findOption","find","toString","MapThemeList","setViewOption","search","setSearch","handleSearchChange","filteredOptions","Object","values","field","toLowerCase","includes","dateMin","dateMax","monthsLocale","isShortLabel","year","moment","utc","monthItem","monthIndex","month","monthMoment","startOf","isBefore","isAfter","valueOf","localeShort","localeLong","monthValue","opt","Boolean","_value","sortOrder","startYear","endYear","yearArray","Array","from","_","format","sort","a","b"],"mappings":"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"}