@mage-ui/components 1.0.16 → 1.0.18

package/dist/components/controls/dropzone/use-dropzone-state.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-dropzone-state.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/use-dropzone-state.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport type { FileData } from './Dropzone';\nimport { uploadFile } from './upload-service';\n\nexport const useDropzoneState = (\n  url: string,\n  initialFiles: Record<string, FileData> | FileData | null | undefined = {},\n) => {\n  const normalizeInitialFiles = (): Record<string, FileData> => {\n    if (!initialFiles) return {};\n\n    if (typeof initialFiles === 'object' && !('name' in initialFiles)) {\n      return initialFiles as Record<string, FileData>;\n    }\n\n    if (typeof initialFiles === 'object' && 'name' in initialFiles) {\n      const fileData = initialFiles as FileData;\n      return {\n        [fileData.name]: {\n          name: fileData.name,\n          size: fileData.size,\n          type: fileData.type,\n          date: fileData.date,\n          uploaded: fileData.uploaded ?? true,\n          loading: fileData.loading ?? false,\n          url: fileData.url,\n          error: fileData.error,\n          progress: fileData.progress,\n        },\n      };\n    }\n\n    return {};\n  };\n\n  const [files, setFiles] = useState<Record<string, FileData>>(\n    normalizeInitialFiles(),\n  );\n  const [isUploading, setIsUploading] = useState(false);\n  const uploadQueue = useRef<Set<string>>(new Set());\n\n  const addFile = useCallback((file: File) => {\n    const fileData: FileData = {\n      name: file.name,\n      size: file.size,\n      type: file.type,\n      url: '',\n      uploaded: false,\n      loading: false,\n      progress: 0,\n      date: new Date().toLocaleString('es-ES', {\n        timeZone: 'Europe/Madrid',\n        year: 'numeric',\n        month: '2-digit',\n        day: '2-digit',\n        hour: '2-digit',\n        minute: '2-digit',\n        second: '2-digit',\n      }),\n    };\n\n    setFiles((prev) => ({\n      ...prev,\n      [file.name]: fileData,\n    }));\n\n    return file.name;\n  }, []);\n\n  const updateFileProgress = useCallback(\n    (fileName: string, progress: number) => {\n      setFiles((prev) => ({\n        ...prev,\n        [fileName]: {\n          ...prev[fileName],\n          progress,\n          loading: progress < 100,\n        },\n      }));\n    },\n    [],\n  );\n\n  const markFileAsUploaded = useCallback((fileName: string, url: string) => {\n    setFiles((prev) => ({\n      ...prev,\n      [fileName]: {\n        ...prev[fileName],\n        uploaded: true,\n        loading: false,\n        progress: 100,\n        url,\n      },\n    }));\n  }, []);\n\n  const markFileAsError = useCallback((fileName: string, error: string) => {\n    setFiles((prev) => ({\n      ...prev,\n      [fileName]: {\n        ...prev[fileName],\n        uploaded: false,\n        loading: false,\n        progress: 0,\n        error,\n      },\n    }));\n  }, []);\n\n  const removeFile = useCallback((fileName: string) => {\n    setFiles((prev) => {\n      const newFiles = { ...prev };\n      delete newFiles[fileName];\n      return newFiles;\n    });\n    uploadQueue.current.delete(fileName);\n  }, []);\n\n  const clearFiles = useCallback(() => {\n    setFiles({});\n    uploadQueue.current.clear();\n  }, []);\n\n  const isFileUploading = useCallback((fileName: string) => {\n    return uploadQueue.current.has(fileName);\n  }, []);\n\n  const addToUploadQueue = useCallback((fileName: string) => {\n    uploadQueue.current.add(fileName);\n  }, []);\n\n  const removeFromUploadQueue = useCallback((fileName: string) => {\n    uploadQueue.current.delete(fileName);\n  }, []);\n\n  const uploadFileToServer = useCallback(\n    async (file: File, data?: Record<string, unknown>) => {\n      const fileName = addFile(file);\n      addToUploadQueue(fileName);\n\n      try {\n        const { body } = await uploadFile(url, file, data, (progress) => {\n          updateFileProgress(fileName, progress.percentage);\n        });\n\n        markFileAsUploaded(fileName, body.url);\n      } catch (error) {\n        console.error('Error al subir archivo:', error);\n        markFileAsError(\n          fileName,\n          error instanceof Error ? error.message : 'Error desconocido',\n        );\n      } finally {\n        removeFromUploadQueue(fileName);\n      }\n    },\n    [\n      addFile,\n      addToUploadQueue,\n      updateFileProgress,\n      markFileAsUploaded,\n      markFileAsError,\n      removeFromUploadQueue,\n      url,\n    ],\n  );\n\n  const uploadMultipleFiles = useCallback(\n    async (acceptedFiles: File[], data?: Record<string, unknown>) => {\n      if (isUploading) {\n        console.warn('Ya hay una subida en progreso');\n        return;\n      }\n\n      setIsUploading(true);\n\n      try {\n        for (const file of acceptedFiles) {\n          await uploadFileToServer(file, data);\n        }\n      } finally {\n        setIsUploading(false);\n      }\n    },\n    [isUploading, setIsUploading, uploadFileToServer],\n  );\n\n  return {\n    files,\n    isUploading,\n    setIsUploading,\n    addFile,\n    updateFileProgress,\n    markFileAsUploaded,\n    markFileAsError,\n    removeFile,\n    clearFiles,\n    isFileUploading,\n    addToUploadQueue,\n    removeFromUploadQueue,\n    uploadFileToServer,\n    uploadMultipleFiles,\n  };\n};\n"],"mappings":"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"}
+{"version":3,"file":"use-dropzone-state.mjs","names":[],"sources":["../../../../src/components/controls/dropzone/use-dropzone-state.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\n\nimport type { FileData } from './Dropzone';\nimport { uploadFile } from './upload-service';\n\nexport const useDropzoneState = (\n  url: string,\n  initialFiles: Record<string, FileData> | FileData | null | undefined = {},\n) => {\n  const normalizeInitialFiles = (): Record<string, FileData> => {\n    if (!initialFiles) return {};\n\n    if (typeof initialFiles === 'object' && !('name' in initialFiles)) {\n      return initialFiles as Record<string, FileData>;\n    }\n\n    if (typeof initialFiles === 'object' && 'name' in initialFiles) {\n      const fileData = initialFiles as FileData;\n      return {\n        [fileData.name]: {\n          name: fileData.name,\n          size: fileData.size,\n          type: fileData.type,\n          date: fileData.date,\n          uploaded: fileData.uploaded ?? true,\n          loading: fileData.loading ?? false,\n          url: fileData.url,\n          error: fileData.error,\n          progress: fileData.progress,\n        },\n      };\n    }\n\n    return {};\n  };\n\n  const [files, setFiles] = useState<Record<string, FileData>>(\n    normalizeInitialFiles(),\n  );\n  const [isUploading, setIsUploading] = useState(false);\n  const uploadQueue = useRef<Set<string>>(new Set());\n\n  const addFile = useCallback((file: File) => {\n    const fileData: FileData = {\n      name: file.name,\n      size: file.size,\n      type: file.type,\n      url: '',\n      uploaded: false,\n      loading: false,\n      progress: 0,\n      date: new Date().toLocaleString('es-ES', {\n        timeZone: 'Europe/Madrid',\n        year: 'numeric',\n        month: '2-digit',\n        day: '2-digit',\n        hour: '2-digit',\n        minute: '2-digit',\n        second: '2-digit',\n      }),\n    };\n\n    setFiles((prev) => ({\n      ...prev,\n      [file.name]: fileData,\n    }));\n\n    return file.name;\n  }, []);\n\n  const updateFileProgress = useCallback(\n    (fileName: string, progress: number) => {\n      setFiles((prev) => ({\n        ...prev,\n        [fileName]: {\n          ...prev[fileName],\n          progress,\n          loading: progress < 100,\n        },\n      }));\n    },\n    [],\n  );\n\n  const markFileAsUploaded = useCallback((fileName: string, url: string) => {\n    setFiles((prev) => ({\n      ...prev,\n      [fileName]: {\n        ...prev[fileName],\n        uploaded: true,\n        loading: false,\n        progress: 100,\n        url,\n      },\n    }));\n  }, []);\n\n  const markFileAsError = useCallback((fileName: string, error: string) => {\n    setFiles((prev) => ({\n      ...prev,\n      [fileName]: {\n        ...prev[fileName],\n        uploaded: false,\n        loading: false,\n        progress: 0,\n        error,\n      },\n    }));\n  }, []);\n\n  const removeFile = useCallback((fileName: string) => {\n    setFiles((prev) => {\n      const newFiles = { ...prev };\n      delete newFiles[fileName];\n      return newFiles;\n    });\n    uploadQueue.current.delete(fileName);\n  }, []);\n\n  const clearFiles = useCallback(() => {\n    setFiles({});\n    uploadQueue.current.clear();\n  }, []);\n\n  const isFileUploading = useCallback((fileName: string) => {\n    return uploadQueue.current.has(fileName);\n  }, []);\n\n  const addToUploadQueue = useCallback((fileName: string) => {\n    uploadQueue.current.add(fileName);\n  }, []);\n\n  const removeFromUploadQueue = useCallback((fileName: string) => {\n    uploadQueue.current.delete(fileName);\n  }, []);\n\n  const uploadFileToServer = useCallback(\n    async (file: File, data?: Record<string, unknown>) => {\n      const fileName = addFile(file);\n      addToUploadQueue(fileName);\n\n      try {\n        const { body } = await uploadFile(url, file, data, (progress) => {\n          updateFileProgress(fileName, progress.percentage);\n        });\n\n        markFileAsUploaded(fileName, body.url);\n      } catch (error) {\n        console.error('Error al subir archivo:', error);\n        markFileAsError(\n          fileName,\n          error instanceof Error ? error.message : 'Error desconocido',\n        );\n      } finally {\n        removeFromUploadQueue(fileName);\n      }\n    },\n    [\n      addFile,\n      addToUploadQueue,\n      updateFileProgress,\n      markFileAsUploaded,\n      markFileAsError,\n      removeFromUploadQueue,\n      url,\n    ],\n  );\n\n  const uploadMultipleFiles = useCallback(\n    async (acceptedFiles: File[], data?: Record<string, unknown>) => {\n      if (isUploading) {\n        console.warn('Ya hay una subida en progreso');\n        return;\n      }\n\n      setIsUploading(true);\n\n      try {\n        for (const file of acceptedFiles) {\n          await uploadFileToServer(file, data);\n        }\n      } finally {\n        setIsUploading(false);\n      }\n    },\n    [isUploading, setIsUploading, uploadFileToServer],\n  );\n\n  return {\n    files,\n    isUploading,\n    setIsUploading,\n    addFile,\n    updateFileProgress,\n    markFileAsUploaded,\n    markFileAsError,\n    removeFile,\n    clearFiles,\n    isFileUploading,\n    addToUploadQueue,\n    removeFromUploadQueue,\n    uploadFileToServer,\n    uploadMultipleFiles,\n  };\n};\n"],"mappings":"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"}

package/dist/components/controls/dropzone-files/DropzoneFiles.d.mts

@@ -1,9 +1,8 @@
-import { IconProps } from "../../data-display/icons/icon/Icon.mjs";
-import { IconWrappedProps } from "../../data-display/icons/icon-wrapped/IconWrapped.mjs";
 import { UploadedFileProps } from "../../data-display/uploaded-file/UploadedFile.mjs";
 import "../../data-display/index.mjs";
 import { DropzoneProps, FileData } from "../dropzone/Dropzone.mjs";
-import * as react_jsx_runtime21 from "react/jsx-runtime";
+import "../index.mjs";
+import * as react_jsx_runtime28 from "react/jsx-runtime";
 import { ReactNode } from "react";
 
 //#region src/components/controls/dropzone-files/DropzoneFiles.d.ts
@@ -34,8 +33,6 @@ type DropzoneFilesProps = {
     scrollArea?: {
       scrollArea?: string;
     };
-    startIconWrapped?: IconWrappedProps['classNames'];
-    startIcon?: IconProps['classNames'];
   };
 };
 declare const DropzoneFiles: ({
@@ -51,7 +48,7 @@ declare const DropzoneFiles: ({
   url,
   inputId,
   classNames
-}: DropzoneFilesProps) => react_jsx_runtime21.JSX.Element;
+}: DropzoneFilesProps) => react_jsx_runtime28.JSX.Element;
 //#endregion
 export { DropzoneFiles, DropzoneFilesProps };
 //# sourceMappingURL=DropzoneFiles.d.mts.map

package/dist/components/controls/dropzone-files/DropzoneFiles.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"DropzoneFiles.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone-files/DropzoneFiles.tsx"],"mappings":";;;;;;;;;KAkCY,kBAAA;EACV,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,KAAA,GAAQ,SAAA;EACR,QAAA,GAAW,SAAA;EACX,IAAA,GAAO,SAAA;EACP,YAAA,GAAe,MAAA,SAAe,QAAA;EAC9B,QAAA;EACA,MAAA;EACA,GAAA;EACA,OAAA;EACA,cAAA;EACA,UAAA;IACE,aAAA;IACA,IAAA;IACA,YAAA;IACA,KAAA;IACA,WAAA;IACA,KAAA;IACA,QAAA;IACA,QAAA;IACA,YAAA,GAAe,iBAAA;IACf,QAAA,GAAW,aAAA;IACX,UAAA;MAAe,UAAA;IAAA;IACf,gBAAA,GAAmB,gBAAA;IACnB,SAAA,GAAY,SAAA;EAAA;AAAA;AAAA,cAIH,aAAA;EAAiB,KAAA;EAAA,WAAA;EAAA,KAAA;EAAA,KAAA;EAAA,QAAA;EAAA,IAAA;EAAA,YAAA;EAAA,QAAA;EAAA,MAAA;EAAA,GAAA;EAAA,OAAA;EAAA;AAAA,GAa3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"DropzoneFiles.d.mts","names":[],"sources":["../../../../src/components/controls/dropzone-files/DropzoneFiles.tsx"],"mappings":";;;;;;;;KAoCY,kBAAA;EACV,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,KAAA,GAAQ,SAAA;EACR,QAAA,GAAW,SAAA;EACX,IAAA,GAAO,SAAA;EACP,YAAA,GAAe,MAAA,SAAe,QAAA;EAC9B,QAAA;EACA,MAAA;EACA,GAAA;EACA,OAAA;EACA,cAAA;EACA,UAAA;IACE,aAAA;IACA,IAAA;IACA,YAAA;IACA,KAAA;IACA,WAAA;IACA,KAAA;IACA,QAAA;IACA,QAAA;IACA,YAAA,GAAe,iBAAA;IACf,QAAA,GAAW,aAAA;IACX,UAAA;MAAe,UAAA;IAAA;EAAA;AAAA;AAAA,cAMN,aAAA;EAAiB,KAAA;EAAA,WAAA;EAAA,KAAA;EAAA,KAAA;EAAA,QAAA;EAAA,IAAA;EAAA,YAAA;EAAA,QAAA;EAAA,MAAA;EAAA,GAAA;EAAA,OAAA;EAAA;AAAA,GAa3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/dropzone-files/DropzoneFiles.mjs

@@ -1,2 +1,2 @@
-import{Icon as e}from"../../data-display/icons/icon/Icon.mjs";import{IconWrapped as t}from"../../data-display/icons/icon-wrapped/IconWrapped.mjs";import{UploadedFile as n}from"../../data-display/uploaded-file/UploadedFile.mjs";import{Dropzone as r}from"../dropzone/Dropzone.mjs";import{cx as i}from"@mage-ui/styled-system/css";import{dropzoneFiles as a,dropzoneFilesDescription as o,dropzoneFilesDropzone as s,dropzoneFilesError as c,dropzoneFilesFileItem as l,dropzoneFilesFileList as u,dropzoneFilesLabel as d,dropzoneFilesLabelWrapper as f,dropzoneFilesRoot as p,dropzoneFilesUploadedFile as m,dropzoneFilesUploadedFileStartIcon as h,dropzoneFilesUploadedFileStartIconIconRaw as g,dropzoneFilesUploadedFileStartIconIconRawRoot as _,dropzoneFilesUploadedFileStartIconRoot as v,dropzoneFilesUploadedFileStartIconWrapped as y,dropzoneFilesUploadedFileStartIconWrappedRoot as b}from"@mage-ui/styled-system/recipes";import{jsx as x,jsxs as S}from"react/jsx-runtime";import{useId as C}from"react";const w=({label:w,description:T,error:E,title:D,subtitle:O,hint:k,initialFiles:A,maxFiles:j,accept:M,url:N,inputId:P,classNames:F})=>{let I=C(),L=P??I;return S(`div`,{className:i(F?.dropzoneFiles??a(),F?.root??p()),children:[S(`div`,{className:F?.labelWrapper??f(),children:[w&&x(`label`,{htmlFor:L,className:F?.label??d(),children:w}),T&&x(`p`,{className:F?.description??o(),children:T})]}),x(r,{maxFiles:j,accept:M,url:N,initialFiles:A,inputId:L,title:D,subtitle:O,hint:k,classNames:{dropzone:F?.dropzone?.dropzone??s()},children:({files:r,removeFile:i})=>x(`ul`,{className:F?.fileList??u(),children:Object.values(r).map(r=>x(`li`,{className:F?.fileItem??l(),children:x(n,{fileName:r.name,fileSize:`${(r.size/1024).toFixed(1)} KB`,fileDate:r.date,fileType:r.type,url:r.url,onRemove:()=>i(r.name),startSlot:x(t,{classNames:{iconWrapped:F?.startIconWrapped?.iconWrapped??y(),root:F?.startIconWrapped?.root??b()},children:x(e,{name:`mage-uploadedfile-file-attachment-01`,path:`/icons/sprite-mage.svg`,classNames:{icon:F?.startIcon?.icon??h(),root:F?.startIcon?.root??v(),iconRaw:{iconRaw:F?.startIcon?.iconRaw?.iconRaw??g(),root:F?.startIcon?.iconRaw?.root??_()}}})}),classNames:{uploadedFile:F?.uploadedFile?.uploadedFile??m()}},r.name)},r.name))})}),E&&x(`p`,{className:F?.error??c(),children:E})]})};export{w as DropzoneFiles};
+import{UploadedFile as e}from"../../data-display/uploaded-file/UploadedFile.mjs";import{UploadedFileDetails as t}from"../../data-display/uploaded-file/UploadedFileDetails.mjs";import{Dropzone as n}from"../dropzone/Dropzone.mjs";import{cx as r}from"@mage-ui/styled-system/css";import{dropzoneFiles as i,dropzoneFilesDescription as a,dropzoneFilesDropzone as o,dropzoneFilesError as s,dropzoneFilesFileItem as c,dropzoneFilesFileList as l,dropzoneFilesLabel as u,dropzoneFilesLabelWrapper as d,dropzoneFilesRoot as f,dropzoneFilesUploadedFile as p}from"@mage-ui/styled-system/recipes";import{jsx as m,jsxs as h}from"react/jsx-runtime";import{useId as g}from"react";const _=({label:_,description:v,error:y,title:b,subtitle:x,hint:S,initialFiles:C,maxFiles:w,accept:T,url:E,inputId:D,classNames:O})=>{let k=g(),A=D??k;return h(`div`,{className:r(O?.dropzoneFiles??i(),O?.root??f()),children:[h(`div`,{className:O?.labelWrapper??d(),children:[_&&m(`label`,{htmlFor:A,className:O?.label??u(),children:_}),v&&m(`p`,{className:O?.description??a(),children:v})]}),m(n,{maxFiles:w,accept:T,url:E,initialFiles:C,inputId:A,title:b,subtitle:x,hint:S,classNames:{dropzone:O?.dropzone?.dropzone??o()},children:({files:n,removeFile:r})=>m(`ul`,{className:O?.fileList??l(),children:Object.values(n).map(n=>m(`li`,{className:O?.fileItem??c(),children:m(e,{fileName:n.name,fileType:n.type,url:n.url,onRemove:()=>r(n.name),classNames:{uploadedFile:O?.uploadedFile?.uploadedFile??p()},children:m(t,{fileSize:`${(n.size/1024).toFixed(1)} KB`,fileDate:n.date,fileType:n.type})},n.name)},n.name))})}),y&&m(`p`,{className:O?.error??s(),children:y})]})};export{_ as DropzoneFiles};
 //# sourceMappingURL=DropzoneFiles.mjs.map

package/dist/components/controls/dropzone-files/DropzoneFiles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropzoneFiles.mjs","names":[],"sources":["../../../../src/components/controls/dropzone-files/DropzoneFiles.tsx"],"sourcesContent":["import { useId, type ReactNode } from 'react';\nimport {\n  Dropzone,\n  type DropzoneProps,\n  type FileData,\n} from '../dropzone/Dropzone';\nimport {\n  Icon,\n  type IconProps,\n  IconWrapped,\n  type IconWrappedProps,\n  UploadedFile,\n  type UploadedFileProps,\n} from '@/components/data-display';\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dropzoneFiles,\n  dropzoneFilesRoot,\n  dropzoneFilesLabelWrapper,\n  dropzoneFilesLabel,\n  dropzoneFilesDescription,\n  dropzoneFilesFileList,\n  dropzoneFilesFileItem,\n  dropzoneFilesError,\n  dropzoneFilesDropzone,\n  dropzoneFilesUploadedFile,\n  dropzoneFilesUploadedFileStartIconWrapped,\n  dropzoneFilesUploadedFileStartIconWrappedRoot,\n  dropzoneFilesUploadedFileStartIcon,\n  dropzoneFilesUploadedFileStartIconRoot,\n  dropzoneFilesUploadedFileStartIconIconRaw,\n  dropzoneFilesUploadedFileStartIconIconRawRoot,\n} from '@mage-ui/styled-system/recipes';\n\nexport type DropzoneFilesProps = {\n  label?: ReactNode;\n  description?: ReactNode;\n  error?: ReactNode;\n  title?: ReactNode;\n  subtitle?: ReactNode;\n  hint?: ReactNode;\n  initialFiles?: Record<string, FileData>;\n  maxFiles?: number;\n  accept?: string[];\n  url: string;\n  inputId?: string;\n  fileListHeight?: number | string;\n  classNames?: {\n    dropzoneFiles?: string;\n    root?: string;\n    labelWrapper?: string;\n    label?: string;\n    description?: string;\n    error?: string;\n    fileList?: string;\n    fileItem?: string;\n    uploadedFile?: UploadedFileProps['classNames'];\n    dropzone?: DropzoneProps['classNames'];\n    scrollArea?: { scrollArea?: string };\n    startIconWrapped?: IconWrappedProps['classNames'];\n    startIcon?: IconProps['classNames'];\n  };\n};\n\nexport const DropzoneFiles = ({\n  label,\n  description,\n  error,\n  title,\n  subtitle,\n  hint,\n  initialFiles,\n  maxFiles,\n  accept,\n  url,\n  inputId,\n  classNames,\n}: DropzoneFilesProps) => {\n  const generatedId = useId();\n  const groupId = inputId ?? generatedId;\n\n  // TODO: gestionar error \n  // TOOD: gestionar required\n  return (\n    <div\n      className={cx(\n        classNames?.dropzoneFiles ?? dropzoneFiles(),\n        classNames?.root ?? dropzoneFilesRoot(),\n      )}\n    >\n      <div className={classNames?.labelWrapper ?? dropzoneFilesLabelWrapper()}>\n      {/* TODO: label obligatori / hidden */}\n      {label && (\n        <label\n          htmlFor={groupId}\n          className={classNames?.label ?? dropzoneFilesLabel()}\n        >\n          {label}\n        </label>\n      )}\n      {description && (\n        <p className={classNames?.description ?? dropzoneFilesDescription()}>\n          {description}\n        </p>\n      )}</div>\n      <Dropzone\n        maxFiles={maxFiles}\n        accept={accept}\n        url={url}\n        initialFiles={initialFiles}\n        inputId={groupId}\n        title={title}\n        subtitle={subtitle}\n        hint={hint}\n        classNames={{\n          dropzone: classNames?.dropzone?.dropzone ?? dropzoneFilesDropzone(),\n        }}\n      >\n        {({ files, removeFile }) => (\n            <ul className={classNames?.fileList ?? dropzoneFilesFileList()}>\n              {Object.values(files).map((file) => (\n                <li\n                  key={file.name}\n                  className={classNames?.fileItem ?? dropzoneFilesFileItem()}\n                >\n                  <UploadedFile\n                    key={file.name}\n                    fileName={file.name}\n                    fileSize={`${(file.size / 1024).toFixed(1)} KB`}\n                    fileDate={file.date}\n                    fileType={file.type}\n                    url={file.url}\n                    onRemove={() => removeFile(file.name)}\n                    startSlot={\n                      <IconWrapped\n                        classNames={{\n                          iconWrapped:\n                            classNames?.startIconWrapped?.iconWrapped ??\n                            dropzoneFilesUploadedFileStartIconWrapped(),\n                          root:\n                            classNames?.startIconWrapped?.root ??\n                            dropzoneFilesUploadedFileStartIconWrappedRoot(),\n                        }}\n                      >\n                        {/* TODO: mostrar icona segons extensió */}\n                        <Icon\n                          name='mage-uploadedfile-file-attachment-01'\n                          path='/icons/sprite-mage.svg'\n                          classNames={{\n                            icon:\n                              classNames?.startIcon?.icon ??\n                              dropzoneFilesUploadedFileStartIcon(),\n                            root:\n                              classNames?.startIcon?.root ??\n                              dropzoneFilesUploadedFileStartIconRoot(),\n                            iconRaw: {\n                              iconRaw:\n                                classNames?.startIcon?.iconRaw?.iconRaw ??\n                                dropzoneFilesUploadedFileStartIconIconRaw(),\n                              root:\n                                classNames?.startIcon?.iconRaw?.root ??\n                                dropzoneFilesUploadedFileStartIconIconRawRoot(),\n                            },\n                          }}\n                        />\n                      </IconWrapped>\n                    }\n                    classNames={{\n                      uploadedFile:\n                        classNames?.uploadedFile?.uploadedFile ??\n                        dropzoneFilesUploadedFile(),\n                    }}\n                  />\n                </li>\n              ))}\n            </ul>\n        )}\n      </Dropzone>\n      {error && (\n        <p className={classNames?.error ?? dropzoneFilesError()}>{error}</p>\n      )}\n    </div>\n  );\n};\n"],"mappings":"k+BAgEA,MAAa,GAAiB,CAC5B,QACA,cACA,QACA,QACA,WACA,OACA,eACA,WACA,SACA,MACA,UACA,gBACwB,CACxB,IAAM,EAAc,GAAO,CACrB,EAAU,GAAW,EAI3B,OACE,EAAC,MAAA,CACC,UAAW,EACT,GAAY,eAAiB,GAAe,CAC5C,GAAY,MAAQ,GAAmB,CACxC,WAED,EAAC,MAAA,CAAI,UAAW,GAAY,cAAgB,GAA2B,WAEtE,GACC,EAAC,QAAA,CACC,QAAS,EACT,UAAW,GAAY,OAAS,GAAoB,UAEnD,GACK,CAET,GACC,EAAC,IAAA,CAAE,UAAW,GAAY,aAAe,GAA0B,UAChE,GACC,CAAA,EACE,CACR,EAAC,EAAA,CACW,WACF,SACH,MACS,eACd,QAAS,EACF,QACG,WACJ,OACN,WAAY,CACV,SAAU,GAAY,UAAU,UAAY,GAAuB,CACpE,WAEC,CAAE,QAAO,gBACP,EAAC,KAAA,CAAG,UAAW,GAAY,UAAY,GAAuB,UAC3D,OAAO,OAAO,EAAM,CAAC,IAAK,GACzB,EAAC,KAAA,CAEC,UAAW,GAAY,UAAY,GAAuB,UAE1D,EAAC,EAAA,CAEC,SAAU,EAAK,KACf,SAAU,IAAI,EAAK,KAAO,MAAM,QAAQ,EAAE,CAAC,KAC3C,SAAU,EAAK,KACf,SAAU,EAAK,KACf,IAAK,EAAK,IACV,aAAgB,EAAW,EAAK,KAAK,CACrC,UACE,EAAC,EAAA,CACC,WAAY,CACV,YACE,GAAY,kBAAkB,aAC9B,GAA2C,CAC7C,KACE,GAAY,kBAAkB,MAC9B,GAA+C,CAClD,UAGD,EAAC,EAAA,CACC,KAAK,uCACL,KAAK,yBACL,WAAY,CACV,KACE,GAAY,WAAW,MACvB,GAAoC,CACtC,KACE,GAAY,WAAW,MACvB,GAAwC,CAC1C,QAAS,CACP,QACE,GAAY,WAAW,SAAS,SAChC,GAA2C,CAC7C,KACE,GAAY,WAAW,SAAS,MAChC,GAA+C,CAClD,CACF,EACD,EACU,CAEhB,WAAY,CACV,aACE,GAAY,cAAc,cAC1B,GAA2B,CAC9B,EA7CI,EAAK,KA8CV,EAlDG,EAAK,KAmDP,CACL,EACC,EAEA,CACV,GACC,EAAC,IAAA,CAAE,UAAW,GAAY,OAAS,GAAoB,UAAG,GAAU,GAElE"}
+{"version":3,"file":"DropzoneFiles.mjs","names":[],"sources":["../../../../src/components/controls/dropzone-files/DropzoneFiles.tsx"],"sourcesContent":["import { type ReactNode, useId } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  dropzoneFiles,\n  dropzoneFilesDescription,\n  dropzoneFilesDropzone,\n  dropzoneFilesError,\n  dropzoneFilesFileItem,\n  dropzoneFilesFileList,\n  dropzoneFilesLabel,\n  dropzoneFilesLabelWrapper,\n  dropzoneFilesRoot,\n  dropzoneFilesUploadedFile,\n  // dropzoneFilesUploadedFileStartIconWrapped,\n  // dropzoneFilesUploadedFileStartIconWrappedRoot,\n  // dropzoneFilesUploadedFileStartIcon,\n  // dropzoneFilesUploadedFileStartIconRoot,\n  // dropzoneFilesUploadedFileStartIconIconRaw,\n  // dropzoneFilesUploadedFileStartIconIconRawRoot,\n} from '@mage-ui/styled-system/recipes';\nimport {\n  Dropzone,\n  type DropzoneProps,\n  type FileData,\n} from '@/components/controls';\nimport {\n  // Icon,\n  // type IconProps,\n  // IconWrapped,\n  // type IconWrappedProps,\n  UploadedFile,\n  UploadedFileDetails,\n  type UploadedFileProps,\n} from '@/components/data-display';\n\nexport type DropzoneFilesProps = {\n  label?: ReactNode;\n  description?: ReactNode;\n  error?: ReactNode;\n  title?: ReactNode;\n  subtitle?: ReactNode;\n  hint?: ReactNode;\n  initialFiles?: Record<string, FileData>;\n  maxFiles?: number;\n  accept?: string[];\n  url: string;\n  inputId?: string;\n  fileListHeight?: number | string;\n  classNames?: {\n    dropzoneFiles?: string;\n    root?: string;\n    labelWrapper?: string;\n    label?: string;\n    description?: string;\n    error?: string;\n    fileList?: string;\n    fileItem?: string;\n    uploadedFile?: UploadedFileProps['classNames'];\n    dropzone?: DropzoneProps['classNames'];\n    scrollArea?: { scrollArea?: string };\n    // startIconWrapped?: IconWrappedProps['classNames'];\n    // startIcon?: IconProps['classNames'];\n  };\n};\n\nexport const DropzoneFiles = ({\n  label,\n  description,\n  error,\n  title,\n  subtitle,\n  hint,\n  initialFiles,\n  maxFiles,\n  accept,\n  url,\n  inputId,\n  classNames,\n}: DropzoneFilesProps) => {\n  const generatedId = useId();\n  const groupId = inputId ?? generatedId;\n\n  // TODO: gestionar error\n  // TOOD: gestionar required\n  return (\n    <div\n      className={cx(\n        classNames?.dropzoneFiles ?? dropzoneFiles(),\n        classNames?.root ?? dropzoneFilesRoot(),\n      )}\n    >\n      <div className={classNames?.labelWrapper ?? dropzoneFilesLabelWrapper()}>\n        {/* TODO: label obligatori / hidden */}\n        {label && (\n          <label\n            htmlFor={groupId}\n            className={classNames?.label ?? dropzoneFilesLabel()}\n          >\n            {label}\n          </label>\n        )}\n        {description && (\n          <p className={classNames?.description ?? dropzoneFilesDescription()}>\n            {description}\n          </p>\n        )}\n      </div>\n      <Dropzone\n        maxFiles={maxFiles}\n        accept={accept}\n        url={url}\n        initialFiles={initialFiles}\n        inputId={groupId}\n        title={title}\n        subtitle={subtitle}\n        hint={hint}\n        classNames={{\n          dropzone: classNames?.dropzone?.dropzone ?? dropzoneFilesDropzone(),\n        }}\n      >\n        {({ files, removeFile }) => (\n          <ul className={classNames?.fileList ?? dropzoneFilesFileList()}>\n            {Object.values(files).map((file) => (\n              <li\n                key={file.name}\n                className={classNames?.fileItem ?? dropzoneFilesFileItem()}\n              >\n                <UploadedFile\n                  key={file.name}\n                  fileName={file.name}\n                  fileType={file.type}\n                  url={file.url}\n                  onRemove={() => removeFile(file.name)}\n                  classNames={{\n                    uploadedFile:\n                      classNames?.uploadedFile?.uploadedFile ??\n                      dropzoneFilesUploadedFile(),\n                  }}\n                >\n                  {/* TODO: comentar */}\n                  <UploadedFileDetails\n                    fileSize={`${(file.size / 1024).toFixed(1)} KB`}\n                    fileDate={file.date}\n                    fileType={file.type}\n                  />\n                </UploadedFile>\n              </li>\n            ))}\n          </ul>\n        )}\n      </Dropzone>\n      {error && (\n        <p className={classNames?.error ?? dropzoneFilesError()}>{error}</p>\n      )}\n    </div>\n  );\n};\n"],"mappings":"upBAkEA,MAAa,GAAiB,CAC5B,QACA,cACA,QACA,QACA,WACA,OACA,eACA,WACA,SACA,MACA,UACA,gBACwB,CACxB,IAAM,EAAc,GAAO,CACrB,EAAU,GAAW,EAI3B,OACE,EAAC,MAAA,CACC,UAAW,EACT,GAAY,eAAiB,GAAe,CAC5C,GAAY,MAAQ,GAAmB,CACxC,WAED,EAAC,MAAA,CAAI,UAAW,GAAY,cAAgB,GAA2B,WAEpE,GACC,EAAC,QAAA,CACC,QAAS,EACT,UAAW,GAAY,OAAS,GAAoB,UAEnD,GACK,CAET,GACC,EAAC,IAAA,CAAE,UAAW,GAAY,aAAe,GAA0B,UAChE,GACC,CAAA,EAEF,CACN,EAAC,EAAA,CACW,WACF,SACH,MACS,eACd,QAAS,EACF,QACG,WACJ,OACN,WAAY,CACV,SAAU,GAAY,UAAU,UAAY,GAAuB,CACpE,WAEC,CAAE,QAAO,gBACT,EAAC,KAAA,CAAG,UAAW,GAAY,UAAY,GAAuB,UAC3D,OAAO,OAAO,EAAM,CAAC,IAAK,GACzB,EAAC,KAAA,CAEC,UAAW,GAAY,UAAY,GAAuB,UAE1D,EAAC,EAAA,CAEC,SAAU,EAAK,KACf,SAAU,EAAK,KACf,IAAK,EAAK,IACV,aAAgB,EAAW,EAAK,KAAK,CACrC,WAAY,CACV,aACE,GAAY,cAAc,cAC1B,GAA2B,CAC9B,UAGD,EAAC,EAAA,CACC,SAAU,IAAI,EAAK,KAAO,MAAM,QAAQ,EAAE,CAAC,KAC3C,SAAU,EAAK,KACf,SAAU,EAAK,MACf,EAhBG,EAAK,KAiBG,EArBV,EAAK,KAsBP,CACL,EACC,EAEE,CACV,GACC,EAAC,IAAA,CAAE,UAAW,GAAY,OAAS,GAAoB,UAAG,GAAU,GAElE"}

package/dist/components/controls/file-input/BaseFileInput.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"BaseFileInput.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/BaseFileInput.tsx"],"mappings":";;;;;KAmBY,kBAAA,GAAqB,IAAA,CAC/B,cAAA;EAQA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,MAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA,IAAY,OAAA,EAAS,IAAA,GAAO,IAAA;EAC5B,cAAA,GAAiB,cAAA;EACjB,UAAA;IACE,SAAA;IACA,IAAA;IACA,KAAA;IACA,QAAA;IACA,WAAA;IACA,KAAA;IACA,OAAA;IACA,KAAA;IACA,OAAA;IACA,WAAA;IACA,SAAA;MACE,IAAA;IAAA;EAAA;AAAA"}
+{"version":3,"file":"BaseFileInput.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/BaseFileInput.tsx"],"mappings":";;;;;KAoBY,kBAAA,GAAqB,IAAA,CAC/B,cAAA;EAQA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,MAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA,IAAY,OAAA,EAAS,IAAA,GAAO,IAAA;EAC5B,cAAA,GAAiB,cAAA;EACjB,UAAA;IACE,SAAA;IACA,IAAA;IACA,KAAA;IACA,QAAA;IACA,WAAA;IACA,KAAA;IACA,OAAA;IACA,KAAA;IACA,OAAA;IACA,WAAA;IACA,SAAA;MACE,IAAA;IAAA;EAAA;AAAA"}

package/dist/components/controls/file-input/BaseFileInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseFileInput.mjs","names":["MantineFileInput"],"sources":["../../../../src/components/controls/file-input/BaseFileInput.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { cx } from '@mage-ui/styled-system/css';\nimport { Icon } from '@/components/data-display/icons/icon/Icon';\nimport {\n  fileInput,\n  fileInputDescription,\n  fileInputError,\n  fileInputInput,\n  fileInputLabel,\n  fileInputPlaceholder,\n  fileInputRequired,\n  fileInputRoot,\n  fileInputSection,\n  fileInputWrapper,\n  fileInputStartIcon,\n} from '@mage-ui/styled-system/recipes';\nimport type { FileInputProps as MantineFileInputProps } from '@mantine/core';\nimport { FileInput as MantineFileInput } from '@mantine/core';\n\nexport type BaseFileInputProps = Omit<\n  MantineFileInputProps,\n  | 'value'\n  | 'defaultValue'\n  | 'onChange'\n  | 'classNames'\n  | 'valueComponent'\n  | 'multiple'\n> & {\n  label?: ReactNode;\n  description?: ReactNode;\n  placeholder?: ReactNode;\n  error?: ReactNode;\n  accept?: string;\n  required?: boolean;\n  disabled?: boolean;\n  multiple: boolean;\n  onChange?: (payload: File | File[] | null) => void;\n  valueComponent?: MantineFileInputProps['valueComponent'];\n  classNames?: {\n    fileInput?: string;\n    root?: string;\n    label?: string;\n    required?: string;\n    description?: string;\n    error?: string;\n    wrapper?: string;\n    input?: string;\n    section?: string;\n    placeholder?: string;\n    startIcon?: {\n      icon?: string;\n    };\n  };\n};\n\nexport const BaseFileInput = ({\n  name,\n  onBlur,\n  onFocus,\n  onChange,\n  label,\n  description,\n  placeholder,\n  error,\n  multiple,\n  accept,\n  required,\n  disabled,\n  valueComponent,\n  classNames,\n}: BaseFileInputProps) => {\n  return (\n    <MantineFileInput\n      name={name}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      onChange={(payload) => {\n        onChange?.(payload);\n      }}\n      disabled={disabled}\n      required={required}\n      multiple={multiple}\n      accept={accept}\n      clearable={true}\n      label={label}\n      description={description}\n      placeholder={placeholder}\n      error={error}\n      valueComponent={valueComponent}\n      leftSection={\n        <Icon\n          name='mage-dropzone-upload-01'\n          path='/icons/sprite-mage.svg'\n          classNames={{\n            icon: classNames?.startIcon?.icon ?? fileInputStartIcon(),\n          }}\n        />\n      }\n      classNames={{\n        root: cx(\n          classNames?.fileInput ?? fileInput(),\n          classNames?.root ?? fileInputRoot(),\n          'group',\n        ),\n        label: classNames?.label ?? fileInputLabel(),\n        required: classNames?.required ?? fileInputRequired(),\n        description: classNames?.description ?? fileInputDescription(),\n        error: classNames?.error ?? fileInputError(),\n        wrapper: classNames?.wrapper ?? fileInputWrapper(),\n        input: cx(classNames?.input ?? fileInputInput(), 'peer'),\n        section: cx(classNames?.section ?? fileInputSection(), 'group'),\n        placeholder: classNames?.placeholder ?? fileInputPlaceholder(),\n      }}\n    />\n  );\n};\n"],"mappings":"ydAuDA,MAAa,GAAiB,CAC5B,OACA,SACA,UACA,WACA,QACA,cACA,cACA,QACA,WACA,SACA,WACA,WACA,iBACA,gBAGE,EAACA,EAAAA,CACO,OACE,SACC,UACT,SAAW,GAAY,CACrB,IAAW,EAAQ,EAEX,WACA,WACA,WACF,SACR,UAAW,GACJ,QACM,cACA,cACN,QACS,iBAChB,YACE,EAAC,EAAA,CACC,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,WAAW,MAAQ,GAAoB,CAC1D,EACD,CAEJ,WAAY,CACV,KAAM,EACJ,GAAY,WAAa,GAAW,CACpC,GAAY,MAAQ,GAAe,CACnC,QACD,CACD,MAAO,GAAY,OAAS,GAAgB,CAC5C,SAAU,GAAY,UAAY,GAAmB,CACrD,YAAa,GAAY,aAAe,GAAsB,CAC9D,MAAO,GAAY,OAAS,GAAgB,CAC5C,QAAS,GAAY,SAAW,GAAkB,CAClD,MAAO,EAAG,GAAY,OAAS,GAAgB,CAAE,OAAO,CACxD,QAAS,EAAG,GAAY,SAAW,GAAkB,CAAE,QAAQ,CAC/D,YAAa,GAAY,aAAe,GAAsB,CAC/D,EACD"}
+{"version":3,"file":"BaseFileInput.mjs","names":["MantineFileInput"],"sources":["../../../../src/components/controls/file-input/BaseFileInput.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  fileInput,\n  fileInputDescription,\n  fileInputError,\n  fileInputInput,\n  fileInputLabel,\n  fileInputPlaceholder,\n  fileInputRequired,\n  fileInputRoot,\n  fileInputSection,\n  fileInputStartIcon,\n  fileInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport type { FileInputProps as MantineFileInputProps } from '@mantine/core';\nimport { FileInput as MantineFileInput } from '@mantine/core';\nimport { Icon } from '@/components/data-display/icons/icon/Icon';\n\nexport type BaseFileInputProps = Omit<\n  MantineFileInputProps,\n  | 'value'\n  | 'defaultValue'\n  | 'onChange'\n  | 'classNames'\n  | 'valueComponent'\n  | 'multiple'\n> & {\n  label?: ReactNode;\n  description?: ReactNode;\n  placeholder?: ReactNode;\n  error?: ReactNode;\n  accept?: string;\n  required?: boolean;\n  disabled?: boolean;\n  multiple: boolean;\n  onChange?: (payload: File | File[] | null) => void;\n  valueComponent?: MantineFileInputProps['valueComponent'];\n  classNames?: {\n    fileInput?: string;\n    root?: string;\n    label?: string;\n    required?: string;\n    description?: string;\n    error?: string;\n    wrapper?: string;\n    input?: string;\n    section?: string;\n    placeholder?: string;\n    startIcon?: {\n      icon?: string;\n    };\n  };\n};\n\nexport const BaseFileInput = ({\n  name,\n  onBlur,\n  onFocus,\n  onChange,\n  label,\n  description,\n  placeholder,\n  error,\n  multiple,\n  accept,\n  required,\n  disabled,\n  valueComponent,\n  classNames,\n}: BaseFileInputProps) => {\n  return (\n    <MantineFileInput\n      name={name}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      onChange={(payload) => {\n        onChange?.(payload);\n      }}\n      disabled={disabled}\n      required={required}\n      multiple={multiple}\n      accept={accept}\n      clearable={true}\n      label={label}\n      description={description}\n      placeholder={placeholder}\n      error={error}\n      valueComponent={valueComponent}\n      leftSection={\n        <Icon\n          name='mage-dropzone-upload-01'\n          path='/icons/sprite-mage.svg'\n          classNames={{\n            icon: classNames?.startIcon?.icon ?? fileInputStartIcon(),\n          }}\n        />\n      }\n      classNames={{\n        root: cx(\n          classNames?.fileInput ?? fileInput(),\n          classNames?.root ?? fileInputRoot(),\n          'group',\n        ),\n        label: classNames?.label ?? fileInputLabel(),\n        required: classNames?.required ?? fileInputRequired(),\n        description: classNames?.description ?? fileInputDescription(),\n        error: classNames?.error ?? fileInputError(),\n        wrapper: classNames?.wrapper ?? fileInputWrapper(),\n        input: cx(classNames?.input ?? fileInputInput(), 'peer'),\n        section: cx(classNames?.section ?? fileInputSection(), 'group'),\n        placeholder: classNames?.placeholder ?? fileInputPlaceholder(),\n      }}\n    />\n  );\n};\n"],"mappings":"ydAwDA,MAAa,GAAiB,CAC5B,OACA,SACA,UACA,WACA,QACA,cACA,cACA,QACA,WACA,SACA,WACA,WACA,iBACA,gBAGE,EAACA,EAAAA,CACO,OACE,SACC,UACT,SAAW,GAAY,CACrB,IAAW,EAAQ,EAEX,WACA,WACA,WACF,SACR,UAAW,GACJ,QACM,cACA,cACN,QACS,iBAChB,YACE,EAAC,EAAA,CACC,KAAK,0BACL,KAAK,yBACL,WAAY,CACV,KAAM,GAAY,WAAW,MAAQ,GAAoB,CAC1D,EACD,CAEJ,WAAY,CACV,KAAM,EACJ,GAAY,WAAa,GAAW,CACpC,GAAY,MAAQ,GAAe,CACnC,QACD,CACD,MAAO,GAAY,OAAS,GAAgB,CAC5C,SAAU,GAAY,UAAY,GAAmB,CACrD,YAAa,GAAY,aAAe,GAAsB,CAC9D,MAAO,GAAY,OAAS,GAAgB,CAC5C,QAAS,GAAY,SAAW,GAAkB,CAClD,MAAO,EAAG,GAAY,OAAS,GAAgB,CAAE,OAAO,CACxD,QAAS,EAAG,GAAY,SAAW,GAAkB,CAAE,QAAQ,CAC/D,YAAa,GAAY,aAAe,GAAsB,CAC/D,EACD"}

package/dist/components/controls/file-input/FileInput.d.mts

@@ -1,5 +1,5 @@
 import { BaseFileInputProps } from "./BaseFileInput.mjs";
-import * as react_jsx_runtime25 from "react/jsx-runtime";
+import * as react_jsx_runtime29 from "react/jsx-runtime";
 
 //#region src/components/controls/file-input/FileInput.d.ts
 type FileInputProps = Omit<BaseFileInputProps, 'multiple' | 'valueComponent' | 'onChange'> & {
@@ -18,7 +18,7 @@ declare const FileInput: ({
   required,
   disabled,
   classNames
-}: FileInputProps) => react_jsx_runtime25.JSX.Element;
+}: FileInputProps) => react_jsx_runtime29.JSX.Element;
 //#endregion
 export { FileInput, FileInputProps };
 //# sourceMappingURL=FileInput.d.mts.map

package/dist/components/controls/file-input/FileInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInput.tsx"],"sourcesContent":["import { BaseFileInput, type BaseFileInputProps } from './BaseFileInput';\n\nexport type FileInputProps = Omit<\n  BaseFileInputProps,\n  'multiple' | 'valueComponent' | 'onChange'\n> & {\n  onChange?: (file: File | null) => void;\n};\n\nexport const FileInput = ({\n  name,\n  onBlur,\n  onFocus,\n  onChange,\n  label,\n  description,\n  placeholder,\n  error,\n  accept,\n  required,\n  disabled,\n  classNames,\n}: FileInputProps) => {\n  return (\n    <BaseFileInput\n      name={name}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      label={label}\n      description={description}\n      placeholder={placeholder}\n      error={error}\n      accept={accept}\n      required={required}\n      disabled={disabled}\n      classNames={classNames}\n      multiple={false}\n      onChange={(payload) => {\n        onChange?.(payload as File | null);\n      }}\n    />\n  );\n};\n\n"],"mappings":"4FASA,MAAa,GAAa,CACxB,OACA,SACA,UACA,WACA,QACA,cACA,cACA,QACA,SACA,WACA,WACA,gBAGE,EAAC,EAAA,CACO,OACE,SACC,UACF,QACM,cACA,cACN,QACC,SACE,WACA,WACE,aACZ,SAAU,GACV,SAAW,GAAY,CACrB,IAAW,EAAuB,GAEpC"}
+{"version":3,"file":"FileInput.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInput.tsx"],"sourcesContent":["import { BaseFileInput, type BaseFileInputProps } from './BaseFileInput';\n\nexport type FileInputProps = Omit<\n  BaseFileInputProps,\n  'multiple' | 'valueComponent' | 'onChange'\n> & {\n  onChange?: (file: File | null) => void;\n};\n\nexport const FileInput = ({\n  name,\n  onBlur,\n  onFocus,\n  onChange,\n  label,\n  description,\n  placeholder,\n  error,\n  accept,\n  required,\n  disabled,\n  classNames,\n}: FileInputProps) => {\n  return (\n    <BaseFileInput\n      name={name}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      label={label}\n      description={description}\n      placeholder={placeholder}\n      error={error}\n      accept={accept}\n      required={required}\n      disabled={disabled}\n      classNames={classNames}\n      multiple={false}\n      onChange={(payload) => {\n        onChange?.(payload as File | null);\n      }}\n    />\n  );\n};\n"],"mappings":"4FASA,MAAa,GAAa,CACxB,OACA,SACA,UACA,WACA,QACA,cACA,cACA,QACA,SACA,WACA,WACA,gBAGE,EAAC,EAAA,CACO,OACE,SACC,UACF,QACM,cACA,cACN,QACC,SACE,WACA,WACE,aACZ,SAAU,GACV,SAAW,GAAY,CACrB,IAAW,EAAuB,GAEpC"}

package/dist/components/controls/file-input/FileInputMultiple.d.mts

@@ -1,5 +1,5 @@
 import { BaseFileInputProps } from "./BaseFileInput.mjs";
-import * as react_jsx_runtime26 from "react/jsx-runtime";
+import * as react_jsx_runtime30 from "react/jsx-runtime";
 
 //#region src/components/controls/file-input/FileInputMultiple.d.ts
 type FileInputMultipleProps = Omit<BaseFileInputProps, 'multiple' | 'onChange' | 'valueComponent'> & {
@@ -25,7 +25,7 @@ declare const FileInputMultiple: ({
   disabled,
   classNames,
   badgeClassNames
-}: FileInputMultipleProps) => react_jsx_runtime26.JSX.Element;
+}: FileInputMultipleProps) => react_jsx_runtime30.JSX.Element;
 //#endregion
 export { FileInputMultiple, FileInputMultipleProps };
 //# sourceMappingURL=FileInputMultiple.d.mts.map

package/dist/components/controls/file-input/FileInputMultiple.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"FileInputMultiple.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"mappings":";;;;KAKY,sBAAA,GAAyB,IAAA,CACnC,kBAAA;EAGA,QAAA,IAAY,KAAA,EAAO,IAAA;EACnB,eAAA;IACE,KAAA;IACA,IAAA;IACA,OAAA;IACA,KAAA;EAAA;AAAA;AAAA,cAiCS,iBAAA;EAAqB,IAAA;EAAA,MAAA;EAAA,OAAA;EAAA,QAAA;EAAA,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA,QAAA;EAAA,UAAA;EAAA;AAAA,GAc/B,sBAAA,KAAsB,mBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"FileInputMultiple.d.mts","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"mappings":";;;;KAMY,sBAAA,GAAyB,IAAA,CACnC,kBAAA;EAGA,QAAA,IAAY,KAAA,EAAO,IAAA;EACnB,eAAA;IACE,KAAA;IACA,IAAA;IACA,OAAA;IACA,KAAA;EAAA;AAAA;AAAA,cAiCS,iBAAA;EAAqB,IAAA;EAAA,MAAA;EAAA,OAAA;EAAA,QAAA;EAAA,KAAA;EAAA,WAAA;EAAA,WAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA,QAAA;EAAA,UAAA;EAAA;AAAA,GAc/B,sBAAA,KAAsB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/file-input/FileInputMultiple.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FileInputMultiple.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"sourcesContent":["import { Badge } from '@/components/data-display/badge/Badge';\nimport { fileInputBadge } from '@mage-ui/styled-system/recipes';\nimport type { FileInputProps as MantineFileInputProps } from '@mantine/core';\nimport { BaseFileInput, type BaseFileInputProps } from './BaseFileInput';\n\nexport type FileInputMultipleProps = Omit<\n  BaseFileInputProps,\n  'multiple' | 'onChange' | 'valueComponent'\n> & {\n  onChange?: (files: File[] | null) => void;\n  badgeClassNames?: {\n    badge?: string;\n    root?: string;\n    section?: string;\n    label?: string;\n  };\n};\n\nconst createValueComponent = ({\n  badgeClassNames,\n}: {\n  badgeClassNames?: {\n    badge?: string;\n  };\n}): MantineFileInputProps['valueComponent'] => {\n  return ({ value }) => {\n    if (!value) return null;\n\n    const files = Array.isArray(value) ? value : [value];\n\n    return (\n      <>\n        {files.map((file) => (\n          <Badge\n            key={`${file.name}-${file.lastModified}`}\n            classNames={{\n              badge: badgeClassNames?.badge ?? fileInputBadge(),\n            }}\n          >\n            {file.name}\n          </Badge>\n        ))}\n      </>\n    );\n  };\n};\n\nexport const FileInputMultiple = ({\n  name,\n  onBlur,\n  onFocus,\n  onChange,\n  label,\n  description,\n  placeholder,\n  error,\n  accept,\n  required,\n  disabled,\n  classNames,\n  badgeClassNames,\n}: FileInputMultipleProps) => {\n  return (\n    <BaseFileInput\n      name={name}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      label={label}\n      description={description}\n      placeholder={placeholder}\n      error={error}\n      accept={accept}\n      required={required}\n      disabled={disabled}\n      classNames={classNames}\n      multiple={true}\n      valueComponent={createValueComponent({\n        badgeClassNames,\n      })}\n      onChange={(payload) => {\n        onChange?.(payload as File[] | null);\n      }}\n    />\n  );\n};\n"],"mappings":"qOAkBA,MAAM,GAAwB,CAC5B,sBAMQ,CAAE,WACH,EAKH,EAAA,EAAA,CAAA,UAHY,MAAM,QAAQ,EAAM,CAAG,EAAQ,CAAC,EAAM,EAIzC,IAAK,GACV,EAAC,EAAA,CAEC,WAAY,CACV,MAAO,GAAiB,OAAS,GAAgB,CAClD,UAEA,EAAK,MALD,GAAG,EAAK,KAAK,GAAG,EAAK,eAMpB,CACR,CAAA,CACD,CAhBc,KAqBV,GAAqB,CAChC,OACA,SACA,UACA,WACA,QACA,cACA,cACA,QACA,SACA,WACA,WACA,aACA,qBAGE,EAAC,EAAA,CACO,OACE,SACC,UACF,QACM,cACA,cACN,QACC,SACE,WACA,WACE,aACZ,SAAU,GACV,eAAgB,EAAqB,CACnC,kBACD,CAAC,CACF,SAAW,GAAY,CACrB,IAAW,EAAyB,GAEtC"}
+{"version":3,"file":"FileInputMultiple.mjs","names":[],"sources":["../../../../src/components/controls/file-input/FileInputMultiple.tsx"],"sourcesContent":["import { fileInputBadge } from '@mage-ui/styled-system/recipes';\nimport type { FileInputProps as MantineFileInputProps } from '@mantine/core';\nimport { Badge } from '@/components/data-display/badge/Badge';\n\nimport { BaseFileInput, type BaseFileInputProps } from './BaseFileInput';\n\nexport type FileInputMultipleProps = Omit<\n  BaseFileInputProps,\n  'multiple' | 'onChange' | 'valueComponent'\n> & {\n  onChange?: (files: File[] | null) => void;\n  badgeClassNames?: {\n    badge?: string;\n    root?: string;\n    section?: string;\n    label?: string;\n  };\n};\n\nconst createValueComponent = ({\n  badgeClassNames,\n}: {\n  badgeClassNames?: {\n    badge?: string;\n  };\n}): MantineFileInputProps['valueComponent'] => {\n  return ({ value }) => {\n    if (!value) return null;\n\n    const files = Array.isArray(value) ? value : [value];\n\n    return (\n      <>\n        {files.map((file) => (\n          <Badge\n            key={`${file.name}-${file.lastModified}`}\n            classNames={{\n              badge: badgeClassNames?.badge ?? fileInputBadge(),\n            }}\n          >\n            {file.name}\n          </Badge>\n        ))}\n      </>\n    );\n  };\n};\n\nexport const FileInputMultiple = ({\n  name,\n  onBlur,\n  onFocus,\n  onChange,\n  label,\n  description,\n  placeholder,\n  error,\n  accept,\n  required,\n  disabled,\n  classNames,\n  badgeClassNames,\n}: FileInputMultipleProps) => {\n  return (\n    <BaseFileInput\n      name={name}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      label={label}\n      description={description}\n      placeholder={placeholder}\n      error={error}\n      accept={accept}\n      required={required}\n      disabled={disabled}\n      classNames={classNames}\n      multiple={true}\n      valueComponent={createValueComponent({\n        badgeClassNames,\n      })}\n      onChange={(payload) => {\n        onChange?.(payload as File[] | null);\n      }}\n    />\n  );\n};\n"],"mappings":"qOAmBA,MAAM,GAAwB,CAC5B,sBAMQ,CAAE,WACH,EAKH,EAAA,EAAA,CAAA,UAHY,MAAM,QAAQ,EAAM,CAAG,EAAQ,CAAC,EAAM,EAIzC,IAAK,GACV,EAAC,EAAA,CAEC,WAAY,CACV,MAAO,GAAiB,OAAS,GAAgB,CAClD,UAEA,EAAK,MALD,GAAG,EAAK,KAAK,GAAG,EAAK,eAMpB,CACR,CAAA,CACD,CAhBc,KAqBV,GAAqB,CAChC,OACA,SACA,UACA,WACA,QACA,cACA,cACA,QACA,SACA,WACA,WACA,aACA,qBAGE,EAAC,EAAA,CACO,OACE,SACC,UACF,QACM,cACA,cACN,QACC,SACE,WACA,WACE,aACZ,SAAU,GACV,eAAgB,EAAqB,CACnC,kBACD,CAAC,CACF,SAAW,GAAY,CACrB,IAAW,EAAyB,GAEtC"}

package/dist/components/controls/index.d.mts

@@ -1,18 +1,20 @@
+import { Menu, MenuProps } from "../navigations/menu/Menu.mjs";
+import { Combobox, ComboboxProps } from "./combobox/Combobox.mjs";
+import { Autocomplete, AutocompleteProps, OptionProps } from "./autocomplete/Autocomplete.mjs";
 import { Checkbox, CheckboxProps } from "./checkbox/Checkbox.mjs";
-import { TextInput, TextInputProps } from "./text-input/TextInput.mjs";
-import { PasswordInput, PasswordInputProps } from "./password-input/PasswordInput.mjs";
-import { PasswordInputStrength, PasswordInputStrengthProps } from "./password-input-strength/PasswordInputStrength.mjs";
+import { DatePicker, DatePickerProps } from "./date-picker/DatePicker.mjs";
+import { Dropzone, DropzoneProps, FileData } from "./dropzone/Dropzone.mjs";
+import { DropzoneFiles, DropzoneFilesProps } from "./dropzone-files/DropzoneFiles.mjs";
 import { FileInput, FileInputProps } from "./file-input/FileInput.mjs";
 import { FileInputMultiple, FileInputMultipleProps } from "./file-input/FileInputMultiple.mjs";
-import { Textarea, TextareaProps } from "./textarea/Textarea.mjs";
-import { Radio, RadioProps } from "./radio/Radio.mjs";
-import { Select, SelectProps } from "./select/Select.mjs";
 import { MultiSelect, MultiSelectProps } from "./multi-select/MultiSelect.mjs";
 import { MultiSelectTags, MultiSelectTagsProps } from "./multi-select/MultiSelectTags.mjs";
-import { Combobox, ComboboxProps } from "./combobox/Combobox.mjs";
-import { Autocomplete, AutocompleteProps, OptionProps } from "./autocomplete/Autocomplete.mjs";
-import { Menu, MenuProps } from "../navigations/menu/Menu.mjs";
-import "./utils/index.mjs";
-import { DatePicker, DatePickerProps } from "./date-picker/DatePicker.mjs";
-import { Dropzone, DropzoneProps, FileData } from "./dropzone/Dropzone.mjs";
-import { DropzoneFiles, DropzoneFilesProps } from "./dropzone-files/DropzoneFiles.mjs";
+import { TextInput, TextInputProps } from "./text-input/TextInput.mjs";
+import { PasswordInput, PasswordInputProps } from "./password-input/PasswordInput.mjs";
+import { PasswordInputStrength, PasswordInputStrengthProps } from "./password-input-strength/oldPasswordInputStrength.mjs";
+import { Radio, RadioProps } from "./radio/Radio.mjs";
+import { Select, SelectProps } from "./select/Select.mjs";
+import { Textarea, TextareaProps } from "./textarea/Textarea.mjs";
+import { Chevron, ChevronProps } from "./utils/chevron/Chevron.mjs";
+import { ClearButton, ClearButtonProps } from "./utils/clear-button/ClearButton.mjs";
+import "./utils/index.mjs";

package/dist/components/controls/multi-select/MultiSelect.d.mts

@@ -1,5 +1,5 @@
 import { DropdownProps, DropdownTextInputClassNames } from "../dropdown/Dropdown.mjs";
-import * as react_jsx_runtime29 from "react/jsx-runtime";
+import * as react_jsx_runtime31 from "react/jsx-runtime";
 
 //#region src/components/controls/multi-select/MultiSelect.d.ts
 type MultiSelectProps = Omit<DropdownProps, 'classNames' | 'children' | 'onChange' | 'onFocus' | 'onBlur' | 'onClick' | 'value' | 'search' | 'setValue' | 'store' | 'target'> & {
@@ -39,7 +39,7 @@ declare const MultiSelect: ({
   keepMounted,
   textSelected,
   classNames
-}: MultiSelectProps) => react_jsx_runtime29.JSX.Element;
+}: MultiSelectProps) => react_jsx_runtime31.JSX.Element;
 //#endregion
 export { MultiSelect, MultiSelectProps };
 //# sourceMappingURL=MultiSelect.d.mts.map

package/dist/components/controls/multi-select/MultiSelect.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.mjs","names":[],"sources":["../../../../src/components/controls/multi-select/MultiSelect.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport {\n  multiSelect,\n  multiSelectChevron,\n  multiSelectChevronIcon,\n  multiSelectChevronIconRoot,\n  multiSelectChevronRoot,\n  multiSelectIconIcon,\n  multiSelectIconIconRaw,\n  multiSelectIconIconRawRoot,\n  multiSelectIconRoot,\n  multiSelectOption,\n  multiSelectOptions,\n  multiSelectRoot,\n  multiSelectScrollAreaAutosize,\n  multiSelectTextInput,\n  multiSelectTextInputDescription,\n  multiSelectTextInputError,\n  multiSelectTextInputInput,\n  multiSelectTextInputLabel,\n  multiSelectTextInputRequired,\n  multiSelectTextInputRoot,\n  multiSelectTextInputSection,\n  multiSelectTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { Icon } from '@/components/data-display/icons/icon/Icon';\n\nimport {\n  Dropdown,\n  type DropdownProps,\n  type DropdownTextInputClassNames,\n} from '../dropdown/Dropdown';\n\nexport type MultiSelectProps = Omit<\n  DropdownProps,\n  | 'classNames'\n  | 'children'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'onClick'\n  | 'value'\n  | 'search'\n  | 'setValue'\n  | 'store'\n  | 'target'\n> & {\n  options: {\n    id: string | number;\n    value: string;\n  }[];\n  textSelected?: {\n    singular?: string;\n    plural?: string;\n  };\n  classNames?: Omit<\n    NonNullable<DropdownProps['classNames']>,\n    'dropdown' | 'search'\n  > & {\n    multiSelect?: string;\n    icon?: {\n      icon?: string;\n      root?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n    scrollArea?: {\n      scrollArea?: string;\n    };\n    textInput?: DropdownTextInputClassNames;\n  };\n};\n\nexport const MultiSelect = ({\n  name,\n  label,\n  placeholder,\n  options,\n  error,\n  startSlot,\n  endSlot,\n  withinPortal = false,\n  keepMounted = true,\n  textSelected,\n  classNames,\n}: MultiSelectProps) => {\n  const [value, setValue] = useState<string[]>([]);\n\n  const handleValueSelect = (val: string) => {\n    setValue((current) =>\n      current.includes(val)\n        ? current.filter((v) => v !== val)\n        : [...current, val],\n    );\n  };\n\n  const displayValue =\n    value.length > 0\n      ? `${value.length} ${value.length === 1 ? (textSelected?.singular ?? 'selected') : (textSelected?.plural ?? 'selected')}`\n      : '';\n\n  const optionsList = options.map((item) => (\n    <Dropdown.Option\n      value={item.value}\n      key={item.id}\n      active={value.includes(item.value)}\n    >\n      {value.includes(item.value) && (\n        <Icon\n          path=\"/icons/sprite-mage.svg\"\n          name='mage-multi-select-check'\n          classNames={{ \n            icon: classNames?.icon?.icon ?? multiSelectIconIcon(),\n            root: classNames?.icon?.root ?? multiSelectIconRoot(),\n            iconRaw: {\n              iconRaw: classNames?.icon?.iconRaw?.iconRaw ?? multiSelectIconIconRaw(),\n              root: classNames?.icon?.iconRaw?.root ?? multiSelectIconIconRawRoot(),\n            }\n          }}\n        />\n      )}\n      <span>{item.value}</span>\n    </Dropdown.Option>\n  ));\n\n  return (\n    <Dropdown\n      readOnly\n      name={name}\n      label={label}\n      placeholder={placeholder}\n      error={error}\n      startSlot={startSlot}\n      endSlot={endSlot}\n      withinPortal={withinPortal}\n      keepMounted={keepMounted}\n      chevron={true}\n      onClick={(combobox) => combobox.toggleDropdown()}\n      setValue={(val) => {\n        if (val === undefined) {\n          setValue([]);\n          return;\n        }\n        handleValueSelect(val);\n      }}\n      value={displayValue}\n      onChange={() => {}}\n      onFocus={() => {}}\n      onBlur={() => {}}\n      classNames={{\n        dropdown: classNames?.multiSelect ?? multiSelect(),\n        root: classNames?.root ?? multiSelectRoot(),\n        options: classNames?.options ?? multiSelectOptions(),\n        option: classNames?.option ?? multiSelectOption(),\n        scrollArea: {\n          scrollArea:\n            classNames?.scrollArea?.scrollArea ?? multiSelectScrollAreaAutosize(),\n        },\n        textInput: {\n          textInput: classNames?.textInput?.input ?? multiSelectTextInput(),\n          root: classNames?.textInput?.root ?? multiSelectTextInputRoot(),\n          label: classNames?.textInput?.label ?? multiSelectTextInputLabel(),\n          description:\n            classNames?.textInput?.description ??\n            multiSelectTextInputDescription(),\n          error: classNames?.textInput?.error ?? multiSelectTextInputError(),\n          wrapper:\n            classNames?.textInput?.wrapper ?? multiSelectTextInputWrapper(),\n          input: classNames?.textInput?.input ?? multiSelectTextInputInput(),\n          section:\n            classNames?.textInput?.section ?? multiSelectTextInputSection(),\n          required:\n            classNames?.textInput?.required ?? multiSelectTextInputRequired(),\n          endSlot: {\n            chevron: {\n              iconWrapped:\n                classNames?.textInput?.endSlot?.chevron?.iconWrapped ??\n                multiSelectChevron(),\n              root:\n                classNames?.textInput?.endSlot?.chevron?.root ??\n                multiSelectChevronRoot(),\n              open: {\n                iconRaw:\n                  classNames?.textInput?.endSlot?.chevron?.open?.iconRaw ??\n                  multiSelectChevronIcon(),\n                root:\n                  classNames?.textInput?.endSlot?.chevron?.open?.root ??\n                  multiSelectChevronIconRoot(),\n              },\n              close: {\n                iconRaw:\n                  classNames?.textInput?.endSlot?.chevron?.close?.iconRaw ??\n                  multiSelectChevronIcon(),\n                root:\n                  classNames?.textInput?.endSlot?.chevron?.close?.root ??\n                  multiSelectChevronIconRoot({ invert: true }),\n              },\n            },\n          },\n        },\n      }}\n    >\n      <Dropdown.Options>{optionsList}</Dropdown.Options>\n    </Dropdown>\n  );\n};\n"],"mappings":"q2BA4EA,MAAa,GAAe,CAC1B,OACA,QACA,cACA,UACA,QACA,YACA,UACA,eAAe,GACf,cAAc,GACd,eACA,gBACsB,CACtB,GAAM,CAAC,EAAO,GAAY,EAAmB,EAAE,CAAC,CAE1C,EAAqB,GAAgB,CACzC,EAAU,GACR,EAAQ,SAAS,EAAI,CACjB,EAAQ,OAAQ,GAAM,IAAM,EAAI,CAChC,CAAC,GAAG,EAAS,EAAI,CACtB,EAGG,EACJ,EAAM,OAAS,EACX,GAAG,EAAM,OAAO,GAAG,EAAM,SAAW,EAAK,GAAc,UAAY,WAAe,GAAc,QAAU,aAC1G,GAEA,EAAc,EAAQ,IAAK,GAC/B,EAAC,EAAS,OAAA,CACR,MAAO,EAAK,MAEZ,OAAQ,EAAM,SAAS,EAAK,MAAM,WAEjC,EAAM,SAAS,EAAK,MAAM,EACzB,EAAC,EAAA,CACC,KAAK,yBACL,KAAK,0BACL,WAAY,CACV,KAAM,GAAY,MAAM,MAAQ,GAAqB,CACrD,KAAM,GAAY,MAAM,MAAQ,GAAqB,CACrD,QAAS,CACP,QAAS,GAAY,MAAM,SAAS,SAAW,GAAwB,CACvE,KAAM,GAAY,MAAM,SAAS,MAAQ,GAA4B,CACtE,CACF,EACD,CAEJ,EAAC,OAAA,CAAA,SAAM,EAAK,MAAA,CAAa,CAAA,EAjBpB,EAAK,GAkBM,CAClB,CAEF,OACE,EAAC,EAAA,CACC,SAAA,GACM,OACC,QACM,cACN,QACI,YACF,UACK,eACD,cACb,QAAS,GACT,QAAU,GAAa,EAAS,gBAAgB,CAChD,SAAW,GAAQ,CACjB,GAAI,IAAQ,IAAA,GAAW,CACrB,EAAS,EAAE,CAAC,CACZ,OAEF,EAAkB,EAAI,EAExB,MAAO,EACP,aAAgB,GAChB,YAAe,GACf,WAAc,GACd,WAAY,CACV,SAAU,GAAY,aAAe,GAAa,CAClD,KAAM,GAAY,MAAQ,GAAiB,CAC3C,QAAS,GAAY,SAAW,GAAoB,CACpD,OAAQ,GAAY,QAAU,GAAmB,CACjD,WAAY,CACV,WACE,GAAY,YAAY,YAAc,GAA+B,CACxE,CACD,UAAW,CACT,UAAW,GAAY,WAAW,OAAS,GAAsB,CACjE,KAAM,GAAY,WAAW,MAAQ,GAA0B,CAC/D,MAAO,GAAY,WAAW,OAAS,GAA2B,CAClE,YACE,GAAY,WAAW,aACvB,GAAiC,CACnC,MAAO,GAAY,WAAW,OAAS,GAA2B,CAClE,QACE,GAAY,WAAW,SAAW,GAA6B,CACjE,MAAO,GAAY,WAAW,OAAS,GAA2B,CAClE,QACE,GAAY,WAAW,SAAW,GAA6B,CACjE,SACE,GAAY,WAAW,UAAY,GAA8B,CACnE,QAAS,CACP,QAAS,CACP,YACE,GAAY,WAAW,SAAS,SAAS,aACzC,GAAoB,CACtB,KACE,GAAY,WAAW,SAAS,SAAS,MACzC,GAAwB,CAC1B,KAAM,CACJ,QACE,GAAY,WAAW,SAAS,SAAS,MAAM,SAC/C,GAAwB,CAC1B,KACE,GAAY,WAAW,SAAS,SAAS,MAAM,MAC/C,GAA4B,CAC/B,CACD,MAAO,CACL,QACE,GAAY,WAAW,SAAS,SAAS,OAAO,SAChD,GAAwB,CAC1B,KACE,GAAY,WAAW,SAAS,SAAS,OAAO,MAChD,EAA2B,CAAE,OAAQ,GAAM,CAAC,CAC/C,CACF,CACF,CACF,CACF,UAED,EAAC,EAAS,QAAA,CAAA,SAAS,EAAA,CAA+B,EACzC"}
+{"version":3,"file":"MultiSelect.mjs","names":[],"sources":["../../../../src/components/controls/multi-select/MultiSelect.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport {\n  multiSelect,\n  multiSelectChevron,\n  multiSelectChevronIcon,\n  multiSelectChevronIconRoot,\n  multiSelectChevronRoot,\n  multiSelectIconIcon,\n  multiSelectIconIconRaw,\n  multiSelectIconIconRawRoot,\n  multiSelectIconRoot,\n  multiSelectOption,\n  multiSelectOptions,\n  multiSelectRoot,\n  multiSelectScrollAreaAutosize,\n  multiSelectTextInput,\n  multiSelectTextInputDescription,\n  multiSelectTextInputError,\n  multiSelectTextInputInput,\n  multiSelectTextInputLabel,\n  multiSelectTextInputRequired,\n  multiSelectTextInputRoot,\n  multiSelectTextInputSection,\n  multiSelectTextInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { Icon } from '@/components/data-display/icons/icon/Icon';\n\nimport {\n  Dropdown,\n  type DropdownProps,\n  type DropdownTextInputClassNames,\n} from '../dropdown/Dropdown';\n\nexport type MultiSelectProps = Omit<\n  DropdownProps,\n  | 'classNames'\n  | 'children'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'onClick'\n  | 'value'\n  | 'search'\n  | 'setValue'\n  | 'store'\n  | 'target'\n> & {\n  options: {\n    id: string | number;\n    value: string;\n  }[];\n  textSelected?: {\n    singular?: string;\n    plural?: string;\n  };\n  classNames?: Omit<\n    NonNullable<DropdownProps['classNames']>,\n    'dropdown' | 'search'\n  > & {\n    multiSelect?: string;\n    icon?: {\n      icon?: string;\n      root?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n    scrollArea?: {\n      scrollArea?: string;\n    };\n    textInput?: DropdownTextInputClassNames;\n  };\n};\n\nexport const MultiSelect = ({\n  name,\n  label,\n  placeholder,\n  options,\n  error,\n  startSlot,\n  endSlot,\n  withinPortal = false,\n  keepMounted = true,\n  textSelected,\n  classNames,\n}: MultiSelectProps) => {\n  const [value, setValue] = useState<string[]>([]);\n\n  const handleValueSelect = (val: string) => {\n    setValue((current) =>\n      current.includes(val)\n        ? current.filter((v) => v !== val)\n        : [...current, val],\n    );\n  };\n\n  const displayValue =\n    value.length > 0\n      ? `${value.length} ${value.length === 1 ? (textSelected?.singular ?? 'selected') : (textSelected?.plural ?? 'selected')}`\n      : '';\n\n  const optionsList = options.map((item) => (\n    <Dropdown.Option\n      value={item.value}\n      key={item.id}\n      active={value.includes(item.value)}\n    >\n      {value.includes(item.value) && (\n        <Icon\n          path='/icons/sprite-mage.svg'\n          name='mage-multi-select-check'\n          classNames={{\n            icon: classNames?.icon?.icon ?? multiSelectIconIcon(),\n            root: classNames?.icon?.root ?? multiSelectIconRoot(),\n            iconRaw: {\n              iconRaw:\n                classNames?.icon?.iconRaw?.iconRaw ?? multiSelectIconIconRaw(),\n              root:\n                classNames?.icon?.iconRaw?.root ?? multiSelectIconIconRawRoot(),\n            },\n          }}\n        />\n      )}\n      <span>{item.value}</span>\n    </Dropdown.Option>\n  ));\n\n  return (\n    <Dropdown\n      readOnly\n      name={name}\n      label={label}\n      placeholder={placeholder}\n      error={error}\n      startSlot={startSlot}\n      endSlot={endSlot}\n      withinPortal={withinPortal}\n      keepMounted={keepMounted}\n      chevron={true}\n      onClick={(combobox) => combobox.toggleDropdown()}\n      setValue={(val) => {\n        if (val === undefined) {\n          setValue([]);\n          return;\n        }\n        handleValueSelect(val);\n      }}\n      value={displayValue}\n      onChange={() => {}}\n      onFocus={() => {}}\n      onBlur={() => {}}\n      classNames={{\n        dropdown: classNames?.multiSelect ?? multiSelect(),\n        root: classNames?.root ?? multiSelectRoot(),\n        options: classNames?.options ?? multiSelectOptions(),\n        option: classNames?.option ?? multiSelectOption(),\n        scrollArea: {\n          scrollArea:\n            classNames?.scrollArea?.scrollArea ??\n            multiSelectScrollAreaAutosize(),\n        },\n        textInput: {\n          textInput: classNames?.textInput?.input ?? multiSelectTextInput(),\n          root: classNames?.textInput?.root ?? multiSelectTextInputRoot(),\n          label: classNames?.textInput?.label ?? multiSelectTextInputLabel(),\n          description:\n            classNames?.textInput?.description ??\n            multiSelectTextInputDescription(),\n          error: classNames?.textInput?.error ?? multiSelectTextInputError(),\n          wrapper:\n            classNames?.textInput?.wrapper ?? multiSelectTextInputWrapper(),\n          input: classNames?.textInput?.input ?? multiSelectTextInputInput(),\n          section:\n            classNames?.textInput?.section ?? multiSelectTextInputSection(),\n          required:\n            classNames?.textInput?.required ?? multiSelectTextInputRequired(),\n          endSlot: {\n            chevron: {\n              iconWrapped:\n                classNames?.textInput?.endSlot?.chevron?.iconWrapped ??\n                multiSelectChevron(),\n              root:\n                classNames?.textInput?.endSlot?.chevron?.root ??\n                multiSelectChevronRoot(),\n              open: {\n                iconRaw:\n                  classNames?.textInput?.endSlot?.chevron?.open?.iconRaw ??\n                  multiSelectChevronIcon(),\n                root:\n                  classNames?.textInput?.endSlot?.chevron?.open?.root ??\n                  multiSelectChevronIconRoot(),\n              },\n              close: {\n                iconRaw:\n                  classNames?.textInput?.endSlot?.chevron?.close?.iconRaw ??\n                  multiSelectChevronIcon(),\n                root:\n                  classNames?.textInput?.endSlot?.chevron?.close?.root ??\n                  multiSelectChevronIconRoot({ invert: true }),\n              },\n            },\n          },\n        },\n      }}\n    >\n      <Dropdown.Options>{optionsList}</Dropdown.Options>\n    </Dropdown>\n  );\n};\n"],"mappings":"q2BA4EA,MAAa,GAAe,CAC1B,OACA,QACA,cACA,UACA,QACA,YACA,UACA,eAAe,GACf,cAAc,GACd,eACA,gBACsB,CACtB,GAAM,CAAC,EAAO,GAAY,EAAmB,EAAE,CAAC,CAE1C,EAAqB,GAAgB,CACzC,EAAU,GACR,EAAQ,SAAS,EAAI,CACjB,EAAQ,OAAQ,GAAM,IAAM,EAAI,CAChC,CAAC,GAAG,EAAS,EAAI,CACtB,EAGG,EACJ,EAAM,OAAS,EACX,GAAG,EAAM,OAAO,GAAG,EAAM,SAAW,EAAK,GAAc,UAAY,WAAe,GAAc,QAAU,aAC1G,GAEA,EAAc,EAAQ,IAAK,GAC/B,EAAC,EAAS,OAAA,CACR,MAAO,EAAK,MAEZ,OAAQ,EAAM,SAAS,EAAK,MAAM,WAEjC,EAAM,SAAS,EAAK,MAAM,EACzB,EAAC,EAAA,CACC,KAAK,yBACL,KAAK,0BACL,WAAY,CACV,KAAM,GAAY,MAAM,MAAQ,GAAqB,CACrD,KAAM,GAAY,MAAM,MAAQ,GAAqB,CACrD,QAAS,CACP,QACE,GAAY,MAAM,SAAS,SAAW,GAAwB,CAChE,KACE,GAAY,MAAM,SAAS,MAAQ,GAA4B,CAClE,CACF,EACD,CAEJ,EAAC,OAAA,CAAA,SAAM,EAAK,MAAA,CAAa,CAAA,EAnBpB,EAAK,GAoBM,CAClB,CAEF,OACE,EAAC,EAAA,CACC,SAAA,GACM,OACC,QACM,cACN,QACI,YACF,UACK,eACD,cACb,QAAS,GACT,QAAU,GAAa,EAAS,gBAAgB,CAChD,SAAW,GAAQ,CACjB,GAAI,IAAQ,IAAA,GAAW,CACrB,EAAS,EAAE,CAAC,CACZ,OAEF,EAAkB,EAAI,EAExB,MAAO,EACP,aAAgB,GAChB,YAAe,GACf,WAAc,GACd,WAAY,CACV,SAAU,GAAY,aAAe,GAAa,CAClD,KAAM,GAAY,MAAQ,GAAiB,CAC3C,QAAS,GAAY,SAAW,GAAoB,CACpD,OAAQ,GAAY,QAAU,GAAmB,CACjD,WAAY,CACV,WACE,GAAY,YAAY,YACxB,GAA+B,CAClC,CACD,UAAW,CACT,UAAW,GAAY,WAAW,OAAS,GAAsB,CACjE,KAAM,GAAY,WAAW,MAAQ,GAA0B,CAC/D,MAAO,GAAY,WAAW,OAAS,GAA2B,CAClE,YACE,GAAY,WAAW,aACvB,GAAiC,CACnC,MAAO,GAAY,WAAW,OAAS,GAA2B,CAClE,QACE,GAAY,WAAW,SAAW,GAA6B,CACjE,MAAO,GAAY,WAAW,OAAS,GAA2B,CAClE,QACE,GAAY,WAAW,SAAW,GAA6B,CACjE,SACE,GAAY,WAAW,UAAY,GAA8B,CACnE,QAAS,CACP,QAAS,CACP,YACE,GAAY,WAAW,SAAS,SAAS,aACzC,GAAoB,CACtB,KACE,GAAY,WAAW,SAAS,SAAS,MACzC,GAAwB,CAC1B,KAAM,CACJ,QACE,GAAY,WAAW,SAAS,SAAS,MAAM,SAC/C,GAAwB,CAC1B,KACE,GAAY,WAAW,SAAS,SAAS,MAAM,MAC/C,GAA4B,CAC/B,CACD,MAAO,CACL,QACE,GAAY,WAAW,SAAS,SAAS,OAAO,SAChD,GAAwB,CAC1B,KACE,GAAY,WAAW,SAAS,SAAS,OAAO,MAChD,EAA2B,CAAE,OAAQ,GAAM,CAAC,CAC/C,CACF,CACF,CACF,CACF,UAED,EAAC,EAAS,QAAA,CAAA,SAAS,EAAA,CAA+B,EACzC"}

package/dist/components/controls/multi-select/MultiSelectTags.d.mts

@@ -1,5 +1,5 @@
 import { DropdownProps, DropdownTextInputClassNames } from "../dropdown/Dropdown.mjs";
-import * as react_jsx_runtime30 from "react/jsx-runtime";
+import * as react_jsx_runtime32 from "react/jsx-runtime";
 
 //#region src/components/controls/multi-select/MultiSelectTags.d.ts
 type MultiSelectTagsProps = Omit<DropdownProps, 'classNames' | 'children' | 'onChange' | 'onFocus' | 'onBlur' | 'onClick' | 'value' | 'search' | 'setValue' | 'store' | 'target'> & {
@@ -57,7 +57,7 @@ declare const MultiSelectTags: ({
   startSlot,
   endSlot,
   classNames
-}: MultiSelectTagsProps) => react_jsx_runtime30.JSX.Element;
+}: MultiSelectTagsProps) => react_jsx_runtime32.JSX.Element;
 //#endregion
 export { MultiSelectTags, MultiSelectTagsProps };
 //# sourceMappingURL=MultiSelectTags.d.mts.map

package/dist/components/controls/multi-select/MultiSelectTags.mjs

@@ -1,2 +1,2 @@
-import{Tag as e}from"../../data-display/tag/Tag.mjs";import{Icon as t}from"../../data-display/icons/icon/Icon.mjs";import{Chevron as n}from"../utils/chevron/Chevron.mjs";import{Dropdown as r}from"../dropdown/Dropdown.mjs";import{cx as i}from"@mage-ui/styled-system/css";import{multiSelectTags as a,multiSelectTagsChevron as o,multiSelectTagsChevronIcon as s,multiSelectTagsChevronIconRoot as c,multiSelectTagsChevronRoot as l,multiSelectTagsEmpty as u,multiSelectTagsGroup as d,multiSelectTagsGroupRoot as f,multiSelectTagsIconIcon as p,multiSelectTagsIconIconRaw as m,multiSelectTagsIconIconRawRoot as h,multiSelectTagsIconRoot as g,multiSelectTagsInput as ee,multiSelectTagsInputDescription as _,multiSelectTagsInputError as v,multiSelectTagsInputField as y,multiSelectTagsInputInput as b,multiSelectTagsInputLabel as x,multiSelectTagsInputPlaceholder as S,multiSelectTagsInputRequired as C,multiSelectTagsInputRoot as w,multiSelectTagsInputSection as T,multiSelectTagsInputWrapper as E,multiSelectTagsOption as D,multiSelectTagsOptions as O,multiSelectTagsRoot as k,multiSelectTagsScrollAreaAutosize as A}from"@mage-ui/styled-system/recipes";import{Input as j,PillsInput as M,useCombobox as N}from"@mantine/core";import{jsx as P,jsxs as F}from"react/jsx-runtime";import{useState as te}from"react";const I=({name:I,label:L,placeholder:R,options:z,error:B,description:V,required:H=!1,withinPortal:U=!1,keepMounted:W=!0,startSlot:G,endSlot:K,classNames:q})=>{let J=N({onDropdownClose:()=>J.resetSelectedOption(),onDropdownOpen:()=>J.updateSelectedOptionIndex(`active`)}),[Y,X]=te([]),Z=e=>X(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e]),Q=e=>X(t=>t.filter(t=>t!==e)),$=Y.map(t=>P(e,{label:t,onRemove:()=>Q(t),children:t},t)),ne=z.map(e=>F(r.Option,{value:e.value,active:Y.includes(e.value),children:[Y.includes(e.value)&&P(t,{path:`/icons/sprite-mage.svg`,name:`mage-multi-select-tags-check`,classNames:{icon:q?.icon?.icon??p(),root:q?.icon?.root??g(),iconRaw:{iconRaw:q?.icon?.iconRaw?.iconRaw??m(),root:q?.icon?.iconRaw?.root??h()}}}),P(`span`,{children:e.value})]},e.id)),re=P(M,{label:L,error:B,withAsterisk:H,description:V,pointer:!0,onClick:()=>J.openDropdown(),leftSection:G,rightSection:K??P(n,{path:`/icons/sprite-mage.svg`,chevronOpen:`mage-multi-select-tags-chevron-down`,chevronClose:`mage-multi-select-tags-chevron-up`,classNames:{iconWrapped:q?.chevron?.iconWrapped??o(),root:q?.chevron?.root??l(),open:{iconRaw:q?.chevron?.open?.iconRaw??s(),root:q?.chevron?.open?.root??c()},close:{iconRaw:q?.chevron?.close?.iconRaw??s(),root:q?.chevron?.close?.root??c({invert:!0})}}}),classNames:{root:i(q?.tagsInput?.tagsInput??ee(),q?.tagsInput?.root??w()),wrapper:q?.tagsInput?.wrapper??E(),input:i(q?.tagsInput?.input??b(),`peer`),section:i(q?.tagsInput?.section??T(),`group`),label:q?.tagsInput?.label??x(),required:q?.tagsInput?.required??C(),description:q?.tagsInput?.description??_(),error:q?.tagsInput?.error??v()},children:F(e.Group,{classNames:{tagGroup:q?.tagsInput?.tagGroup?.tagGroup??d(),root:q?.tagsInput?.tagGroup?.root??f()},children:[$.length>0?$:P(j.Placeholder,{classNames:{placeholder:q?.tagsInput?.placeholder??S()},children:R}),P(r.EventsTarget,{children:P(M.Field,{name:I,type:`hidden`,classNames:{field:q?.tagsInput?.field??y()},onKeyDown:e=>{e.key===`Backspace`&&Y.length>0&&(e.preventDefault(),Q(Y[Y.length-1]))}})})]})});return P(r,{readOnly:!0,store:J,withinPortal:U,keepMounted:W,chevron:!0,setValue:e=>{if(e===void 0){X([]);return}Z(e)},onChange:()=>{},onFocus:()=>{},onBlur:()=>{},onClick:()=>{},classNames:{dropdown:q?.multiSelectTags??a(),root:q?.root??k(),options:q?.options??O(),option:q?.option??D(),empty:q?.empty??u(),scrollArea:{scrollArea:q?.scrollArea?.scrollArea??A()}},target:re,children:P(r.Options,{children:ne})})};export{I as MultiSelectTags};
+import{Icon as e}from"../../data-display/icons/icon/Icon.mjs";import{Tag as t}from"../../data-display/tag/Tag.mjs";import{Chevron as n}from"../utils/chevron/Chevron.mjs";import{Dropdown as r}from"../dropdown/Dropdown.mjs";import{cx as i}from"@mage-ui/styled-system/css";import{multiSelectTags as a,multiSelectTagsChevron as o,multiSelectTagsChevronIcon as s,multiSelectTagsChevronIconRoot as c,multiSelectTagsChevronRoot as l,multiSelectTagsEmpty as u,multiSelectTagsGroup as d,multiSelectTagsGroupRoot as f,multiSelectTagsIconIcon as p,multiSelectTagsIconIconRaw as m,multiSelectTagsIconIconRawRoot as h,multiSelectTagsIconRoot as g,multiSelectTagsInput as ee,multiSelectTagsInputDescription as _,multiSelectTagsInputError as v,multiSelectTagsInputField as y,multiSelectTagsInputInput as b,multiSelectTagsInputLabel as x,multiSelectTagsInputPlaceholder as S,multiSelectTagsInputRequired as C,multiSelectTagsInputRoot as w,multiSelectTagsInputSection as T,multiSelectTagsInputWrapper as E,multiSelectTagsOption as D,multiSelectTagsOptions as O,multiSelectTagsRoot as k,multiSelectTagsScrollAreaAutosize as A}from"@mage-ui/styled-system/recipes";import{Input as j,PillsInput as M,useCombobox as N}from"@mantine/core";import{jsx as P,jsxs as F}from"react/jsx-runtime";import{useState as te}from"react";const I=({name:I,label:L,placeholder:R,options:z,error:B,description:V,required:H=!1,withinPortal:U=!1,keepMounted:W=!0,startSlot:G,endSlot:K,classNames:q})=>{let J=N({onDropdownClose:()=>J.resetSelectedOption(),onDropdownOpen:()=>J.updateSelectedOptionIndex(`active`)}),[Y,X]=te([]),Z=e=>X(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e]),Q=e=>X(t=>t.filter(t=>t!==e)),$=Y.map(e=>P(t,{label:e,onRemove:()=>Q(e),children:e},e)),ne=z.map(t=>F(r.Option,{value:t.value,active:Y.includes(t.value),children:[Y.includes(t.value)&&P(e,{path:`/icons/sprite-mage.svg`,name:`mage-multi-select-tags-check`,classNames:{icon:q?.icon?.icon??p(),root:q?.icon?.root??g(),iconRaw:{iconRaw:q?.icon?.iconRaw?.iconRaw??m(),root:q?.icon?.iconRaw?.root??h()}}}),P(`span`,{children:t.value})]},t.id)),re=P(M,{label:L,error:B,withAsterisk:H,description:V,pointer:!0,onClick:()=>J.openDropdown(),leftSection:G,rightSection:K??P(n,{path:`/icons/sprite-mage.svg`,chevronOpen:`mage-multi-select-tags-chevron-down`,chevronClose:`mage-multi-select-tags-chevron-up`,classNames:{iconWrapped:q?.chevron?.iconWrapped??o(),root:q?.chevron?.root??l(),open:{iconRaw:q?.chevron?.open?.iconRaw??s(),root:q?.chevron?.open?.root??c()},close:{iconRaw:q?.chevron?.close?.iconRaw??s(),root:q?.chevron?.close?.root??c({invert:!0})}}}),classNames:{root:i(q?.tagsInput?.tagsInput??ee(),q?.tagsInput?.root??w()),wrapper:q?.tagsInput?.wrapper??E(),input:i(q?.tagsInput?.input??b(),`peer`),section:i(q?.tagsInput?.section??T(),`group`),label:q?.tagsInput?.label??x(),required:q?.tagsInput?.required??C(),description:q?.tagsInput?.description??_(),error:q?.tagsInput?.error??v()},children:F(t.Group,{classNames:{tagGroup:q?.tagsInput?.tagGroup?.tagGroup??d(),root:q?.tagsInput?.tagGroup?.root??f()},children:[$.length>0?$:P(j.Placeholder,{classNames:{placeholder:q?.tagsInput?.placeholder??S()},children:R}),P(r.EventsTarget,{children:P(M.Field,{name:I,type:`hidden`,classNames:{field:q?.tagsInput?.field??y()},onKeyDown:e=>{e.key===`Backspace`&&Y.length>0&&(e.preventDefault(),Q(Y[Y.length-1]))}})})]})});return P(r,{readOnly:!0,store:J,withinPortal:U,keepMounted:W,chevron:!0,setValue:e=>{if(e===void 0){X([]);return}Z(e)},onChange:()=>{},onFocus:()=>{},onBlur:()=>{},onClick:()=>{},classNames:{dropdown:q?.multiSelectTags??a(),root:q?.root??k(),options:q?.options??O(),option:q?.option??D(),empty:q?.empty??u(),scrollArea:{scrollArea:q?.scrollArea?.scrollArea??A()}},target:re,children:P(r.Options,{children:ne})})};export{I as MultiSelectTags};
 //# sourceMappingURL=MultiSelectTags.mjs.map

package/dist/components/controls/multi-select/MultiSelectTags.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelectTags.mjs","names":["TagsInput"],"sources":["../../../../src/components/controls/multi-select/MultiSelectTags.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  multiSelectTags,\n  multiSelectTagsChevron,\n  multiSelectTagsChevronIcon,\n  multiSelectTagsChevronIconRoot,\n  multiSelectTagsChevronRoot,\n  multiSelectTagsEmpty,\n  multiSelectTagsGroup,\n  multiSelectTagsGroupRoot,\n  multiSelectTagsIconIcon,\n  multiSelectTagsIconIconRaw,\n  multiSelectTagsIconIconRawRoot,\n  multiSelectTagsIconRoot,\n  multiSelectTagsInput,\n  multiSelectTagsInputDescription,\n  multiSelectTagsInputError,\n  multiSelectTagsInputField,\n  multiSelectTagsInputInput,\n  multiSelectTagsInputLabel,\n  multiSelectTagsInputPlaceholder,\n  multiSelectTagsInputRequired,\n  multiSelectTagsInputRoot,\n  multiSelectTagsInputSection,\n  multiSelectTagsInputWrapper,\n  multiSelectTagsOption,\n  multiSelectTagsOptions,\n  multiSelectTagsRoot,\n  multiSelectTagsScrollAreaAutosize,\n} from '@mage-ui/styled-system/recipes';\nimport { Input, PillsInput as TagsInput, useCombobox } from '@mantine/core';\nimport { Icon, Tag } from '@/components/data-display';\n\nimport {\n  Dropdown,\n  type DropdownProps,\n  type DropdownTextInputClassNames,\n} from '../dropdown/Dropdown';\nimport { Chevron } from '../utils';\n\nexport type MultiSelectTagsProps = Omit<\n  DropdownProps,\n  | 'classNames'\n  | 'children'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'onClick'\n  | 'value'\n  | 'search'\n  | 'setValue'\n  | 'store'\n  | 'target'\n> & {\n  classNames?: Omit<NonNullable<DropdownProps['classNames']>, 'dropdown'> & {\n    multiSelectTags?: string;\n    icon?: {\n      icon?: string;\n      root?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n    scrollArea?: {\n      scrollArea?: string;\n    };\n    tagsInput?: DropdownTextInputClassNames & {\n      tagsInput?: string;\n      placeholder?: string;\n      field?: string;\n      tagGroup?: {\n        root?: string;\n        tagGroup?: string;\n      };\n    };\n    chevron?: {\n      iconWrapped?: string;\n      root?: string;\n      open?: {\n        iconRaw?: string;\n        root?: string;\n      };\n      close?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n  options: {\n    id: string | number;\n    value: string;\n  }[];\n  required?: boolean;\n};\n\nexport const MultiSelectTags = ({\n  name,\n  label,\n  placeholder,\n  options,\n  error,\n  description,\n  required = false,\n  withinPortal = false,\n  keepMounted = true,\n  startSlot,\n  endSlot,\n  classNames,\n}: MultiSelectTagsProps) => {\n  const combobox = useCombobox({\n    onDropdownClose: () => combobox.resetSelectedOption(),\n    onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n  });\n\n  const [value, setValue] = useState<string[]>([]);\n\n  const handleValueSelect = (val: string) =>\n    setValue((current) =>\n      current.includes(val)\n        ? current.filter((v) => v !== val)\n        : [...current, val],\n    );\n\n  const handleValueRemove = (val: string) =>\n    setValue((current) => current.filter((v) => v !== val));\n\n  const values = value.map((item) => (\n    <Tag key={item} label={item} onRemove={() => handleValueRemove(item)}>\n      {item}\n    </Tag>\n  ));\n\n  const optionsList = options.map((item) => (\n    <Dropdown.Option\n      value={item.value}\n      key={item.id}\n      active={value.includes(item.value)}\n    >\n      {value.includes(item.value) && (\n        <Icon\n          path=\"/icons/sprite-mage.svg\"\n          name='mage-multi-select-tags-check'\n          classNames={{\n            icon: classNames?.icon?.icon ?? multiSelectTagsIconIcon(),\n            root: classNames?.icon?.root ?? multiSelectTagsIconRoot(),\n            iconRaw: {\n              iconRaw: classNames?.icon?.iconRaw?.iconRaw ?? multiSelectTagsIconIconRaw(),\n              root: classNames?.icon?.iconRaw?.root ?? multiSelectTagsIconIconRawRoot(),\n            }\n          }}\n        />\n\n\n      )}\n      <span>{item.value}</span>\n    </Dropdown.Option>\n  ));\n\n  const tagsTarget = (\n    <TagsInput\n      label={label}\n      error={error}\n      withAsterisk={required}\n      description={description}\n      pointer\n      onClick={() => combobox.openDropdown()}\n      leftSection={startSlot}\n      rightSection={\n        endSlot ?? (\n          <Chevron\n            path='/icons/sprite-mage.svg'\n            chevronOpen='mage-multi-select-tags-chevron-down'\n            chevronClose='mage-multi-select-tags-chevron-up'\n            classNames={{\n              iconWrapped:\n                classNames?.chevron?.iconWrapped ?? multiSelectTagsChevron(),\n              root: classNames?.chevron?.root ?? multiSelectTagsChevronRoot(),\n              open: {\n                iconRaw:\n                  classNames?.chevron?.open?.iconRaw ??\n                  multiSelectTagsChevronIcon(),\n                root:\n                  classNames?.chevron?.open?.root ??\n                  multiSelectTagsChevronIconRoot(),\n              },\n              close: {\n                iconRaw:\n                  classNames?.chevron?.close?.iconRaw ??\n                  multiSelectTagsChevronIcon(),\n                root:\n                  classNames?.chevron?.close?.root ??\n                  multiSelectTagsChevronIconRoot({ invert: true }),\n              },\n            }}\n          />\n        )\n      }\n      classNames={{\n        root: cx(\n          classNames?.tagsInput?.tagsInput ?? multiSelectTagsInput(),\n          classNames?.tagsInput?.root ?? multiSelectTagsInputRoot(),\n        ),\n        wrapper:\n          classNames?.tagsInput?.wrapper ?? multiSelectTagsInputWrapper(),\n        input: cx(\n          classNames?.tagsInput?.input ?? multiSelectTagsInputInput(),\n          'peer',\n        ),\n        section: cx(\n          classNames?.tagsInput?.section ?? multiSelectTagsInputSection(),\n          'group',\n        ),\n        label: classNames?.tagsInput?.label ?? multiSelectTagsInputLabel(),\n        required:\n          classNames?.tagsInput?.required ?? multiSelectTagsInputRequired(),\n        description:\n          classNames?.tagsInput?.description ??\n          multiSelectTagsInputDescription(),\n        error: classNames?.tagsInput?.error ?? multiSelectTagsInputError(),\n      }}\n    >\n      <Tag.Group\n        classNames={{\n          tagGroup: classNames?.tagsInput?.tagGroup?.tagGroup ?? multiSelectTagsGroup(),\n          root: classNames?.tagsInput?.tagGroup?.root ?? multiSelectTagsGroupRoot(),\n        }}\n      >\n        {values.length > 0 ? (\n          values\n        ) : (\n          <Input.Placeholder\n            classNames={{\n              placeholder:\n                classNames?.tagsInput?.placeholder ??\n                multiSelectTagsInputPlaceholder(),\n            }}\n          >\n            {placeholder}\n          </Input.Placeholder>\n        )}\n        <Dropdown.EventsTarget>\n          <TagsInput.Field\n            name={name}\n            type='hidden'\n            classNames={{\n              field:\n                classNames?.tagsInput?.field ?? multiSelectTagsInputField(),\n            }}\n            onKeyDown={(event) => {\n              if (event.key === 'Backspace' && value.length > 0) {\n                event.preventDefault();\n                handleValueRemove(value[value.length - 1]);\n              }\n            }}\n          />\n        </Dropdown.EventsTarget>\n      </Tag.Group>\n    </TagsInput>\n  );\n\n  return (\n    <Dropdown\n      readOnly\n      store={combobox}\n      withinPortal={withinPortal}\n      keepMounted={keepMounted}\n      chevron={true}\n      setValue={(val) => {\n        if (val === undefined) {\n          setValue([]);\n          return;\n        }\n        handleValueSelect(val);\n      }}\n      onChange={() => { }}\n      onFocus={() => { }}\n      onBlur={() => { }}\n      onClick={() => { }}\n      classNames={{\n        dropdown: classNames?.multiSelectTags ?? multiSelectTags(),\n        root: classNames?.root ?? multiSelectTagsRoot(),\n        options: classNames?.options ?? multiSelectTagsOptions(),\n        option: classNames?.option ?? multiSelectTagsOption(),\n        empty: classNames?.empty ?? multiSelectTagsEmpty(),\n        scrollArea: {\n          scrollArea:\n            classNames?.scrollArea?.scrollArea ?? multiSelectTagsScrollAreaAutosize(),\n        },\n      }}\n      target={tagsTarget}\n    >\n      <Dropdown.Options>{optionsList}</Dropdown.Options>\n    </Dropdown>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"MultiSelectTags.mjs","names":["TagsInput"],"sources":["../../../../src/components/controls/multi-select/MultiSelectTags.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  multiSelectTags,\n  multiSelectTagsChevron,\n  multiSelectTagsChevronIcon,\n  multiSelectTagsChevronIconRoot,\n  multiSelectTagsChevronRoot,\n  multiSelectTagsEmpty,\n  multiSelectTagsGroup,\n  multiSelectTagsGroupRoot,\n  multiSelectTagsIconIcon,\n  multiSelectTagsIconIconRaw,\n  multiSelectTagsIconIconRawRoot,\n  multiSelectTagsIconRoot,\n  multiSelectTagsInput,\n  multiSelectTagsInputDescription,\n  multiSelectTagsInputError,\n  multiSelectTagsInputField,\n  multiSelectTagsInputInput,\n  multiSelectTagsInputLabel,\n  multiSelectTagsInputPlaceholder,\n  multiSelectTagsInputRequired,\n  multiSelectTagsInputRoot,\n  multiSelectTagsInputSection,\n  multiSelectTagsInputWrapper,\n  multiSelectTagsOption,\n  multiSelectTagsOptions,\n  multiSelectTagsRoot,\n  multiSelectTagsScrollAreaAutosize,\n} from '@mage-ui/styled-system/recipes';\nimport { Input, PillsInput as TagsInput, useCombobox } from '@mantine/core';\nimport { Icon, Tag } from '@/components/data-display';\n\nimport {\n  Dropdown,\n  type DropdownProps,\n  type DropdownTextInputClassNames,\n} from '../dropdown/Dropdown';\nimport { Chevron } from '../utils';\n\nexport type MultiSelectTagsProps = Omit<\n  DropdownProps,\n  | 'classNames'\n  | 'children'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'onClick'\n  | 'value'\n  | 'search'\n  | 'setValue'\n  | 'store'\n  | 'target'\n> & {\n  classNames?: Omit<NonNullable<DropdownProps['classNames']>, 'dropdown'> & {\n    multiSelectTags?: string;\n    icon?: {\n      icon?: string;\n      root?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n    scrollArea?: {\n      scrollArea?: string;\n    };\n    tagsInput?: DropdownTextInputClassNames & {\n      tagsInput?: string;\n      placeholder?: string;\n      field?: string;\n      tagGroup?: {\n        root?: string;\n        tagGroup?: string;\n      };\n    };\n    chevron?: {\n      iconWrapped?: string;\n      root?: string;\n      open?: {\n        iconRaw?: string;\n        root?: string;\n      };\n      close?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n  options: {\n    id: string | number;\n    value: string;\n  }[];\n  required?: boolean;\n};\n\nexport const MultiSelectTags = ({\n  name,\n  label,\n  placeholder,\n  options,\n  error,\n  description,\n  required = false,\n  withinPortal = false,\n  keepMounted = true,\n  startSlot,\n  endSlot,\n  classNames,\n}: MultiSelectTagsProps) => {\n  const combobox = useCombobox({\n    onDropdownClose: () => combobox.resetSelectedOption(),\n    onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n  });\n\n  const [value, setValue] = useState<string[]>([]);\n\n  const handleValueSelect = (val: string) =>\n    setValue((current) =>\n      current.includes(val)\n        ? current.filter((v) => v !== val)\n        : [...current, val],\n    );\n\n  const handleValueRemove = (val: string) =>\n    setValue((current) => current.filter((v) => v !== val));\n\n  const values = value.map((item) => (\n    <Tag key={item} label={item} onRemove={() => handleValueRemove(item)}>\n      {item}\n    </Tag>\n  ));\n\n  const optionsList = options.map((item) => (\n    <Dropdown.Option\n      value={item.value}\n      key={item.id}\n      active={value.includes(item.value)}\n    >\n      {value.includes(item.value) && (\n        <Icon\n          path='/icons/sprite-mage.svg'\n          name='mage-multi-select-tags-check'\n          classNames={{\n            icon: classNames?.icon?.icon ?? multiSelectTagsIconIcon(),\n            root: classNames?.icon?.root ?? multiSelectTagsIconRoot(),\n            iconRaw: {\n              iconRaw:\n                classNames?.icon?.iconRaw?.iconRaw ??\n                multiSelectTagsIconIconRaw(),\n              root:\n                classNames?.icon?.iconRaw?.root ??\n                multiSelectTagsIconIconRawRoot(),\n            },\n          }}\n        />\n      )}\n      <span>{item.value}</span>\n    </Dropdown.Option>\n  ));\n\n  const tagsTarget = (\n    <TagsInput\n      label={label}\n      error={error}\n      withAsterisk={required}\n      description={description}\n      pointer\n      onClick={() => combobox.openDropdown()}\n      leftSection={startSlot}\n      rightSection={\n        endSlot ?? (\n          <Chevron\n            path='/icons/sprite-mage.svg'\n            chevronOpen='mage-multi-select-tags-chevron-down'\n            chevronClose='mage-multi-select-tags-chevron-up'\n            classNames={{\n              iconWrapped:\n                classNames?.chevron?.iconWrapped ?? multiSelectTagsChevron(),\n              root: classNames?.chevron?.root ?? multiSelectTagsChevronRoot(),\n              open: {\n                iconRaw:\n                  classNames?.chevron?.open?.iconRaw ??\n                  multiSelectTagsChevronIcon(),\n                root:\n                  classNames?.chevron?.open?.root ??\n                  multiSelectTagsChevronIconRoot(),\n              },\n              close: {\n                iconRaw:\n                  classNames?.chevron?.close?.iconRaw ??\n                  multiSelectTagsChevronIcon(),\n                root:\n                  classNames?.chevron?.close?.root ??\n                  multiSelectTagsChevronIconRoot({ invert: true }),\n              },\n            }}\n          />\n        )\n      }\n      classNames={{\n        root: cx(\n          classNames?.tagsInput?.tagsInput ?? multiSelectTagsInput(),\n          classNames?.tagsInput?.root ?? multiSelectTagsInputRoot(),\n        ),\n        wrapper:\n          classNames?.tagsInput?.wrapper ?? multiSelectTagsInputWrapper(),\n        input: cx(\n          classNames?.tagsInput?.input ?? multiSelectTagsInputInput(),\n          'peer',\n        ),\n        section: cx(\n          classNames?.tagsInput?.section ?? multiSelectTagsInputSection(),\n          'group',\n        ),\n        label: classNames?.tagsInput?.label ?? multiSelectTagsInputLabel(),\n        required:\n          classNames?.tagsInput?.required ?? multiSelectTagsInputRequired(),\n        description:\n          classNames?.tagsInput?.description ??\n          multiSelectTagsInputDescription(),\n        error: classNames?.tagsInput?.error ?? multiSelectTagsInputError(),\n      }}\n    >\n      <Tag.Group\n        classNames={{\n          tagGroup:\n            classNames?.tagsInput?.tagGroup?.tagGroup ?? multiSelectTagsGroup(),\n          root:\n            classNames?.tagsInput?.tagGroup?.root ?? multiSelectTagsGroupRoot(),\n        }}\n      >\n        {values.length > 0 ? (\n          values\n        ) : (\n          <Input.Placeholder\n            classNames={{\n              placeholder:\n                classNames?.tagsInput?.placeholder ??\n                multiSelectTagsInputPlaceholder(),\n            }}\n          >\n            {placeholder}\n          </Input.Placeholder>\n        )}\n        <Dropdown.EventsTarget>\n          <TagsInput.Field\n            name={name}\n            type='hidden'\n            classNames={{\n              field:\n                classNames?.tagsInput?.field ?? multiSelectTagsInputField(),\n            }}\n            onKeyDown={(event) => {\n              if (event.key === 'Backspace' && value.length > 0) {\n                event.preventDefault();\n                handleValueRemove(value[value.length - 1]);\n              }\n            }}\n          />\n        </Dropdown.EventsTarget>\n      </Tag.Group>\n    </TagsInput>\n  );\n\n  return (\n    <Dropdown\n      readOnly\n      store={combobox}\n      withinPortal={withinPortal}\n      keepMounted={keepMounted}\n      chevron={true}\n      setValue={(val) => {\n        if (val === undefined) {\n          setValue([]);\n          return;\n        }\n        handleValueSelect(val);\n      }}\n      onChange={() => {}}\n      onFocus={() => {}}\n      onBlur={() => {}}\n      onClick={() => {}}\n      classNames={{\n        dropdown: classNames?.multiSelectTags ?? multiSelectTags(),\n        root: classNames?.root ?? multiSelectTagsRoot(),\n        options: classNames?.options ?? multiSelectTagsOptions(),\n        option: classNames?.option ?? multiSelectTagsOption(),\n        empty: classNames?.empty ?? multiSelectTagsEmpty(),\n        scrollArea: {\n          scrollArea:\n            classNames?.scrollArea?.scrollArea ??\n            multiSelectTagsScrollAreaAutosize(),\n        },\n      }}\n      target={tagsTarget}\n    >\n      <Dropdown.Options>{optionsList}</Dropdown.Options>\n    </Dropdown>\n  );\n};\n"],"mappings":"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"}

package/dist/components/controls/password-input/PasswordInput.d.mts

@@ -1,15 +1,10 @@
 import { TextInputProps } from "../text-input/TextInput.mjs";
-import * as react_jsx_runtime23 from "react/jsx-runtime";
-import { ReactNode } from "react";
+import * as react_jsx_runtime33 from "react/jsx-runtime";
 
 //#region src/components/controls/password-input/PasswordInput.d.ts
-type PasswordInputProps = Omit<TextInputProps, 'classNames' | 'endSlot'> & {
-  label?: ReactNode;
-  description?: ReactNode;
-  error?: ReactNode;
-  startSlot?: ReactNode;
-  hidePasswordText?: string;
-  showPasswordText?: string;
+type PasswordInputProps = Omit<NonNullable<TextInputProps>, 'classNames'> & {
+  hideText?: string;
+  showText?: string;
   classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {
     passwordInput?: string;
     buttonIcon?: {
@@ -24,24 +19,11 @@ type PasswordInputProps = Omit<TextInputProps, 'classNames' | 'endSlot'> & {
   };
 };
 declare const PasswordInput: ({
-  name,
-  label,
-  description,
-  error,
-  placeholder,
   classNames,
-  startSlot,
-  onChange,
-  value,
-  id,
-  disabled,
-  required,
-  readOnly,
-  onClick,
-  onFocus,
-  hidePasswordText,
-  showPasswordText
-}: PasswordInputProps) => react_jsx_runtime23.JSX.Element;
+  hideText,
+  showText,
+  ...props
+}: PasswordInputProps) => react_jsx_runtime33.JSX.Element;
 //#endregion
 export { PasswordInput, PasswordInputProps };
 //# sourceMappingURL=PasswordInput.d.mts.map

package/dist/components/controls/password-input/PasswordInput.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordInput.d.mts","names":[],"sources":["../../../../src/components/controls/password-input/PasswordInput.tsx"],"mappings":";;;;;KAqBY,kBAAA,GAAqB,IAAA,CAC/B,cAAA;EAGA,KAAA,GAAQ,SAAA;EACR,WAAA,GAAc,SAAA;EACd,KAAA,GAAQ,SAAA;EACR,SAAA,GAAY,SAAA;EACZ,gBAAA;EACA,gBAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,cAAA;IAC5B,aAAA;IACA,UAAA;MACE,UAAA;MACA,IAAA;MACA,IAAA;MACA,OAAA;QACE,OAAA;QACA,IAAA;MAAA;IAAA;EAAA;AAAA;AAAA,cAMK,aAAA;EAAiB,IAAA;EAAA,KAAA;EAAA,WAAA;EAAA,KAAA;EAAA,WAAA;EAAA,UAAA;EAAA,SAAA;EAAA,QAAA;EAAA,KAAA;EAAA,EAAA;EAAA,QAAA;EAAA,QAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,gBAAA;EAAA;AAAA,GAkB3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"PasswordInput.d.mts","names":[],"sources":["../../../../src/components/controls/password-input/PasswordInput.tsx"],"mappings":";;;;KAuBY,kBAAA,GAAqB,IAAA,CAC/B,WAAA,CAAY,cAAA;EAGZ,QAAA;EACA,QAAA;EACA,UAAA,GAAa,IAAA,CAAK,WAAA,CAAY,cAAA;IAC5B,aAAA;IACA,UAAA;MACE,UAAA;MACA,IAAA;MACA,IAAA;MACA,OAAA;QACE,OAAA;QACA,IAAA;MAAA;IAAA;EAAA;AAAA;AAAA,cAMK,aAAA;EAAiB,UAAA;EAAA,QAAA;EAAA,QAAA;EAAA,GAAA;AAAA,GAK3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/controls/password-input/PasswordInput.mjs

@@ -1,2 +1,2 @@
-import{ButtonIcon as e}from"../../buttons/button-icon/ButtonIcon.mjs";import{TextInput as t}from"../text-input/TextInput.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{passwordInput as r,passwordInputButtonIcon as i,passwordInputButtonIconIcon as a,passwordInputButtonIconIconRaw as o,passwordInputButtonIconIconRawRoot as s,passwordInputButtonIconRoot as c,passwordInputDescription as l,passwordInputError as u,passwordInputInput as d,passwordInputLabel as f,passwordInputRequired as p,passwordInputRoot as m,passwordInputSection as h,passwordInputWrapper as g}from"@mage-ui/styled-system/recipes";import{jsx as _}from"react/jsx-runtime";import{useState as v}from"react";const y=({name:y,label:b,description:x,error:S,placeholder:C,classNames:w,startSlot:T,onChange:E,value:D,id:O,disabled:k,required:A,readOnly:j,onClick:M,onFocus:N,hidePasswordText:P,showPasswordText:F})=>{let[I,L]=v(!1);return _(t,{name:y,label:b,description:x,error:S,placeholder:C,value:D,id:O,disabled:k,required:A,readOnly:j,onChange:E,onClick:M,onFocus:N,type:I?`text`:`password`,startSlot:T,endSlot:_(e,{name:I?`mage-password-input-eye-off`:`mage-password-input-eye`,path:`/icons/sprite-mage.svg`,label:I?P??`Hide password`:F??`Show password`,onClick:()=>L(!I),disabled:k,classNames:{buttonIcon:w?.buttonIcon?.buttonIcon??i(),root:w?.buttonIcon?.root??c(),icon:w?.buttonIcon?.icon??a(),iconRaw:{iconRaw:w?.buttonIcon?.iconRaw?.iconRaw??o(),root:w?.buttonIcon?.iconRaw?.root??s()}}}),classNames:{root:n(w?.passwordInput??r(),w?.root??m()),label:w?.label??f(),required:w?.required??p(),description:w?.description??l(),error:w?.error??u(),wrapper:w?.wrapper??g(),input:w?.input??d(),section:w?.section??h()}})};export{y as PasswordInput};
+import{ButtonIcon as e}from"../../buttons/button-icon/ButtonIcon.mjs";import{TextInput as t}from"../text-input/TextInput.mjs";import{cx as n}from"@mage-ui/styled-system/css";import{passwordInput as r,passwordInputButtonIcon as i,passwordInputButtonIconIcon as a,passwordInputButtonIconIconRaw as o,passwordInputButtonIconIconRawRoot as s,passwordInputButtonIconRoot as c,passwordInputDescription as l,passwordInputError as u,passwordInputInput as d,passwordInputLabel as f,passwordInputRequired as p,passwordInputRoot as m,passwordInputSection as h,passwordInputWrapper as g}from"@mage-ui/styled-system/recipes";import{jsx as _}from"react/jsx-runtime";import{useState as v}from"react";const y=({classNames:y,hideText:b=`Hide password`,showText:x=`Show password`,...S})=>{let[C,w]=v(!1);return _(t,{type:C?`text`:`password`,endSlot:_(()=>_(e,{name:C?`mage-password-input-eye-off`:`mage-password-input-eye`,path:`/icons/sprite-mage.svg`,label:C?b:x,onClick:()=>w(!C),classNames:{buttonIcon:y?.buttonIcon?.buttonIcon??i(),root:y?.buttonIcon?.root??c(),icon:y?.buttonIcon?.icon??a(),iconRaw:{iconRaw:y?.buttonIcon?.iconRaw?.iconRaw??o(),root:y?.buttonIcon?.iconRaw?.root??s()}}}),{}),classNames:{root:n(y?.passwordInput??r(),y?.root??m()),label:y?.label??f(),required:y?.required??p(),description:y?.description??l(),error:y?.error??u(),wrapper:y?.wrapper??g(),input:y?.input??d(),section:y?.section??h()},...S})};export{y as PasswordInput};
 //# sourceMappingURL=PasswordInput.mjs.map

package/dist/components/controls/password-input/PasswordInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordInput.mjs","names":[],"sources":["../../../../src/components/controls/password-input/PasswordInput.tsx"],"sourcesContent":["import { useState, type ReactNode } from 'react';\nimport { TextInput, type TextInputProps } from '../text-input/TextInput';\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  passwordInput,\n  passwordInputButtonIcon,\n  passwordInputButtonIconIcon,\n  passwordInputButtonIconIconRaw,\n  passwordInputButtonIconIconRawRoot,\n  passwordInputButtonIconRoot,\n  passwordInputDescription,\n  passwordInputError,\n  passwordInputInput,\n  passwordInputLabel,\n  passwordInputRequired,\n  passwordInputRoot,\n  passwordInputSection,\n  passwordInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { ButtonIcon } from '@/components/buttons';\n\nexport type PasswordInputProps = Omit<\n  TextInputProps,\n  'classNames' | 'endSlot'\n> & {\n  label?: ReactNode;\n  description?: ReactNode;\n  error?: ReactNode;\n  startSlot?: ReactNode;\n  hidePasswordText?: string;\n  showPasswordText?: string;\n  classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {\n    passwordInput?: string;\n    buttonIcon?: {\n      buttonIcon?: string;\n      root?: string;\n      icon?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n};\n\nexport const PasswordInput = ({\n  name,\n  label,\n  description,\n  error,\n  placeholder,\n  classNames,\n  startSlot,\n  onChange,\n  value,\n  id,\n  disabled,\n  required,\n  readOnly,\n  onClick,\n  onFocus,\n  hidePasswordText,\n  showPasswordText,\n}: PasswordInputProps) => {\n  const [visible, setVisible] = useState(false);\n\n  return (\n    <TextInput\n      name={name}\n      label={label}\n      description={description}\n      error={error}\n      placeholder={placeholder}\n      value={value}\n      id={id}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      onChange={onChange}\n      onClick={onClick}\n      onFocus={onFocus}\n      type={visible ? 'text' : 'password'}\n      startSlot={startSlot}\n      endSlot={\n        <ButtonIcon\n          name={\n            visible ? 'mage-password-input-eye-off' : 'mage-password-input-eye'\n          }\n          path='/icons/sprite-mage.svg'\n          label={\n            visible\n              ? (hidePasswordText ?? 'Hide password')\n              : (showPasswordText ?? 'Show password')\n          }\n          onClick={() => setVisible(!visible)}\n          disabled={disabled}\n          classNames={{\n            buttonIcon:\n              classNames?.buttonIcon?.buttonIcon ?? passwordInputButtonIcon(),\n            root: classNames?.buttonIcon?.root ?? passwordInputButtonIconRoot(),\n            icon: classNames?.buttonIcon?.icon ?? passwordInputButtonIconIcon(),\n            iconRaw: {\n              iconRaw:\n                classNames?.buttonIcon?.iconRaw?.iconRaw ??\n                passwordInputButtonIconIconRaw(),\n              root:\n                classNames?.buttonIcon?.iconRaw?.root ??\n                passwordInputButtonIconIconRawRoot(),\n            },\n          }}\n        />\n      }\n      classNames={{\n        root: cx(\n          classNames?.passwordInput ?? passwordInput(),\n          classNames?.root ?? passwordInputRoot(),\n        ),\n        label: classNames?.label ?? passwordInputLabel(),\n        required: classNames?.required ?? passwordInputRequired(),\n        description: classNames?.description ?? passwordInputDescription(),\n        error: classNames?.error ?? passwordInputError(),\n        wrapper: classNames?.wrapper ?? passwordInputWrapper(),\n        input: classNames?.input ?? passwordInputInput(),\n        section: classNames?.section ?? passwordInputSection(),\n      }}\n    />\n  );\n};\n"],"mappings":"6qBA6CA,MAAa,GAAiB,CAC5B,OACA,QACA,cACA,QACA,cACA,aACA,YACA,WACA,QACA,KACA,WACA,WACA,WACA,UACA,UACA,mBACA,sBACwB,CACxB,GAAM,CAAC,EAAS,GAAc,EAAS,GAAM,CAE7C,OACE,EAAC,EAAA,CACO,OACC,QACM,cACN,QACM,cACN,QACH,KACM,WACA,WACA,WACA,WACD,UACA,UACT,KAAM,EAAU,OAAS,WACd,YACX,QACE,EAAC,EAAA,CACC,KACE,EAAU,8BAAgC,0BAE5C,KAAK,yBACL,MACE,EACK,GAAoB,gBACpB,GAAoB,gBAE3B,YAAe,EAAW,CAAC,EAAQ,CACzB,WACV,WAAY,CACV,WACE,GAAY,YAAY,YAAc,GAAyB,CACjE,KAAM,GAAY,YAAY,MAAQ,GAA6B,CACnE,KAAM,GAAY,YAAY,MAAQ,GAA6B,CACnE,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAAgC,CAClC,KACE,GAAY,YAAY,SAAS,MACjC,GAAoC,CACvC,CACF,EACD,CAEJ,WAAY,CACV,KAAM,EACJ,GAAY,eAAiB,GAAe,CAC5C,GAAY,MAAQ,GAAmB,CACxC,CACD,MAAO,GAAY,OAAS,GAAoB,CAChD,SAAU,GAAY,UAAY,GAAuB,CACzD,YAAa,GAAY,aAAe,GAA0B,CAClE,MAAO,GAAY,OAAS,GAAoB,CAChD,QAAS,GAAY,SAAW,GAAsB,CACtD,MAAO,GAAY,OAAS,GAAoB,CAChD,QAAS,GAAY,SAAW,GAAsB,CACvD,EACD"}
+{"version":3,"file":"PasswordInput.mjs","names":[],"sources":["../../../../src/components/controls/password-input/PasswordInput.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { cx } from '@mage-ui/styled-system/css';\nimport {\n  passwordInput,\n  passwordInputButtonIcon,\n  passwordInputButtonIconIcon,\n  passwordInputButtonIconIconRaw,\n  passwordInputButtonIconIconRawRoot,\n  passwordInputButtonIconRoot,\n  passwordInputDescription,\n  passwordInputError,\n  passwordInputInput,\n  passwordInputLabel,\n  passwordInputRequired,\n  passwordInputRoot,\n  passwordInputSection,\n  passwordInputWrapper,\n} from '@mage-ui/styled-system/recipes';\nimport { ButtonIcon } from '@/components/buttons';\n\nimport { TextInput, type TextInputProps } from '../text-input/TextInput';\n\nexport type PasswordInputProps = Omit<\n  NonNullable<TextInputProps>,\n  'classNames'\n> & {\n  hideText?: string;\n  showText?: string;\n  classNames?: Omit<NonNullable<TextInputProps['classNames']>, 'textInput'> & {\n    passwordInput?: string;\n    buttonIcon?: {\n      buttonIcon?: string;\n      root?: string;\n      icon?: string;\n      iconRaw?: {\n        iconRaw?: string;\n        root?: string;\n      };\n    };\n  };\n};\n\nexport const PasswordInput = ({\n  classNames,\n  hideText = 'Hide password',\n  showText = 'Show password',\n  ...props\n}: PasswordInputProps) => {\n  const [visible, setVisible] = useState(false);\n\n  const ButtonVisibility = () => {\n    return (\n      <ButtonIcon\n        name={\n          visible ? 'mage-password-input-eye-off' : 'mage-password-input-eye'\n        }\n        path='/icons/sprite-mage.svg'\n        label={visible ? hideText : showText}\n        onClick={() => setVisible(!visible)}\n        classNames={{\n          buttonIcon:\n            classNames?.buttonIcon?.buttonIcon ?? passwordInputButtonIcon(),\n          root: classNames?.buttonIcon?.root ?? passwordInputButtonIconRoot(),\n          icon: classNames?.buttonIcon?.icon ?? passwordInputButtonIconIcon(),\n          iconRaw: {\n            iconRaw:\n              classNames?.buttonIcon?.iconRaw?.iconRaw ??\n              passwordInputButtonIconIconRaw(),\n            root:\n              classNames?.buttonIcon?.iconRaw?.root ??\n              passwordInputButtonIconIconRawRoot(),\n          },\n        }}\n      />\n    );\n  };\n\n  return (\n    <TextInput\n      type={visible ? 'text' : 'password'}\n      endSlot={<ButtonVisibility />}\n      classNames={{\n        root: cx(\n          classNames?.passwordInput ?? passwordInput(),\n          classNames?.root ?? passwordInputRoot(),\n        ),\n        label: classNames?.label ?? passwordInputLabel(),\n        required: classNames?.required ?? passwordInputRequired(),\n        description: classNames?.description ?? passwordInputDescription(),\n        error: classNames?.error ?? passwordInputError(),\n        wrapper: classNames?.wrapper ?? passwordInputWrapper(),\n        input: classNames?.input ?? passwordInputInput(),\n        section: classNames?.section ?? passwordInputSection(),\n      }}\n      {...props}\n    />\n  );\n};\n"],"mappings":"6qBA2CA,MAAa,GAAiB,CAC5B,aACA,WAAW,gBACX,WAAW,gBACX,GAAG,KACqB,CACxB,GAAM,CAAC,EAAS,GAAc,EAAS,GAAM,CA6B7C,OACE,EAAC,EAAA,CACC,KAAM,EAAU,OAAS,WACzB,QAAS,MA5BT,EAAC,EAAA,CACC,KACE,EAAU,8BAAgC,0BAE5C,KAAK,yBACL,MAAO,EAAU,EAAW,EAC5B,YAAe,EAAW,CAAC,EAAQ,CACnC,WAAY,CACV,WACE,GAAY,YAAY,YAAc,GAAyB,CACjE,KAAM,GAAY,YAAY,MAAQ,GAA6B,CACnE,KAAM,GAAY,YAAY,MAAQ,GAA6B,CACnE,QAAS,CACP,QACE,GAAY,YAAY,SAAS,SACjC,GAAgC,CAClC,KACE,GAAY,YAAY,SAAS,MACjC,GAAoC,CACvC,CACF,EACD,CAOQ,EAAA,CAAmB,CAC7B,WAAY,CACV,KAAM,EACJ,GAAY,eAAiB,GAAe,CAC5C,GAAY,MAAQ,GAAmB,CACxC,CACD,MAAO,GAAY,OAAS,GAAoB,CAChD,SAAU,GAAY,UAAY,GAAuB,CACzD,YAAa,GAAY,aAAe,GAA0B,CAClE,MAAO,GAAY,OAAS,GAAoB,CAChD,QAAS,GAAY,SAAW,GAAsB,CACtD,MAAO,GAAY,OAAS,GAAoB,CAChD,QAAS,GAAY,SAAW,GAAsB,CACvD,CACD,GAAI,GACJ"}

package/dist/components/controls/password-input/PasswordStrengthInput.d.mts

@@ -0,0 +1,11 @@
+import "./PasswordInput.mjs";
+import "react/jsx-runtime";
+
+//#region src/components/controls/password-input/PasswordStrengthInput.d.ts
+type PasswordSegment = {
+  minScore: number;
+  label: string;
+};
+//#endregion
+export { PasswordSegment };
+//# sourceMappingURL=PasswordStrengthInput.d.mts.map

package/dist/components/controls/password-input/PasswordStrengthInput.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordStrengthInput.d.mts","names":[],"sources":["../../../../src/components/controls/password-input/PasswordStrengthInput.tsx"],"mappings":";;;;KAOY,eAAA;EACV,QAAA;EACA,KAAA;AAAA"}

package/dist/components/controls/password-input/PasswordStrengthInput.mjs

@@ -0,0 +1,2 @@
+import{PasswordInput as e}from"./PasswordInput.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";const r=({segments:r=[],rules:i=[],showRules:a=!0,showStrengthLabel:o=!0,...s})=>{let c=r.length,l=i.filter(e=>e.isValid).length,u=i.length>0?l/i.length*100:0,d=s.value&&String(s.value).length>0,f=r.reverse().find(e=>u>=e.minScore),p=d?f?.label??``:``,m=e=>d&&u>=r[e].minScore?`hsl(${e/(c-1)*120}, 70%, 45%)`:`#e5e7eb`;return n(`div`,{children:[t(e,{...s}),n(`div`,{style:{display:`flex`,alignItems:`center`,gap:`8px`,marginTop:`8px`},children:[t(`div`,{style:{display:`flex`,gap:`4px`,flex:1},children:r.map((e,n)=>t(`div`,{style:{flex:1,height:`4px`,backgroundColor:m(n),borderRadius:`2px`}},n))}),o&&p&&t(`span`,{style:{fontSize:`12px`,color:`#6b7280`,whiteSpace:`nowrap`},children:p})]}),a&&i.length>0&&t(`ul`,{style:{listStyle:`none`,padding:0,margin:`8px 0 0 0`,fontSize:`14px`},children:i.map((e,r)=>n(`li`,{style:{display:`flex`,alignItems:`center`,gap:`6px`,color:e.isValid?`#22c55e`:`#9ca3af`},children:[t(`span`,{children:e.isValid?`✓`:`✗`}),t(`span`,{children:e.text})]},r))})]})};export{r as PasswordStrengthInput};
+//# sourceMappingURL=PasswordStrengthInput.mjs.map

package/dist/components/controls/password-input/PasswordStrengthInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordStrengthInput.mjs","names":[],"sources":["../../../../src/components/controls/password-input/PasswordStrengthInput.tsx"],"sourcesContent":["import { PasswordInput, type PasswordInputProps } from './PasswordInput';\n\nexport type PasswordRule = {\n  text: string;\n  isValid: boolean;\n};\n\nexport type PasswordSegment = {\n  minScore: number;\n  label: string;\n};\n\nexport type PasswordStrengthInputProps = PasswordInputProps & {\n  segments?: PasswordSegment[];\n  rules?: PasswordRule[];\n  showRules?: boolean;\n  showStrengthLabel?: boolean;\n};\n\nexport const PasswordStrengthInput = ({\n  segments = [],\n  rules = [],\n  showRules = true,\n  showStrengthLabel = true,\n  ...props\n}: PasswordStrengthInputProps) => {\n  const segmentCount = segments.length;\n\n  const validCount = rules.filter((rule) => rule.isValid).length;\n  const scorePercent = rules.length > 0 ? (validCount / rules.length) * 100 : 0;\n\n  const hasValue = props.value && String(props.value).length > 0;\n\n  const currentSegment = segments\n    .reverse()\n    .find((segment) => scorePercent >= segment.minScore);\n  const currentLabel = hasValue ? (currentSegment?.label ?? '') : '';\n\n  const getSegmentColor = (index: number) => {\n    if (!hasValue) return '#e5e7eb';\n    const segment = segments[index];\n    if (scorePercent >= segment.minScore) {\n      const hue = (index / (segmentCount - 1)) * 120;\n      return `hsl(${hue}, 70%, 45%)`;\n    }\n    return '#e5e7eb';\n  };\n\n  return (\n    <div>\n      <PasswordInput {...props} />\n      <div\n        style={{\n          display: 'flex',\n          alignItems: 'center',\n          gap: '8px',\n          marginTop: '8px',\n        }}\n      >\n        <div style={{ display: 'flex', gap: '4px', flex: 1 }}>\n          {segments.map((_, index) => (\n            <div\n              key={index}\n              style={{\n                flex: 1,\n                height: '4px',\n                backgroundColor: getSegmentColor(index),\n                borderRadius: '2px',\n              }}\n            />\n          ))}\n        </div>\n        {showStrengthLabel && currentLabel && (\n          <span\n            style={{ fontSize: '12px', color: '#6b7280', whiteSpace: 'nowrap' }}\n          >\n            {currentLabel}\n          </span>\n        )}\n      </div>\n      {showRules && rules.length > 0 && (\n        <ul\n          style={{\n            listStyle: 'none',\n            padding: 0,\n            margin: '8px 0 0 0',\n            fontSize: '14px',\n          }}\n        >\n          {rules.map((rule, index) => (\n            <li\n              key={index}\n              style={{\n                display: 'flex',\n                alignItems: 'center',\n                gap: '6px',\n                color: rule.isValid ? '#22c55e' : '#9ca3af',\n              }}\n            >\n              <span>{rule.isValid ? '✓' : '✗'}</span>\n              <span>{rule.text}</span>\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n};\n"],"mappings":"sGAmBA,MAAa,GAAyB,CACpC,WAAW,EAAE,CACb,QAAQ,EAAE,CACV,YAAY,GACZ,oBAAoB,GACpB,GAAG,KAC6B,CAChC,IAAM,EAAe,EAAS,OAExB,EAAa,EAAM,OAAQ,GAAS,EAAK,QAAQ,CAAC,OAClD,EAAe,EAAM,OAAS,EAAK,EAAa,EAAM,OAAU,IAAM,EAEtE,EAAW,EAAM,OAAS,OAAO,EAAM,MAAM,CAAC,OAAS,EAEvD,EAAiB,EACpB,SAAS,CACT,KAAM,GAAY,GAAgB,EAAQ,SAAS,CAChD,EAAe,EAAY,GAAgB,OAAS,GAAM,GAE1D,EAAmB,GAClB,GAED,GADY,EAAS,GACG,SAEnB,OADM,GAAS,EAAe,GAAM,IACzB,aAEb,UAGT,OACE,EAAC,MAAA,CAAA,SAAA,CACC,EAAC,EAAA,CAAc,GAAI,EAAA,CAAS,CAC5B,EAAC,MAAA,CACC,MAAO,CACL,QAAS,OACT,WAAY,SACZ,IAAK,MACL,UAAW,MACZ,WAED,EAAC,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,IAAK,MAAO,KAAM,EAAG,UACjD,EAAS,KAAK,EAAG,IAChB,EAAC,MAAA,CAEC,MAAO,CACL,KAAM,EACN,OAAQ,MACR,gBAAiB,EAAgB,EAAM,CACvC,aAAc,MACf,CAAA,CANI,EAOL,CACF,EACE,CACL,GAAqB,GACpB,EAAC,OAAA,CACC,MAAO,CAAE,SAAU,OAAQ,MAAO,UAAW,WAAY,SAAU,UAElE,GACI,CAAA,EAEL,CACL,GAAa,EAAM,OAAS,GAC3B,EAAC,KAAA,CACC,MAAO,CACL,UAAW,OACX,QAAS,EACT,OAAQ,YACR,SAAU,OACX,UAEA,EAAM,KAAK,EAAM,IAChB,EAAC,KAAA,CAEC,MAAO,CACL,QAAS,OACT,WAAY,SACZ,IAAK,MACL,MAAO,EAAK,QAAU,UAAY,UACnC,WAED,EAAC,OAAA,CAAA,SAAM,EAAK,QAAU,IAAM,IAAA,CAAW,CACvC,EAAC,OAAA,CAAA,SAAM,EAAK,KAAA,CAAY,CAAA,EATnB,EAUF,CACL,EACC,GAEH"}

package/dist/components/controls/password-input/usePasswordRules.d.mts

@@ -0,0 +1,11 @@
+import "./PasswordStrengthInput.mjs";
+
+//#region src/components/controls/password-input/usePasswordRules.d.ts
+type PasswordRuleDefinition = {
+  key?: string;
+  text: string;
+  validate: (value: string) => boolean;
+};
+//#endregion
+export { PasswordRuleDefinition };
+//# sourceMappingURL=usePasswordRules.d.mts.map

package/dist/components/controls/password-input/usePasswordRules.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePasswordRules.d.mts","names":[],"sources":["../../../../src/components/controls/password-input/usePasswordRules.ts"],"mappings":";;;KAIY,sBAAA;EACV,GAAA;EACA,IAAA;EACA,QAAA,GAAW,KAAA;AAAA"}

package/dist/components/controls/password-input/usePasswordRules.mjs

@@ -0,0 +1,2 @@
+import{useMemo as e}from"react";const t=(t,n,r)=>e(()=>n.map(e=>({text:e.key&&r?r(e.key,{},e.text):e.text,isValid:e.validate(t)})),[t,n,r]);export{t as usePasswordRules};
+//# sourceMappingURL=usePasswordRules.mjs.map

package/dist/components/controls/password-input/usePasswordRules.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePasswordRules.mjs","names":[],"sources":["../../../../src/components/controls/password-input/usePasswordRules.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport type { PasswordRule } from './PasswordStrengthInput';\n\nexport type PasswordRuleDefinition = {\n  key?: string;\n  text: string;\n  validate: (value: string) => boolean;\n};\n\nexport const usePasswordRules = (\n  value: string,\n  definitions: PasswordRuleDefinition[],\n  t?: (\n    key: string,\n    bindings?: Record<string, string>,\n    fallback?: string,\n  ) => string,\n): PasswordRule[] => {\n  return useMemo(() => {\n    return definitions.map((def) => ({\n      text: def.key && t ? t(def.key, {}, def.text) : def.text,\n      isValid: def.validate(value),\n    }));\n  }, [value, definitions, t]);\n};\n"],"mappings":"gCAUA,MAAa,GACX,EACA,EACA,IAMO,MACE,EAAY,IAAK,IAAS,CAC/B,KAAM,EAAI,KAAO,EAAI,EAAE,EAAI,IAAK,EAAE,CAAE,EAAI,KAAK,CAAG,EAAI,KACpD,QAAS,EAAI,SAAS,EAAM,CAC7B,EAAE,CACF,CAAC,EAAO,EAAa,EAAE,CAAC"}