@caspeco/casper-ui-library 10.3.1 → 10.5.0

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

@@ -1,22 +1,18 @@
-function t(a) {
-  return a.replace(/[^a-zA-Z0-9-.]/g, "_");
+//#region lib/components/image-upload/image-upload-helper.ts
+function e(e) {
+	return e.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);
-  });
+function t(e) {
+	return new Promise((t, n) => {
+		let r = new FileReader();
+		r.onload = () => t(r.result), r.onerror = () => n(r.error ?? /* @__PURE__ */ Error("Failed to read image data")), r.readAsDataURL(e);
+	});
 }
-async function i(a, r) {
-  const e = await (await fetch(a, {
-    signal: r
-  })).blob();
-  return {
-    data: await o(e),
-    fileName: t(a)
-  };
+async function n(n, r) {
+	return {
+		data: await t(await (await fetch(n, { signal: r })).blob()),
+		fileName: e(n)
+	};
 }
-export {
-  i as loadImageFileItem,
-  t as sanitizeFilename
-};
+//#endregion
+export { n as loadImageFileItem, e as sanitizeFilename };

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

@@ -1,21 +1,53 @@
-import { jsx as t } from "react/jsx-runtime";
-import { c as i } from "../../_virtual/compiler-runtime.js";
-import { Icon as o } from "@chakra-ui/react";
-const n = () => {
-  const C = i.c(1);
-  let e;
-  return C[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ t(o, { boxSize: "30px", width: "30px", height: "30px", asChild: !0, children: /* @__PURE__ */ t("svg", { viewBox: "0 0 30 30", children: /* @__PURE__ */ t("path", { d: "M24 6.75H6C5.57812 6.75 5.25 7.125 5.25 7.5V22.5V22.5469L5.4375 22.2656L9.1875 17.0156C9.42188 16.6875 9.75 16.5 10.125 16.5C10.4531 16.5 10.8281 16.6875 11.0156 16.9688L12.4688 18.9844L16.3594 13.9688C16.5469 13.6875 16.875 13.5 17.25 13.5C17.5781 13.5 17.9062 13.6875 18.1406 13.9688L24.5156 22.2188L24.75 22.5V7.5C24.75 7.125 24.375 6.75 24 6.75ZM6 4.5H24C25.6406 4.5 27 5.85938 27 7.5V22.5C27 24.1875 25.6406 25.5 24 25.5H6C4.3125 25.5 3 24.1875 3 22.5V7.5C3 5.85938 4.3125 4.5 6 4.5ZM9.75 13.5C8.90625 13.5 8.20312 13.0781 7.78125 12.375C7.35938 11.7188 7.35938 10.8281 7.78125 10.125C8.20312 9.46875 8.90625 9 9.75 9C10.5469 9 11.25 9.46875 11.6719 10.125C12.0938 10.8281 12.0938 11.7188 11.6719 12.375C11.25 13.0781 10.5469 13.5 9.75 13.5Z", fill: "#0C0656", fillOpacity: "0.24" }) }) }), C[0] = e) : e = C[0], e;
-}, h = () => {
-  const C = i.c(1);
-  let e;
-  return C[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ t(o, { boxSize: "64px", width: "64px", height: "64px", asChild: !0, children: /* @__PURE__ */ t("svg", { viewBox: "0 0 64 64", children: /* @__PURE__ */ t("path", { d: "M20 15C16.625 15 14 17.75 14 21C14 24.375 16.625 27 20 27C23.25 27 26 24.375 26 21C26 17.75 23.25 15 20 15ZM56.875 4H8.875C4.5 4 0.875 7.625 0.875 12V52C0.875 56.5 4.5 60 8.875 60H56.875C61.25 60 64.875 56.5 64.875 52V12C64.875 7.625 61.375 4 56.875 4ZM58.875 51.25L41.75 28C41.375 27.375 40.75 27 40 27C39.125 27 38.5 27.375 38 28L24.75 46L20.125 40.25C19.625 39.75 19 39.375 18.25 39.375C17.5 39.375 16.875 39.75 16.375 40.25L7 52L6.875 12C6.875 11 7.875 10 8.875 10H56.875C58 10 58.875 11 58.875 12V51.25Z", fill: "#0C0656", fillOpacity: "0.24" }) }) }), C[0] = e) : e = C[0], e;
-}, s = () => {
-  const C = i.c(1);
-  let e;
-  return C[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ t(o, { width: "24px", height: "24px", asChild: !0, children: /* @__PURE__ */ t("svg", { viewBox: "0 0 24 24", children: /* @__PURE__ */ t("path", { d: "M17.9766 7.85156L13.2891 12.5391L17.9375 17.1875C18.3281 17.5391 18.3281 18.125 17.9375 18.4766C17.5859 18.8672 17 18.8672 16.6484 18.4766L11.9609 13.8281L7.3125 18.4766C6.96094 18.8672 6.375 18.8672 6.02344 18.4766C5.63281 18.125 5.63281 17.5391 6.02344 17.1484L10.6719 12.5L6.02344 7.85156C5.63281 7.5 5.63281 6.91406 6.02344 6.52344C6.375 6.17188 6.96094 6.17188 7.35156 6.52344L12 11.2109L16.6484 6.5625C17 6.17188 17.5859 6.17188 17.9766 6.5625C18.3281 6.91406 18.3281 7.5 17.9766 7.85156Z", fill: "#0C0656" }) }) }), C[0] = e) : e = C[0], e;
-};
-export {
-  n as ImageIcon,
-  h as ImageIconLarge,
-  s as RemoveIcon
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import { Icon as t } from "@chakra-ui/react";
+import { jsx as n } from "react/jsx-runtime";
+//#region lib/components/image-upload/image-upload-icons.tsx
+var r = e(), i = () => {
+	let e = (0, r.c)(1), i;
+	return e[0] === Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ n(t, {
+		boxSize: "30px",
+		width: "30px",
+		height: "30px",
+		asChild: !0,
+		children: /* @__PURE__ */ n("svg", {
+			viewBox: "0 0 30 30",
+			children: /* @__PURE__ */ n("path", {
+				d: "M24 6.75H6C5.57812 6.75 5.25 7.125 5.25 7.5V22.5V22.5469L5.4375 22.2656L9.1875 17.0156C9.42188 16.6875 9.75 16.5 10.125 16.5C10.4531 16.5 10.8281 16.6875 11.0156 16.9688L12.4688 18.9844L16.3594 13.9688C16.5469 13.6875 16.875 13.5 17.25 13.5C17.5781 13.5 17.9062 13.6875 18.1406 13.9688L24.5156 22.2188L24.75 22.5V7.5C24.75 7.125 24.375 6.75 24 6.75ZM6 4.5H24C25.6406 4.5 27 5.85938 27 7.5V22.5C27 24.1875 25.6406 25.5 24 25.5H6C4.3125 25.5 3 24.1875 3 22.5V7.5C3 5.85938 4.3125 4.5 6 4.5ZM9.75 13.5C8.90625 13.5 8.20312 13.0781 7.78125 12.375C7.35938 11.7188 7.35938 10.8281 7.78125 10.125C8.20312 9.46875 8.90625 9 9.75 9C10.5469 9 11.25 9.46875 11.6719 10.125C12.0938 10.8281 12.0938 11.7188 11.6719 12.375C11.25 13.0781 10.5469 13.5 9.75 13.5Z",
+				fill: "#0C0656",
+				fillOpacity: "0.24"
+			})
+		})
+	}), e[0] = i) : i = e[0], i;
+}, a = () => {
+	let e = (0, r.c)(1), i;
+	return e[0] === Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ n(t, {
+		boxSize: "64px",
+		width: "64px",
+		height: "64px",
+		asChild: !0,
+		children: /* @__PURE__ */ n("svg", {
+			viewBox: "0 0 64 64",
+			children: /* @__PURE__ */ n("path", {
+				d: "M20 15C16.625 15 14 17.75 14 21C14 24.375 16.625 27 20 27C23.25 27 26 24.375 26 21C26 17.75 23.25 15 20 15ZM56.875 4H8.875C4.5 4 0.875 7.625 0.875 12V52C0.875 56.5 4.5 60 8.875 60H56.875C61.25 60 64.875 56.5 64.875 52V12C64.875 7.625 61.375 4 56.875 4ZM58.875 51.25L41.75 28C41.375 27.375 40.75 27 40 27C39.125 27 38.5 27.375 38 28L24.75 46L20.125 40.25C19.625 39.75 19 39.375 18.25 39.375C17.5 39.375 16.875 39.75 16.375 40.25L7 52L6.875 12C6.875 11 7.875 10 8.875 10H56.875C58 10 58.875 11 58.875 12V51.25Z",
+				fill: "#0C0656",
+				fillOpacity: "0.24"
+			})
+		})
+	}), e[0] = i) : i = e[0], i;
+}, o = () => {
+	let e = (0, r.c)(1), i;
+	return e[0] === Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ n(t, {
+		width: "24px",
+		height: "24px",
+		asChild: !0,
+		children: /* @__PURE__ */ n("svg", {
+			viewBox: "0 0 24 24",
+			children: /* @__PURE__ */ n("path", {
+				d: "M17.9766 7.85156L13.2891 12.5391L17.9375 17.1875C18.3281 17.5391 18.3281 18.125 17.9375 18.4766C17.5859 18.8672 17 18.8672 16.6484 18.4766L11.9609 13.8281L7.3125 18.4766C6.96094 18.8672 6.375 18.8672 6.02344 18.4766C5.63281 18.125 5.63281 17.5391 6.02344 17.1484L10.6719 12.5L6.02344 7.85156C5.63281 7.5 5.63281 6.91406 6.02344 6.52344C6.375 6.17188 6.96094 6.17188 7.35156 6.52344L12 11.2109L16.6484 6.5625C17 6.17188 17.5859 6.17188 17.9766 6.5625C18.3281 6.91406 18.3281 7.5 17.9766 7.85156Z",
+				fill: "#0C0656"
+			})
+		})
+	}), e[0] = i) : i = e[0], i;
 };
+//#endregion
+export { i as ImageIcon, a as ImageIconLarge, o as RemoveIcon };

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

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

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

@@ -1,87 +1,97 @@
-import { jsx as s, jsxs as L, Fragment as W } from "react/jsx-runtime";
-import { c as X } from "../../_virtual/compiler-runtime.js";
-import { useDisclosure as $ } from "../../hooks/use-disclosure.js";
-import { Box as q, Spinner as G } from "@chakra-ui/react";
-import { useState as N } from "react";
-import { ImageIcon as H } from "./image-upload-icons.js";
-import { ImageUploadModal as J } from "./image-upload-modal.js";
-import { ImageUploadAspectRatio as l } from "./types.js";
-import { Text as K } from "../text/text.js";
-import { Image as Q } from "../image/image.js";
-import { ThemeRadiusVariable as k, ThemeColorVariable as D, ThemeSpaceVariable as Y } from "../../theme/theme-types.js";
-function ce(j) {
-  const e = X.c(32), {
-    title: B,
-    savedImageUrl: c,
-    savedCrop: m,
-    aspectRatio: t,
-    isLoading: w,
-    locale: R,
-    onSave: p
-  } = j, I = R === void 0 ? "en-US" : R, {
-    isOpen: b,
-    onOpen: S,
-    onClose: r
-  } = $(), [d, F] = N(c || ""), [v, M] = N(m || null);
-  let u;
-  e[0] !== r || e[1] !== p ? (u = (U, P, z) => {
-    const E = {
-      crop: P,
-      file: {
-        imageFilename: U.fileName,
-        imageUploadData: U.data
-      }
-    };
-    p && (p(E, z), r());
-  }, e[0] = r, e[1] = p, e[2] = u) : u = e[2];
-  const y = u;
-  let f;
-  e[3] !== t ? (f = () => {
-    switch (t) {
-      case l.OneByOne:
-        return "102px";
-      case l.SixteenByNine:
-        return "178px";
-      case l.ThirtyTwoByNine:
-        return "360px";
-      default:
-        return "102px";
-    }
-  }, e[3] = t, e[4] = f) : f = e[4];
-  const V = f;
-  let g;
-  e[5] !== t ? (g = () => {
-    switch (t) {
-      case l.OneByOne:
-        return "1:1";
-      case l.SixteenByNine:
-        return "16:9";
-      case l.ThirtyTwoByNine:
-        return "32:9";
-      default:
-        return "";
-    }
-  }, e[5] = t, e[6] = g) : g = e[6];
-  const A = g;
-  let h;
-  e[7] !== w || e[8] !== d ? (h = () => w ? /* @__PURE__ */ s(G, { color: D.OnBackgroundBorder, size: "lg", animationDuration: "0.825s" }) : d ? /* @__PURE__ */ s(Q, { alt: "Preview Image", src: d, borderRadius: k.Medium, objectFit: "fill", h: "100%", w: "100%" }) : /* @__PURE__ */ s(H, {}), e[7] = w, e[8] = d, e[9] = h) : h = e[9];
-  const O = h, T = V();
-  let o;
-  e[10] !== O ? (o = O(), e[10] = O, e[11] = o) : o = e[11];
-  let i;
-  e[12] !== S || e[13] !== o || e[14] !== T ? (i = /* @__PURE__ */ s(q, { as: "button", onClick: S, bg: D.BackgroundDisabled, borderRadius: k.Medium, w: T, h: "102px", children: o }), e[12] = S, e[13] = o, e[14] = T, e[15] = i) : i = e[15];
-  const C = A();
-  let n;
-  e[16] !== C ? (n = /* @__PURE__ */ s(K, { mt: Y.XSmall, color: D.OnBackground, children: C }), e[16] = C, e[17] = n) : n = e[17];
-  let a;
-  e[18] !== t || e[19] !== v || e[20] !== y || e[21] !== b || e[22] !== I || e[23] !== r || e[24] !== m || e[25] !== c || e[26] !== B ? (a = /* @__PURE__ */ s(J, { locale: I, title: B, src: c, savedCrop: m, aspectRatio: t, isOpen: b, onClose: r, handleSaveImage: y, setPreviewImage: F, crop: v, setCrop: M }), e[18] = t, e[19] = v, e[20] = y, e[21] = b, e[22] = I, e[23] = r, e[24] = m, e[25] = c, e[26] = B, e[27] = a) : a = e[27];
-  let x;
-  return e[28] !== a || e[29] !== i || e[30] !== n ? (x = /* @__PURE__ */ L(W, { children: [
-    i,
-    n,
-    a
-  ] }), e[28] = a, e[29] = i, e[30] = n, e[31] = x) : x = e[31], x;
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import { ThemeColorVariable as t, ThemeRadiusVariable as n, ThemeSpaceVariable as r } from "../../theme/theme-types.js";
+import { useDisclosure as i } from "../../hooks/use-disclosure.js";
+import { Text as a } from "../text/text.js";
+import { Image as o } from "../image/image.js";
+import { ImageIcon as s } from "./image-upload-icons.js";
+import { ImageUploadAspectRatio as c } from "./types.js";
+import { ImageUploadModal as l } from "./image-upload-modal.js";
+import { useState as u } from "react";
+import { Box as d, Spinner as f } from "@chakra-ui/react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region lib/components/image-upload/image-upload.tsx
+var g = e();
+function _(e) {
+	let _ = (0, g.c)(32), { title: v, savedImageUrl: y, savedCrop: b, aspectRatio: x, isLoading: S, locale: C, onSave: w } = e, T = C === void 0 ? "en-US" : C, { isOpen: E, onOpen: D, onClose: O } = i(), [k, A] = u(y || ""), [j, M] = u(b || null), N;
+	_[0] !== O || _[1] !== w ? (N = (e, t, n) => {
+		let r = {
+			crop: t,
+			file: {
+				imageFilename: e.fileName,
+				imageUploadData: e.data
+			}
+		};
+		w && (w(r, n), O());
+	}, _[0] = O, _[1] = w, _[2] = N) : N = _[2];
+	let P = N, F;
+	_[3] === x ? F = _[4] : (F = () => {
+		switch (x) {
+			case c.OneByOne: return "102px";
+			case c.SixteenByNine: return "178px";
+			case c.ThirtyTwoByNine: return "360px";
+			default: return "102px";
+		}
+	}, _[3] = x, _[4] = F);
+	let I = F, L;
+	_[5] === x ? L = _[6] : (L = () => {
+		switch (x) {
+			case c.OneByOne: return "1:1";
+			case c.SixteenByNine: return "16:9";
+			case c.ThirtyTwoByNine: return "32:9";
+			default: return "";
+		}
+	}, _[5] = x, _[6] = L);
+	let R = L, z;
+	_[7] !== S || _[8] !== k ? (z = () => S ? /* @__PURE__ */ m(f, {
+		color: t.OnBackgroundBorder,
+		size: "lg",
+		animationDuration: "0.825s"
+	}) : k ? /* @__PURE__ */ m(o, {
+		alt: "Preview Image",
+		src: k,
+		borderRadius: n.Medium,
+		objectFit: "fill",
+		h: "100%",
+		w: "100%"
+	}) : /* @__PURE__ */ m(s, {}), _[7] = S, _[8] = k, _[9] = z) : z = _[9];
+	let B = z, V = I(), H;
+	_[10] === B ? H = _[11] : (H = B(), _[10] = B, _[11] = H);
+	let U;
+	_[12] !== D || _[13] !== H || _[14] !== V ? (U = /* @__PURE__ */ m(d, {
+		as: "button",
+		onClick: D,
+		bg: t.BackgroundDisabled,
+		borderRadius: n.Medium,
+		w: V,
+		h: "102px",
+		children: H
+	}), _[12] = D, _[13] = H, _[14] = V, _[15] = U) : U = _[15];
+	let W = R(), G;
+	_[16] === W ? G = _[17] : (G = /* @__PURE__ */ m(a, {
+		mt: r.XSmall,
+		color: t.OnBackground,
+		children: W
+	}), _[16] = W, _[17] = G);
+	let K;
+	_[18] !== x || _[19] !== j || _[20] !== P || _[21] !== E || _[22] !== T || _[23] !== O || _[24] !== b || _[25] !== y || _[26] !== v ? (K = /* @__PURE__ */ m(l, {
+		locale: T,
+		title: v,
+		src: y,
+		savedCrop: b,
+		aspectRatio: x,
+		isOpen: E,
+		onClose: O,
+		handleSaveImage: P,
+		setPreviewImage: A,
+		crop: j,
+		setCrop: M
+	}), _[18] = x, _[19] = j, _[20] = P, _[21] = E, _[22] = T, _[23] = O, _[24] = b, _[25] = y, _[26] = v, _[27] = K) : K = _[27];
+	let q;
+	return _[28] !== K || _[29] !== U || _[30] !== G ? (q = /* @__PURE__ */ h(p, { children: [
+		U,
+		G,
+		K
+	] }), _[28] = K, _[29] = U, _[30] = G, _[31] = q) : q = _[31], q;
 }
-export {
-  ce as ImageUpload
-};
+//#endregion
+export { _ as ImageUpload };