@oneplatformdev/ui 0.1.99-beta.3 → 0.1.99-beta.300

package/Dropzone/Dropzone.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dropzone.types.d.ts","sourceRoot":"","sources":["../../src/Dropzone/Dropzone.types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEjD,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,MAAM,CAAC;AAE9C,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,iBAAiB,CAAC;IACxB,MAAM,CAAC,EAAE,IAAI,CACX,cAAc,EACd,eAAe,GAAG,cAAc,GAAG,aAAa,CACjD,CAAC;CACH;AAED,MAAM,WAAW,oBAAoB;IACnC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,aACf,SAAQ,oBAAoB,EAC1B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC5B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,EAAE,KAAK,IAAI,CAAC;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,yBAAyB,CAAC,EAAE,MAAM,CAAC;CACpC;AAED,MAAM,WAAW,cAAc;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,kBAAkB,UAM9B,CAAC;AAEF,eAAO,MAAM,oBAAoB,UAMhC,CAAC;AAGF,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC;CACzD"}
+{"version":3,"file":"Dropzone.types.d.ts","sourceRoot":"","sources":["../../src/Dropzone/Dropzone.types.tsx"],"names":[],"mappings":"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"}

package/Dropzone/Dropzone.types.js

@@ -1,18 +1,41 @@
-const e = [
+const o = [
+  "application/pdf",
   "application/msword",
   "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+  "application/vnd.ms-excel",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+  "application/vnd.ms-powerpoint",
+  "application/vnd.openxmlformats-officedocument.presentationml.presentation",
   "text/csv",
-  "text/plain",
-  "application/pdf"
-], i = [
+  "text/plain"
+], e = [
   "image/png",
   "image/jpeg",
   "image/jpg",
-  "image/webp",
-  "image/gif"
-];
+  "image/webp"
+  // 'image/gif', // TODO: normalize this type
+], i = [
+  "video/mp4",
+  "video/quicktime",
+  "video/x-msvideo",
+  "video/webm",
+  "video/avi"
+], a = [
+  "audio/mpeg",
+  // mp3
+  "audio/wav",
+  "audio/x-wav",
+  "audio/ogg",
+  "audio/mp4",
+  // m4a
+  "audio/aac",
+  "audio/webm"
+], p = o;
 export {
-  e as DEFAULT_FILE_TYPES,
-  i as DEFAULT_IMAGES_TYPES
+  a as DEFAULT_AUDIO_TYPES,
+  o as DEFAULT_DOCUMENT_TYPES,
+  p as DEFAULT_FILE_TYPES,
+  e as DEFAULT_IMAGES_TYPES,
+  i as DEFAULT_VIDEO_TYPES
 };
 //# sourceMappingURL=Dropzone.types.js.map

package/Dropzone/Dropzone.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dropzone.types.js","sources":["../../src/Dropzone/Dropzone.types.tsx"],"sourcesContent":["import { FileRejection } from 'react-dropzone';\nimport { Dispatch, SetStateAction } from 'react';\n\nexport type DropzoneValueItem = File | string;\n\nexport interface FilePreviewProps {\n  item: DropzoneValueItem;\n  styles?: Pick<\n    DropzoneStyles,\n    'previewWraper' | 'previewImage' | 'previewFile'\n  >;\n}\n\nexport interface DropzoneTranslations {\n  labelDropzonePrompt?: string;\n  labelDropzoneSubPrompt?: string;\n  labelOrClickToSelect?: string;\n  labelSelectedFiles?: string;\n  labelUploadErrors?: string;\n  labelFileTooLarge?: string;\n  labelInvalidFileType?: string;\n}\n\nexport interface DropzoneProps\n  extends DropzoneTranslations,\n    React.HTMLAttributes<HTMLDivElement> {\n  acceptTypes?: string[];\n  maxSizeMB: number;\n  maxFiles?: number;\n  onErrors?: (errors: FileRejection[]) => void;\n  hideErrors?: boolean;\n  disabled?: boolean;\n  classNames?: DropzoneStyles;\n  value?: DropzoneValueItem[];\n  onChangeValue?: (items: DropzoneValueItem[]) => void;\n  singlePick?: boolean;\n  labelDropzoneClassname?: string;\n  labelDropzoneSubClassname?: string;\n}\n\nexport interface DropzoneStyles {\n  idleWrapper?: string;\n  previewWrapper?: string;\n  errorWrapper?: string;\n  previewWraper?: string;\n  previewImage?: string;\n  previewFile?: string;\n}\n\nexport const DEFAULT_FILE_TYPES = [\n  'application/msword',\n  'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\n  'text/csv',\n  'text/plain',\n  'application/pdf',\n];\n\nexport const DEFAULT_IMAGES_TYPES = [\n  'image/png',\n  'image/jpeg',\n  'image/jpg',\n  'image/webp',\n  'image/gif',\n];\n\n\nexport interface DropzoneControl {\n  setItems: Dispatch<SetStateAction<DropzoneValueItem[]>>;\n}\n"],"names":["DEFAULT_FILE_TYPES","DEFAULT_IMAGES_TYPES"],"mappings":"AAiDO,MAAMA,IAAqB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAAuB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}
+{"version":3,"file":"Dropzone.types.js","sources":["../../src/Dropzone/Dropzone.types.tsx"],"sourcesContent":["import { FileRejection } from 'react-dropzone';\r\nimport { Dispatch, SetStateAction } from 'react';\r\n\r\nexport type DropzoneValueItem = File | string;\r\n\r\nexport interface FilePreviewProps {\r\n  item: DropzoneValueItem;\r\n  styles?: Pick<\r\n    DropzoneStyles,\r\n    'previewWraper' | 'previewImage' | 'previewFile'\r\n  >;\r\n}\r\n\r\nexport interface DropzoneTranslations {\r\n  labelDropzonePrompt?: string;\r\n  labelDropzoneSubPrompt?: string;\r\n  labelOrClickToSelect?: string;\r\n  labelSelectedFiles?: string;\r\n  labelUploadErrors?: string;\r\n  labelFileTooLarge?: string;\r\n  labelInvalidFileType?: string;\r\n  labelVideoUploaded?: string;\r\n  labelVideoReplace?: string;\r\n}\r\n\r\nexport interface DropzoneProps\r\n  extends DropzoneTranslations,\r\n    React.HTMLAttributes<HTMLDivElement> {\r\n  acceptTypes?: string[];\r\n  maxSizeMB: number;\r\n  maxFiles?: number;\r\n  onErrors?: (errors: FileRejection[]) => void;\r\n  hideErrors?: boolean;\r\n  disabled?: boolean;\r\n  classNames?: DropzoneStyles;\r\n  value?: DropzoneValueItem[];\r\n  onChangeValue?: (items: DropzoneValueItem[]) => void;\r\n  singlePick?: boolean;\r\n  labelDropzoneClassname?: string;\r\n  labelDropzoneSubClassname?: string;\r\n  isUploading?: boolean;\r\n  uploadProgress?: number;\r\n  uploadLoadedBytes?: number;\r\n  uploadTotalBytes?: number;\r\n  onCancelUpload?: () => void;\r\n  labelUploadingTitle?: string;\r\n  labelUploadingHint?: string;\r\n  labelUploadingActionCancel?: string;\r\n  labelUploadingOf?: string;\r\n  playerTranslations?: Partial<Record<string, string>>;\r\n  singlePickFileInfo?: { name?: string; size?: number };\r\n  persistentDropzone?: boolean;\r\n  previewVariant?: 'default' | 'image-grid' | 'file-list';\r\n  designVariant?: 'legacy' | 'modern';\r\n  documentUploadCard?: boolean;\r\n  /**\r\n   * In `image-grid` variant, render the first item as a full-width cover preview.\r\n   * Other items keep the regular grid size. The remove (X) button is preserved.\r\n   */\r\n  coverFirstItem?: boolean;\r\n}\r\n\r\nexport interface DropzoneStyles {\r\n  idleWrapper?: string;\r\n  previewWrapper?: string;\r\n  errorWrapper?: string;\r\n  previewWraper?: string;\r\n  previewImage?: string;\r\n  previewFile?: string;\r\n}\r\n\r\nexport const DEFAULT_DOCUMENT_TYPES = [\r\n  'application/pdf',\r\n  'application/msword',\r\n  'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\r\n  'application/vnd.ms-excel',\r\n  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',\r\n  'application/vnd.ms-powerpoint',\r\n  'application/vnd.openxmlformats-officedocument.presentationml.presentation',\r\n  'text/csv',\r\n  'text/plain',\r\n];\r\n\r\nexport const DEFAULT_IMAGES_TYPES = [\r\n  'image/png',\r\n  'image/jpeg',\r\n  'image/jpg',\r\n  'image/webp',\r\n  // 'image/gif', // TODO: normalize this type\r\n];\r\n\r\nexport const DEFAULT_VIDEO_TYPES = [\r\n  'video/mp4',\r\n  'video/quicktime',\r\n  'video/x-msvideo',\r\n  'video/webm',\r\n  'video/avi'\r\n];\r\n\r\nexport const DEFAULT_AUDIO_TYPES = [\r\n  'audio/mpeg', // mp3\r\n  'audio/wav',\r\n  'audio/x-wav',\r\n  'audio/ogg',\r\n  'audio/mp4', // m4a\r\n  'audio/aac',\r\n  'audio/webm',\r\n];\r\n\r\n// Backward-compatible alias.\r\nexport const DEFAULT_FILE_TYPES = DEFAULT_DOCUMENT_TYPES;\r\n\r\n\r\nexport interface DropzoneControl {\r\n  setItems: Dispatch<SetStateAction<DropzoneValueItem[]>>;\r\n}\r\n"],"names":["DEFAULT_DOCUMENT_TYPES","DEFAULT_IMAGES_TYPES","DEFAULT_VIDEO_TYPES","DEFAULT_AUDIO_TYPES","DEFAULT_FILE_TYPES"],"mappings":"AAuEO,MAAMA,IAAyB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAAuB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAEF,GAEaC,IAAsB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAAsB;AAAA,EACjC;AAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EACA;AAAA,EACA;AACF,GAGaC,IAAqBJ;"}

package/Dropzone/DropzoneCoverPreview.d.ts

@@ -0,0 +1,14 @@
+import { DropzoneValueItem } from './Dropzone.types';
+interface DropzoneCoverPreviewProps {
+    item: DropzoneValueItem;
+    className?: string;
+}
+/**
+ * Cover preview for the image-grid (multi select) drop area.
+ * Mirrors the single image preview: wide images fill the frame (object-cover),
+ * portrait images are shown in full (object-contain) over a blurred backdrop,
+ * so the cover is never cropped awkwardly.
+ */
+export declare const DropzoneCoverPreview: ({ item, className }: DropzoneCoverPreviewProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=DropzoneCoverPreview.d.ts.map

package/Dropzone/DropzoneCoverPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropzoneCoverPreview.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneCoverPreview.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAGrD,UAAU,yBAAyB;IACjC,IAAI,EAAE,iBAAiB,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,qBAAqB,yBAAyB,mDAmDlF,CAAC"}

package/Dropzone/DropzoneCoverPreview.js

@@ -0,0 +1,56 @@
+import { jsxs as m, jsx as a } from "react/jsx-runtime";
+import { useState as n, useEffect as d } from "react";
+import { cn as i } from "@oneplatformdev/utils";
+import { isFile as v } from "./DropzoneUtils.js";
+const h = ({ item: e, className: u }) => {
+  const [t, o] = n(""), [l, f] = n(!1);
+  return d(() => {
+    if (v(e)) {
+      const r = URL.createObjectURL(e);
+      return o(r), () => URL.revokeObjectURL(r);
+    }
+    if (typeof e == "string") {
+      o(e);
+      return;
+    }
+    o("");
+  }, [e]), t ? /* @__PURE__ */ m(
+    "div",
+    {
+      className: i(
+        "relative flex w-full h-full items-center justify-center overflow-hidden",
+        u
+      ),
+      children: [
+        !l && /* @__PURE__ */ a(
+          "div",
+          {
+            className: "absolute inset-0 scale-110 bg-cover bg-center opacity-80 blur-xl",
+            style: { backgroundImage: `url(${t})` }
+          }
+        ),
+        /* @__PURE__ */ a(
+          "img",
+          {
+            src: t,
+            alt: "",
+            onLoad: (r) => {
+              const { naturalWidth: s, naturalHeight: c } = r.currentTarget;
+              f(
+                !!s && !!c && s > c
+              );
+            },
+            className: i(
+              "relative h-full",
+              l ? "w-full object-cover" : "z-10 max-w-full object-contain"
+            )
+          }
+        )
+      ]
+    }
+  ) : null;
+};
+export {
+  h as DropzoneCoverPreview
+};
+//# sourceMappingURL=DropzoneCoverPreview.js.map

package/Dropzone/DropzoneCoverPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropzoneCoverPreview.js","sources":["../../src/Dropzone/DropzoneCoverPreview.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\r\n\r\nimport { cn } from '@oneplatformdev/utils';\r\n\r\nimport { DropzoneValueItem } from './Dropzone.types';\r\nimport { isFile } from './DropzoneUtils';\r\n\r\ninterface DropzoneCoverPreviewProps {\r\n  item: DropzoneValueItem;\r\n  className?: string;\r\n}\r\n\r\n/**\r\n * Cover preview for the image-grid (multi select) drop area.\r\n * Mirrors the single image preview: wide images fill the frame (object-cover),\r\n * portrait images are shown in full (object-contain) over a blurred backdrop,\r\n * so the cover is never cropped awkwardly.\r\n */\r\nexport const DropzoneCoverPreview = ({ item, className }: DropzoneCoverPreviewProps) => {\r\n  const [src, setSrc] = useState('');\r\n  const [isWideImage, setIsWideImage] = useState(false);\r\n\r\n  useEffect(() => {\r\n    if (isFile(item)) {\r\n      const objectUrl = URL.createObjectURL(item);\r\n      setSrc(objectUrl);\r\n      return () => URL.revokeObjectURL(objectUrl);\r\n    }\r\n\r\n    if (typeof item === 'string') {\r\n      setSrc(item);\r\n      return undefined;\r\n    }\r\n\r\n    setSrc('');\r\n    return undefined;\r\n  }, [item]);\r\n\r\n  if (!src) return null;\r\n\r\n  return (\r\n    <div\r\n      className={cn(\r\n        'relative flex w-full h-full items-center justify-center overflow-hidden',\r\n        className,\r\n      )}\r\n    >\r\n      {!isWideImage && (\r\n        <div\r\n          className=\"absolute inset-0 scale-110 bg-cover bg-center opacity-80 blur-xl\"\r\n          style={{ backgroundImage: `url(${src})` }}\r\n        />\r\n      )}\r\n      <img\r\n        src={src}\r\n        alt=\"\"\r\n        onLoad={(event) => {\r\n          const { naturalWidth, naturalHeight } = event.currentTarget;\r\n          setIsWideImage(\r\n            !!naturalWidth && !!naturalHeight && naturalWidth > naturalHeight,\r\n          );\r\n        }}\r\n        className={cn(\r\n          'relative h-full',\r\n          isWideImage ? 'w-full object-cover' : 'z-10 max-w-full object-contain',\r\n        )}\r\n      />\r\n    </div>\r\n  );\r\n};\r\n"],"names":["DropzoneCoverPreview","item","className","src","setSrc","useState","isWideImage","setIsWideImage","useEffect","isFile","objectUrl","jsxs","cn","jsx","event","naturalWidth","naturalHeight"],"mappings":";;;;AAkBO,MAAMA,IAAuB,CAAC,EAAE,MAAAC,GAAM,WAAAC,QAA2C;AACtF,QAAM,CAACC,GAAKC,CAAM,IAAIC,EAAS,EAAE,GAC3B,CAACC,GAAaC,CAAc,IAAIF,EAAS,EAAK;AAkBpD,SAhBAG,EAAU,MAAM;AACd,QAAIC,EAAOR,CAAI,GAAG;AAChB,YAAMS,IAAY,IAAI,gBAAgBT,CAAI;AAC1C,aAAAG,EAAOM,CAAS,GACT,MAAM,IAAI,gBAAgBA,CAAS;AAAA,IAC5C;AAEA,QAAI,OAAOT,KAAS,UAAU;AAC5B,MAAAG,EAAOH,CAAI;AACX;AAAA,IACF;AAEA,IAAAG,EAAO,EAAE;AAAA,EAEX,GAAG,CAACH,CAAI,CAAC,GAEJE,IAGH,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAV;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,CAACI,KACA,gBAAAO;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO,EAAE,iBAAiB,OAAOV,CAAG,IAAA;AAAA,UAAI;AAAA,QAAA;AAAA,QAG5C,gBAAAU;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAAV;AAAA,YACA,KAAI;AAAA,YACJ,QAAQ,CAACW,MAAU;AACjB,oBAAM,EAAE,cAAAC,GAAc,eAAAC,EAAA,IAAkBF,EAAM;AAC9C,cAAAP;AAAA,gBACE,CAAC,CAACQ,KAAgB,CAAC,CAACC,KAAiBD,IAAeC;AAAA,cAAA;AAAA,YAExD;AAAA,YACA,WAAWJ;AAAA,cACT;AAAA,cACAN,IAAc,wBAAwB;AAAA,YAAA;AAAA,UACxC;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA,IA5Ba;AA+BnB;"}

package/Dropzone/DropzoneFileCard.d.ts

@@ -0,0 +1,17 @@
+import { FC } from 'react';
+export interface DropzoneFileCardProps {
+    name: string;
+    sizeLabel?: string;
+    /** Resolved extension icon (svg src). When absent a generic icon is shown. */
+    iconSrc?: string | null;
+    disabled?: boolean;
+    className?: string;
+    onRemove?: (event: React.MouseEvent<HTMLDivElement>) => void;
+}
+/**
+ * Прямокутна картка файлу для мультизавантаження (variant `file-list`):
+ * іконка за типом + назва + розмір + кнопка видалення. Підходить під будь-який
+ * тип (pdf / doc / фото / відео) — усі показуються однаково.
+ */
+export declare const DropzoneFileCard: FC<DropzoneFileCardProps>;
+//# sourceMappingURL=DropzoneFileCard.d.ts.map

package/Dropzone/DropzoneFileCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropzoneFileCard.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneFileCard.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8EAA8E;IAC9E,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC9D;AAED;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA6CtD,CAAC"}

package/Dropzone/DropzoneFileCard.js

@@ -0,0 +1,39 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { FileTextIcon as o, X as m } from "lucide-react";
+import { cn as x } from "@oneplatformdev/utils";
+const h = ({
+  name: r,
+  sizeLabel: t,
+  iconSrc: i,
+  disabled: n = !1,
+  className: a,
+  onRemove: s
+}) => /* @__PURE__ */ l(
+  "div",
+  {
+    className: x(
+      "w-full min-h-[72px] rounded-[8px] bg-[#F5F5F5] p-4 flex items-center gap-4",
+      a
+    ),
+    onClick: (c) => c.stopPropagation(),
+    children: [
+      i ? /* @__PURE__ */ e("img", { src: i, alt: "", className: "size-10 shrink-0" }) : /* @__PURE__ */ e("div", { className: "size-10 rounded-[8px] bg-[#9368FF] text-white flex items-center justify-center shrink-0", children: /* @__PURE__ */ e(o, { size: 20 }) }),
+      /* @__PURE__ */ l("div", { className: "flex flex-col items-start text-left gap-1 min-w-0 flex-1", children: [
+        /* @__PURE__ */ e("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate", children: r }),
+        t && /* @__PURE__ */ e("span", { className: "w-full text-[12px] font-medium leading-[120%] text-[#666A78]", children: t })
+      ] }),
+      !n && s && /* @__PURE__ */ e(
+        "div",
+        {
+          className: "size-6 flex items-center justify-center cursor-pointer shrink-0",
+          onClick: s,
+          children: /* @__PURE__ */ e(m, { size: 24, color: "#06080D" })
+        }
+      )
+    ]
+  }
+);
+export {
+  h as DropzoneFileCard
+};
+//# sourceMappingURL=DropzoneFileCard.js.map

package/Dropzone/DropzoneFileCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropzoneFileCard.js","sources":["../../src/Dropzone/DropzoneFileCard.tsx"],"sourcesContent":["import { FileTextIcon, X } from 'lucide-react';\nimport { FC } from 'react';\n\nimport { cn } from '@oneplatformdev/utils';\n\nexport interface DropzoneFileCardProps {\n  name: string;\n  sizeLabel?: string;\n  /** Resolved extension icon (svg src). When absent a generic icon is shown. */\n  iconSrc?: string | null;\n  disabled?: boolean;\n  className?: string;\n  onRemove?: (event: React.MouseEvent<HTMLDivElement>) => void;\n}\n\n/**\n * Прямокутна картка файлу для мультизавантаження (variant `file-list`):\n * іконка за типом + назва + розмір + кнопка видалення. Підходить під будь-який\n * тип (pdf / doc / фото / відео) — усі показуються однаково.\n */\nexport const DropzoneFileCard: FC<DropzoneFileCardProps> = ({\n  name,\n  sizeLabel,\n  iconSrc,\n  disabled = false,\n  className,\n  onRemove,\n}) => {\n  return (\n    <div\n      className={cn(\n        'w-full min-h-[72px] rounded-[8px] bg-[#F5F5F5] p-4 flex items-center gap-4',\n        className\n      )}\n      onClick={(event) => event.stopPropagation()}\n    >\n      {iconSrc ? (\n        <img src={iconSrc} alt=\"\" className=\"size-10 shrink-0\" />\n      ) : (\n        <div className=\"size-10 rounded-[8px] bg-[#9368FF] text-white flex items-center justify-center shrink-0\">\n          <FileTextIcon size={20} />\n        </div>\n      )}\n\n      <div className=\"flex flex-col items-start text-left gap-1 min-w-0 flex-1\">\n        <span className=\"w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate\">\n          {name}\n        </span>\n        {sizeLabel && (\n          <span className=\"w-full text-[12px] font-medium leading-[120%] text-[#666A78]\">\n            {sizeLabel}\n          </span>\n        )}\n      </div>\n\n      {!disabled && onRemove && (\n        <div\n          className=\"size-6 flex items-center justify-center cursor-pointer shrink-0\"\n          onClick={onRemove}\n        >\n          <X size={24} color=\"#06080D\" />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["DropzoneFileCard","name","sizeLabel","iconSrc","disabled","className","onRemove","jsxs","cn","event","jsx","FileTextIcon","X"],"mappings":";;;AAoBO,MAAMA,IAA8C,CAAC;AAAA,EAC1D,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,UAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAH;AAAA,IAAA;AAAA,IAEF,SAAS,CAACI,MAAUA,EAAM,gBAAA;AAAA,IAEzB,UAAA;AAAA,MAAAN,sBACE,OAAA,EAAI,KAAKA,GAAS,KAAI,IAAG,WAAU,oBAAmB,IAEvD,gBAAAO,EAAC,SAAI,WAAU,2FACb,4BAACC,GAAA,EAAa,MAAM,IAAI,GAC1B;AAAA,MAGF,gBAAAJ,EAAC,OAAA,EAAI,WAAU,4DACb,UAAA;AAAA,QAAA,gBAAAG,EAAC,QAAA,EAAK,WAAU,2EACb,UAAAT,GACH;AAAA,QACCC,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAU,gEACb,UAAAR,EAAA,CACH;AAAA,MAAA,GAEJ;AAAA,MAEC,CAACE,KAAYE,KACZ,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAASJ;AAAA,UAET,UAAA,gBAAAI,EAACE,GAAA,EAAE,MAAM,IAAI,OAAM,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAC/B;AAAA,EAAA;AAAA;"}

package/Dropzone/DropzoneFilePreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropzoneFilePreview.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneFilePreview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAuB,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAwB,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAI1E,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA8D5C,CAAC"}
+{"version":3,"file":"DropzoneFilePreview.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneFilePreview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAuB,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAwB,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAM1E,OAAO,wCAAwC,CAAC;AAChD,OAAO,iDAAiD,CAAC;AACzD,OAAO,yDAAyD,CAAC;AAEjE,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA8E5C,CAAC"}

package/Dropzone/DropzoneFilePreview.js

@@ -1,48 +1,68 @@
-import { jsx as n, jsxs as d } from "react/jsx-runtime";
-import { useState as u, useEffect as f } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { useState as p, useEffect as f } from "react";
 import { File as m } from "lucide-react";
-import { DEFAULT_IMAGES_TYPES as p } from "./Dropzone.types.js";
+import { DEFAULT_IMAGES_TYPES as w } from "./Dropzone.types.js";
 import { isFile as a } from "./DropzoneUtils.js";
-import { cn as t } from "@oneplatformdev/utils";
-const N = ({ item: e, styles: s }) => {
-  const [c, r] = u(null), i = a(e) && p.includes(e.type);
+import { cn as i } from "@oneplatformdev/utils";
+import { MediaPlayer as x, MediaProvider as v } from "@vidstack/react";
+import { DefaultVideoLayout as h, defaultLayoutIcons as y } from "@vidstack/react/player/layouts/default";
+import "@vidstack/react/player/styles/base.css";
+import "@vidstack/react/player/styles/default/theme.css";
+import "@vidstack/react/player/styles/default/layouts/video.css";
+const E = ({ item: e, styles: t }) => {
+  const [s, o] = p(null), d = a(e) && w.includes(e.type), c = a(e) && e.type.includes("video");
   return f(() => {
-    let l = null;
-    if (a(e) && i) {
-      const o = new FileReader();
-      return o.onloadend = () => r(o.result), o.readAsDataURL(e), () => r(null);
+    let r = null;
+    if (a(e) && d) {
+      const n = new FileReader();
+      return n.onloadend = () => o(n.result), n.readAsDataURL(e), () => o(null);
     } else {
       if (typeof e == "string")
-        return l = new Image(), l.src = e, l.onload = () => r(e), l.onerror = () => r(null), () => {
-          l.onload = null, l.onerror = null;
+        return r = new Image(), r.src = e, r.onload = () => o(e), r.onerror = () => o(null), () => {
+          r.onload = null, r.onerror = null;
         };
-      r(null);
+      if (a(e) && c) {
+        const n = URL.createObjectURL(e);
+        return o(n), () => URL.revokeObjectURL(n);
+      } else
+        o(null);
     }
-    return () => r(null);
-  }, [e, i]), /* @__PURE__ */ n(
+    return () => o(null);
+  }, [e, d, c]), /* @__PURE__ */ l(
     "div",
     {
-      className: t(
+      className: i(
         "w-32 h-32 border border-gray-300 rounded-md overflow-hidden flex items-center justify-center",
-        s?.previewWraper
+        t?.previewWraper
       ),
-      children: c ? /* @__PURE__ */ n(
+      children: s && c ? /* @__PURE__ */ l("div", { className: "w-full h-full bg-black", onClick: (r) => r.stopPropagation(), children: /* @__PURE__ */ u(
+        x,
+        {
+          src: a(e) ? { src: s, type: e.type } : s,
+          className: "h-full w-full bg-black text-white",
+          playsInline: !0,
+          children: [
+            /* @__PURE__ */ l(v, {}),
+            /* @__PURE__ */ l(h, { icons: y })
+          ]
+        }
+      ) }) : s ? /* @__PURE__ */ l(
         "img",
         {
-          src: c,
+          src: s,
           alt: a(e) ? e.name : "external-image",
-          className: t("w-full h-full object-cover", s?.previewImage)
+          className: i("w-full h-full object-cover", t?.previewImage)
         }
-      ) : /* @__PURE__ */ d(
+      ) : /* @__PURE__ */ u(
         "div",
         {
-          className: t(
+          className: i(
             "flex flex-col items-center justify-center text-gray-500 text-sm p-2 text-center",
-            s?.previewFile
+            t?.previewFile
           ),
           children: [
-            /* @__PURE__ */ n(m, { className: "w-6 h-6" }),
-            a(e) ? /* @__PURE__ */ n("span", { className: "text-xs break-all", children: e.name }) : /* @__PURE__ */ n("span", { className: "text-xs break-all", children: e })
+            /* @__PURE__ */ l(m, { className: "w-6 h-6" }),
+            a(e) ? /* @__PURE__ */ l("span", { className: "text-xs break-all", children: e.name }) : /* @__PURE__ */ l("span", { className: "text-xs break-all", children: e })
           ]
         }
       )
@@ -50,6 +70,6 @@ const N = ({ item: e, styles: s }) => {
   );
 };
 export {
-  N as FilePreview
+  E as FilePreview
 };
 //# sourceMappingURL=DropzoneFilePreview.js.map

package/Dropzone/DropzoneFilePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropzoneFilePreview.js","sources":["../../src/Dropzone/DropzoneFilePreview.tsx"],"sourcesContent":["import { FC, useEffect, useState } from 'react';\nimport { File as FileIcon } from 'lucide-react';\nimport { DEFAULT_IMAGES_TYPES, FilePreviewProps } from './Dropzone.types';\nimport { isFile } from './DropzoneUtils';\nimport { cn } from '@oneplatformdev/utils';\n\nexport const FilePreview: FC<FilePreviewProps> = ({ item, styles }) => {\n  const [preview, setPreview] = useState<string | null>(null);\n\n  const isFileTypeImage =\n    isFile(item) && DEFAULT_IMAGES_TYPES.includes(item.type);\n\n  useEffect(() => {\n    let img: HTMLImageElement | null = null;\n\n    if (isFile(item) && isFileTypeImage) {\n      const reader = new FileReader();\n      reader.onloadend = () => setPreview(reader.result as string);\n      reader.readAsDataURL(item);\n\n      return () => setPreview(null);\n    } else if (typeof item === 'string') {\n      img = new Image();\n      img.src = item;\n      img.onload = () => setPreview(item);\n      img.onerror = () => setPreview(null);\n\n      return () => {\n        img!.onload = null;\n        img!.onerror = null;\n      };\n    } else {\n      setPreview(null);\n    }\n\n    return () => setPreview(null);\n  }, [item, isFileTypeImage]);\n\n  return (\n    <div\n      className={cn(\n        'w-32 h-32 border border-gray-300 rounded-md overflow-hidden flex items-center justify-center',\n        styles?.previewWraper\n      )}\n    >\n      {preview ? (\n        <img\n          src={preview}\n          alt={isFile(item) ? item.name : 'external-image'}\n          className={cn('w-full h-full object-cover', styles?.previewImage)}\n        />\n      ) : (\n        <div\n          className={cn(\n            'flex flex-col items-center justify-center text-gray-500 text-sm p-2 text-center',\n            styles?.previewFile\n          )}\n        >\n          <FileIcon className=\"w-6 h-6\" />\n          {!isFile(item) ? (\n            <span className=\"text-xs break-all\">{item}</span>\n          ) : (\n            <span className=\"text-xs break-all\">{item.name}</span>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["FilePreview","item","styles","preview","setPreview","useState","isFileTypeImage","isFile","DEFAULT_IMAGES_TYPES","useEffect","img","reader","jsx","cn","jsxs","FileIcon"],"mappings":";;;;;;AAMO,MAAMA,IAAoC,CAAC,EAAE,MAAAC,GAAM,QAAAC,QAAa;AACrE,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAwB,IAAI,GAEpDC,IACJC,EAAON,CAAI,KAAKO,EAAqB,SAASP,EAAK,IAAI;AAEzD,SAAAQ,EAAU,MAAM;AACd,QAAIC,IAA+B;AAEnC,QAAIH,EAAON,CAAI,KAAKK,GAAiB;AACnC,YAAMK,IAAS,IAAI,WAAA;AACnB,aAAAA,EAAO,YAAY,MAAMP,EAAWO,EAAO,MAAgB,GAC3DA,EAAO,cAAcV,CAAI,GAElB,MAAMG,EAAW,IAAI;AAAA,IAC9B,OAAA;AAAA,UAAW,OAAOH,KAAS;AACzB,eAAAS,IAAM,IAAI,MAAA,GACVA,EAAI,MAAMT,GACVS,EAAI,SAAS,MAAMN,EAAWH,CAAI,GAClCS,EAAI,UAAU,MAAMN,EAAW,IAAI,GAE5B,MAAM;AACX,UAAAM,EAAK,SAAS,MACdA,EAAK,UAAU;AAAA,QACjB;AAEA,MAAAN,EAAW,IAAI;AAAA;AAGjB,WAAO,MAAMA,EAAW,IAAI;AAAA,EAC9B,GAAG,CAACH,GAAMK,CAAe,CAAC,GAGxB,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAX,GAAQ;AAAA,MAAA;AAAA,MAGT,UAAAC,IACC,gBAAAS;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKT;AAAA,UACL,KAAKI,EAAON,CAAI,IAAIA,EAAK,OAAO;AAAA,UAChC,WAAWY,EAAG,8BAA8BX,GAAQ,YAAY;AAAA,QAAA;AAAA,MAAA,IAGlE,gBAAAY;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWD;AAAA,YACT;AAAA,YACAX,GAAQ;AAAA,UAAA;AAAA,UAGV,UAAA;AAAA,YAAA,gBAAAU,EAACG,GAAA,EAAS,WAAU,UAAA,CAAU;AAAA,YAC5BR,EAAON,CAAI,IAGX,gBAAAW,EAAC,QAAA,EAAK,WAAU,qBAAqB,YAAK,KAAA,CAAK,sBAF9C,QAAA,EAAK,WAAU,qBAAqB,UAAAX,EAAA,CAAK;AAAA,UAEK;AAAA,QAAA;AAAA,MAAA;AAAA,IAEnD;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"DropzoneFilePreview.js","sources":["../../src/Dropzone/DropzoneFilePreview.tsx"],"sourcesContent":["import { FC, useEffect, useState } from 'react';\r\nimport { File as FileIcon } from 'lucide-react';\r\nimport { DEFAULT_IMAGES_TYPES, FilePreviewProps } from './Dropzone.types';\r\nimport { isFile } from './DropzoneUtils';\r\nimport { cn } from '@oneplatformdev/utils';\r\nimport { MediaPlayer, MediaProvider } from '@vidstack/react';\r\nimport { defaultLayoutIcons, DefaultVideoLayout } from '@vidstack/react/player/layouts/default';\r\n\r\nimport '@vidstack/react/player/styles/base.css';\r\nimport '@vidstack/react/player/styles/default/theme.css';\r\nimport '@vidstack/react/player/styles/default/layouts/video.css';\r\n\r\nexport const FilePreview: FC<FilePreviewProps> = ({ item, styles }) => {\r\n  const [preview, setPreview] = useState<string | null>(null);\r\n\r\n  const isFileTypeImage =\r\n    isFile(item) && DEFAULT_IMAGES_TYPES.includes(item.type);\r\n  const isFileTypeVideo = isFile(item) && item.type.includes('video');\r\n\r\n  useEffect(() => {\r\n    let img: HTMLImageElement | null = null;\r\n\r\n    if (isFile(item) && isFileTypeImage) {\r\n      const reader = new FileReader();\r\n      reader.onloadend = () => setPreview(reader.result as string);\r\n      reader.readAsDataURL(item);\r\n\r\n      return () => setPreview(null);\r\n    } else if (typeof item === 'string') {\r\n      img = new Image();\r\n      img.src = item;\r\n      img.onload = () => setPreview(item);\r\n      img.onerror = () => setPreview(null);\r\n\r\n      return () => {\r\n        img!.onload = null;\r\n        img!.onerror = null;\r\n      };\r\n    } else if (isFile(item) && isFileTypeVideo) {\r\n      const objectUrl = URL.createObjectURL(item);\r\n      setPreview(objectUrl);\r\n      return () => URL.revokeObjectURL(objectUrl);\r\n    } else {\r\n      setPreview(null);\r\n    }\r\n\r\n    return () => setPreview(null);\r\n  }, [item, isFileTypeImage, isFileTypeVideo]);\r\n\r\n  return (\r\n    <div\r\n      className={cn(\r\n        'w-32 h-32 border border-gray-300 rounded-md overflow-hidden flex items-center justify-center',\r\n        styles?.previewWraper\r\n      )}\r\n    >\r\n      {preview && isFileTypeVideo ? (\r\n        <div className=\"w-full h-full bg-black\" onClick={(event) => event.stopPropagation()}>\r\n          <MediaPlayer\r\n            src={isFile(item) ? { src: preview, type: item.type } : preview}\r\n            className=\"h-full w-full bg-black text-white\"\r\n            playsInline\r\n          >\r\n            <MediaProvider />\r\n            <DefaultVideoLayout icons={defaultLayoutIcons} />\r\n          </MediaPlayer>\r\n        </div>\r\n      ) : preview ? (\r\n        <img\r\n          src={preview}\r\n          alt={isFile(item) ? item.name : 'external-image'}\r\n          className={cn('w-full h-full object-cover', styles?.previewImage)}\r\n        />\r\n      ) : (\r\n        <div\r\n          className={cn(\r\n            'flex flex-col items-center justify-center text-gray-500 text-sm p-2 text-center',\r\n            styles?.previewFile\r\n          )}\r\n        >\r\n          <FileIcon className=\"w-6 h-6\" />\r\n          {!isFile(item) ? (\r\n            <span className=\"text-xs break-all\">{item}</span>\r\n          ) : (\r\n            <span className=\"text-xs break-all\">{item.name}</span>\r\n          )}\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n};\r\n"],"names":["FilePreview","item","styles","preview","setPreview","useState","isFileTypeImage","isFile","DEFAULT_IMAGES_TYPES","isFileTypeVideo","useEffect","img","reader","objectUrl","jsx","cn","event","jsxs","MediaPlayer","MediaProvider","DefaultVideoLayout","defaultLayoutIcons","FileIcon"],"mappings":";;;;;;;;;;;AAYO,MAAMA,IAAoC,CAAC,EAAE,MAAAC,GAAM,QAAAC,QAAa;AACrE,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAwB,IAAI,GAEpDC,IACJC,EAAON,CAAI,KAAKO,EAAqB,SAASP,EAAK,IAAI,GACnDQ,IAAkBF,EAAON,CAAI,KAAKA,EAAK,KAAK,SAAS,OAAO;AAElE,SAAAS,EAAU,MAAM;AACd,QAAIC,IAA+B;AAEnC,QAAIJ,EAAON,CAAI,KAAKK,GAAiB;AACnC,YAAMM,IAAS,IAAI,WAAA;AACnB,aAAAA,EAAO,YAAY,MAAMR,EAAWQ,EAAO,MAAgB,GAC3DA,EAAO,cAAcX,CAAI,GAElB,MAAMG,EAAW,IAAI;AAAA,IAC9B,OAAA;AAAA,UAAW,OAAOH,KAAS;AACzB,eAAAU,IAAM,IAAI,MAAA,GACVA,EAAI,MAAMV,GACVU,EAAI,SAAS,MAAMP,EAAWH,CAAI,GAClCU,EAAI,UAAU,MAAMP,EAAW,IAAI,GAE5B,MAAM;AACX,UAAAO,EAAK,SAAS,MACdA,EAAK,UAAU;AAAA,QACjB;AACF,UAAWJ,EAAON,CAAI,KAAKQ,GAAiB;AAC1C,cAAMI,IAAY,IAAI,gBAAgBZ,CAAI;AAC1C,eAAAG,EAAWS,CAAS,GACb,MAAM,IAAI,gBAAgBA,CAAS;AAAA,MAC5C;AACE,QAAAT,EAAW,IAAI;AAAA;AAGjB,WAAO,MAAMA,EAAW,IAAI;AAAA,EAC9B,GAAG,CAACH,GAAMK,GAAiBG,CAAe,CAAC,GAGzC,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAb,GAAQ;AAAA,MAAA;AAAA,MAGT,UAAAC,KAAWM,IACV,gBAAAK,EAAC,OAAA,EAAI,WAAU,0BAAyB,SAAS,CAACE,MAAUA,EAAM,gBAAA,GAChE,UAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,KAAKX,EAAON,CAAI,IAAI,EAAE,KAAKE,GAAS,MAAMF,EAAK,KAAA,IAASE;AAAA,UACxD,WAAU;AAAA,UACV,aAAW;AAAA,UAEX,UAAA;AAAA,YAAA,gBAAAW,EAACK,GAAA,EAAc;AAAA,YACf,gBAAAL,EAACM,GAAA,EAAmB,OAAOC,EAAA,CAAoB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,EACjD,CACF,IACElB,IACF,gBAAAW;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKX;AAAA,UACL,KAAKI,EAAON,CAAI,IAAIA,EAAK,OAAO;AAAA,UAChC,WAAWc,EAAG,8BAA8Bb,GAAQ,YAAY;AAAA,QAAA;AAAA,MAAA,IAGlE,gBAAAe;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF;AAAA,YACT;AAAA,YACAb,GAAQ;AAAA,UAAA;AAAA,UAGV,UAAA;AAAA,YAAA,gBAAAY,EAACQ,GAAA,EAAS,WAAU,UAAA,CAAU;AAAA,YAC5Bf,EAAON,CAAI,IAGX,gBAAAa,EAAC,QAAA,EAAK,WAAU,qBAAqB,YAAK,KAAA,CAAK,sBAF9C,QAAA,EAAK,WAAU,qBAAqB,UAAAb,EAAA,CAAK;AAAA,UAEK;AAAA,QAAA;AAAA,MAAA;AAAA,IAEnD;AAAA,EAAA;AAIR;"}

package/Dropzone/DropzoneSinglePickPreview.d.ts

@@ -3,8 +3,16 @@ export declare const transformImageToSrc: (preview?: string | File | null) => st
 interface SinglePickPreviewProps {
     item: DropzoneValueItem;
     disabled?: boolean;
-    onRemoveClick: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onRemoveClick: (e: React.MouseEvent<HTMLElement>) => void;
+    onReplaceClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    labelUploaded?: string;
+    labelReplace?: string;
+    fileInfo?: {
+        name?: string;
+        size?: number;
+    };
+    playerTranslations?: Partial<Record<string, string>>;
 }
-export declare const DropzoneSinglePickPreview: ({ item, disabled, onRemoveClick, }: SinglePickPreviewProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DropzoneSinglePickPreview: ({ item, disabled, onRemoveClick, onReplaceClick, labelReplace, fileInfo, playerTranslations, }: SinglePickPreviewProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=DropzoneSinglePickPreview.d.ts.map

package/Dropzone/DropzoneSinglePickPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropzoneSinglePickPreview.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneSinglePickPreview.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAIrD,eAAO,MAAM,mBAAmB,GAAI,UAAU,MAAM,GAAG,IAAI,GAAG,IAAI,KAAG,MAYpE,CAAC;AAEF,UAAU,sBAAsB;IAC9B,IAAI,EAAE,iBAAiB,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC9D;AAED,eAAO,MAAM,yBAAyB,GAAI,oCAIvC,sBAAsB,4CAkCxB,CAAC"}
+{"version":3,"file":"DropzoneSinglePickPreview.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneSinglePickPreview.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAOrD,OAAO,wCAAwC,CAAC;AAChD,OAAO,iDAAiD,CAAC;AACzD,OAAO,yDAAyD,CAAC;AACjE,OAAO,iCAAiC,CAAC;AAgBzC,eAAO,MAAM,mBAAmB,GAAI,UAAU,MAAM,GAAG,IAAI,GAAG,IAAI,KAAG,MAYpE,CAAC;AAqCF,UAAU,sBAAsB;IAC9B,IAAI,EAAE,iBAAiB,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC1D,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAClE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5C,kBAAkB,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;CACtD;AAED,eAAO,MAAM,yBAAyB,GAAI,gGAQvC,sBAAsB,4CAsNxB,CAAC"}