@hai-dev/ui-kit 1.1.2 → 1.1.5

package/dist/components/photo-crop-uploader/components/upload-button/types.d.ts

@@ -13,6 +13,7 @@ type UploadButtonCustonProps = {
     onDragLeave?: (event: DragEvent<HTMLDivElement>) => unknown;
     onDragDrop?: (event: DragEvent<HTMLDivElement>) => unknown;
     button?: ReactNode;
+    withVideoUploaded?: boolean;
 };
 export type UploadButtonProps = InputHTMLAttributes<HTMLInputElement> & UploadButtonCustonProps;
 export {};

package/dist/components/photo-crop-uploader/components/upload-button/upload-button.js

@@ -1,113 +1,114 @@
-import { jsx as n, jsxs as v, Fragment as b } from "react/jsx-runtime";
-import { useState as k, useRef as R } from "react";
-import { c as a } from "../../../../index-B2JRaoNz.js";
-import { localizedText as x } from "../../locale.js";
-import { EN_LOCALE as V } from "../../../../constants.js";
-import { SUPPORTED_IMAGE_EXTENSIONS as y } from "../../constants.js";
-import { UPLOAD_BUTTON_WIDTH_DEFAULT as W, UPLOAD_BUTTON_TAB_INDEX as j, UPLOAD_BUTTON_IMAGE_SIZE as T } from "./constants.js";
-import { B as H } from "../../../../Button-CcvrOEKV.js";
-import '../../../../assets/upload-button.css';const M = "data:image/svg+xml,%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Transformed%20by:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%201024%201024'%20xmlns='http://www.w3.org/2000/svg'%20fill='%23000000'%3e%3cg%20id='SVGRepo_bgCarrier'%20stroke-width='0'/%3e%3cg%20id='SVGRepo_tracerCarrier'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cg%20id='SVGRepo_iconCarrier'%3e%3cpath%20fill='%23ffffff'%20d='M544%20864V672h128L512%20480%20352%20672h128v192H320v-1.6c-5.376.32-10.496%201.6-16%201.6A240%20240%200%200%201%2064%20624c0-123.136%2093.12-223.488%20212.608-237.248A239.808%20239.808%200%200%201%20512%20192a239.872%20239.872%200%200%201%20235.456%20194.752c119.488%2013.76%20212.48%20114.112%20212.48%20237.248a240%20240%200%200%201-240%20240c-5.376%200-10.56-1.28-16-1.6v1.6H544z'/%3e%3c/g%3e%3c/svg%3e", F = "_dragDropWrapper_cgx9x_1", z = "_input_cgx9x_4", i = {
-  dragDropWrapper: F,
-  input: z
-}, ee = (w) => {
+import { jsx as r, jsxs as E, Fragment as k } from "react/jsx-runtime";
+import { useState as R, useRef as W } from "react";
+import { c as n } from "../../../../index-B2JRaoNz.js";
+import { localizedText as T } from "../../locale.js";
+import { EN_LOCALE as y } from "../../../../constants.js";
+import { SUPPORTED_IMAGE_EXTENSIONS as M, MP4_VIDEO_EXT as j, WEBM_VIDEO_EXT as H } from "../../constants.js";
+import { UPLOAD_BUTTON_WIDTH_DEFAULT as X, UPLOAD_BUTTON_TAB_INDEX as F, UPLOAD_BUTTON_IMAGE_SIZE as x } from "./constants.js";
+import { B as z } from "../../../../Button-CcvrOEKV.js";
+import '../../../../assets/upload-button.css';const Y = "data:image/svg+xml,%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Transformed%20by:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%201024%201024'%20xmlns='http://www.w3.org/2000/svg'%20fill='%23000000'%3e%3cg%20id='SVGRepo_bgCarrier'%20stroke-width='0'/%3e%3cg%20id='SVGRepo_tracerCarrier'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cg%20id='SVGRepo_iconCarrier'%3e%3cpath%20fill='%23ffffff'%20d='M544%20864V672h128L512%20480%20352%20672h128v192H320v-1.6c-5.376.32-10.496%201.6-16%201.6A240%20240%200%200%201%2064%20624c0-123.136%2093.12-223.488%20212.608-237.248A239.808%20239.808%200%200%201%20512%20192a239.872%20239.872%200%200%201%20235.456%20194.752c119.488%2013.76%20212.48%20114.112%20212.48%20237.248a240%20240%200%200%201-240%20240c-5.376%200-10.56-1.28-16-1.6v1.6H544z'/%3e%3c/g%3e%3c/svg%3e", Z = "_dragDropWrapper_cgx9x_1", q = "_input_cgx9x_4", a = {
+  dragDropWrapper: Z,
+  input: q
+}, ne = (w) => {
   const {
-    buttonClassname: C,
-    buttonDisabled: r = !1,
-    children: E,
+    buttonClassname: O,
+    buttonDisabled: o = !1,
+    children: C,
     className: p,
-    onChange: o,
-    locale: g = V,
-    width: O = W,
-    allowedExtensions: d = y,
+    onChange: c,
+    locale: d = y,
+    width: I = X,
+    allowedExtensions: g = M,
     onDragOver: N = () => {
     },
-    onDragLeave: S = () => {
+    onDragLeave: P = () => {
     },
-    onDragDrop: I = () => {
+    onDragDrop: S = () => {
     },
-    button: s,
+    button: i,
     multiple: f,
     onPhotoDataLoaded: L = () => {
     },
     fromSources: t,
+    withVideoUploaded: U = !1,
     ...u
-  } = w, [P, l] = k(!1), c = R(null), h = (e) => {
-    r || e && e.length > 0 && o && o({
+  } = w, [B, s] = R(!1), l = W(null), h = U ? [...g, j, H] : g, D = (e) => {
+    o || e && e.length > 0 && c && c({
       target: {
         files: e,
         value: ""
       }
     });
-  }, U = (e) => {
-    t?.length || (e.preventDefault(), e.stopPropagation(), N(e), r || l(!0));
+  }, V = (e) => {
+    t?.length || (e.preventDefault(), e.stopPropagation(), N(e), o || s(!0));
   }, A = (e) => {
-    t?.length || (e.preventDefault(), e.stopPropagation(), S(e), l(!1));
-  }, B = (e) => {
-    if (t?.length || (e.preventDefault(), e.stopPropagation(), I(e), l(!1), r)) return;
-    const _ = e.dataTransfer?.files;
-    h(_);
-  }, G = () => {
-    t?.length ? L(t) : s && c.current?.click();
-  }, D = (e) => {
-    t?.length && e.preventDefault();
+    t?.length || (e.preventDefault(), e.stopPropagation(), P(e), s(!1));
+  }, G = (e) => {
+    if (t?.length || (e.preventDefault(), e.stopPropagation(), S(e), s(!1), o)) return;
+    const v = e.dataTransfer?.files;
+    D(v);
+  }, b = () => {
+    t?.length ? L(t) : i && l.current?.click();
   }, m = (e) => {
-    h(e.target.files), o && o(e);
+    t?.length && e.preventDefault();
+  }, _ = (e) => {
+    D(e.target.files), e.target.value = "";
   };
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ r(
     "div",
     {
-      className: a(i.dragDropWrapper),
-      onDragOver: U,
+      className: n(a.dragDropWrapper),
+      onDragOver: V,
       onDragLeave: A,
-      onDrop: B,
-      onClick: G,
-      children: s ? /* @__PURE__ */ v(b, { children: [
-        s,
-        /* @__PURE__ */ n(
+      onDrop: G,
+      onClick: b,
+      children: i ? /* @__PURE__ */ E(k, { children: [
+        i,
+        /* @__PURE__ */ r(
           "input",
           {
-            onClick: D,
-            ref: c,
-            className: a(i.input, p),
+            onClick: m,
+            ref: l,
+            className: n(a.input, p),
             type: "file",
-            accept: d.join(", "),
-            onChange: m,
+            accept: h.join(", "),
+            onChange: _,
             multiple: f,
             ...u
           }
         )
-      ] }) : /* @__PURE__ */ v(
-        H,
+      ] }) : /* @__PURE__ */ E(
+        z,
         {
           component: "label",
           sx: {
-            width: O
+            width: I
           },
           role: "none",
           variant: "contained",
-          disabled: r,
-          tabIndex: j,
-          className: a(i.uploadButton, C),
-          startIcon: /* @__PURE__ */ n(
+          disabled: o,
+          tabIndex: F,
+          className: n(a.uploadButton, O),
+          startIcon: /* @__PURE__ */ r(
             "img",
             {
-              width: T,
-              height: T,
-              src: M,
-              alt: x[g].upload
+              width: x,
+              height: x,
+              src: Y,
+              alt: T[d].upload
             }
           ),
           children: [
-            P ? x[g].drop : E,
-            /* @__PURE__ */ n(
+            B ? T[d].drop : C,
+            /* @__PURE__ */ r(
               "input",
               {
-                onClick: D,
-                ref: c,
-                className: a(i.input, p),
+                onClick: m,
+                ref: l,
+                className: n(a.input, p),
                 type: "file",
-                accept: d.join(", "),
-                onChange: m,
+                accept: h.join(", "),
+                onChange: _,
                 multiple: f,
                 ...u
               }
@@ -119,5 +120,5 @@ import '../../../../assets/upload-button.css';const M = "data:image/svg+xml,%3c!
   );
 };
 export {
-  ee as UploadButton
+  ne as UploadButton
 };

package/dist/components/photo-crop-uploader/components/upload-dialog/upload-dialog.js

@@ -22,7 +22,7 @@ import { Button as E } from "../../../button/button.js";
 import '../../../../assets/upload-dialog.css';function io(o) {
   return Q("MuiIconButton", o);
 }
-const U = K("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorError", "colorInfo", "colorSuccess", "colorWarning", "edgeStart", "edgeEnd", "sizeSmall", "sizeMedium", "sizeLarge", "loading", "loadingIndicator", "loadingWrapper"]), so = (o) => {
+const U = K("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorError", "colorInfo", "colorSuccess", "colorWarning", "edgeStart", "edgeEnd", "sizeSmall", "sizeMedium", "sizeLarge", "loading", "loadingIndicator", "loadingWrapper"]), lo = (o) => {
   const {
     classes: e,
     disabled: r,
@@ -36,7 +36,7 @@ const U = K("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary"
     loadingWrapper: ["loadingWrapper"]
   };
   return eo(u, io, e);
-}, lo = W(ro, {
+}, so = W(ro, {
   name: "MuiIconButton",
   slot: "Root",
   overridesResolver: (o, e) => {
@@ -182,9 +182,9 @@ const U = K("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary"
     disableFocusRipple: I = !1,
     size: z = "medium",
     id: v,
-    loading: l = null,
+    loading: s = null,
     loadingIndicator: R,
-    ...s
+    ...l
   } = c, N = ao(v), B = R ?? /* @__PURE__ */ a(no, {
     "aria-labelledby": N,
     color: "inherit",
@@ -195,20 +195,20 @@ const U = K("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary"
     color: u,
     disabled: y,
     disableFocusRipple: I,
-    loading: l,
+    loading: s,
     loadingIndicator: B,
     size: z
-  }, d = so(h);
-  return /* @__PURE__ */ L(lo, {
-    id: l ? N : v,
+  }, d = lo(h);
+  return /* @__PURE__ */ L(so, {
+    id: s ? N : v,
     className: X(d.root, b),
     centerRipple: !0,
     focusRipple: !I,
-    disabled: y || l,
+    disabled: y || s,
     ref: r,
-    ...s,
+    ...l,
     ownerState: h,
-    children: [typeof l == "boolean" && // use plain HTML span to minimize the runtime overhead
+    children: [typeof s == "boolean" && // use plain HTML span to minimize the runtime overhead
     /* @__PURE__ */ a("span", {
       className: d.loadingWrapper,
       style: {
@@ -217,7 +217,7 @@ const U = K("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary"
       children: /* @__PURE__ */ a(co, {
         className: d.loadingIndicator,
         ownerState: h,
-        children: l && B
+        children: s && B
       })
     }), f]
   });
@@ -315,9 +315,9 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
     onNextPhoto: I,
     onSkipCrop: z,
     onClearErrors: v,
-    minDimension: l = Y,
+    minDimension: s = Y,
     aspectRatio: R = q,
-    locale: s = Z,
+    locale: l = Z,
     circular: N,
     keepSelection: B = !0,
     photoSourceLoading: h,
@@ -327,7 +327,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
     errors: k,
     ...x
   } = o, S = r.slice(C).length > 1;
-  return h ? /* @__PURE__ */ a(
+  return h || !r.length ? /* @__PURE__ */ a(
     T,
     {
       className: i(n.dialog, d),
@@ -344,7 +344,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
       children: /* @__PURE__ */ a(
         V,
         {
-          locale: s,
+          locale: l,
           photoSources: r,
           errors: k,
           onCloseDialogHandler: e,
@@ -364,7 +364,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
           {
             onClick: e,
             className: i(n.close),
-            "aria-label": p[s].back,
+            "aria-label": p[l].back,
             children: /* @__PURE__ */ a(
               "img",
               {
@@ -372,12 +372,12 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
                 width: w,
                 height: w,
                 src: po,
-                alt: p[s].back
+                alt: p[l].back
               }
             )
           }
         ) }),
-        /* @__PURE__ */ a(G, { className: i(n.title), children: p[s]["photo-crop"] }),
+        /* @__PURE__ */ a(G, { className: i(n.title), children: p[l]["photo-crop"] }),
         /* @__PURE__ */ L(D, { className: i(n.content, S && n.many), children: [
           S && /* @__PURE__ */ a("span", {}),
           !!r.length && /* @__PURE__ */ a(
@@ -388,8 +388,8 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
               circularCrop: N,
               keepSelection: B,
               aspect: R,
-              minWidth: l,
-              minHeight: l,
+              minWidth: s,
+              minHeight: s,
               onChange: g,
               children: /* @__PURE__ */ a(
                 "img",
@@ -397,7 +397,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
                   onLoad: f,
                   src: r[C],
                   ref: b,
-                  alt: p[s]["photo-crop"],
+                  alt: p[l]["photo-crop"],
                   draggable: !1
                 },
                 C
@@ -417,7 +417,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
               buttonWeight: 500,
               className: i(n.button),
               onClick: z,
-              children: p[s].skip
+              children: p[l].skip
             }
           ),
           /* @__PURE__ */ a(
@@ -429,7 +429,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
               buttonWeight: 500,
               className: i(n.button),
               onClick: I,
-              children: p[s].continue
+              children: p[l].continue
             }
           )
         ] }) : /* @__PURE__ */ a(
@@ -442,7 +442,7 @@ const po = "data:image/svg+xml,%3csvg%20width='46'%20height='46'%20viewBox='0%20
             buttonWeight: 500,
             className: i(n.button),
             onClick: y,
-            children: p[s].crop
+            children: p[l].crop
           }
         ) })
       ]

package/dist/components/photo-crop-uploader/constants.d.ts

@@ -18,6 +18,10 @@ export declare const GIF_IMAGE_TYPE = "image/gif";
 export declare const WEBP_IMAGE_TYPE = "image/webp";
 export declare const ICO_IMAGE_TYPE = "image/x-icon";
 export declare const MICROSOFT_ICO_IMAGE_TYPE = "image/vnd.microsoft.icon";
+export declare const MP4_VIDEO_EXT = ".mp4";
+export declare const WEBM_VIDEO_EXT = ".webm";
+export declare const MP4_VIDEO_TYPE = "video/mp4";
+export declare const WEBM_VIDEO_TYPE = "video/webm";
 export declare const SUPPORTED_IMAGE_MIME_TYPES: string[];
 export declare const MIME_TO_EXT: {
     JPEG_IMAGE_TYPE: string[];

package/dist/components/photo-crop-uploader/constants.js

@@ -1,14 +1,14 @@
 import { BYTE_TO_KILOBYTE as I } from "../../constants.js";
-const m = 1, L = 670, _ = ".jpg", E = ".jpeg", A = ".png", P = ".svg", G = ".bmp", M = ".gif", T = ".ico", o = ".webp", C = [
-  _,
+const N = 1, e = 670, E = ".jpg", _ = ".jpeg", P = ".png", o = ".svg", M = ".bmp", A = ".gif", T = ".ico", G = ".webp", D = [
   E,
-  A,
+  _,
   P,
-  G,
-  M,
   o,
+  M,
+  A,
+  G,
   T
-], n = "image/jpg", c = "image/jpeg", s = "image/png", t = "image/svg+xml", O = "image/bmp", Y = "image/gif", S = "image/webp", g = "image/x-icon", N = "image/vnd.microsoft.icon", U = [
+], n = "image/jpg", c = "image/jpeg", s = "image/png", t = "image/svg+xml", O = "image/bmp", Y = "image/gif", S = "image/webp", m = "image/x-icon", g = "image/vnd.microsoft.icon", L = ".mp4", X = ".webm", p = "video/mp4", C = "video/webm", U = [
   n,
   c,
   s,
@@ -16,55 +16,59 @@ const m = 1, L = 670, _ = ".jpg", E = ".jpeg", A = ".png", P = ".svg", G = ".bmp
   O,
   Y,
   S,
-  g,
-  N
-], e = {
-  JPEG_IMAGE_TYPE: [_, E],
-  JPG_IMAGE_TYPE: [_, E],
-  PNG_IMAGE_TYPE: [A],
-  GIF_IMAGE_TYPE: [M],
-  SVG_IMAGE_TYPE: [P],
-  BMP_IMAGE_TYPE: [G],
-  WEBP_IMAGE_TYPE: [o],
+  m,
+  g
+], F = {
+  JPEG_IMAGE_TYPE: [E, _],
+  JPG_IMAGE_TYPE: [E, _],
+  PNG_IMAGE_TYPE: [P],
+  GIF_IMAGE_TYPE: [A],
+  SVG_IMAGE_TYPE: [o],
+  BMP_IMAGE_TYPE: [M],
+  WEBP_IMAGE_TYPE: [G],
   ICO_IMAGE_TYPE: [T],
   MICROSOFT_ICO_IMAGE_TYPE: [T]
-}, X = 500, p = 5 * I * I, F = "2d", R = "high", D = "%", B = "px", a = "ms", J = "mb", b = 1, V = 100, f = 2, j = 0.5, r = 100, x = 100, H = 500;
+}, R = 500, B = 5 * I * I, a = "2d", V = "high", b = "%", J = "px", v = "ms", W = "mb", d = 1, f = 100, j = 2, r = 0.5, w = 100, x = 100, H = 500;
 export {
-  G as BMP_IMAGE_EXT,
+  M as BMP_IMAGE_EXT,
   O as BMP_IMAGE_TYPE,
-  m as DEFAULT_ASPECT_RATIO,
-  p as DEFAULT_FILE_MAX_SIZE,
-  L as DEFAULT_MIN_DIMENSION,
-  X as DEFAULT_TIMEOUT,
-  V as FULL_CROP_SIZE,
-  r as FULL_PROGRESS_VALUE,
-  M as GIF_IMAGE_EXT,
+  N as DEFAULT_ASPECT_RATIO,
+  B as DEFAULT_FILE_MAX_SIZE,
+  e as DEFAULT_MIN_DIMENSION,
+  R as DEFAULT_TIMEOUT,
+  f as FULL_CROP_SIZE,
+  w as FULL_PROGRESS_VALUE,
+  A as GIF_IMAGE_EXT,
   Y as GIF_IMAGE_TYPE,
   T as ICO_IMAGE_EXT,
-  g as ICO_IMAGE_TYPE,
-  E as JPEG_IMAGE_EXT,
+  m as ICO_IMAGE_TYPE,
+  _ as JPEG_IMAGE_EXT,
   c as JPEG_IMAGE_TYPE,
-  _ as JPG_IMAGE_EXT,
+  E as JPG_IMAGE_EXT,
   n as JPG_IMAGE_TYPE,
-  f as MAX_ASPECT_RATIO,
-  b as MB_FRACTION_DIGITS,
-  J as MB_UNIT,
-  N as MICROSOFT_ICO_IMAGE_TYPE,
-  e as MIME_TO_EXT,
-  j as MIN_ASPECT_RATIO,
-  a as MS_UNIT,
-  F as PHOTO_CANVAS_CONTEXT,
+  j as MAX_ASPECT_RATIO,
+  d as MB_FRACTION_DIGITS,
+  W as MB_UNIT,
+  g as MICROSOFT_ICO_IMAGE_TYPE,
+  F as MIME_TO_EXT,
+  r as MIN_ASPECT_RATIO,
+  L as MP4_VIDEO_EXT,
+  p as MP4_VIDEO_TYPE,
+  v as MS_UNIT,
+  a as PHOTO_CANVAS_CONTEXT,
   x as PHOTO_LOADING_DELAY,
-  R as PHOTO_SMOOTHING_QUALITY,
-  B as PIXEL_UNIT,
-  A as PNG_IMAGE_EXT,
+  V as PHOTO_SMOOTHING_QUALITY,
+  J as PIXEL_UNIT,
+  P as PNG_IMAGE_EXT,
   s as PNG_IMAGE_TYPE,
-  D as PRECENT_UNIT,
+  b as PRECENT_UNIT,
   H as RESET_DATA_DELAY,
-  C as SUPPORTED_IMAGE_EXTENSIONS,
+  D as SUPPORTED_IMAGE_EXTENSIONS,
   U as SUPPORTED_IMAGE_MIME_TYPES,
-  P as SVG_IMAGE_EXT,
+  o as SVG_IMAGE_EXT,
   t as SVG_IMAGE_TYPE,
-  o as WEBP_IMAGE_EXT,
+  X as WEBM_VIDEO_EXT,
+  C as WEBM_VIDEO_TYPE,
+  G as WEBP_IMAGE_EXT,
   S as WEBP_IMAGE_TYPE
 };

package/dist/components/photo-crop-uploader/photo-crop-uploader.js

@@ -1,263 +1,295 @@
-import { jsxs as To, Fragment as wo, jsx as P } from "react/jsx-runtime";
-import { useState as a, useRef as j } from "react";
-import { D as Ao } from "../../index-BiffjjQq.js";
-import { c as Uo } from "../../index-B2JRaoNz.js";
-import { localizedText as xo } from "./locale.js";
-import { EN_LOCALE as yo } from "../../constants.js";
-import { DEFAULT_MIN_DIMENSION as Oo, DEFAULT_ASPECT_RATIO as Io, DEFAULT_TIMEOUT as vo, DEFAULT_FILE_MAX_SIZE as Fo, FULL_PROGRESS_VALUE as B, PHOTO_LOADING_DELAY as Mo, RESET_DATA_DELAY as D } from "./constants.js";
-import { UploadDialog as No } from "./components/upload-dialog/upload-dialog.js";
-import { UploadButton as Ro } from "./components/upload-button/upload-button.js";
-import { ErrorUploadDialog as Ho } from "./components/error-upload-dialog/error-upload-dialog.js";
-import { validatePhotoFile as G } from "./utils/validate-photo-file.js";
-import { readPhoto as Y } from "./utils/read-photo.js";
-import { getPhotoCrop as bo } from "./utils/get-photo-crop.js";
-import { getCroppedSource as ko } from "./utils/get-cropped-source.js";
-import { getDefaultCroppedPhoto as X } from "./utils/get-default-cropped-photo.js";
-import '../../assets/photo-crop-uploader.css';const zo = "_photoCropCanvas_1i4lr_1", Vo = {
-  photoCropCanvas: zo
+import { jsxs as yo, Fragment as Io, jsx as _ } from "react/jsx-runtime";
+import { useState as i, useRef as w } from "react";
+import { D as Fo } from "../../index-BiffjjQq.js";
+import { c as No } from "../../index-B2JRaoNz.js";
+import { localizedText as Mo } from "./locale.js";
+import { EN_LOCALE as bo } from "../../constants.js";
+import { DEFAULT_MIN_DIMENSION as Ho, DEFAULT_ASPECT_RATIO as Vo, DEFAULT_TIMEOUT as ko, DEFAULT_FILE_MAX_SIZE as jo, FULL_PROGRESS_VALUE as K, PHOTO_LOADING_DELAY as zo, RESET_DATA_DELAY as m } from "./constants.js";
+import { UploadDialog as Wo } from "./components/upload-dialog/upload-dialog.js";
+import { UploadButton as Bo } from "./components/upload-button/upload-button.js";
+import { ErrorUploadDialog as Go } from "./components/error-upload-dialog/error-upload-dialog.js";
+import { isVideo as Q } from "./utils/is-video.js";
+import { validatePhotoFile as $ } from "./utils/validate-photo-file.js";
+import { readPhoto as oo } from "./utils/read-photo.js";
+import { getPhotoCrop as Yo } from "./utils/get-photo-crop.js";
+import { getCroppedSource as Xo } from "./utils/get-cropped-source.js";
+import { getDefaultCroppedPhoto as eo } from "./utils/get-default-cropped-photo.js";
+import '../../assets/photo-crop-uploader.css';const Zo = "_photoCropCanvas_1i4lr_1", qo = {
+  photoCropCanvas: Zo
 };
-function nr(n) {
+function me(a) {
   const {
-    buttonClassname: Z = "",
-    onStartUpload: q = () => {
+    buttonClassname: ro = "",
+    onStartUpload: to = () => {
     },
-    onEndUpload: J = () => {
+    onEndUpload: so = () => {
     },
-    onError: K = () => {
+    onError: no = () => {
     },
-    onStartCrop: Q = () => {
+    onStartCrop: ao = () => {
     },
-    onDragOver: $ = () => {
+    onDragOver: io = () => {
     },
-    onDragLeave: oo = () => {
+    onDragLeave: co = () => {
     },
-    onDragDrop: ro = () => {
+    onDragDrop: lo = () => {
     },
-    showErrorPopup: to = !1,
-    minDimension: l = Oo,
-    aspectRatio: h = Io,
-    locale: s = yo,
-    timeout: O = vo,
-    fileMaxSize: I = Fo,
-    allowedExtensions: S,
-    allowedMimeTypes: v,
-    circular: eo,
-    width: so,
-    keepSelection: no,
-    uploadButton: ao,
-    multiple: m = !1,
-    fromSources: F,
-    returnCropParams: lo = !1,
-    ...io
-  } = n, {
-    onEndCrop: Wo,
-    onClose: jo,
-    ...co
-  } = io, [po, d] = a(!1), [f, C] = a([]), [L, _] = a([]), [p, M] = a(0), N = j(null), R = j(null), [i, T] = a(!1), [fo, H] = a(0), [b, k] = a(""), [uo, g] = a([]), [ho, z] = a(!1), mo = po || i && m, Co = () => {
-    g([]);
-  }, w = (o = []) => {
-    i || (n.returnCropParams === !0 && n.onClose?.(o, f), d(!1), setTimeout(() => g([]), D), setTimeout(() => C([]), D));
-  }, A = (o = []) => {
-    i || (n.returnCropParams !== !0 && n.onClose?.(o, f), d(!1), setTimeout(() => g([]), D), setTimeout(() => C([]), D));
-  }, go = () => {
-    i || (n.returnCropParams === !0 ? w([]) : A([]));
-  }, Eo = () => {
-    z(!1);
-  }, U = (o) => {
-    J(o), C(o), _(Array(o.length)), M(0), d(!0), k("");
-  }, x = (o) => {
-    o instanceof Error && (console.warn(o.message), K(o), k(o.message), z(!0), C([]), d(!1));
-  }, Po = async (o) => {
-    const { files: t } = o.target;
-    if (t?.length && !i)
+    showErrorPopup: po = !1,
+    minDimension: c = Ho,
+    aspectRatio: C = Vo,
+    locale: s = bo,
+    timeout: N = ko,
+    fileMaxSize: M = jo,
+    allowedExtensions: U,
+    allowedMimeTypes: b,
+    circular: uo,
+    width: fo,
+    keepSelection: ho,
+    uploadButton: mo,
+    multiple: g = !1,
+    fromSources: H,
+    withVideoUploaded: A = !1,
+    returnCropParams: Co = !1,
+    dialogClassname: V,
+    ...go
+  } = a, {
+    onEndCrop: Jo,
+    onClose: Ko,
+    ...Eo
+  } = go, [Po, E] = i(!1), [P, D] = i([]), [x, v] = i([]), f = w([]), h = w([]), [p, k] = i(0), j = w(null), z = w(null), [l, O] = i(!1), [Do, W] = i(0), [B, G] = i(""), [So, S] = i([]), [Lo, Y] = i(!1), To = Po || l && g, _o = () => {
+    S([]);
+  }, R = (o = []) => {
+    l || (a.returnCropParams === !0 && a.onClose?.(
+      o,
+      f.current,
+      h.current
+    ), E(!1), setTimeout(() => S([]), m), setTimeout(() => D([]), m), setTimeout(() => {
+      f.current = [], h.current = [];
+    }, m));
+  }, y = (o = []) => {
+    l || (a.returnCropParams || a.onClose?.(
+      o,
+      f.current,
+      h.current
+    ), E(!1), setTimeout(() => S([]), m), setTimeout(() => D([]), m), setTimeout(() => {
+      f.current = [], h.current = [];
+    }, m));
+  }, X = () => {
+    l || (a.returnCropParams === !0 ? R([]) : y([]));
+  }, wo = () => {
+    Y(!1);
+  }, L = (o, r = o, e = []) => {
+    so(o), G(""), D(o), v(Array(o.length)), k(0), E(!0), f.current = r, h.current = e, o.length || X();
+  }, I = (o) => {
+    o instanceof Error && (console.warn(o.message), no(o), G(o.message), Y(!0), D([]), E(!1), f.current = [], h.current = []);
+  }, Uo = async (o) => {
+    const { files: r } = o.target;
+    if (r?.length && !l)
       try {
-        if (T(!0), q(), m) {
-          const r = Array.from(t), e = B / r.length, E = [], u = [];
-          for (const y of r) {
+        if (O(!0), to(), g) {
+          const e = Array.from(r), t = K / e.length, T = [], u = [], q = [], F = [];
+          for (const d of e) {
+            const Ro = Q(d);
             try {
-              G(
-                y,
-                {
-                  maxSize: I,
-                  allowedExtensions: S,
-                  allowedMimeTypes: v
-                },
-                s
-              );
-              const c = await Y(y, l, s, O);
-              E.push(c);
-            } catch (c) {
-              let W = "";
-              c instanceof Error && (W = c.message), u.push({
-                photoName: y.name,
-                errorMessage: W
+              if (A && Ro) {
+                const n = URL.createObjectURL(d);
+                q.push(u.length), u.push(n);
+              } else {
+                $(
+                  d,
+                  {
+                    maxSize: M,
+                    allowedExtensions: U,
+                    allowedMimeTypes: b
+                  },
+                  s
+                );
+                const n = await oo(
+                  d,
+                  c,
+                  s,
+                  N
+                );
+                T.push(n), u.push(n);
+              }
+            } catch (n) {
+              let J = "";
+              n instanceof Error && (J = n.message), F.push({
+                photoName: d.name,
+                errorMessage: J
               });
             }
-            H(
-              (c) => Math.min(B, c + e)
-            ), await new Promise((c) => setTimeout(c, 0));
+            W(
+              (n) => Math.min(K, n + t)
+            ), await new Promise((n) => setTimeout(n, 0));
           }
-          if (F?.length)
-            throw new Error(u[0]?.errorMessage);
-          g(u), U(E);
+          if (H?.length)
+            throw new Error(F[0]?.errorMessage);
+          S(F), L(T, u, q);
         } else {
-          const r = t[0];
-          G(
-            r,
-            { maxSize: I, allowedExtensions: S, allowedMimeTypes: v },
-            s
-          );
-          const e = await Y(r, l, s, O);
-          U([e]);
+          const e = r[0];
+          if (A && Q(e)) {
+            const t = URL.createObjectURL(e);
+            L([], [t], [0]);
+          } else {
+            $(
+              e,
+              { maxSize: M, allowedExtensions: U, allowedMimeTypes: b },
+              s
+            );
+            const t = await oo(e, c, s, N);
+            L([t]);
+          }
         }
-      } catch (r) {
-        x(r);
+      } catch (e) {
+        I(e);
       } finally {
-        m ? setTimeout(() => {
-          o.target.value = "", H(0), T(!1);
-        }, Mo) : (o.target.value = "", T(!1));
+        g ? setTimeout(() => {
+          o.target.value = "", W(0), O(!1);
+        }, zo) : (o.target.value = "", O(!1));
       }
-  }, Do = (o) => {
-    const { width: t, height: r } = o.currentTarget;
-    console.log(o);
-    const e = bo(t, r, l, h);
-    _((E) => {
-      const u = [...E];
-      return u[p] = e, u;
+  }, Ao = (o) => {
+    const { width: r, height: e } = o.currentTarget, t = Yo(r, e, c, C);
+    v((T) => {
+      const u = [...T];
+      return u[p] = t, u;
     });
-  }, So = (o, t) => {
-    _((r) => {
-      const e = [...r];
-      return e[p] = t, e;
+  }, xo = (o, r) => {
+    v((e) => {
+      const t = [...e];
+      return t[p] = r, t;
     });
-  }, V = () => {
-    const o = R.current, t = N.current;
-    if (o && t && L)
+  }, Z = () => {
+    const o = z.current, r = j.current;
+    if (o && r && x)
       try {
-        const r = L[p];
-        if (!r) return !1;
-        if (Q(), n.returnCropParams === !0) {
-          const e = Ao(r, t.naturalWidth, t.naturalHeight);
-          n.onEndCrop?.(e), p >= f.length - 1 && w();
+        const e = x[p];
+        if (!e) return !1;
+        if (ao(), a.returnCropParams === !0) {
+          const t = Fo(e, r.naturalWidth, r.naturalHeight);
+          a.onEndCrop?.(t), p >= P.length - 1 && R();
         } else {
-          const e = ko(
-            t,
-            o,
+          const t = Xo(
             r,
+            o,
+            e,
             s
           );
-          n.onEndCrop?.(e), p >= f.length - 1 && A();
+          a.onEndCrop?.(t), p >= P.length - 1 && y();
         }
         return !0;
-      } catch (r) {
-        return r instanceof Error && (console.warn(r), x(r)), !1;
+      } catch (e) {
+        return e instanceof Error && (console.warn(e), I(e)), !1;
       }
     else
       return !1;
-  }, Lo = () => {
-    V() && M((t) => t + 1);
-  }, _o = async () => {
-    const o = f.slice(p);
+  }, vo = () => {
+    Z() && k((r) => r + 1);
+  }, Oo = async () => {
+    const o = P.slice(p);
     try {
-      if (lo) {
-        const t = await Promise.all(
+      if (Co) {
+        const r = await Promise.all(
           o.map(
-            (r) => X(
-              r,
-              l,
-              h,
+            (e) => eo(
+              e,
+              c,
+              C,
               s,
               !0
             )
           )
         );
-        w(t);
+        R(r);
       } else {
-        const t = await Promise.all(
+        const r = await Promise.all(
           o.map(
-            (r) => X(
-              r,
-              l,
-              h,
+            (e) => eo(
+              e,
+              c,
+              C,
               s,
               !1
             )
           )
         );
-        A(t);
+        y(r);
       }
-    } catch (t) {
-      x(t);
+    } catch (r) {
+      I(r);
     }
   };
-  return /* @__PURE__ */ To(wo, { children: [
-    /* @__PURE__ */ P(
-      Ro,
+  return /* @__PURE__ */ yo(Io, { children: [
+    /* @__PURE__ */ _(
+      Bo,
       {
-        onChange: Po,
-        onPhotoDataLoaded: U,
-        buttonClassname: Z,
-        disabled: i,
-        buttonDisabled: i,
+        onChange: Uo,
+        onPhotoDataLoaded: L,
+        buttonClassname: ro,
+        disabled: l,
+        buttonDisabled: l,
         locale: s,
-        width: so,
-        allowedExtensions: S,
-        onDragDrop: ro,
-        onDragLeave: oo,
-        onDragOver: $,
-        button: ao,
-        multiple: m,
-        fromSources: F,
-        ...co,
-        children: xo[s].upload
+        width: fo,
+        allowedExtensions: U,
+        onDragDrop: lo,
+        onDragLeave: co,
+        onDragOver: io,
+        button: mo,
+        multiple: g,
+        fromSources: H,
+        withVideoUploaded: A,
+        ...Eo,
+        children: Mo[s].upload
       }
     ),
-    /* @__PURE__ */ P(
-      No,
+    /* @__PURE__ */ _(
+      Wo,
       {
-        open: mo,
-        photoSourceLoading: i,
-        loadingValue: fo,
-        errors: uo,
-        photoCrops: L,
-        photoSources: f,
-        onNextPhoto: Lo,
-        onSkipCrop: _o,
-        onClearErrors: Co,
-        photoError: b,
-        onCloseDialogHandler: go,
-        onCropChange: So,
-        onPhotoCrop: V,
-        onPhotoLoad: Do,
-        imageRef: N,
-        minDimension: l,
-        aspectRatio: h,
+        open: To,
+        className: V,
+        photoSourceLoading: l,
+        loadingValue: Do,
+        errors: So,
+        photoCrops: x,
+        photoSources: P,
+        onNextPhoto: vo,
+        onSkipCrop: Oo,
+        onClearErrors: _o,
+        photoError: B,
+        onCloseDialogHandler: X,
+        onCropChange: xo,
+        onPhotoCrop: Z,
+        onPhotoLoad: Ao,
+        imageRef: j,
+        minDimension: c,
+        aspectRatio: C,
         locale: s,
-        circular: eo,
-        keepSelection: no,
+        circular: uo,
+        keepSelection: ho,
         photoIndex: p
       }
     ),
-    /* @__PURE__ */ P(
-      Ho,
+    /* @__PURE__ */ _(
+      Go,
       {
-        open: to && ho,
-        photoError: b,
-        onCloseErrorDialog: Eo,
+        className: V,
+        open: po && Lo,
+        photoError: B,
+        onCloseErrorDialog: wo,
         locale: s
       }
     ),
-    /* @__PURE__ */ P(
+    /* @__PURE__ */ _(
       "canvas",
       {
-        className: Uo(Vo.photoCropCanvas),
-        width: l,
-        height: l,
-        ref: R
+        className: No(qo.photoCropCanvas),
+        width: c,
+        height: c,
+        ref: z
       }
     )
   ] });
 }
 export {
-  nr as PhotoCropUploader
+  me as PhotoCropUploader
 };

package/dist/components/photo-crop-uploader/types.d.ts

@@ -18,12 +18,12 @@ export type PhotoFileOptions = {
 type CropPropsWithParams = {
     returnCropParams: true;
     onEndCrop?: (photoData: PixelCrop) => unknown;
-    onClose?: (skipPhotosData: PixelCrop[], sourcesData: PhotoDataUrl[]) => unknown;
+    onClose?: (skipPhotosData: PixelCrop[], sourcesData: PhotoDataUrl[], videoSourceIndexes: number[]) => unknown;
 };
 type CropPropsWithDataUrl = {
     returnCropParams?: false;
     onEndCrop?: (photoData: PhotoDataUrl) => unknown;
-    onClose?: (skipPhotosData: PhotoDataUrl[], sourcesData: PhotoDataUrl[]) => unknown;
+    onClose?: (skipPhotosData: PhotoDataUrl[], sourcesData: PhotoDataUrl[], videoSourceIndexes: number[]) => unknown;
 };
 type CropProps = CropPropsWithParams | CropPropsWithDataUrl;
 export type PhotoCropUploaderCustomProps = {
@@ -48,6 +48,8 @@ export type PhotoCropUploaderCustomProps = {
     width?: number;
     uploadButton?: ReactNode;
     fromSources?: PhotoDataUrl[];
+    withVideoUploaded?: boolean;
+    dialogClassname?: string;
 };
 export type PhotoCropUploaderProps = PhotoCropUploaderCustomProps & CropProps & InputHTMLAttributes<HTMLInputElement>;
 export type PhotoCropUploaderLocaleText = Record<Locale, Record<string, string>>;

package/dist/components/photo-crop-uploader/utils/index.d.ts

@@ -4,3 +4,4 @@ export { getCroppedSource } from './get-cropped-source';
 export { validatePhotoFile } from './validate-photo-file';
 export { getDefaultCroppedPhoto } from './get-default-cropped-photo';
 export { drawCroppedImage } from './draw-cropped-image';
+export { isVideo } from './is-video';

package/dist/components/photo-crop-uploader/utils/index.js

@@ -1,14 +1,16 @@
 import { readPhoto as e } from "./read-photo.js";
 import { getPhotoCrop as p } from "./get-photo-crop.js";
 import { getCroppedSource as m } from "./get-cropped-source.js";
-import { validatePhotoFile as d } from "./validate-photo-file.js";
+import { validatePhotoFile as x } from "./validate-photo-file.js";
 import { getDefaultCroppedPhoto as g } from "./get-default-cropped-photo.js";
-import { drawCroppedImage as C } from "./draw-cropped-image.js";
+import { drawCroppedImage as i } from "./draw-cropped-image.js";
+import { isVideo as P } from "./is-video.js";
 export {
-  C as drawCroppedImage,
+  i as drawCroppedImage,
   m as getCroppedSource,
   g as getDefaultCroppedPhoto,
   p as getPhotoCrop,
+  P as isVideo,
   e as readPhoto,
-  d as validatePhotoFile
+  x as validatePhotoFile
 };

package/dist/components/photo-crop-uploader/utils/is-video.d.ts

@@ -0,0 +1 @@
+export declare const isVideo: (file: File) => boolean;

package/dist/components/photo-crop-uploader/utils/is-video.js

@@ -0,0 +1,8 @@
+import { MP4_VIDEO_EXT as o, WEBM_VIDEO_EXT as s, MP4_VIDEO_TYPE as _, WEBM_VIDEO_TYPE as I } from "../constants.js";
+const c = [o, s], O = [_, I], T = (E) => {
+  const t = E.name.lastIndexOf("."), e = t > 0 ? E.name.slice(t).toLowerCase() : "", n = E.type;
+  return c.includes(e) && O.includes(n);
+};
+export {
+  T as isVideo
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hai-dev/ui-kit",
   "private": false,
-  "version": "1.1.2",
+  "version": "1.1.5",
   "license": "UNLICENSED",
   "author": {
     "name": "Vladislav Knitrunov",