@zonos/amino 5.5.30 → 5.5.32

package/components/drop-zone/DropZone.d.ts

@@ -0,0 +1,178 @@
+import { type DropzoneOptions } from 'react-dropzone';
+import { type HelpTextProps } from "../help-text/HelpText";
+import type { BaseProps } from "../../types/BaseProps";
+import type { UploadedFile } from "../../types/UploadedFile";
+export type DropZoneProps = BaseProps & HelpTextProps & {
+    /**
+     * This `disabled` state only applies when no file is selected
+     * @default false
+     * */
+    disabled?: boolean;
+    dropzoneOptions: Omit<DropzoneOptions, 'disabled'>;
+    /**
+     * Text to display in empty state
+     * @default 'Drop your file(s) here'
+     * */
+    instructionText?: string;
+    loading?: boolean;
+    /**
+     * Text to show while loading state is active
+     * @default 'Uploading file(s)...''
+     */
+    loadingText?: string;
+    /**
+     * Whether to show the icon in file upload
+     * @default false
+     * */
+    noIcon?: boolean;
+    /** When the remove icon is clicked on an individual file */
+    onRemoveFile: (index: number) => void;
+    /** Display file info if uploaded file property has data */
+    uploadedFiles: UploadedFile[];
+};
+/**
+ * DropZone component provides a drag-and-drop interface for file uploads.
+ * It supports single or multiple file uploads, image previews, and various states
+ * including loading, error, and success.
+ *
+ * @example Basic usage
+ * const [files, setFiles] = useState<UploadedFile[]>([]);
+ *
+ * const handleDrop = useCallback((acceptedFiles: File[]) => {
+ *   const newFiles = acceptedFiles.map(file => ({
+ *     name: file.name,
+ *     size: `${(file.size / 1024).toFixed(2)} KB`,
+ *     file
+ *   }));
+ *
+ *   setFiles(prevFiles => [...prevFiles, ...newFiles]);
+ * }, []);
+ *
+ * const handleRemoveFile = (index: number) => {
+ *   setFiles(prevFiles => prevFiles.filter((_, i) => i !== index));
+ * };
+ *
+ * <DropZone
+ *   dropzoneOptions={{
+ *     onDrop: handleDrop,
+ *     accept: {'image/*': []}
+ *   }}
+ *   onRemoveFile={handleRemoveFile}
+ *   uploadedFiles={files}
+ * />
+ *
+ * @example With validation and error state
+ * const [files, setFiles] = useState<UploadedFile[]>([]);
+ * const [error, setError] = useState(false);
+ * const [errorText, setErrorText] = useState('');
+ *
+ * const handleDrop = useCallback((acceptedFiles: File[]) => {
+ *   if (acceptedFiles.some(file => file.size > 1024 * 1024)) {
+ *     setError(true);
+ *     setErrorText('File size must be less than 1MB');
+ *     return;
+ *   }
+ *
+ *   setError(false);
+ *   setErrorText('');
+ *   // Process files...
+ * }, []);
+ *
+ * <DropZone
+ *   dropzoneOptions={{
+ *     onDrop: handleDrop,
+ *     maxSize: 1024 * 1024
+ *   }}
+ *   error={error}
+ *   helpText={errorText}
+ *   onRemoveFile={handleRemoveFile}
+ *   uploadedFiles={files}
+ * />
+ *
+ * @example With image previews
+ * const [files, setFiles] = useState<UploadedFile[]>([]);
+ *
+ * const handleDrop = useCallback((acceptedFiles: File[]) => {
+ *   const newFiles = acceptedFiles.map(file => {
+ *     const imageUrl = URL.createObjectURL(file);
+ *
+ *     return {
+ *       name: file.name,
+ *       size: `${(file.size / 1024).toFixed(2)} KB`,
+ *       file,
+ *       imageUrl
+ *     };
+ *   });
+ *
+ *   setFiles(prevFiles => [...prevFiles, ...newFiles]);
+ * }, []);
+ *
+ * <DropZone
+ *   dropzoneOptions={{
+ *     onDrop: handleDrop,
+ *     accept: {'image/*': []}
+ *   }}
+ *   onRemoveFile={handleRemoveFile}
+ *   uploadedFiles={files}
+ * />
+ *
+ * @example With loading state
+ * const [files, setFiles] = useState<UploadedFile[]>([]);
+ * const [loading, setLoading] = useState(false);
+ *
+ * const handleDrop = useCallback(async (acceptedFiles: File[]) => {
+ *   setLoading(true);
+ *
+ *   try {
+ *     // Simulate upload
+ *     await new Promise(resolve => setTimeout(resolve, 2000));
+ *
+ *     const newFiles = acceptedFiles.map(file => ({
+ *       name: file.name,
+ *       size: `${(file.size / 1024).toFixed(2)} KB`,
+ *       file
+ *     }));
+ *
+ *     setFiles(prevFiles => [...prevFiles, ...newFiles]);
+ *   } finally {
+ *     setLoading(false);
+ *   }
+ * }, []);
+ *
+ * <DropZone
+ *   dropzoneOptions={{
+ *     onDrop: handleDrop
+ *   }}
+ *   loading={loading}
+ *   loadingText="Uploading your files..."
+ *   onRemoveFile={handleRemoveFile}
+ *   uploadedFiles={files}
+ * />
+ *
+ * @example With file type restrictions
+ * <DropZone
+ *   dropzoneOptions={{
+ *     onDrop: handleDrop,
+ *     accept: {
+ *       'application/pdf': ['.pdf'],
+ *       'application/msword': ['.doc', '.docx']
+ *     },
+ *     maxFiles: 5
+ *   }}
+ *   instructionText="Drop PDF or Word documents here"
+ *   onRemoveFile={handleRemoveFile}
+ *   uploadedFiles={files}
+ * />
+ *
+ * @example With disabled state
+ * <DropZone
+ *   disabled={true}
+ *   dropzoneOptions={{
+ *     onDrop: handleDrop
+ *   }}
+ *   instructionText="File uploads are currently disabled"
+ *   onRemoveFile={handleRemoveFile}
+ *   uploadedFiles={files}
+ * />
+ */
+export declare const DropZone: ({ className, disabled, dropzoneOptions, error, helpText, instructionText, loading, loadingText, noIcon, onRemoveFile, style, uploadedFiles, }: DropZoneProps) => import("react").JSX.Element;

package/components/drop-zone/DropZone.js

@@ -1 +1 @@
-"use strict";var e=require("../../_rollupPluginBabelHelpers-77a6284f.js"),o=require("../../tslib.es6-8c21e256.js"),r=require("react-dropzone"),a=require("clsx"),t=require("../avatar/ImageAvatar.js"),n=require("../button/ButtonIcon.js"),i=require("../help-text/HelpText.js"),l=require("../spinner/Spinner.js"),c=require("../text/Text.js"),s=require("../thumbnail/Thumbnail.js"),u=require("../../icons/FileDuotoneIcon.js"),m=require("../../icons/FileUploadDuotoneIcon.js"),p=require("../../icons/RemoveCircleDuotoneIcon.js"),d=require("../../styles/constants/theme.js"),_=require("../../style-inject.es-d4ddeae4.js");function v(e){return e&&e.__esModule?e:{default:e}}require("../avatar/AvatarBase.js"),require("../button/Button.js"),require("react"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../button/useRipple.js"),require("../../utils/getTestId.js"),require("../../icons/icon-base/_IconBase.js");var x=v(a),R="Amino_DropZone-module__wrapper--7G4TF",g="Amino_DropZone-module__uploadWrapper--45zf4",b="Amino_DropZone-module__contentWrapper--Vy--l",y="Amino_DropZone-module__instructionTextWrapper--rs4Tz",f="Amino_DropZone-module__browseButton--2YSV-",D="Amino_DropZone-module__removeFileButton--fNm3K",j="Amino_DropZone-module__uploadedFilesWrapper--xWaa3",q="Amino_DropZone-module__uploadedFileRow--RNmU-",E="Amino_DropZone-module__uploadedFileInfoWrapper--ujYT6";_.styleInject(".Amino_DropZone-module__wrapper--7G4TF{cursor:var(--amino-drop-zone-cursor);display:flex;flex-direction:column;gap:var(--amino-space-16);opacity:var(--amino-drop-zone-opacity)}.Amino_DropZone-module__uploadWrapper--45zf4{align-items:center;border:2px dashed;border-color:var(--amino-drop-zone-border-color);border-radius:var(--amino-radius-12);display:flex;flex-direction:column}.Amino_DropZone-module__contentWrapper--Vy--l{align-items:center;display:flex;flex-direction:column;gap:var(--amino-space-12);height:100%;justify-content:center;outline:none;padding:var(--amino-space-16);width:100%}.Amino_DropZone-module__instructionTextWrapper--rs4Tz{align-items:center;display:flex;flex-direction:column;gap:var(--amino-space-4)}.Amino_DropZone-module__browseButton--2YSV-{display:inline}.Amino_DropZone-module__removeFileButton--fNm3K{margin-left:auto}.Amino_DropZone-module__uploadedFilesWrapper--xWaa3{display:flex;flex-direction:column;gap:var(--amino-space-4)}.Amino_DropZone-module__uploadedFileRow--RNmU-{border:var(--amino-border);border-radius:var(--amino-radius-12);display:flex;gap:var(--amino-space-12);justify-content:flex-start;padding:var(--amino-space-16)}.Amino_DropZone-module__uploadedFileInfoWrapper--ujYT6{display:flex;flex-direction:column}");exports.DropZone=function(a){var _=a.className,v=a.disabled,T=void 0!==v&&v,A=a.dropzoneOptions,Z=a.error,h=void 0!==Z&&Z,F=a.helpText,z=a.instructionText,I=void 0===z?"Drop your file(s) here":z,N=a.loading,W=a.loadingText,B=void 0===W?"Uploading file(s)...":W,w=a.noIcon,U=void 0!==w&&w,C=a.onRemoveFile,k=a.style,S=a.uploadedFiles,V=A.maxFiles||0,Y=r.useDropzone(o.__assign(o.__assign({},A),{disabled:T,noClick:!0,noKeyboard:!0})),G=Y.getInputProps,H=Y.getRootProps,K=Y.open,P=0!==V&&S.length>=V;return React.createElement("div",{className:x.default(R,_),style:o.__assign(o.__assign({},k),{"--amino-drop-zone-border-color":h?d.theme.danger:d.theme.borderColor,"--amino-drop-zone-cursor":T?"not-allowed":"auto","--amino-drop-zone-opacity":T?d.theme.opacityDisabled:1})},N?React.createElement("div",{className:g},React.createElement("div",{className:b},React.createElement(l.Spinner,null),React.createElement(c.Text,{color:"gray800",type:"label"},B))):React.createElement(React.Fragment,null,!P&&React.createElement("div",{className:g},React.createElement("div",e._extends({className:b},H(),{role:void 0}),React.createElement("input",G()),!U&&React.createElement(s.Thumbnail,{icon:React.createElement(m.FileUploadDuotoneIcon,null),size:40}),React.createElement("div",{className:y},React.createElement(c.Text,{type:"label"},I," or"," ",React.createElement("button",{className:f,disabled:T,onClick:K,type:"button"},React.createElement(c.Text,{color:"blue600",type:"label"},"browse"))),React.createElement(i.HelpText,{error:h,helpText:F})))),!!S.length&&React.createElement("div",{className:j},S.map((function(e,o){return React.createElement("div",{key:e.name,className:q},e.imageUrl?React.createElement(t.ImageAvatar,{imageUrl:e.imageUrl,shape:"rounded"}):React.createElement(u.FileDuotoneIcon,null),React.createElement("div",{className:E},React.createElement(c.Text,{color:"gray1000",type:"label"},e.name),e.size&&React.createElement(c.Text,{color:"gray700",type:"caption"},e.size)),C&&React.createElement(n.ButtonIcon,{className:D,icon:React.createElement(p.RemoveCircleDuotoneIcon,{size:20}),onClick:function(){return C(o)},variant:"text"}))})))))};
+"use strict";var e=require("../../_rollupPluginBabelHelpers-697f213c.js"),o=require("../../tslib.es6-8c21e256.js"),r=require("react-dropzone"),i=require("clsx"),n=require("../avatar/ImageAvatar.js"),a=require("../button/ButtonIcon.js"),l=require("../help-text/HelpText.js"),s=require("../spinner/Spinner.js"),t=require("../text/Text.js"),d=require("../thumbnail/Thumbnail.js"),p=require("../../icons/FileDuotoneIcon.js"),u=require("../../icons/FileUploadDuotoneIcon.js"),c=require("../../icons/RemoveCircleDuotoneIcon.js"),m=require("../../styles/constants/theme.js"),_=require("../../style-inject.es-d4ddeae4.js"),x=require("react/jsx-runtime");function j(e){return e&&e.__esModule?e:{default:e}}require("../avatar/AvatarBase.js"),require("../button/Button.js"),require("react"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../button/useRipple.js"),require("../../utils/getTestId.js"),require("../../icons/icon-base/_IconBase.js");var v=j(i),b="Amino_DropZone-module__wrapper--7G4TF",g="Amino_DropZone-module__uploadWrapper--45zf4",h="Amino_DropZone-module__contentWrapper--Vy--l",f="Amino_DropZone-module__instructionTextWrapper--rs4Tz",y="Amino_DropZone-module__browseButton--2YSV-",D="Amino_DropZone-module__removeFileButton--fNm3K",q="Amino_DropZone-module__uploadedFilesWrapper--xWaa3",T="Amino_DropZone-module__uploadedFileRow--RNmU-",A="Amino_DropZone-module__uploadedFileInfoWrapper--ujYT6";_.styleInject(".Amino_DropZone-module__wrapper--7G4TF{cursor:var(--amino-drop-zone-cursor);display:flex;flex-direction:column;gap:var(--amino-space-16);opacity:var(--amino-drop-zone-opacity)}.Amino_DropZone-module__uploadWrapper--45zf4{align-items:center;border:2px dashed;border-color:var(--amino-drop-zone-border-color);border-radius:var(--amino-radius-12);display:flex;flex-direction:column}.Amino_DropZone-module__contentWrapper--Vy--l{align-items:center;display:flex;flex-direction:column;gap:var(--amino-space-12);height:100%;justify-content:center;outline:none;padding:var(--amino-space-16);width:100%}.Amino_DropZone-module__instructionTextWrapper--rs4Tz{align-items:center;display:flex;flex-direction:column;gap:var(--amino-space-4)}.Amino_DropZone-module__browseButton--2YSV-{display:inline}.Amino_DropZone-module__removeFileButton--fNm3K{margin-left:auto}.Amino_DropZone-module__uploadedFilesWrapper--xWaa3{display:flex;flex-direction:column;gap:var(--amino-space-4)}.Amino_DropZone-module__uploadedFileRow--RNmU-{border:var(--amino-border);border-radius:var(--amino-radius-12);display:flex;gap:var(--amino-space-12);justify-content:flex-start;padding:var(--amino-space-16)}.Amino_DropZone-module__uploadedFileInfoWrapper--ujYT6{display:flex;flex-direction:column}");exports.DropZone=function(i){var _=i.className,j=i.disabled,Z=void 0!==j&&j,F=i.dropzoneOptions,z=i.error,I=void 0!==z&&z,N=i.helpText,W=i.instructionText,R=void 0===W?"Drop your file(s) here":W,B=i.loading,w=i.loadingText,U=void 0===w?"Uploading file(s)...":w,C=i.noIcon,S=void 0!==C&&C,V=i.onRemoveFile,Y=i.style,k=i.uploadedFiles,G=F.maxFiles||0,H=r.useDropzone(o.__assign(o.__assign({},F),{disabled:Z,noClick:!0,noKeyboard:!0})),K=H.getInputProps,P=H.getRootProps,M=H.open,O=0!==G&&k.length>=G;return x.jsx("div",{className:v.default(b,_),style:o.__assign(o.__assign({},Y),{"--amino-drop-zone-border-color":I?m.theme.danger:m.theme.borderColor,"--amino-drop-zone-cursor":Z?"not-allowed":"auto","--amino-drop-zone-opacity":Z?m.theme.opacityDisabled:1}),children:B?x.jsx("div",{className:g,children:x.jsxs("div",{className:h,children:[x.jsx(s.Spinner,{}),x.jsx(t.Text,{color:"gray800",type:"label",children:U})]})}):x.jsxs(x.Fragment,{children:[!O&&x.jsx("div",{className:g,children:x.jsxs("div",e._objectSpread2(e._objectSpread2({className:h},P()),{},{role:void 0,children:[x.jsx("input",e._objectSpread2({},K())),!S&&x.jsx(d.Thumbnail,{icon:x.jsx(u.FileUploadDuotoneIcon,{}),size:40}),x.jsxs("div",{className:f,children:[x.jsxs(t.Text,{type:"label",children:[R," or"," ",x.jsx("button",{className:y,disabled:Z,onClick:M,type:"button",children:x.jsx(t.Text,{color:"blue600",type:"label",children:"browse"})})]}),x.jsx(l.HelpText,{error:I,helpText:N})]})]}))}),!!k.length&&x.jsx("div",{className:q,children:k.map((function(e,o){return x.jsxs("div",{className:T,children:[e.imageUrl?x.jsx(n.ImageAvatar,{imageUrl:e.imageUrl,shape:"rounded"}):x.jsx(p.FileDuotoneIcon,{}),x.jsxs("div",{className:A,children:[x.jsx(t.Text,{color:"gray1000",type:"label",children:e.name}),e.size&&x.jsx(t.Text,{color:"gray700",type:"caption",children:e.size})]}),V&&x.jsx(a.ButtonIcon,{className:D,icon:x.jsx(c.RemoveCircleDuotoneIcon,{size:20}),onClick:function(){return V(o)},variant:"text"})]},e.name)}))})]})})};

package/components/file-upload/FileUpload.d.ts

@@ -0,0 +1,112 @@
+import { type DropzoneOptions } from 'react-dropzone';
+import type { BaseProps } from "../../types/BaseProps";
+type UploadFileNoImage = {
+    name: string;
+    size?: string;
+};
+export type FileUploadProps = BaseProps & {
+    /**
+     * This `disabled` state only applies when no file is selected
+     * @default false
+     * */
+    disabled?: boolean;
+    dropzoneOptions: Omit<DropzoneOptions, 'disabled' | 'multiple'>;
+    /**
+     * Display error state with red border
+     * @default false
+     */
+    error?: boolean;
+    /**
+     * Text to display in empty state
+     * @default 'or drag your file here'
+     * */
+    instructionText?: string;
+    /**
+     * Show loading state
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Text to show while loading state is active
+     * @default 'Uploading...'
+     */
+    loadingText?: string;
+    /**
+     * Function called when the remove button is clicked
+     */
+    onRemoveFile?: () => void;
+    /**
+     * Display file info if uploaded file property has data
+     */
+    uploadedFile: UploadFileNoImage | null;
+};
+/**
+ * FileUpload component provides a drag-and-drop interface for uploading single files.
+ * It displays file information once uploaded and supports loading states.
+ *
+ * @example Basic usage
+ * ```tsx
+ * <FileUpload
+ *   dropzoneOptions={{
+ *     maxSize: 5 * 1024 * 1024, // 5MB
+ *     onDrop: (acceptedFiles) => {
+ *       const file = acceptedFiles[0];
+ *       if (file) {
+ *         setUploadedFile({ name: file.name, size: `${file.size} bytes` });
+ *       }
+ *     }
+ *   }}
+ *   uploadedFile={null}
+ * />
+ * ```
+ *
+ * @example With a file already uploaded
+ * ```tsx
+ * <FileUpload
+ *   dropzoneOptions={{
+ *     maxSize: 5 * 1024 * 1024,
+ *     onDrop: (acceptedFiles) => {
+ *       // Handle file drop
+ *     }
+ *   }}
+ *   uploadedFile={{ name: 'document.pdf', size: '1.2 MB' }}
+ *   onRemoveFile={() => setUploadedFile(null)}
+ * />
+ * ```
+ *
+ * @example With custom instruction text and error state
+ * ```tsx
+ * <FileUpload
+ *   dropzoneOptions={{
+ *     accept: {
+ *       'image/*': ['.jpg', '.jpeg', '.png']
+ *     },
+ *     onDrop: (acceptedFiles, rejections) => {
+ *       // Handle file drop and rejection
+ *       setError(rejections.length > 0);
+ *     }
+ *   }}
+ *   error={hasError}
+ *   instructionText="Drop image files here"
+ *   uploadedFile={uploadedFile}
+ * />
+ * ```
+ *
+ * @example With loading state
+ * ```tsx
+ * <FileUpload
+ *   dropzoneOptions={{
+ *     onDrop: (acceptedFiles) => {
+ *       // Start upload
+ *       setLoading(true);
+ *       uploadFile(acceptedFiles[0]).then(() => setLoading(false));
+ *     }
+ *   }}
+ *   loading={isLoading}
+ *   loadingText="Uploading file..."
+ *   uploadedFile={uploadedFile}
+ * />
+ * ```
+ */
+export declare const FileUpload: ({ className, disabled, dropzoneOptions, error, instructionText, loading, loadingText, onRemoveFile, style, uploadedFile, }: FileUploadProps) => import("react").JSX.Element;
+export {};

package/components/file-upload/FileUpload.js

@@ -1 +1 @@
-"use strict";var e=require("../../_rollupPluginBabelHelpers-77a6284f.js"),o=require("../../tslib.es6-8c21e256.js"),t=require("react-dropzone"),r=require("clsx"),i=require("../button/Button.js"),a=require("../button/ButtonIcon.js"),n=require("../text/Text.js"),l=require("../../icons/RemoveCircleDuotoneIcon.js"),s=require("../../styles/constants/theme.js"),u=require("../../style-inject.es-d4ddeae4.js");function c(e){return e&&e.__esModule?e:{default:e}}require("react"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../button/useRipple.js"),require("../spinner/Spinner.js"),require("../../utils/getTestId.js"),require("../../icons/icon-base/_IconBase.js");var d=c(r),p="Amino_FileUpload-module__wrapper--tTW4v",m="Amino_FileUpload-module__styledFileInput--ndVD1",_="Amino_FileUpload-module__contentWrapper--Da0yR",f="Amino_FileUpload-module__uploadedFileInfoWrapper--f8bVP",v="Amino_FileUpload-module__removeFileButton--Di0zb";u.styleInject(".Amino_FileUpload-module__wrapper--tTW4v{border:var(--amino-border);border-color:var(--amino-file-upload-border-color);border-radius:var(--amino-radius-10);cursor:var(--amino-file-upload-cursor);display:flex;justify-content:flex-start;opacity:var(--amino-file-upload-opacity);padding:var(--amino-space-8) var(--amino-space-12)}.Amino_FileUpload-module__styledFileInput--ndVD1{align-items:center;display:flex;flex-direction:column;justify-content:center;outline:none;text-align:center}.Amino_FileUpload-module__contentWrapper--Da0yR{align-items:center;display:flex;gap:var(--amino-space-12);justify-content:flex-start}.Amino_FileUpload-module__uploadedFileInfoWrapper--f8bVP{align-items:center;display:flex;gap:var(--amino-space-4)}.Amino_FileUpload-module__removeFileButton--Di0zb{margin-left:auto}");exports.FileUpload=function(r){var u=r.className,c=r.disabled,y=void 0!==c&&c,g=r.dropzoneOptions,b=r.error,R=void 0!==b&&b,j=r.instructionText,q=void 0===j?"or drag your file here":j,x=r.loading,F=r.loadingText,E=void 0===F?"Uploading...":F,I=r.onRemoveFile,U=r.style,A=r.uploadedFile,D=t.useDropzone(o.__assign(o.__assign({},g),{disabled:y,multiple:!1,noClick:!0,noKeyboard:!0})),T=D.getInputProps,B=D.getRootProps,C=D.open,z=function(){return x?React.createElement(n.Text,null,E):A?function(){if(A){var e=A.name,o=A.size;return React.createElement("div",{className:f},React.createElement(n.Text,{color:"gray1000",type:"label"},e),o&&React.createElement(n.Text,{color:"gray700",type:"caption"},o))}return null}():React.createElement(n.Text,{color:"gray600"},q)};return React.createElement("div",{className:d.default(p,u),style:o.__assign(o.__assign({},U),{"--amino-file-upload-border-color":R?s.theme.danger:s.theme.borderColor,"--amino-file-upload-cursor":y?"not-allowed":"auto","--amino-file-upload-opacity":y?s.theme.opacityDisabled:1})},React.createElement("div",e._extends({className:m},B()),React.createElement("input",T()),React.createElement("div",{className:_},React.createElement(i.Button,{loading:x,onClick:C,spinnerColor:"black"},"Browse"),z())),I&&A&&React.createElement(a.ButtonIcon,{className:v,icon:React.createElement(l.RemoveCircleDuotoneIcon,{size:20}),onClick:function(){return I()},variant:"text"}))};
+"use strict";var e=require("../../_rollupPluginBabelHelpers-697f213c.js"),o=require("../../tslib.es6-8c21e256.js"),r=require("react-dropzone"),i=require("clsx"),n=require("../button/Button.js"),l=require("../button/ButtonIcon.js"),t=require("../text/Text.js"),a=require("../../icons/RemoveCircleDuotoneIcon.js"),s=require("../../styles/constants/theme.js"),u=require("../../style-inject.es-d4ddeae4.js"),d=require("react/jsx-runtime");function p(e){return e&&e.__esModule?e:{default:e}}require("react"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../button/useRipple.js"),require("../spinner/Spinner.js"),require("../../utils/getTestId.js"),require("../../icons/icon-base/_IconBase.js");var c=p(i),m="Amino_FileUpload-module__wrapper--tTW4v",_="Amino_FileUpload-module__styledFileInput--ndVD1",j="Amino_FileUpload-module__contentWrapper--Da0yR",x="Amino_FileUpload-module__uploadedFileInfoWrapper--f8bVP",f="Amino_FileUpload-module__removeFileButton--Di0zb";u.styleInject(".Amino_FileUpload-module__wrapper--tTW4v{border:var(--amino-border);border-color:var(--amino-file-upload-border-color);border-radius:var(--amino-radius-10);cursor:var(--amino-file-upload-cursor);display:flex;justify-content:flex-start;opacity:var(--amino-file-upload-opacity);padding:var(--amino-space-8) var(--amino-space-12)}.Amino_FileUpload-module__styledFileInput--ndVD1{align-items:center;display:flex;flex-direction:column;justify-content:center;outline:none;text-align:center}.Amino_FileUpload-module__contentWrapper--Da0yR{align-items:center;display:flex;gap:var(--amino-space-12);justify-content:flex-start}.Amino_FileUpload-module__uploadedFileInfoWrapper--f8bVP{align-items:center;display:flex;gap:var(--amino-space-4)}.Amino_FileUpload-module__removeFileButton--Di0zb{margin-left:auto}");exports.FileUpload=function(i){var u=i.className,p=i.disabled,v=void 0!==p&&p,b=i.dropzoneOptions,y=i.error,g=void 0!==y&&y,q=i.instructionText,F=void 0===q?"or drag your file here":q,h=i.loading,I=i.loadingText,U=void 0===I?"Uploading...":I,A=i.onRemoveFile,D=i.style,T=i.uploadedFile,B=r.useDropzone(o.__assign(o.__assign({},b),{disabled:v,multiple:!1,noClick:!0,noKeyboard:!0})),R=B.getInputProps,C=B.getRootProps,z=B.open,N=function(){return h?d.jsx(t.Text,{children:U}):T?function(){if(T){var e=T.name,o=T.size;return d.jsxs("div",{className:x,children:[d.jsx(t.Text,{color:"gray1000",type:"label",children:e}),o&&d.jsx(t.Text,{color:"gray700",type:"caption",children:o})]})}return null}():d.jsx(t.Text,{color:"gray600",children:F})};return d.jsxs("div",{className:c.default(m,u),style:o.__assign(o.__assign({},D),{"--amino-file-upload-border-color":g?s.theme.danger:s.theme.borderColor,"--amino-file-upload-cursor":v?"not-allowed":"auto","--amino-file-upload-opacity":v?s.theme.opacityDisabled:1}),children:[d.jsxs("div",e._objectSpread2(e._objectSpread2({className:_},C()),{},{children:[d.jsx("input",e._objectSpread2({},R())),d.jsxs("div",{className:j,children:[d.jsx(n.Button,{loading:h,onClick:z,spinnerColor:"black",children:"Browse"}),N()]})]})),A&&T&&d.jsx(l.ButtonIcon,{className:f,icon:d.jsx(a.RemoveCircleDuotoneIcon,{size:20}),onClick:function(){return A()},variant:"text"})]})};

package/components/filter/FilterWrapper.d.ts

@@ -0,0 +1,115 @@
+import type { KeyboardEvent, MouseEvent, ReactNode, RefObject } from 'react';
+import type { BaseProps } from "../../types/BaseProps";
+type FilterWrapperProps = BaseProps & {
+    active: boolean;
+    children: ReactNode;
+    dropDownOpen: boolean;
+    dropdownRef: RefObject<HTMLDivElement>;
+    dropdownTitle: string;
+    filterText: string;
+    handleApply: () => void;
+    handleKeyDown: (event: KeyboardEvent) => void;
+    handleOpenDropdown: (e: MouseEvent) => void;
+    handleToggle: () => void;
+    hasFilter: boolean;
+    label: string;
+};
+/**
+ * FilterWrapper provides a standardized UI for creating filters in data views.
+ * It displays a toggle button to activate the filter, a dropdown to select filter options,
+ * and includes the apply button to confirm filter selections.
+ *
+ * This component is typically used with other filtering components like FilterDate,
+ * FilterSelect, etc., and is designed to work with the useFilterWrapper hook for state
+ * management.
+ *
+ * @example Basic usage with useFilterWrapper hook
+ * ```tsx
+ * const {
+ *   renderWrapper,
+ *   setFilterText
+ * } = useFilterWrapper({
+ *   dropdownTitle: "Status Filter",
+ *   isActive: isStatusFilterActive,
+ *   label: "Status",
+ *   setActive: setIsStatusFilterActive,
+ *   initialFilterText: "All statuses",
+ *   onApply: (setFilterText) => {
+ *     setFilterText(selectedStatus ? selectedStatus.label : "All statuses");
+ *     onFilterApplied(selectedStatus?.value);
+ *   },
+ *   onApplyFilterText: (setFilterText) => {
+ *     setFilterText(selectedStatus ? selectedStatus.label : "All statuses");
+ *   },
+ *   onClose: () => {},
+ *   onRemove: () => {
+ *     setSelectedStatus(undefined);
+ *     onFilterApplied(undefined);
+ *   }
+ * });
+ *
+ * return renderWrapper(
+ *   <FilterSelect
+ *     options={[
+ *       { label: "Active", value: "active" },
+ *       { label: "Pending", value: "pending" },
+ *       { label: "Inactive", value: "inactive" }
+ *     ]}
+ *     onChange={setSelectedStatus}
+ *     value={selectedStatus}
+ *   />
+ * );
+ * ```
+ *
+ * @example With date filter
+ * ```tsx
+ * const {
+ *   renderWrapper,
+ *   setFilterText
+ * } = useFilterWrapper({
+ *   dropdownTitle: "Date Range",
+ *   isActive: isDateFilterActive,
+ *   label: "Date",
+ *   setActive: setIsDateFilterActive,
+ *   initialFilterText: "All dates",
+ *   onApply: (setFilterText) => {
+ *     if (startDate && endDate) {
+ *       const formattedText = `${formatDate(startDate)} - ${formatDate(endDate)}`;
+ *       setFilterText(formattedText);
+ *       onFilterApplied({ startDate, endDate });
+ *     }
+ *   },
+ *   onApplyFilterText: (setFilterText) => {
+ *     if (startDate && endDate) {
+ *       setFilterText(`${formatDate(startDate)} - ${formatDate(endDate)}`);
+ *     }
+ *   },
+ *   onClose: () => {},
+ *   onRemove: () => {
+ *     setStartDate(undefined);
+ *     setEndDate(undefined);
+ *     onFilterApplied({ startDate: null, endDate: null });
+ *   }
+ * });
+ *
+ * return renderWrapper(
+ *   <FilterDate
+ *     startDate={startDate}
+ *     endDate={endDate}
+ *     onStartDateChange={setStartDate}
+ *     onEndDateChange={setEndDate}
+ *   />
+ * );
+ * ```
+ *
+ * @example Multiple filters in a filter bar
+ * ```tsx
+ * <div style={{ display: 'flex', gap: '8px' }}>
+ *   {statusFilterWrapper}
+ *   {dateFilterWrapper}
+ *   {textFilterWrapper}
+ * </div>
+ * ```
+ */
+export declare const FilterWrapper: ({ active, children, className, dropDownOpen, dropdownRef, dropdownTitle, filterText, handleApply, handleKeyDown, handleOpenDropdown, handleToggle, hasFilter, label, style, }: FilterWrapperProps) => import("react").JSX.Element;
+export {};

package/components/filter/FilterWrapper.js

@@ -1 +1 @@
-"use strict";var e=require("../../tslib.es6-8c21e256.js"),r=require("clsx"),o=require("../button/Button.js"),a=require("../text/Text.js"),i=require("../../icons/ChevronDownIcon.js"),t=require("../../icons/MinusCircleDuotoneIcon.js"),l=require("../../icons/PlusCircleDuotoneIcon.js"),n=require("../../styles/constants/theme.js"),p=require("../../global.module-569e4fd5.js"),s=require("../../style-inject.es-d4ddeae4.js");function d(e){return e&&e.__esModule?e:{default:e}}require("../../_rollupPluginBabelHelpers-77a6284f.js"),require("react"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../button/useRipple.js"),require("../spinner/Spinner.js"),require("../../utils/getTestId.js"),require("../../icons/icon-base/_IconBase.js");var c=d(r),u="Amino_FilterWrapper-module__filterWrapper--u-lhr",m="Amino_FilterWrapper-module__badgeWrapper--wljBB",_="Amino_FilterWrapper-module__toggleWrapper--gqVoy",g="Amino_FilterWrapper-module__styledDropdownTrigger--YXu5i",b="Amino_FilterWrapper-module__filterTitle--1VaM3",v="Amino_FilterWrapper-module__filterText--UowIN",f="Amino_FilterWrapper-module__dropdownWrapper--dPZ9C",y="Amino_FilterWrapper-module__controlsWrapper--j4AT5";s.styleInject(".Amino_FilterWrapper-module__filterWrapper--u-lhr{position:relative}.Amino_FilterWrapper-module__badgeWrapper--wljBB{align-items:center;background-color:initial;border:1px dashed var(--amino-gray-200);border-radius:100px;color:var(--amino-gray-700);display:inline-flex}.Amino_FilterWrapper-module__badgeWrapper--wljBB.active{border:var(--amino-border)}.Amino_FilterWrapper-module__toggleWrapper--gqVoy{align-items:center;border-radius:100px;border-bottom-right-radius:var(--amino-filter-wrapper-border-bottom-right-radius);border-top-right-radius:var(--amino-filter-wrapper-border-top-right-radius);cursor:pointer;display:flex;gap:var(--amino-space-0);padding:var(--amino-space-4) var(--amino-space-4)}.Amino_FilterWrapper-module__toggleWrapper--gqVoy:hover{background-color:var(--amino-hover-color)}.Amino_FilterWrapper-module__toggleWrapper--gqVoy.active{border-right:1px solid var(--amino-filter-wrapper-border-right-color)}.Amino_FilterWrapper-module__styledDropdownTrigger--YXu5i{align-items:center;border-radius:100px;border-bottom-left-radius:0;border-top-left-radius:0;cursor:pointer;display:flex;gap:var(--amino-space-0);padding:var(--amino-space-4) var(--amino-space-4)}.Amino_FilterWrapper-module__styledDropdownTrigger--YXu5i:hover{background-color:var(--amino-hover-color)}.Amino_FilterWrapper-module__filterText--UowIN,.Amino_FilterWrapper-module__filterTitle--1VaM3{padding-left:var(--amino-space-4);padding-right:var(--amino-space-4)}.Amino_FilterWrapper-module__filterText--UowIN{color:var(--amino-blue-600);font-weight:600}.Amino_FilterWrapper-module__dropdownWrapper--dPZ9C{background-color:var(--amino-page-background);border-radius:var(--amino-radius-12);box-shadow:var(--amino-v3-shadow-xl);display:flex;flex-direction:column;gap:var(--amino-space-24);min-width:400px;outline:none;padding:var(--amino-space-24);position:absolute;z-index:5}.Amino_FilterWrapper-module__controlsWrapper--j4AT5{display:flex;flex-direction:column;gap:var(--amino-space-8);max-height:400px}");exports.FilterWrapper=function(r){var s=r.active,d=r.children,h=r.className,W=r.dropDownOpen,x=r.dropdownRef,w=r.dropdownTitle,A=r.filterText,q=r.handleApply,j=r.handleKeyDown,F=r.handleOpenDropdown,R=r.handleToggle,T=r.hasFilter,C=r.label,E=r.style;return React.createElement("div",{className:c.default(h,u),style:e.__assign(e.__assign({},E),{"--amino-filter-wrapper-border-bottom-right-radius":T?"0px":"100px","--amino-filter-wrapper-border-right-color":s?n.theme.borderColor:n.theme.gray200,"--amino-filter-wrapper-border-top-right-radius":T?"0px":"100px"})},React.createElement("div",{className:c.default(s&&"active",m)},React.createElement("button",{className:p.globalStyles.focusable,onClick:R,type:"button"},React.createElement("div",{className:c.default(s&&"active",_)},s?React.createElement(t.MinusCircleDuotoneIcon,{color:"gray0",secondaryColor:"gray600",size:24}):React.createElement(l.PlusCircleDuotoneIcon,{color:"gray0",secondaryColor:"gray600",size:24}),React.createElement(a.Text,{className:b,fontWeight:600},C))),T&&React.createElement("button",{className:c.default(g,p.globalStyles.focusable),onClick:F,type:"button"},React.createElement(a.Text,{className:v},A),React.createElement(i.ChevronDownIcon,{size:24}))),React.createElement("div",{ref:x,className:f,onKeyDown:j,role:"menu",style:{display:W?"flex":"none"},tabIndex:-1},React.createElement(a.Text,{type:"bold-subheader"},w),React.createElement("div",{className:y},d),React.createElement(o.Button,{onClick:q,size:"md",variant:"primary"},"Apply")))};
+"use strict";var r=require("../../tslib.es6-8c21e256.js"),e=require("clsx"),o=require("../button/Button.js"),i=require("../text/Text.js"),a=require("../../icons/ChevronDownIcon.js"),l=require("../../icons/MinusCircleDuotoneIcon.js"),t=require("../../icons/PlusCircleDuotoneIcon.js"),n=require("../../styles/constants/theme.js"),p=require("../../global.module-569e4fd5.js"),s=require("../../style-inject.es-d4ddeae4.js"),d=require("react/jsx-runtime");function u(r){return r&&r.__esModule?r:{default:r}}require("../../_rollupPluginBabelHelpers-697f213c.js"),require("react"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../button/useRipple.js"),require("../spinner/Spinner.js"),require("../../utils/getTestId.js"),require("../../icons/icon-base/_IconBase.js");var m=u(e),c="Amino_FilterWrapper-module__filterWrapper--u-lhr",_="Amino_FilterWrapper-module__badgeWrapper--wljBB",g="Amino_FilterWrapper-module__toggleWrapper--gqVoy",b="Amino_FilterWrapper-module__styledDropdownTrigger--YXu5i",x="Amino_FilterWrapper-module__filterTitle--1VaM3",h="Amino_FilterWrapper-module__filterText--UowIN",v="Amino_FilterWrapper-module__dropdownWrapper--dPZ9C",f="Amino_FilterWrapper-module__controlsWrapper--j4AT5";s.styleInject(".Amino_FilterWrapper-module__filterWrapper--u-lhr{position:relative}.Amino_FilterWrapper-module__badgeWrapper--wljBB{align-items:center;background-color:initial;border:1px dashed var(--amino-gray-200);border-radius:100px;color:var(--amino-gray-700);display:inline-flex}.Amino_FilterWrapper-module__badgeWrapper--wljBB.active{border:var(--amino-border)}.Amino_FilterWrapper-module__toggleWrapper--gqVoy{align-items:center;border-radius:100px;border-bottom-right-radius:var(--amino-filter-wrapper-border-bottom-right-radius);border-top-right-radius:var(--amino-filter-wrapper-border-top-right-radius);cursor:pointer;display:flex;gap:var(--amino-space-0);padding:var(--amino-space-4) var(--amino-space-4)}.Amino_FilterWrapper-module__toggleWrapper--gqVoy:hover{background-color:var(--amino-hover-color)}.Amino_FilterWrapper-module__toggleWrapper--gqVoy.active{border-right:1px solid var(--amino-filter-wrapper-border-right-color)}.Amino_FilterWrapper-module__styledDropdownTrigger--YXu5i{align-items:center;border-radius:100px;border-bottom-left-radius:0;border-top-left-radius:0;cursor:pointer;display:flex;gap:var(--amino-space-0);padding:var(--amino-space-4) var(--amino-space-4)}.Amino_FilterWrapper-module__styledDropdownTrigger--YXu5i:hover{background-color:var(--amino-hover-color)}.Amino_FilterWrapper-module__filterText--UowIN,.Amino_FilterWrapper-module__filterTitle--1VaM3{padding-left:var(--amino-space-4);padding-right:var(--amino-space-4)}.Amino_FilterWrapper-module__filterText--UowIN{color:var(--amino-blue-600);font-weight:600}.Amino_FilterWrapper-module__dropdownWrapper--dPZ9C{background-color:var(--amino-page-background);border-radius:var(--amino-radius-12);box-shadow:var(--amino-v3-shadow-xl);display:flex;flex-direction:column;gap:var(--amino-space-24);min-width:400px;outline:none;padding:var(--amino-space-24);position:absolute;z-index:5}.Amino_FilterWrapper-module__controlsWrapper--j4AT5{display:flex;flex-direction:column;gap:var(--amino-space-8);max-height:400px}");exports.FilterWrapper=function(e){var s=e.active,u=e.children,j=e.className,y=e.dropDownOpen,W=e.dropdownRef,w=e.dropdownTitle,q=e.filterText,A=e.handleApply,F=e.handleKeyDown,T=e.handleOpenDropdown,C=e.handleToggle,D=e.hasFilter,I=e.label,N=e.style;return d.jsxs("div",{className:m.default(j,c),style:r.__assign(r.__assign({},N),{"--amino-filter-wrapper-border-bottom-right-radius":D?"0px":"100px","--amino-filter-wrapper-border-right-color":s?n.theme.borderColor:n.theme.gray200,"--amino-filter-wrapper-border-top-right-radius":D?"0px":"100px"}),children:[d.jsxs("div",{className:m.default(s&&"active",_),children:[d.jsx("button",{className:p.globalStyles.focusable,onClick:C,type:"button",children:d.jsxs("div",{className:m.default(s&&"active",g),children:[s?d.jsx(l.MinusCircleDuotoneIcon,{color:"gray0",secondaryColor:"gray600",size:24}):d.jsx(t.PlusCircleDuotoneIcon,{color:"gray0",secondaryColor:"gray600",size:24}),d.jsx(i.Text,{className:x,fontWeight:600,children:I})]})}),D&&d.jsxs("button",{className:m.default(b,p.globalStyles.focusable),onClick:T,type:"button",children:[d.jsx(i.Text,{className:h,children:q}),d.jsx(a.ChevronDownIcon,{size:24})]})]}),d.jsxs("div",{ref:W,className:v,onKeyDown:F,role:"menu",style:{display:y?"flex":"none"},tabIndex:-1,children:[d.jsx(i.Text,{type:"bold-subheader",children:w}),d.jsx("div",{className:f,children:u}),d.jsx(o.Button,{onClick:A,size:"md",variant:"primary",children:"Apply"})]})]})};

package/components/filter/filter-amount/FilterAmount.d.ts

@@ -0,0 +1,55 @@
+import { type Dispatch } from 'react';
+import { type FilterAmountAction, type FilterAmountState } from "./filterAmountReducer";
+import { type BaseFilterProps } from "../useFilterWrapper";
+export type FilterAmountType = 'equal' | 'between' | 'greater' | 'less';
+export type FilterAmountProps = BaseFilterProps & {
+    dispatch: Dispatch<FilterAmountAction>;
+    filter: FilterAmountState;
+};
+/**
+ * FilterAmount provides a specialized filter interface for numeric amount values.
+ * It allows users to filter by equal to, between, greater than, or less than specific amounts.
+ * Integrates with the filter wrapper system for consistent behavior across filters.
+ *
+ * @example Basic usage with a reducer
+ * ```tsx
+ * const [filter, dispatch] = useReducer(filterAmountReducer, initialFilterAmountState);
+ *
+ * <FilterAmount
+ *   dispatch={dispatch}
+ *   dropdownTitle="Amount"
+ *   filter={filter}
+ *   label="Amount"
+ * />
+ * ```
+ *
+ * @example With specific initial filter value
+ * ```tsx
+ * const [filter, dispatch] = useReducer(filterAmountReducer, {
+ *   ...initialFilterAmountState,
+ *   amountFilterType: 'greater',
+ *   amountTotalMin: 100
+ * });
+ *
+ * <FilterAmount
+ *   dispatch={dispatch}
+ *   dropdownTitle="Price"
+ *   filter={filter}
+ *   label="Price"
+ * />
+ * ```
+ *
+ * @example As part of a filter group
+ * ```tsx
+ * <FilterWrapper>
+ *   <FilterAmount
+ *     dispatch={dispatch}
+ *     dropdownTitle="Total"
+ *     filter={filter}
+ *     label="Total Amount"
+ *   />
+ *   <OtherFilters... />
+ * </FilterWrapper>
+ * ```
+ */
+export declare const FilterAmount: ({ dispatch, dropdownTitle, filter, label, }: FilterAmountProps) => import("react").JSX.Element;

package/components/filter/filter-amount/FilterAmount.js

@@ -1 +1 @@
-"use strict";var e=require("../../../tslib.es6-8c21e256.js"),t=require("react"),n=require("./filterAmountReducer.js"),r=require("../useFilterWrapper.js"),a=require("../../input/Input.js"),i=require("../../select/Select.js"),u=require("../../../icons/ArrowRightIcon.js"),o=require("../../../style-inject.es-d4ddeae4.js");require("lodash/cloneDeep"),require("zod"),require("../../../utils/changeDeepProperty.js"),require("lodash/set"),require("../../../utils/hooks/useStateUrl.js"),require("../FilterWrapper.js"),require("clsx"),require("../../button/Button.js"),require("../../../_rollupPluginBabelHelpers-77a6284f.js"),require("../../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../../button/_Ripple.js"),require("../../../utils/getAminoColor.js"),require("../../../styles/constants/theme.js"),require("../../button/useRipple.js"),require("../../spinner/Spinner.js"),require("../../../utils/getTestId.js"),require("../../text/Text.js"),require("../../../icons/ChevronDownIcon.js"),require("../../../icons/icon-base/_IconBase.js"),require("../../../icons/MinusCircleDuotoneIcon.js"),require("../../../icons/PlusCircleDuotoneIcon.js"),require("../../../global.module-569e4fd5.js"),require("../../help-text/HelpText.js"),require("../../input/input-type/_DateInput.js"),require("@floating-ui/react"),require("../../input/input-type/_FloatLabelInput.js"),require("../../../icons/CalendarIcon.js"),require("../../input/input-type/_NumberInput.js"),require("../../../icons/CaretDownIcon.js"),require("../../../icons/CaretUpIcon.js"),require("../../input/input-type/_PasswordInput.js"),require("../../../icons/EyeIcon.js"),require("../../../icons/EyeOffIcon.js"),require("../../input/input-type/_TimeInput.js"),require("../../../icons/ClockIcon.js"),require("../../select/_StyledReactSelect.js"),require("react-intersection-observer"),require("react-select"),require("../../checkbox/Checkbox.js"),require("../../../icons/CheckmarkIcon.js"),require("../../../icons/DoubleChevronIcon.js"),require("../../../icons/RemoveCircleIcon.js"),require("../../../icons/RemoveIcon.js");var l="Amino_FilterAmount-module__inputWrapper--6kcs2";o.styleInject(".Amino_FilterAmount-module__inputWrapper--6kcs2{align-items:center;display:flex;gap:var(--amino-space-8)}.Amino_FilterAmount-module__inputWrapper--6kcs2 svg{min-width:var(--amino-space-24)}.Amino_FilterAmount-module__inputWrapper--6kcs2 .arrow-right{margin-right:var(--amino-space-16)}");exports.FilterAmount=function(o){var s=o.dispatch,c=o.dropdownTitle,p=o.filter,m=o.label,q=e.__read(t.useState(p.amountFilterType),2),j=q[0],g=q[1],d=e.__read(t.useState(p.amountTotalMin?String(p.amountTotalMin.toFixed(2)):null),2),v=d[0],F=d[1],y=e.__read(t.useState(p.amountTotalMax?String(p.amountTotalMax.toFixed(2)):null),2),b=y[0],h=y[1],_=e.__read(t.useState(!1),2),A=_[0],I=_[1],M=t.useCallback((function(e){s({name:"amountTotalMin",type:"change",value:e.amountMin}),s({name:"amountTotalMax",type:"change",value:e.amountMax})}),[s]),f=t.useCallback((function(e){var t=v?"".concat(parseFloat(v).toFixed(2)):"0",n=b?"".concat(parseFloat(b).toFixed(2)):"0";switch(j){case"between":e("Between ".concat(t," and ").concat(n));break;case"equal":e("Equal to ".concat(t));break;case"greater":e("Greater than ".concat(t));break;case"less":e("Less than ".concat(n))}}),[b,v,j]),x=t.useCallback((function(e){switch(s({name:"amountFilterType",type:"change",value:j}),j){case"between":M({amountMax:b?parseFloat(b):null,amountMin:v?parseFloat(v):null});break;case"equal":M({amountMax:v?parseFloat(v):null,amountMin:v?parseFloat(v):null});break;case"greater":M({amountMax:null,amountMin:v?parseFloat(v):null});break;case"less":M({amountMax:b?parseFloat(b):null,amountMin:null})}s({name:"isActive",type:"change",value:!0}),f(e)}),[s,M,b,v,j,f]),T=t.useMemo((function(){return"less"===j?null===b?"":String(b):null===v?"":String(v)}),[b,v,j]);return(0,r.useFilterWrapper({dropdownTitle:c,isActive:p.isActive,label:m,onApply:x,onApplyFilterText:f,onClose:function(){g(p.amountFilterType),F(p.amountTotalMin?String(p.amountTotalMin):null),h(p.amountTotalMax?String(p.amountTotalMax):null)},onRemove:function(){s({name:"isActive",type:"change",value:!1}),s({name:"amountFilterType",type:"change",value:n.initialFilterAmountState.amountFilterType}),M({amountMax:null,amountMin:null}),g(n.initialFilterAmountState.amountFilterType),F("0"),h("0")},setActive:function(e){return s({name:"isActive",type:"change",value:e})}}).renderWrapper)(React.createElement(React.Fragment,null,React.createElement(i.Select,{isClearable:!1,onChange:function(e){return g((null==e?void 0:e.value)||n.initialFilterAmountState.amountFilterType)},onKeyDown:function(e){"Enter"===e.key&&A&&e.stopPropagation()},onMenuClose:function(){return I(!1)},onMenuOpen:function(){return I(!0)},options:n.filterAmountOptions,size:"md",value:n.filterAmountOptions.filter((function(e){return e.value===j}))}),React.createElement("div",{className:l},React.createElement(u.ArrowRightIcon,{className:"arrow-right",color:"blue600",size:24}),React.createElement(a.Input,{onChange:function(e){return t=e.target.value,void("less"===j?h(t):F(t));var t},size:"md",type:"number",value:T}),"between"===j&&React.createElement(React.Fragment,null,"and",React.createElement(a.Input,{onChange:function(e){return h(e.target.value)},size:"md",type:"number",value:null===b?"":String(b)})))))};
+"use strict";var e=require("../../../tslib.es6-8c21e256.js"),t=require("react"),n=require("./filterAmountReducer.js"),r=require("../useFilterWrapper.js"),i=require("../../input/Input.js"),u=require("../../select/Select.js"),a=require("../../../icons/ArrowRightIcon.js"),o=require("../../../style-inject.es-d4ddeae4.js"),l=require("react/jsx-runtime");require("lodash/cloneDeep"),require("zod"),require("../../../utils/changeDeepProperty.js"),require("lodash/set"),require("../../../utils/hooks/useStateUrl.js"),require("../FilterWrapper.js"),require("clsx"),require("../../button/Button.js"),require("../../../_rollupPluginBabelHelpers-697f213c.js"),require("../../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../../button/_Ripple.js"),require("../../../utils/getAminoColor.js"),require("../../../styles/constants/theme.js"),require("../../button/useRipple.js"),require("../../spinner/Spinner.js"),require("../../../utils/getTestId.js"),require("../../text/Text.js"),require("../../../icons/ChevronDownIcon.js"),require("../../../icons/icon-base/_IconBase.js"),require("../../../icons/MinusCircleDuotoneIcon.js"),require("../../../icons/PlusCircleDuotoneIcon.js"),require("../../../global.module-569e4fd5.js"),require("../../help-text/HelpText.js"),require("../../input/input-type/_DateInput.js"),require("@floating-ui/react"),require("../../input/input-type/_FloatLabelInput.js"),require("../../../icons/CalendarIcon.js"),require("../../input/input-type/_NumberInput.js"),require("../../../icons/CaretDownIcon.js"),require("../../../icons/CaretUpIcon.js"),require("../../input/input-type/_PasswordInput.js"),require("../../../icons/EyeIcon.js"),require("../../../icons/EyeOffIcon.js"),require("../../input/input-type/_TimeInput.js"),require("../../../icons/ClockIcon.js"),require("../../select/_StyledReactSelect.js"),require("react-intersection-observer"),require("react-select"),require("../../checkbox/Checkbox.js"),require("../../../icons/CheckmarkIcon.js"),require("../../../icons/DoubleChevronIcon.js"),require("../../../icons/RemoveCircleIcon.js"),require("../../../icons/RemoveIcon.js");var s="Amino_FilterAmount-module__inputWrapper--6kcs2";o.styleInject(".Amino_FilterAmount-module__inputWrapper--6kcs2{align-items:center;display:flex;gap:var(--amino-space-8)}.Amino_FilterAmount-module__inputWrapper--6kcs2 svg{min-width:var(--amino-space-24)}.Amino_FilterAmount-module__inputWrapper--6kcs2 .arrow-right{margin-right:var(--amino-space-16)}");exports.FilterAmount=function(o){var c=o.dispatch,p=o.dropdownTitle,m=o.filter,q=o.label,j=e.__read(t.useState(m.amountFilterType),2),d=j[0],g=j[1],v=e.__read(t.useState(m.amountTotalMin?String(m.amountTotalMin.toFixed(2)):null),2),h=v[0],F=v[1],x=e.__read(t.useState(m.amountTotalMax?String(m.amountTotalMax.toFixed(2)):null),2),y=x[0],b=x[1],_=e.__read(t.useState(!1),2),A=_[0],I=_[1],M=t.useCallback((function(e){c({name:"amountTotalMin",type:"change",value:e.amountMin}),c({name:"amountTotalMax",type:"change",value:e.amountMax})}),[c]),f=t.useCallback((function(e){var t=h?"".concat(parseFloat(h).toFixed(2)):"0",n=y?"".concat(parseFloat(y).toFixed(2)):"0";switch(d){case"between":e("Between ".concat(t," and ").concat(n));break;case"equal":e("Equal to ".concat(t));break;case"greater":e("Greater than ".concat(t));break;case"less":e("Less than ".concat(n))}}),[y,h,d]),T=t.useCallback((function(e){switch(c({name:"amountFilterType",type:"change",value:d}),d){case"between":M({amountMax:y?parseFloat(y):null,amountMin:h?parseFloat(h):null});break;case"equal":M({amountMax:h?parseFloat(h):null,amountMin:h?parseFloat(h):null});break;case"greater":M({amountMax:null,amountMin:h?parseFloat(h):null});break;case"less":M({amountMax:y?parseFloat(y):null,amountMin:null})}c({name:"isActive",type:"change",value:!0}),f(e)}),[c,M,y,h,d,f]),C=t.useMemo((function(){return"less"===d?null===y?"":String(y):null===h?"":String(h)}),[y,h,d]);return(0,r.useFilterWrapper({dropdownTitle:p,isActive:m.isActive,label:q,onApply:T,onApplyFilterText:f,onClose:function(){g(m.amountFilterType),F(m.amountTotalMin?String(m.amountTotalMin):null),b(m.amountTotalMax?String(m.amountTotalMax):null)},onRemove:function(){c({name:"isActive",type:"change",value:!1}),c({name:"amountFilterType",type:"change",value:n.initialFilterAmountState.amountFilterType}),M({amountMax:null,amountMin:null}),g(n.initialFilterAmountState.amountFilterType),F("0"),b("0")},setActive:function(e){return c({name:"isActive",type:"change",value:e})}}).renderWrapper)(l.jsxs(l.Fragment,{children:[l.jsx(u.Select,{isClearable:!1,onChange:function(e){return g((null==e?void 0:e.value)||n.initialFilterAmountState.amountFilterType)},onKeyDown:function(e){"Enter"===e.key&&A&&e.stopPropagation()},onMenuClose:function(){return I(!1)},onMenuOpen:function(){return I(!0)},options:n.filterAmountOptions,size:"md",value:n.filterAmountOptions.filter((function(e){return e.value===d}))}),l.jsxs("div",{className:s,children:[l.jsx(a.ArrowRightIcon,{className:"arrow-right",color:"blue600",size:24}),l.jsx(i.Input,{onChange:function(e){return t=e.target.value,void("less"===d?b(t):F(t));var t},size:"md",type:"number",value:C}),"between"===d&&l.jsxs(l.Fragment,{children:["and",l.jsx(i.Input,{onChange:function(e){return b(e.target.value)},size:"md",type:"number",value:null===y?"":String(y)})]})]})]}))};

package/components/filter/filter-amount/filterAmountReducer.d.ts

@@ -0,0 +1,20 @@
+import type { DeepReducerActions } from "../../../types/deep/DeepReducerActions";
+export declare const filterAmountTypes: readonly ["equal", "between", "greater", "less"];
+export type FilterAmountType = (typeof filterAmountTypes)[number];
+export declare const filterAmountOptions: {
+    label: string;
+    value: FilterAmountType;
+}[];
+export type FilterAmountState = {
+    amountFilterType: FilterAmountType;
+    amountTotalMax: number | null;
+    amountTotalMin: number | null;
+    isActive: boolean;
+};
+export declare const initialFilterAmountState: FilterAmountState;
+export type FilterAmountAction = DeepReducerActions<FilterAmountState> | {
+    type: 'reset';
+};
+export declare const filterAmountReducer: (state: FilterAmountState, action: FilterAmountAction) => FilterAmountState;
+export declare const filterAmountReducerUrl: (prefixKey?: string) => (state: FilterAmountState, action: FilterAmountAction) => FilterAmountState;
+export declare const getInitialFilterAmountStateUrl: (prefixKey?: string) => FilterAmountState;

package/components/filter/filter-date/DateControls.d.ts

@@ -0,0 +1,11 @@
+import { type FilterDateData, type FilterDateRangeType } from "./filterDateReducer";
+import type { BaseProps } from "../../../types/BaseProps";
+type DateControlProps = BaseProps & {
+    onChange: (value: FilterDateData) => void;
+    onChangeFilterText: (text: string) => void;
+    rangeType: FilterDateRangeType;
+    setRangeType: (range: FilterDateRangeType) => void;
+    value: FilterDateData;
+};
+export declare const DateControls: ({ onChange, onChangeFilterText, rangeType, setRangeType, value, }: DateControlProps) => import("react").JSX.Element;
+export {};