haze-ui 1.27.0 → 1.28.0

package/dist/components/DataTable/csv.js

@@ -0,0 +1,29 @@
+"use client";
+//#region src/lib/components/DataTable/csv.ts
+function e(e) {
+	return e.id === void 0 ? "accessorKey" in e ? e.accessorKey : "" : e.id;
+}
+function t(e) {
+	return e.flatMap((e) => "columns" in e && e.columns ? t(e.columns) : [e]);
+}
+function n(t, n) {
+	return t.meta?.excludeFromExport || !("accessorKey" in t) && !("accessorFn" in t) ? !1 : n?.[e(t)] !== !1;
+}
+function r(e, t) {
+	if ("accessorFn" in e) return e.accessorFn(t, 0);
+	if ("accessorKey" in e) return t[e.accessorKey];
+}
+function i(e) {
+	return e == null ? "" : e instanceof Date ? e.toISOString() : typeof e == "string" || typeof e == "number" || typeof e == "boolean" || typeof e == "bigint" ? String(e) : typeof e == "function" || typeof e == "symbol" ? "" : JSON.stringify(e);
+}
+function a(e) {
+	return /["\r\n,]/.test(e) ? `"${e.replace(/"/g, "\"\"")}"` : e;
+}
+function o(o, s, c) {
+	let l = t(s).filter((e) => n(e, c?.columnVisibility));
+	if (l.length === 0) return "";
+	let u = l.map((t) => a(i(typeof t.header == "string" ? t.header : e(t)))).join(","), d = o.map((e) => l.map((t) => a(i(r(t, e)))).join(","));
+	return `${c?.bom === !1 ? "" : ""}${[u, ...d].join("\r\n")}`;
+}
+//#endregion
+export { o as dataTableToCsv };

package/dist/components/DataTable/index.js

@@ -1,4 +1,5 @@
 "use client";
 import e from "./DataTable.js";
-import { dataTableAvg as t, dataTableCount as n, dataTableSum as r } from "./summary.js";
-export { e as DataTable, t as dataTableAvg, n as dataTableCount, r as dataTableSum };
+import { dataTableToCsv as t } from "./csv.js";
+import { dataTableAvg as n, dataTableCount as r, dataTableSum as i } from "./summary.js";
+export { e as DataTable, n as dataTableAvg, r as dataTableCount, i as dataTableSum, t as dataTableToCsv };

package/dist/components/DateRangePicker/DateRangePicker.js

@@ -1,25 +1,40 @@
 "use client";
-import e from "./DateRangePickerCore.js";
-import { jsx as t } from "react/jsx-runtime";
-import { useControl as n } from "react-use-control";
+import { useStrings as e } from "../LocaleProvider/useStrings.js";
+import t from "./DateRangePickerCore.js";
+import { commonRangePresets as n } from "./presets.js";
+import { jsx as r } from "react/jsx-runtime";
+import { useControl as i } from "react-use-control";
 //#region src/lib/components/DateRangePicker/DateRangePicker.tsx
-function r({ startDate: r, endDate: i, onStartChange: a, onEndChange: o, separator: s, months: c, disabledDate: l, presets: u, className: d }) {
-	let [f, p] = n(r, ""), [m, h] = n(i, "");
-	return /* @__PURE__ */ t(e, {
-		startDate: f,
-		endDate: m,
+function a(e, t) {
+	if (e === void 0) return;
+	let r = e === "common" ? ["common"] : e, i = [];
+	for (let e of r) e === "common" ? i.push(...n(t)) : i.push(e);
+	return i;
+}
+function o({ startDate: n, endDate: o, onStartChange: s, onEndChange: c, separator: l, months: u, disabledDate: d, presets: f, className: p }) {
+	let [m, h] = i(n, ""), [g, _] = i(o, ""), v = e("dateRangePicker");
+	return /* @__PURE__ */ r(t, {
+		startDate: m,
+		endDate: g,
 		onStartChange: (e) => {
-			p(e), a?.(e);
+			h(e), s?.(e);
 		},
 		onEndChange: (e) => {
-			h(e), o?.(e);
+			_(e), c?.(e);
 		},
-		separator: s,
-		months: c,
-		disabledDate: l,
-		presets: u,
-		className: d
+		separator: l,
+		months: u,
+		disabledDate: d,
+		presets: a(f, {
+			today: v.presetToday,
+			yesterday: v.presetYesterday,
+			last7Days: v.presetLast7Days,
+			last30Days: v.presetLast30Days,
+			thisMonth: v.presetThisMonth,
+			lastMonth: v.presetLastMonth
+		}),
+		className: p
 	});
 }
 //#endregion
-export { r as default };
+export { o as default };

package/dist/components/DateRangePicker/presets.js

@@ -0,0 +1,43 @@
+"use client";
+import { addMonths as e, formatDate as t, getDaysInMonth as n } from "../Calendar/date.js";
+//#region src/lib/components/DateRangePicker/presets.ts
+function r(e, t) {
+	return new Date(e.getFullYear(), e.getMonth(), e.getDate() + t);
+}
+function i(e) {
+	return t(e.getFullYear(), e.getMonth(), e.getDate());
+}
+function a(e, r) {
+	return [t(e, r, 1), t(e, r, n(e, r))];
+}
+function o(t, n = /* @__PURE__ */ new Date()) {
+	let o = (e) => i(r(n, e)), s = a(n.getFullYear(), n.getMonth()), c = e(n.getFullYear(), n.getMonth(), -1), l = a(c.year, c.month);
+	return [
+		{
+			label: t.today,
+			range: [o(0), o(0)]
+		},
+		{
+			label: t.yesterday,
+			range: [o(-1), o(-1)]
+		},
+		{
+			label: t.last7Days,
+			range: [o(-6), o(0)]
+		},
+		{
+			label: t.last30Days,
+			range: [o(-29), o(0)]
+		},
+		{
+			label: t.thisMonth,
+			range: s
+		},
+		{
+			label: t.lastMonth,
+			range: l
+		}
+	];
+}
+//#endregion
+export { o as commonRangePresets };

package/dist/components/Datepicker/Datepicker.js

@@ -3,23 +3,24 @@ import e from "./DatepickerCore.js";
 import { jsx as t } from "react/jsx-runtime";
 import { useControl as n } from "react-use-control";
 //#region src/lib/components/Datepicker/Datepicker.tsx
-function r({ value: r, open: i, picker: a, min: o, max: s, disabledDate: c, presets: l, locale: u, weekStartsOn: d, placeholder: f, className: p, ref: m }) {
-	let [h, g] = n(r, ""), [_, v] = n(i, !1);
+function r({ value: r, open: i, picker: a, min: o, max: s, disabledDate: c, presets: l, showTime: u, locale: d, weekStartsOn: f, placeholder: p, className: m, ref: h }) {
+	let [g, _] = n(r, ""), [v, y] = n(i, !1);
 	return /* @__PURE__ */ t(e, {
-		ref: m,
-		value: h,
-		onChange: g,
-		open: _,
-		onOpenChange: v,
+		ref: h,
+		value: g,
+		onChange: _,
+		open: v,
+		onOpenChange: y,
 		picker: a,
 		min: o,
 		max: s,
 		disabledDate: c,
 		presets: l,
-		locale: u,
-		weekStartsOn: d,
-		placeholder: f,
-		className: p
+		showTime: u,
+		locale: d,
+		weekStartsOn: f,
+		placeholder: p,
+		className: m
 	});
 }
 //#endregion

package/dist/components/Datepicker/DatepickerCore.js

@@ -2,66 +2,87 @@
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { mergeRefs as t } from "../../utils/refs.js";
-import { FloatingPanel as n, useFloating as r } from "../../utils/floating.js";
-import i from "../Calendar/Calendar.js";
+import { useStrings as n } from "../LocaleProvider/useStrings.js";
+import { FloatingPanel as r, useFloating as i } from "../../utils/floating.js";
+import a from "../Calendar/Calendar.js";
+import { formatDateTimeValue as o, splitDateTimeValue as s } from "./datetime.js";
 /* empty css                         */
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { useCallback as s, useId as c, useRef as l } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useCallback as u, useId as d, useRef as f, useState as p } from "react";
 //#region src/lib/components/Datepicker/DatepickerCore.tsx
-var u = "haze-DatepickerCore__wrapper", d = "haze-DatepickerCore__input", f = "haze-DatepickerCore__dropdown", p = "haze-DatepickerCore__presetList", m = "haze-DatepickerCore__presetRow";
-function h({ value: h, onChange: g, open: _, onOpenChange: v, picker: y, min: b, max: x, disabledDate: S, presets: C, locale: w, weekStartsOn: T, placeholder: E = "Select date", className: D, ref: O }) {
-	let k = l(null), A = s((e) => t(k, O)(e), [k, O]), j = l(null), M = c(), N = s((e) => v(typeof e == "function" ? e(_) : e), [v, _]), P = r({
-		open: _,
-		setOpen: N,
-		triggerRef: k,
-		panelRef: j,
+var m = "haze-DatepickerCore__wrapper", h = "haze-DatepickerCore__input", g = "haze-DatepickerCore__dropdown", _ = "haze-DatepickerCore__presetList", v = "haze-DatepickerCore__presetRow", y = "haze-DatepickerCore__timeRow", b = "haze-DatepickerCore__timeLabel", x = "haze-DatepickerCore__timeInput";
+function S({ value: S, onChange: C, open: w, onOpenChange: T, picker: E, min: D, max: O, disabledDate: k, presets: A, showTime: j, locale: M, weekStartsOn: N, placeholder: P = "Select date", className: F, ref: I }) {
+	let L = n("datepicker"), R = f(null), z = u((e) => t(R, I)(e), [R, I]), B = f(null), V = d(), [H, U] = p("00:00"), W = j === !0 && (E ?? "date") === "date", G = W ? s(S) : null, K = W ? G?.date ?? "" : S, q = G?.time ?? H, J = u((e) => T(typeof e == "function" ? e(w) : e), [T, w]), Y = i({
+		open: w,
+		setOpen: J,
+		triggerRef: R,
+		panelRef: B,
 		animated: !0
 	});
-	return /* @__PURE__ */ o("div", {
-		className: e([u, D]),
-		children: [/* @__PURE__ */ a("input", {
-			ref: A,
+	return /* @__PURE__ */ l("div", {
+		className: e([m, F]),
+		children: [/* @__PURE__ */ c("input", {
+			ref: z,
 			readOnly: !0,
-			style: P.triggerStyle,
-			className: d,
-			value: h,
-			placeholder: E,
+			style: Y.triggerStyle,
+			className: h,
+			value: S,
+			placeholder: P,
 			role: "combobox",
 			"aria-haspopup": "dialog",
-			"aria-expanded": _,
-			"aria-controls": M,
-			onPointerDown: P.onTriggerPointerDown,
-			onClick: P.onTriggerClick
-		}), /* @__PURE__ */ o(n, {
-			ref: j,
-			behavior: P,
+			"aria-expanded": w,
+			"aria-controls": V,
+			onPointerDown: Y.onTriggerPointerDown,
+			onClick: Y.onTriggerClick
+		}), /* @__PURE__ */ l(r, {
+			ref: B,
+			behavior: Y,
 			placement: "bottom",
-			visualClass: f,
-			id: M,
-			children: [C && C.length > 0 && /* @__PURE__ */ a("div", {
-				className: e([p]),
-				children: C.map((t) => /* @__PURE__ */ a("button", {
-					type: "button",
-					onClick: () => {
-						g(t.value), v(!1);
-					},
-					className: e([m]),
-					children: t.label
-				}, `${t.label}:${t.value}`))
-			}), /* @__PURE__ */ a(i, {
-				picker: y,
-				value: h,
-				min: b,
-				max: x,
-				disabledDate: S,
-				locale: w,
-				weekStartsOn: T,
-				onSelect: (e) => {
-					g(e), v(!1);
-				}
-			})]
+			visualClass: g,
+			id: V,
+			children: [
+				A && A.length > 0 && /* @__PURE__ */ c("div", {
+					className: e([_]),
+					children: A.map((t) => /* @__PURE__ */ c("button", {
+						type: "button",
+						onClick: () => {
+							C(t.value), T(!1);
+						},
+						className: e([v]),
+						children: t.label
+					}, `${t.label}:${t.value}`))
+				}),
+				/* @__PURE__ */ c(a, {
+					picker: E,
+					value: K,
+					min: D,
+					max: O,
+					disabledDate: k,
+					locale: M,
+					weekStartsOn: N,
+					onSelect: (e) => {
+						W ? C(o(e, q)) : (C(e), T(!1));
+					}
+				}),
+				W && /* @__PURE__ */ l("div", {
+					className: e([y]),
+					children: [/* @__PURE__ */ c("span", {
+						className: e([b]),
+						children: L.time
+					}), /* @__PURE__ */ c("input", {
+						type: "time",
+						"aria-label": L.time,
+						value: q,
+						onChange: (e) => {
+							let t = e.target.value || "00:00";
+							U(t), G?.date && C(o(G.date, t));
+						},
+						className: e([x])
+					})]
+				})
+			]
 		})]
 	});
 }
 //#endregion
-export { h as default };
+export { S as default };

package/dist/components/Datepicker/datetime.js

@@ -0,0 +1,23 @@
+"use client";
+import { parseCivilDate as e } from "../Calendar/date.js";
+//#region src/lib/components/Datepicker/datetime.ts
+var t = /^(\d{4}-\d{2}-\d{2}) (2[0-3]|[01]\d):([0-5]\d)$/;
+function n(n) {
+	let r = t.exec(n);
+	if (r) {
+		let t = r[1];
+		return e(t) ? {
+			date: t,
+			time: `${r[2]}:${r[3]}`
+		} : null;
+	}
+	return e(n) ? {
+		date: n,
+		time: null
+	} : null;
+}
+function r(e, t) {
+	return `${e} ${t}`;
+}
+//#endregion
+export { r as formatDateTimeValue, n as splitDateTimeValue };

package/dist/components/Descriptions/Descriptions.js

@@ -0,0 +1,46 @@
+
+"use client";
+import { classnames as e } from "../../utils/classnames.js";
+/* empty css                       */
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/lib/components/Descriptions/Descriptions.tsx
+var r = "haze-Descriptions__root", i = "haze-Descriptions__titleStyle", a = "haze-Descriptions__listDefault", o = "haze-Descriptions__listBordered", s = "haze-Descriptions__group", c = "haze-Descriptions__labelCell", l = "haze-Descriptions__valueCell", u = "haze-Descriptions__labelCellBordered", d = "haze-Descriptions__valueCellBordered", f = "haze-Descriptions__sizeSm", p = "haze-Descriptions__sizeMd";
+function m({ items: m, columns: h = 3, bordered: g = !1, size: _ = "md", title: v, className: y, style: b, ...x }) {
+	let S = Math.max(1, Math.floor(h)), C = _ === "sm" ? f : p;
+	return /* @__PURE__ */ n("div", {
+		style: b,
+		...x,
+		className: e([r, y]),
+		children: [v && /* @__PURE__ */ t("div", {
+			className: e([i]),
+			children: v
+		}), /* @__PURE__ */ t("dl", {
+			style: { gridTemplateColumns: `repeat(${S}, auto minmax(0, 1fr))` },
+			className: e([g ? o : a]),
+			children: m.map(({ key: r, label: i, children: a, span: o = 1 }) => {
+				let f = Math.min(Math.max(o, 1), S);
+				return /* @__PURE__ */ n("div", {
+					className: e([s]),
+					children: [/* @__PURE__ */ t("dt", {
+						className: e([
+							c,
+							C,
+							g && u
+						]),
+						children: i
+					}), /* @__PURE__ */ t("dd", {
+						style: { gridColumn: `span ${f * 2 - 1}` },
+						className: e([
+							l,
+							C,
+							g && d
+						]),
+						children: a
+					})]
+				}, r);
+			})
+		})]
+	});
+}
+//#endregion
+export { m as default };

package/dist/components/Descriptions/index.js

@@ -0,0 +1,3 @@
+"use client";
+import e from "./Descriptions.js";
+export { e as Descriptions };

package/dist/components/DiffViewer/DiffViewer.js

@@ -1,12 +1,13 @@
 
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
+import { useStrings as t } from "../LocaleProvider/useStrings.js";
 /* empty css                     */
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
-import { useMemo as r } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useMemo as i } from "react";
 //#region src/lib/components/DiffViewer/DiffViewer.tsx
-var i = "haze-DiffViewer__wrapper", a = "haze-DiffViewer__header", o = "haze-DiffViewer__body", s = "haze-DiffViewer__line", c = "haze-DiffViewer__lineNum", l = "haze-DiffViewer__lineContent", u = "haze-DiffViewer__added", d = "haze-DiffViewer__removed", f = "haze-DiffViewer__addedPrefix", p = "haze-DiffViewer__removedPrefix";
-function m(e, t) {
+var a = "haze-DiffViewer__wrapper", o = "haze-DiffViewer__header", s = "haze-DiffViewer__body", c = "haze-DiffViewer__line", l = "haze-DiffViewer__lineNum", u = "haze-DiffViewer__lineContent", d = "haze-DiffViewer__added", f = "haze-DiffViewer__removed", p = "haze-DiffViewer__addedPrefix", m = "haze-DiffViewer__removedPrefix";
+function h(e, t) {
 	let n = e.split("\n"), r = t.split("\n"), i = [], a = 0, o = 0;
 	for (; a < n.length || o < r.length;) {
 		let e = n[a], t = r[o];
@@ -35,42 +36,42 @@ function m(e, t) {
 	}
 	return i;
 }
-function h({ oldValue: s, newValue: h, className: _ }) {
-	let v = r(() => m(s, h), [s, h]);
-	return /* @__PURE__ */ n("div", {
-		className: e([i, _]),
-		children: [/* @__PURE__ */ t("div", {
-			className: e([a]),
-			children: "Diff"
-		}), /* @__PURE__ */ t("div", {
+function g({ oldValue: c, newValue: g, className: v }) {
+	let y = t("diffViewer"), b = i(() => h(c, g), [c, g]);
+	return /* @__PURE__ */ r("div", {
+		className: e([a, v]),
+		children: [/* @__PURE__ */ n("div", {
 			className: e([o]),
-			children: v.map((r, i) => /* @__PURE__ */ n("div", {
+			children: y.header
+		}), /* @__PURE__ */ n("div", {
+			className: e([s]),
+			children: b.map((t, i) => /* @__PURE__ */ r("div", {
 				className: e([
-					g,
-					r.type === "added" && u,
-					r.type === "removed" && d
+					_,
+					t.type === "added" && d,
+					t.type === "removed" && f
 				]),
 				children: [
-					/* @__PURE__ */ t("span", {
-						className: e([c]),
-						children: r.oldLine ?? ""
-					}),
-					/* @__PURE__ */ t("span", {
-						className: e([c]),
-						children: r.newLine ?? ""
+					/* @__PURE__ */ n("span", {
+						className: e([l]),
+						children: t.oldLine ?? ""
 					}),
 					/* @__PURE__ */ n("span", {
 						className: e([l]),
+						children: t.newLine ?? ""
+					}),
+					/* @__PURE__ */ r("span", {
+						className: e([u]),
 						children: [
-							r.type === "added" && /* @__PURE__ */ t("span", {
-								className: e([f]),
+							t.type === "added" && /* @__PURE__ */ n("span", {
+								className: e([p]),
 								children: "+ "
 							}),
-							r.type === "removed" && /* @__PURE__ */ t("span", {
-								className: e([p]),
+							t.type === "removed" && /* @__PURE__ */ n("span", {
+								className: e([m]),
 								children: "- "
 							}),
-							r.content
+							t.content
 						]
 					})
 				]
@@ -78,6 +79,6 @@ function h({ oldValue: s, newValue: h, className: _ }) {
 		})]
 	});
 }
-var g = s;
+var _ = c;
 //#endregion
-export { h as default };
+export { g as default };

package/dist/components/FilePreview/FilePreview.js

@@ -0,0 +1,135 @@
+
+"use client";
+import { classnames as e } from "../../utils/classnames.js";
+import { useStrings as t } from "../LocaleProvider/useStrings.js";
+import n from "../Progress/Progress.js";
+import { formatFileSize as r, getFileExtension as i } from "./file-preview-format.js";
+/* empty css                      */
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/lib/components/FilePreview/FilePreview.tsx
+var s = "haze-FilePreview__card", c = "haze-FilePreview__thumbWrap", l = "haze-FilePreview__thumb", u = "haze-FilePreview__extBadge", d = "haze-FilePreview__info", f = "haze-FilePreview__nameClass", p = "haze-FilePreview__meta", m = "haze-FilePreview__statusUploading", h = "haze-FilePreview__statusError", g = "haze-FilePreview__srOnly", _ = "haze-FilePreview__actions", v = "haze-FilePreview__actionBtn", y = "haze-FilePreview__actionBtnRetry", b = "haze-FilePreview__progressRow", x = "haze-FilePreview__percentClass", S = () => /* @__PURE__ */ o("svg", {
+	width: "16",
+	height: "16",
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.25",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	focusable: "false",
+	children: [/* @__PURE__ */ a("path", { d: "M9 1.5H4A1.5 1.5 0 0 0 2.5 3v10A1.5 1.5 0 0 0 4 14.5h8a1.5 1.5 0 0 0 1.5-1.5V6L9 1.5Z" }), /* @__PURE__ */ a("path", { d: "M9 1.5V6h4.5" })]
+}), C = () => /* @__PURE__ */ a("svg", {
+	width: "12",
+	height: "12",
+	viewBox: "0 0 12 12",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	focusable: "false",
+	children: a("path", { d: "M2 6.5 4.8 9.2 10 3.5" })
+}), w = () => /* @__PURE__ */ o("svg", {
+	width: "12",
+	height: "12",
+	viewBox: "0 0 12 12",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	"aria-hidden": "true",
+	focusable: "false",
+	children: [/* @__PURE__ */ a("path", { d: "M10.5 6a4.5 4.5 0 1 1-1.32-3.18" }), /* @__PURE__ */ a("path", { d: "M10.5 1v2.5H8" })]
+}), T = () => /* @__PURE__ */ a("svg", {
+	width: "12",
+	height: "12",
+	viewBox: "0 0 12 12",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "1.5",
+	strokeLinecap: "round",
+	"aria-hidden": "true",
+	focusable: "false",
+	children: a("path", { d: "M2.5 2.5l7 7M9.5 2.5l-7 7" })
+});
+function E({ file: E, status: D = "uploaded", progress: O, onRemove: k, onRetry: A, removeLabel: j, retryLabel: M, uploadingLabel: N, uploadedLabel: P, errorLabel: F, className: I, ...L }) {
+	let R = t("filePreview"), z = j ?? R.remove, B = M ?? R.retry, V = N ?? R.uploading, H = P ?? R.uploaded, U = F ?? R.error, W = (E.type?.startsWith("image/") ?? !1) && E.url !== void 0, G = W ? "" : i(E.name), K = r(E.size), q = O === void 0 ? void 0 : Math.max(0, Math.min(100, O));
+	return /* @__PURE__ */ o("div", {
+		...L,
+		className: e([s, I]),
+		children: [
+			W ? /* @__PURE__ */ a("img", {
+				src: E.url,
+				alt: "",
+				loading: "lazy",
+				className: e([l])
+			}) : /* @__PURE__ */ o("span", {
+				className: e([c]),
+				children: [/* @__PURE__ */ a(S, {}), G && /* @__PURE__ */ a("span", {
+					"aria-hidden": "true",
+					className: e([u]),
+					children: G
+				})]
+			}),
+			/* @__PURE__ */ o("div", {
+				className: e([d]),
+				children: [/* @__PURE__ */ a("span", {
+					title: E.name,
+					className: e([f]),
+					children: E.name
+				}), /* @__PURE__ */ o("div", {
+					className: e([p]),
+					children: [
+						K && /* @__PURE__ */ a("span", { children: K }),
+						D === "uploading" && /* @__PURE__ */ a("span", {
+							className: e([m]),
+							children: V
+						}),
+						D === "uploaded" && /* @__PURE__ */ o("span", {
+							className: e([m]),
+							children: [/* @__PURE__ */ a(C, {}), /* @__PURE__ */ a("span", {
+								className: e([g]),
+								children: H
+							})]
+						}),
+						D === "error" && /* @__PURE__ */ a("span", {
+							className: e([h]),
+							children: U
+						})
+					]
+				})]
+			}),
+			(k || D === "error" && A) && /* @__PURE__ */ o("div", {
+				className: e([_]),
+				children: [D === "error" && A && /* @__PURE__ */ a("button", {
+					type: "button",
+					"aria-label": B,
+					onClick: A,
+					className: e([v, y]),
+					children: /* @__PURE__ */ a(w, {})
+				}), k && /* @__PURE__ */ a("button", {
+					type: "button",
+					"aria-label": z,
+					onClick: k,
+					className: e([v]),
+					children: /* @__PURE__ */ a(T, {})
+				})]
+			}),
+			D === "uploading" && /* @__PURE__ */ o("div", {
+				className: e([b]),
+				children: [/* @__PURE__ */ a(n, {
+					value: q ?? 0,
+					size: "sm"
+				}), q !== void 0 && /* @__PURE__ */ o("span", {
+					className: e([x]),
+					children: [Math.round(q), "%"]
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { E as default };

package/dist/components/FilePreview/file-preview-format.js

@@ -0,0 +1,23 @@
+"use client";
+//#region src/lib/components/FilePreview/file-preview-format.ts
+function e(e) {
+	if (e == null || !Number.isFinite(e) || e < 0) return "";
+	if (e < 1024) return `${e} B`;
+	let t = [
+		"KB",
+		"MB",
+		"GB",
+		"TB"
+	], n = e, r = -1;
+	do
+		n /= 1024, r += 1;
+	while (n >= 1024 && r < t.length - 1);
+	let i = n >= 100 ? 0 : n >= 10 ? 1 : 2;
+	return `${n.toFixed(i)} ${t[r]}`;
+}
+function t(e) {
+	let t = e.lastIndexOf(".");
+	return t <= 0 || t === e.length - 1 ? "" : e.slice(t + 1).toUpperCase();
+}
+//#endregion
+export { e as formatFileSize, t as getFileExtension };

package/dist/components/FilePreview/index.js

@@ -0,0 +1,3 @@
+"use client";
+import e from "./FilePreview.js";
+export { e as FilePreview };