@caspeco/casper-ui-library 10.0.0 → 10.0.2

package/dist/components/image-upload/image-upload-dropzone.js

@@ -1,111 +1,113 @@
-import { jsx as p, jsxs as B, Fragment as v } from "react/jsx-runtime";
-import { c as ee } from "../../_virtual/compiler-runtime.js";
-import { Text as O, Box as W, Input as te } from "@chakra-ui/react";
-import re, { useState as L } from "react";
-import { sanitizeFilename as le } from "./image-upload-helper.js";
-import { ImageIconLarge as ae } from "./image-upload-icons.js";
-import { translations as I } from "./translations.js";
-import { Alert as N } from "../alert/alert.js";
-import { ThemeColorVariable as M, ThemeRadiusVariable as ne, ThemeSpaceVariable as $ } from "../../theme/theme-types.js";
-function he(q) {
-  const e = ee.c(34), {
-    locale: l,
-    setFileItem: R,
-    setHasImageChanged: A
-  } = q, [G, C] = L(!1), [z, V] = L(!1), [w, H] = L(!1);
-  let u;
-  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (u = re.createRef(), e[0] = u) : u = e[0];
-  const n = u;
-  let g;
-  e[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (g = function(r, a) {
-    const T = new FileReader();
-    T.onload = a, T.readAsDataURL(r);
-  }, e[1] = g) : g = e[1];
-  const J = g;
+import { jsx as u, jsxs as M, Fragment as te } from "react/jsx-runtime";
+import { c as re } from "../../_virtual/compiler-runtime.js";
+import { Text as N, Box as $, Input as le } from "@chakra-ui/react";
+import ae, { useState as V } from "react";
+import { sanitizeFilename as oe } from "./image-upload-helper.js";
+import { ImageIconLarge as ne } from "./image-upload-icons.js";
+import { translations as g } from "./translations.js";
+import { Alert as q } from "../alert/alert.js";
+import { ThemeColorVariable as H, ThemeRadiusVariable as ie, ThemeSpaceVariable as G } from "../../theme/theme-types.js";
+function _e(J) {
+  const e = re.c(37), {
+    locale: r,
+    setFileItem: A,
+    setHasImageChanged: C
+  } = J, [K, z] = V(!1), [w, O] = V(!1), [E, W] = V(!1);
   let h;
-  e[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (h = ["image/jpeg", "image/png", "image/webp", "image/gif", "image/svg+xml"], e[2] = h) : h = e[2];
-  const K = h;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (h = ae.createRef(), e[0] = h) : h = e[0];
+  const o = h;
   let b;
-  e[3] !== R || e[4] !== A ? (b = (t) => {
+  e[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (b = function(l, a) {
+    const R = new FileReader();
+    R.onload = a, R.readAsDataURL(l);
+  }, e[1] = b) : b = e[1];
+  const P = b;
+  let _;
+  e[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (_ = ["image/jpeg", "image/png", "image/webp", "image/gif", "image/svg+xml"], e[2] = _) : _ = e[2];
+  const Q = _;
+  let D;
+  e[3] !== A || e[4] !== C ? (D = (t) => {
     const {
-      target: r
+      target: l
     } = t;
-    if (!r || !r.files || !r.files[0])
+    if (!l || !l.files || !l.files[0])
       return;
-    const a = r.files[0];
-    if (!K.includes(a.type)) {
-      H(!0);
+    const a = l.files[0];
+    if (!Q.includes(a.type)) {
+      W(!0);
       return;
     }
-    H(!1), a.size > 3145728 ? V(!0) : (V(!1), J(a, (T) => {
-      const Y = T.target?.result, Z = {
-        fileName: le(a.name),
-        data: Y
+    W(!1), a.size > 3145728 ? O(!0) : (O(!1), P(a, (R) => {
+      const v = R.target?.result, ee = {
+        fileName: oe(a.name),
+        data: v
       };
-      R(Z), A(!0);
+      A(ee), C(!0);
     }));
-  }, e[3] = R, e[4] = A, e[5] = b) : b = e[5];
-  const o = b;
-  let _;
-  e[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (_ = () => {
-    n.current && n.current.click();
-  }, e[6] = _) : _ = e[6];
-  const P = _;
-  let D;
-  e[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (D = (t) => {
-    t.preventDefault(), t.dataTransfer.items && t.dataTransfer.items.length > 0 && C(!0);
-  }, e[7] = D) : D = e[7];
-  const Q = D;
+  }, e[3] = A, e[4] = C, e[5] = D) : D = e[5];
+  const n = D;
   let x;
-  e[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (x = () => {
-    C(!1);
-  }, e[8] = x) : x = e[8];
+  e[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (x = () => {
+    o.current && o.current.click();
+  }, e[6] = x) : x = e[6];
   const X = x;
   let y;
-  e[9] !== o ? (y = (t) => {
-    if (t.preventDefault(), !!n.current && t.dataTransfer.files && t.dataTransfer.files.length > 0) {
-      const r = new DataTransfer();
+  e[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (y = (t) => {
+    t.preventDefault(), t.dataTransfer.items && t.dataTransfer.items.length > 0 && z(!0);
+  }, e[7] = y) : y = e[7];
+  const Y = y;
+  let F;
+  e[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (F = () => {
+    z(!1);
+  }, e[8] = F) : F = e[8];
+  const Z = F;
+  let S;
+  e[9] !== n ? (S = (t) => {
+    if (t.preventDefault(), !!o.current && t.dataTransfer.files && t.dataTransfer.files.length > 0) {
+      const l = new DataTransfer();
       Array.from(t.dataTransfer.files).forEach((a) => {
-        r.items.add(a);
-      }), n.current.files = r.files, o({
-        target: n.current
-      }), t.dataTransfer.clearData(), C(!1);
+        l.items.add(a);
+      }), o.current.files = l.files, n({
+        target: o.current
+      }), t.dataTransfer.clearData(), z(!1);
     }
-  }, e[9] = o, e[10] = y) : y = e[10];
-  const E = y, U = G ? M.OnSurfaceBorder : "transparent";
-  let F;
-  e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (F = /* @__PURE__ */ p(ae, {}), e[11] = F) : F = e[11];
-  const j = I[l];
+  }, e[9] = n, e[10] = S) : S = e[10];
+  const U = S, j = K ? H.OnSurfaceBorder : "transparent";
+  let T;
+  e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (T = /* @__PURE__ */ u(ne, {}), e[11] = T) : T = e[11];
+  const k = g[r];
   let i;
-  e[12] !== j.pullAndDrop ? (i = /* @__PURE__ */ p(O, { children: j.pullAndDrop }), e[12] = j.pullAndDrop, e[13] = i) : i = e[13];
-  const k = I[l];
+  e[12] !== k.pullAndDrop ? (i = /* @__PURE__ */ u(N, { children: k.pullAndDrop }), e[12] = k.pullAndDrop, e[13] = i) : i = e[13];
+  const B = g[r], L = g[r];
   let s;
-  e[14] !== k.upload ? (s = /* @__PURE__ */ B(O, { children: [
-    "eller",
+  e[14] !== L.upload ? (s = /* @__PURE__ */ u($, { as: "span", color: H.Accent, textDecoration: "underline", children: L.upload }), e[14] = L.upload, e[15] = s) : s = e[15];
+  let c;
+  e[16] !== B.or || e[17] !== s ? (c = /* @__PURE__ */ M(N, { children: [
+    B.or,
     " ",
-    /* @__PURE__ */ p(W, { as: "span", color: M.Accent, textDecoration: "underline", children: k.upload }),
+    s,
     "."
-  ] }), e[14] = k.upload, e[15] = s) : s = e[15];
-  let c;
-  e[16] !== o ? (c = /* @__PURE__ */ p(te, { type: "file", ref: n, display: "none", onChange: o }), e[16] = o, e[17] = c) : c = e[17];
+  ] }), e[16] = B.or, e[17] = s, e[18] = c) : c = e[18];
   let f;
-  e[18] !== E || e[19] !== i || e[20] !== s || e[21] !== c || e[22] !== U ? (f = /* @__PURE__ */ B(W, { p: "108px", bg: M.BackgroundDisabled, borderWidth: "1px", borderColor: U, transition: "150ms ease", borderRadius: ne.Medium, display: "flex", alignItems: "center", justifyContent: "center", flexDir: "column", onDragOver: Q, onDragLeave: X, onDrop: E, onClick: P, cursor: "pointer", children: [
-    F,
-    i,
-    s,
-    c
-  ] }), e[18] = E, e[19] = i, e[20] = s, e[21] = c, e[22] = U, e[23] = f) : f = e[23];
+  e[19] !== n ? (f = /* @__PURE__ */ u(le, { type: "file", ref: o, display: "none", onChange: n }), e[19] = n, e[20] = f) : f = e[20];
   let m;
-  e[24] !== l || e[25] !== w ? (m = w && /* @__PURE__ */ p(N, { mt: $.Medium, type: "error", children: I[l].unsupportedFormat }), e[24] = l, e[25] = w, e[26] = m) : m = e[26];
+  e[21] !== U || e[22] !== i || e[23] !== c || e[24] !== f || e[25] !== j ? (m = /* @__PURE__ */ M($, { p: "108px", bg: H.BackgroundDisabled, borderWidth: "1px", borderColor: j, transition: "150ms ease", borderRadius: ie.Medium, display: "flex", alignItems: "center", justifyContent: "center", flexDir: "column", onDragOver: Y, onDragLeave: Z, onDrop: U, onClick: X, cursor: "pointer", children: [
+    T,
+    i,
+    c,
+    f
+  ] }), e[21] = U, e[22] = i, e[23] = c, e[24] = f, e[25] = j, e[26] = m) : m = e[26];
   let d;
-  e[27] !== l || e[28] !== z ? (d = z && /* @__PURE__ */ p(N, { mt: $.Medium, type: "error", children: I[l].sizeExceeded }), e[27] = l, e[28] = z, e[29] = d) : d = e[29];
-  let S;
-  return e[30] !== f || e[31] !== m || e[32] !== d ? (S = /* @__PURE__ */ B(v, { children: [
-    f,
+  e[27] !== r || e[28] !== E ? (d = E && /* @__PURE__ */ u(q, { mt: G.Medium, type: "error", children: g[r].unsupportedFormat }), e[27] = r, e[28] = E, e[29] = d) : d = e[29];
+  let p;
+  e[30] !== r || e[31] !== w ? (p = w && /* @__PURE__ */ u(q, { mt: G.Medium, type: "error", children: g[r].sizeExceeded }), e[30] = r, e[31] = w, e[32] = p) : p = e[32];
+  let I;
+  return e[33] !== m || e[34] !== d || e[35] !== p ? (I = /* @__PURE__ */ M(te, { children: [
     m,
-    d
-  ] }), e[30] = f, e[31] = m, e[32] = d, e[33] = S) : S = e[33], S;
+    d,
+    p
+  ] }), e[33] = m, e[34] = d, e[35] = p, e[36] = I) : I = e[36], I;
 }
 export {
-  he as default
+  _e as default
 };

package/dist/components/image-upload/image-upload-helper.d.ts

@@ -1,2 +1,5 @@
+import { FileItem } from './image-upload-dropzone.js';
 export declare function sanitizeFilename(filename: string): string;
+export declare function readBlobAsDataUrl(blob: Blob): Promise<string>;
+export declare function loadImageFileItem(src: string, signal?: AbortSignal): Promise<FileItem>;
 //# sourceMappingURL=image-upload-helper.d.ts.map

package/dist/components/image-upload/image-upload-helper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-upload-helper.d.ts","sourceRoot":"","sources":["../../../lib/components/image-upload/image-upload-helper.ts"],"names":[],"mappings":"AAAA,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAGzD"}
+{"version":3,"file":"image-upload-helper.d.ts","sourceRoot":"","sources":["../../../lib/components/image-upload/image-upload-helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAExD,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAGzD;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC,MAAM,CAAC,CAO7D;AAED,wBAAsB,iBAAiB,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC,QAAQ,CAAC,CAO5F"}

package/dist/components/image-upload/image-upload-helper.js

@@ -1,6 +1,23 @@
-function n(e) {
-  return e.replace(/[^a-zA-Z0-9-.]/g, "_");
+function t(a) {
+  return a.replace(/[^a-zA-Z0-9-.]/g, "_");
+}
+function o(a) {
+  return new Promise((r, n) => {
+    const e = new FileReader();
+    e.onload = () => r(e.result), e.onerror = () => n(e.error ?? new Error("Failed to read image data")), e.readAsDataURL(a);
+  });
+}
+async function i(a, r) {
+  const e = await (await fetch(a, {
+    signal: r
+  })).blob();
+  return {
+    data: await o(e),
+    fileName: t(a)
+  };
 }
 export {
-  n as sanitizeFilename
+  i as loadImageFileItem,
+  o as readBlobAsDataUrl,
+  t as sanitizeFilename
 };

package/dist/components/image-upload/image-upload-modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-upload-modal.d.ts","sourceRoot":"","sources":["../../../lib/components/image-upload/image-upload-modal.tsx"],"names":[],"mappings":"AAOA,OAAiB,EAAE,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAIlE,OAAO,EAAE,KAAK,IAAI,EAAE,sBAAsB,EAAE,KAAK,OAAO,EAAE,MAAM,SAAS,CAAC;AAE1E,UAAU,uBAAuB;IAChC,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,SAAS,EAAE,IAAI,GAAG,SAAS,CAAC;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,sBAAsB,CAAC;IACpC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,eAAe,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3F,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,gBAAgB,CAAC,EAChC,KAAK,EACL,GAAG,EACH,SAAS,EACT,MAAM,EACN,WAAW,EACX,IAAI,EACJ,MAAM,EACN,OAAO,EACP,eAAe,EACf,eAAe,EACf,OAAO,GACP,EAAE,uBAAuB,+BAqHzB"}
+{"version":3,"file":"image-upload-modal.d.ts","sourceRoot":"","sources":["../../../lib/components/image-upload/image-upload-modal.tsx"],"names":[],"mappings":"AAOA,OAAiB,EAAE,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAIlE,OAAO,EAAE,KAAK,IAAI,EAAE,sBAAsB,EAAE,KAAK,OAAO,EAAE,MAAM,SAAS,CAAC;AAE1E,UAAU,uBAAuB;IAChC,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,SAAS,EAAE,IAAI,GAAG,SAAS,CAAC;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,sBAAsB,CAAC;IACpC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,eAAe,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3F,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CACrC;AAED,wBAAgB,gBAAgB,CAAC,EAChC,KAAK,EACL,GAAG,EACH,SAAS,EACT,MAAM,EACN,WAAW,EACX,IAAI,EACJ,MAAM,EACN,OAAO,EACP,eAAe,EACf,eAAe,EACf,OAAO,GACP,EAAE,uBAAuB,+BA8GzB"}

package/dist/components/image-upload/image-upload-modal.js

@@ -1,82 +1,107 @@
-import { jsxs as t, jsx as e, Fragment as k } from "react/jsx-runtime";
-import { ButtonGroup as D } from "@chakra-ui/react";
-import { useState as u, useEffect as H } from "react";
-import { ImageCropper as L } from "./image-cropper.js";
-import R from "./image-upload-dropzone.js";
-import { sanitizeFilename as V } from "./image-upload-helper.js";
-import { RemoveIcon as j } from "./image-upload-icons.js";
-import { translations as s } from "./translations.js";
-import { Modal as O } from "../modal/modal.js";
-import { ModalHeader as $ } from "../modal/modal-header.js";
-import { Text as w } from "../text/text.js";
-import { ModalCloseButton as U } from "../modal/modal-close-button.js";
-import { ModalBody as W } from "../modal/modal-body.js";
-import { Button as p } from "../button/button.js";
-import { ModalFooter as X } from "../modal/modal-footer.js";
-import { ThemeSpaceVariable as o, ThemeFontSizeVariable as A, ThemeFontVariable as E, ThemeColorVariable as g } from "../../theme/theme-types.js";
-function de({
-  title: b,
-  src: r,
-  savedCrop: S,
-  isOpen: C,
-  aspectRatio: x,
-  crop: c,
-  locale: i,
-  onClose: y,
-  handleSaveImage: I,
-  setPreviewImage: n,
-  setCrop: l
-}) {
-  const [M, F] = u(!1), [a, m] = u({
+import { jsx as l, jsxs as C, Fragment as q } from "react/jsx-runtime";
+import { c as J } from "../../_virtual/compiler-runtime.js";
+import { ButtonGroup as K } from "@chakra-ui/react";
+import { useState as E, useEffect as Q } from "react";
+import { ImageCropper as Y } from "./image-cropper.js";
+import Z from "./image-upload-dropzone.js";
+import { loadImageFileItem as W } from "./image-upload-helper.js";
+import { RemoveIcon as ee } from "./image-upload-icons.js";
+import { translations as F } from "./translations.js";
+import { Text as te } from "../text/text.js";
+import { ModalHeader as oe } from "../modal/modal-header.js";
+import { ModalBody as re } from "../modal/modal-body.js";
+import { Button as L } from "../button/button.js";
+import { ModalFooter as ae } from "../modal/modal-footer.js";
+import { ModalCloseButton as le } from "../modal/modal-close-button.js";
+import { Modal as ie } from "../modal/modal.js";
+import { ThemeFontSizeVariable as me, ThemeFontVariable as ne, ThemeColorVariable as X, ThemeSpaceVariable as i } from "../../theme/theme-types.js";
+function Fe(A) {
+  const e = J.c(48), {
+    title: T,
+    src: o,
+    savedCrop: B,
+    isOpen: k,
+    aspectRatio: w,
+    crop: n,
+    locale: m,
+    onClose: z,
+    handleSaveImage: H,
+    setPreviewImage: r,
+    setCrop: a
+  } = A, [O, G] = E(!1);
+  let b;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (b = {
     data: "",
     fileName: ""
-  }), d = () => {
-    (async () => {
-      if (!r)
-        return;
-      const B = await (await fetch(r)).blob(), f = new FileReader();
-      f.readAsDataURL(B), f.onloadend = () => {
-        m({
-          data: f.result,
-          fileName: V(r)
-        });
-      };
-    })().catch(console.error);
-  };
-  H(() => {
-    d();
-  }, [d]);
-  const T = () => {
-    I(a, c, M);
-  }, N = (!a.data || !a.fileName) && !r, v = (!a.data || !a.fileName) && r, h = () => {
-    m({
+  }, e[0] = b) : b = e[0];
+  const [t, u] = E(b);
+  let I, S;
+  e[1] !== o ? (I = () => {
+    if (!o)
+      return;
+    const D = new AbortController();
+    return W(o, D.signal).then((U) => {
+      D.signal.aborted || u(U);
+    }).catch(console.error), () => {
+      D.abort();
+    };
+  }, S = [o], e[1] = o, e[2] = I, e[3] = S) : (I = e[2], S = e[3]), Q(I, S);
+  let v;
+  e[4] !== n || e[5] !== t || e[6] !== H || e[7] !== O ? (v = () => {
+    H(t, n, O);
+  }, e[4] = n, e[5] = t, e[6] = H, e[7] = O, e[8] = v) : v = e[8];
+  const R = v, V = (!t.data || !t.fileName) && !o, P = (!t.data || !t.fileName) && o;
+  let y;
+  e[9] !== z || e[10] !== B || e[11] !== a || e[12] !== r || e[13] !== o ? (y = () => {
+    u({
       data: "",
       fileName: ""
-    }), n(""), r && (d(), n(r)), l(S || null), y();
-  }, z = () => {
-    m({
+    }), r(""), o && (W(o).then(u).catch(console.error), r(o)), a(B || null), z();
+  }, e[9] = z, e[10] = B, e[11] = a, e[12] = r, e[13] = o, e[14] = y) : y = e[14];
+  const s = y;
+  let x;
+  e[15] !== a || e[16] !== r ? (x = () => {
+    u({
       data: "",
       fileName: ""
-    }), n(""), l(null);
-  };
-  return /* @__PURE__ */ t(O, { isOpen: C, onClose: h, size: "md", children: [
-    /* @__PURE__ */ t($, { display: "flex", alignItems: "center", justifyContent: "space-between", p: o.Medium, children: [
-      /* @__PURE__ */ e(w, { color: g.OnSurfaceHeader, fontFamily: E.SubHeader, fontWeight: "medium", fontSize: A.XLarge, children: b }),
-      /* @__PURE__ */ e(U, {})
-    ] }),
-    /* @__PURE__ */ e(W, { display: "flex", flexDirection: "column", p: `${o.Large} ${o.Medium}`, children: a.data && a.fileName ? /* @__PURE__ */ t(k, { children: [
-      /* @__PURE__ */ e(L, { src: a.data, crop: c, onCropCallback: l, aspectRatio: x, setPreviewImage: n }),
-      /* @__PURE__ */ e(D, { gap: o.Small, mt: o.Large, flexWrap: "wrap", children: /* @__PURE__ */ t(p, { variant: "ghost", onClick: z, gap: o.XSmall, children: [
-        /* @__PURE__ */ e(j, {}),
-        "Ta bort bild"
-      ] }) })
-    ] }) : /* @__PURE__ */ e(R, { locale: i, setFileItem: m, setHasImageChanged: F }) }),
-    /* @__PURE__ */ t(X, { p: o.Medium, gap: o.Medium, borderTop: `1px solid ${g.OnSurfaceBorder}`, children: [
-      /* @__PURE__ */ e(p, { variant: "ghost", onClick: h, children: s[i].secondary }),
-      /* @__PURE__ */ e(p, { variant: "primary", onClick: T, isDisabled: N, children: v ? s[i].remove : s[i].primary })
-    ] })
-  ] });
+    }), r(""), a(null);
+  }, e[15] = a, e[16] = r, e[17] = x) : x = e[17];
+  const _ = x;
+  let c;
+  e[18] !== T ? (c = /* @__PURE__ */ l(te, { color: X.OnSurfaceHeader, fontFamily: ne.SubHeader, fontWeight: "medium", fontSize: me.XLarge, children: T }), e[18] = T, e[19] = c) : c = e[19];
+  let M;
+  e[20] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (M = /* @__PURE__ */ l(le, {}), e[20] = M) : M = e[20];
+  let f;
+  e[21] !== c ? (f = /* @__PURE__ */ C(oe, { display: "flex", alignItems: "center", justifyContent: "space-between", p: i.Medium, children: [
+    c,
+    M
+  ] }), e[21] = c, e[22] = f) : f = e[22];
+  let d;
+  e[23] !== w || e[24] !== n || e[25] !== t.data || e[26] !== t.fileName || e[27] !== _ || e[28] !== m || e[29] !== a || e[30] !== r ? (d = /* @__PURE__ */ l(re, { display: "flex", flexDirection: "column", p: `${i.Large} ${i.Medium}`, children: t.data && t.fileName ? /* @__PURE__ */ C(q, { children: [
+    /* @__PURE__ */ l(Y, { src: t.data, crop: n, onCropCallback: a, aspectRatio: w, setPreviewImage: r }),
+    /* @__PURE__ */ l(K, { gap: i.Small, mt: i.Large, flexWrap: "wrap", children: /* @__PURE__ */ C(L, { variant: "ghost", onClick: _, gap: i.XSmall, children: [
+      /* @__PURE__ */ l(ee, {}),
+      F[m].remove
+    ] }) })
+  ] }) : /* @__PURE__ */ l(Z, { locale: m, setFileItem: u, setHasImageChanged: G }) }), e[23] = w, e[24] = n, e[25] = t.data, e[26] = t.fileName, e[27] = _, e[28] = m, e[29] = a, e[30] = r, e[31] = d) : d = e[31];
+  const $ = F[m];
+  let p;
+  e[32] !== s || e[33] !== $.secondary ? (p = /* @__PURE__ */ l(L, { variant: "ghost", onClick: s, children: $.secondary }), e[32] = s, e[33] = $.secondary, e[34] = p) : p = e[34];
+  const j = P ? F[m].remove : F[m].primary;
+  let h;
+  e[35] !== V || e[36] !== R || e[37] !== j ? (h = /* @__PURE__ */ l(L, { variant: "primary", onClick: R, isDisabled: V, children: j }), e[35] = V, e[36] = R, e[37] = j, e[38] = h) : h = e[38];
+  let g;
+  e[39] !== p || e[40] !== h ? (g = /* @__PURE__ */ C(ae, { p: i.Medium, gap: i.Medium, borderTop: `1px solid ${X.OnSurfaceBorder}`, children: [
+    p,
+    h
+  ] }), e[39] = p, e[40] = h, e[41] = g) : g = e[41];
+  let N;
+  return e[42] !== s || e[43] !== k || e[44] !== d || e[45] !== g || e[46] !== f ? (N = /* @__PURE__ */ C(ie, { isOpen: k, onClose: s, size: "md", children: [
+    f,
+    d,
+    g
+  ] }), e[42] = s, e[43] = k, e[44] = d, e[45] = g, e[46] = f, e[47] = N) : N = e[47], N;
 }
 export {
-  de as ImageUploadModal
+  Fe as ImageUploadModal
 };

package/dist/components/image-upload/translations.d.ts

@@ -5,6 +5,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;
@@ -14,6 +15,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;
@@ -23,6 +25,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;
@@ -32,6 +35,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;
@@ -41,6 +45,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;
@@ -50,6 +55,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;
@@ -59,6 +65,7 @@ export declare const translations: {
         secondary: string;
         remove: string;
         pullAndDrop: string;
+        or: string;
         upload: string;
         unsupportedFormat: string;
         sizeExceeded: string;

package/dist/components/image-upload/translations.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"translations.d.ts","sourceRoot":"","sources":["../../../lib/components/image-upload/translations.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAa1F,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsDxB,CAAC"}
+{"version":3,"file":"translations.d.ts","sourceRoot":"","sources":["../../../lib/components/image-upload/translations.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAc1F,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DxB,CAAC"}

package/dist/components/image-upload/translations.js

@@ -3,6 +3,7 @@ const e = {
   secondary: "Cancel",
   remove: "Remove image",
   pullAndDrop: "Drag and drop the image here",
+  or: "or",
   upload: "Upload a file",
   unsupportedFormat: "Unsupported file format. Please upload a JPG, PNG, WebP, GIF, or SVG.",
   sizeExceeded: "The image size exceeds 3MB. Please choose a smaller file or reduce the size of the current image."
@@ -12,6 +13,7 @@ const e = {
     secondary: "Avbryt",
     remove: "Ta bort bild",
     pullAndDrop: "Dra och släpp bilden här",
+    or: "eller",
     upload: "ladda upp en fil",
     unsupportedFormat: "Otillåtet filformat. Vänligen ladda upp JPG, PNG, WebP, GIF, eller SVG.",
     sizeExceeded: "Storleken på bilden du försöker ladda upp överskrider 3MB. Vänligen välj en mindre fil eller minska storleken på den nuvarande bilden."
@@ -23,6 +25,7 @@ const e = {
     secondary: "Avbryt",
     remove: "Fjern bilde",
     pullAndDrop: "Dra og slipp bildet her",
+    or: "eller",
     upload: "Last opp en fil",
     unsupportedFormat: "Ugyldig filformat. Vennligst last opp en JPG, PNG, WebP, GIF eller SVG.",
     sizeExceeded: "Bildet du prøver å laste opp overstiger 3MB. Vennligst velg en mindre fil eller reduser størrelsen på det nåværende bildet."
@@ -32,6 +35,7 @@ const e = {
     secondary: "Annuller",
     remove: "Fjern billede",
     pullAndDrop: "Træk og slip billedet her",
+    or: "eller",
     upload: "Upload en fil",
     unsupportedFormat: "Ugyldigt filformat. Upload venligst en JPG, PNG, WebP, GIF eller SVG.",
     sizeExceeded: "Billedets størrelse overstiger 3MB. Vælg venligst en mindre fil eller reducer størrelsen på det nuværende billede."
@@ -41,6 +45,7 @@ const e = {
     secondary: "Annuler",
     remove: "Supprimer l'image",
     pullAndDrop: "Glissez-déposez l'image ici",
+    or: "ou",
     upload: "Télécharger un fichier",
     unsupportedFormat: "Format de fichier non pris en charge. Veuillez télécharger un JPG, PNG, WebP, GIF ou SVG.",
     sizeExceeded: "La taille de l'image dépasse 3 Mo. Veuillez choisir un fichier plus petit ou réduire la taille de l'image actuelle."
@@ -50,6 +55,7 @@ const e = {
     secondary: "Annuleren",
     remove: "Afbeelding verwijderen",
     pullAndDrop: "Sleep de afbeelding hierheen",
+    or: "of",
     upload: "Een bestand uploaden",
     unsupportedFormat: "Ongeldig bestandsformaat. Upload een JPG, PNG, WebP, GIF of SVG.",
     sizeExceeded: "De afbeelding die je probeert te uploaden is groter dan 3 MB. Kies een kleiner bestand of verklein de huidige afbeelding."