@materialui-reactjs/admin 1.0.6 → 2.0.1

package/dist/form-heyswTRq.js

@@ -0,0 +1,3897 @@
+import { t as e } from "./Env-SHztUA3s.js";
+import { _ as t, b as n, c as r, f as i, g as a, h as o, i as s, m as c, o as l, p as u, r as d, t as f, u as p, v as m } from "./Common-_PK8HLKN.js";
+import { a as h, i as g, t as _ } from "./Validator-D2zwZeov.js";
+import { t as v } from "./SortableItem-B4-Zsso3.js";
+import y, { createContext as b, memo as x, useCallback as S, useContext as C, useEffect as w, useId as ee, useMemo as T, useReducer as te, useRef as E, useState as D } from "react";
+import O, { components as k } from "react-select";
+import { DragDropContext as ne, Draggable as re, Droppable as A } from "@hello-pangea/dnd";
+import { Fragment as j, jsx as M, jsxs as N } from "react/jsx-runtime";
+import { format as ie } from "date-fns";
+import { createPortal as P, unstable_batchedUpdates as ae } from "react-dom";
+import { add as oe, canUseDOM as F, findFirstFocusableNode as se, getEventCoordinates as ce, getOwnerDocument as I, getWindow as L, isDocument as R, isHTMLElement as le, isKeyboardEvent as ue, isNode as de, isSVGElement as z, isWindow as fe, subtract as B, useEvent as pe, useInterval as V, useIsomorphicLayoutEffect as me, useLatestValue as he, useLazyMemo as H, useNodeRef as U, usePrevious as ge, useUniqueId as _e } from "@dnd-kit/utilities";
+import { SortableContext as ve, arrayMove as ye } from "@dnd-kit/sortable";
+import { CKEditor as W } from "@ckeditor/ckeditor5-react";
+import { Alignment as be, BlockQuote as xe, Bold as Se, ButtonView as Ce, ClassicEditor as we, Code as Te, CodeBlock as G, Emoji as K, Essentials as Ee, FontBackgroundColor as De, FontColor as q, FontFamily as Oe, FontSize as ke, GeneralHtmlSupport as Ae, Heading as je, Highlight as Me, HorizontalLine as Ne, HtmlEmbed as Pe, Image as Fe, ImageCaption as Ie, ImageInsertViaUrl as Le, ImageResize as Re, ImageStyle as ze, ImageToolbar as Be, Indent as Ve, IndentBlock as He, Italic as Ue, Link as We, List as Ge, MediaEmbed as Ke, Mention as qe, Paragraph as Je, Plugin as Ye, RemoveFormat as Xe, SourceEditing as Ze, SpecialCharacters as Qe, SpecialCharactersEssentials as $e, Strikethrough as et, Subscript as tt, Superscript as nt, Table as rt, TableCellProperties as it, TableProperties as at, TableToolbar as ot, TodoList as st, Underline as ct, WordCount as lt } from "ckeditor5";
+import "ckeditor5/ckeditor5.css";
+import { DatePicker as ut } from "@mui/x-date-pickers/DatePicker";
+import { LocalizationProvider as dt } from "@mui/x-date-pickers/LocalizationProvider";
+import { AdapterDateFns as ft } from "@mui/x-date-pickers/AdapterDateFns";
+import { vi as pt } from "date-fns/locale";
+import { DateTimePicker as mt } from "@mui/x-date-pickers/DateTimePicker";
+import { Form as ht } from "react-router-dom";
+//#region src/components/form/AdvancedMultiSelect.tsx
+var gt = (e, t) => (Array.isArray(t) ? t : []).map((t) => e.find((e) => e.value === t)).filter((e) => e !== void 0), _t = (e, t, n, r, i) => {
+	let a = [];
+	r && a.push({
+		value: -1,
+		label: "Tất cả"
+	}), i && a.push({
+		value: 0,
+		label: "Không có"
+	});
+	let o = Array.isArray(e) ? e.map((e) => ({
+		value: e[t],
+		label: String(e[n] ?? "")
+	})) : [];
+	return [...a, ...o];
+}, vt = ({ label: e, name: t, lists: n = [], keyValue: r = "id", keyName: i = "name", value: a = [], cpnClass: o = "", required: s = !1, disabled: c = !1, all: l = !1, zero: u = !1, onChange: d }) => {
+	let [f, p] = D([]);
+	w(() => {
+		p(_t(n, r, i, l, u));
+	}, [n]);
+	let m = (e) => {
+		if (!e.destination) return;
+		let n = [...gt(f, a)], [r] = n.splice(e.source.index, 1);
+		n.splice(e.destination.index, 0, r), d?.({
+			target: {
+				name: t,
+				value: n.map((e) => e?.value)
+			},
+			preventDefault: () => {}
+		});
+	}, h = (e) => {
+		d?.({
+			target: {
+				name: t,
+				value: e
+			},
+			preventDefault: () => {}
+		});
+	}, g = (e) => /* @__PURE__ */ N(k.Option, {
+		...e,
+		children: [/* @__PURE__ */ M("input", {
+			type: "checkbox",
+			checked: e.isSelected,
+			onChange: () => null,
+			style: { marginRight: 8 }
+		}), /* @__PURE__ */ M("div", { children: e.label })]
+	}), _ = (e) => /* @__PURE__ */ M(re, {
+		draggableId: String(e.data.value),
+		index: e.index,
+		children: (t) => /* @__PURE__ */ M("div", {
+			ref: t.innerRef,
+			...t.draggableProps,
+			...t.dragHandleProps,
+			style: {
+				display: "inline-flex",
+				alignItems: "center",
+				marginRight: 6,
+				...t.draggableProps.style
+			},
+			children: /* @__PURE__ */ M(k.MultiValue, { ...e })
+		})
+	});
+	return /* @__PURE__ */ N("div", {
+		className: "form-group " + (o ?? ""),
+		children: [/* @__PURE__ */ M("div", {
+			className: "form-label mb-1",
+			children: e + (s ? " *" : "")
+		}), /* @__PURE__ */ M(ne, {
+			onDragEnd: m,
+			children: /* @__PURE__ */ M(A, {
+				droppableId: "selected",
+				direction: "horizontal",
+				children: (e) => /* @__PURE__ */ N("div", {
+					ref: e.innerRef,
+					...e.droppableProps,
+					children: [/* @__PURE__ */ M(O, {
+						options: f,
+						value: gt(f, a),
+						isMulti: !0,
+						isSearchable: !0,
+						closeMenuOnSelect: !1,
+						hideSelectedOptions: !1,
+						placeholder: "Chọn và kéo thả để sắp xếp...",
+						noOptionsMessage: () => "Không có dữ liệu",
+						"data-required-error": "Vui lòng nhập dữ liệu",
+						"data-error": "Dữ liệu không hợp lệ",
+						isDisabled: c,
+						components: {
+							Option: g,
+							MultiValue: _
+						},
+						onChange: (e) => h((e ?? []).map((e) => e.value)),
+						menuPortalTarget: document.body,
+						styles: {
+							menuPortal: (e) => ({
+								...e,
+								zIndex: 99999
+							}),
+							input: (e) => ({
+								...e,
+								minHeight: 30
+							}),
+							multiValue: (e) => ({
+								...e,
+								cursor: "grab"
+							}),
+							menuList: (e) => ({
+								...e,
+								display: "flex",
+								flexDirection: "column",
+								alignItems: "center",
+								paddingLeft: 5,
+								paddingRight: 5,
+								paddingTop: 5,
+								paddingBottom: 2
+							}),
+							option: (e, t) => ({
+								...e,
+								minHeight: 40,
+								width: "100%",
+								display: "flex",
+								alignItems: "center",
+								paddingTop: 8,
+								paddingBottom: 8,
+								marginBottom: 5,
+								borderRadius: 6,
+								justifyContent: "flex-start",
+								backgroundColor: t.isFocused ? "#FFC20E" : t.isSelected ? "#ED7D31" : "white",
+								color: t.isFocused ? "#333" : t.isSelected ? "#fff" : "#333",
+								cursor: "pointer"
+							})
+						}
+					}), e.placeholder]
+				})
+			})
+		})]
+	});
+}, yt = ({ label: t, name: n, cpnClass: r = "", required: i = !1, value: a = [], onChange: o, isEdit: s = !1, ext: c = ".png, .jpg, .jpeg, .ico", df: l = "" }) => {
+	let u = E(null), [p, m] = D([]), [g, _] = D(Array.isArray(a) ? a : []), v = E(/* @__PURE__ */ new Map()), y = (e) => {
+		let t = v.current.get(e);
+		return t || (t = URL.createObjectURL(e), v.current.set(e, t)), t;
+	};
+	w(() => () => {
+		v.current.forEach((e) => URL.revokeObjectURL(e)), v.current.clear();
+	}, []), w(() => {
+		_((e) => {
+			let t = Array.isArray(a) ? a : [];
+			return e.length === t.length && e.every((e, n) => e === t[n]) ? e : t;
+		});
+	}, [a]);
+	let b = (e) => {
+		e.preventDefault();
+		let t = /\.(png|jpg|jpeg|ico)$/i, n = u.current?.querySelector(".default-file-input");
+		if (!n) return;
+		let r = n.files;
+		if (!r) return;
+		let i = n.getAttribute("accept"), a = f(i, t);
+		d(r, 10, a).then(() => {
+			let e = Array.from(r);
+			m((t) => [...t, ...e]);
+		}).catch((e) => {
+			console.error("[AsxhUImages] Upload không hợp lệ:", e.message);
+		});
+	}, x = (e, t) => {
+		e.preventDefault(), _((e) => e.filter((e, n) => n !== t));
+	}, S = (e, t) => {
+		e.preventDefault();
+		let n = p[t];
+		if (n) {
+			let e = v.current.get(n);
+			e && (URL.revokeObjectURL(e), v.current.delete(n));
+		}
+		m((e) => e.filter((e, n) => n !== t));
+	};
+	w(() => {
+		o && o(h(`${n}_upload`, p, "files"));
+	}, [p]), w(() => {
+		o && o(h(n, g));
+	}, [g]);
+	let C = (t, n = "/styles/default.jpg") => t ? (e().API_URL ?? "") + "/uploads/" + t : n;
+	return /* @__PURE__ */ N("div", {
+		ref: u,
+		className: `card boxUImage ${r}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ N("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: [/* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: t
+						}), s && /* @__PURE__ */ N("label", {
+							className: "text-info cursor-pointer m-0 ms-auto",
+							children: ["Tải lên", /* @__PURE__ */ M("input", {
+								required: i,
+								name: n,
+								multiple: !0,
+								type: "file",
+								onChange: b,
+								className: "d-none default-file-input",
+								accept: c
+							})]
+						})]
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ N("div", {
+				className: "card-body py-2 px-3",
+				style: { minHeight: "50px" },
+				children: [g?.map((e, t) => {
+					let n = (e ? e.split("/").pop() ?? "" : "").split("___");
+					return /* @__PURE__ */ N("div", {
+						className: "d-flex w-100 justify-content-between",
+						children: [/* @__PURE__ */ N("div", {
+							className: `d-flex justify-content-center flex-column ${e ? "" : "d-none"}`,
+							children: [/* @__PURE__ */ N("div", {
+								className: "w-100",
+								children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+									className: "text-info",
+									href: C(e, l),
+									target: "_blank",
+									children: n?.[1]
+								})]
+							}), /* @__PURE__ */ M("span", { children: n[0] ? new Date(Number(n[0])).toLocaleString("vi-VN") : "" })]
+						}), s && /* @__PURE__ */ M("a", {
+							onClick: (e) => x(e, t),
+							href: "#",
+							className: `ml-auto link text-danger ${e ? "" : "d-none"}`,
+							children: "Xóa"
+						})]
+					}, t);
+				}), p?.map((e, t) => /* @__PURE__ */ N("div", {
+					className: "d-flex w-100 justify-content-between",
+					children: [/* @__PURE__ */ N("div", {
+						className: `d-flex align-items-center justify-content-center ${e ? "" : "d-none"}`,
+						children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+							className: "text-info text-1-line",
+							href: y(e),
+							target: "_blank",
+							rel: "noopener noreferrer",
+							children: e?.name
+						})]
+					}), s && /* @__PURE__ */ M("a", {
+						onClick: (e) => S(e, t),
+						href: "#",
+						className: `ml-auto link text-danger ${e ? "" : "d-none"}`,
+						children: "Xóa"
+					})]
+				}, t))]
+			})
+		]
+	});
+}, bt = (e, t) => {
+	t?.(e);
+	let n = e.currentTarget.closest(".input-group-outline");
+	e.currentTarget.value.trim() === "" ? n?.classList.remove("is-filled") : n?.classList.add("is-filled");
+}, xt = (e) => {
+	e.preventDefault(), e.currentTarget.closest(".input-group-outline")?.classList.add("is-focused");
+}, St = (e) => {
+	e.preventDefault(), e.currentTarget.closest(".input-group-outline")?.classList.remove("is-focused");
+}, Ct = ({ label: e, name: t, value: n = "", required: r = !1, disabled: i = !1, readonly: a = !1, cpnClass: o = "", minLength: s = 0, maxLength: c = 255, onChange: l, style: u = {} }) => {
+	let d = E(null);
+	return w(() => {
+		document.activeElement !== d.current && l && l(h(t, n));
+	}, [n]), /* @__PURE__ */ M("div", {
+		className: "form-group " + (o ?? ""),
+		children: /* @__PURE__ */ N("div", {
+			className: `input-group input-group-outline ${n ? "is-filled" : ""}`,
+			children: [/* @__PURE__ */ M("div", {
+				className: "form-label",
+				children: e + (r ? " *" : "")
+			}), /* @__PURE__ */ M("input", {
+				style: u,
+				name: t,
+				placeholder: "",
+				readOnly: a,
+				disabled: i,
+				required: r,
+				minLength: s,
+				maxLength: c,
+				"data-required-error": "Vui lòng nhập dữ liệu",
+				"data-error": "Dữ liệu không hợp lệ",
+				className: "form-control",
+				value: n,
+				onChange: (e) => bt(e, l),
+				onFocus: xt,
+				onBlur: St
+			})]
+		})
+	});
+}, wt = ({ label: e, name: t, value: n = "", required: r = !1, disabled: i = !1, readonly: a = !1, cpnClass: o = "", minLength: s = 0, maxLength: c = 255, onChange: l }) => {
+	let u = E(null);
+	return w(() => {
+		document.activeElement !== u.current && l && l(h(t, n));
+	}, [n]), /* @__PURE__ */ M("div", {
+		className: "form-group " + (o ?? ""),
+		children: /* @__PURE__ */ N("div", {
+			className: `input-group input-group-outline ${n ? "is-filled" : ""}`,
+			children: [/* @__PURE__ */ M("div", {
+				className: "form-label",
+				children: e + (r ? " *" : "")
+			}), /* @__PURE__ */ M("input", {
+				type: "email",
+				name: t,
+				readOnly: a,
+				disabled: i,
+				required: r,
+				minLength: s,
+				maxLength: c,
+				"data-required-error": "Vui lòng nhập dữ liệu",
+				"data-error": "Dữ liệu không hợp lệ",
+				className: "form-control",
+				value: n,
+				onChange: (e) => bt(e, l),
+				onFocus: xt,
+				onBlur: St
+			})]
+		})
+	});
+}, Tt = ({ label: e, name: t, value: n = "", cpnClass: r = "", required: i = !1, disabled: a = !1, readonly: o = !1, rows: s = 3, onChange: c }) => {
+	let l = E(null);
+	return w(() => {
+		document.activeElement !== l.current && c && c(h(t, n));
+	}, [n]), /* @__PURE__ */ M("div", {
+		className: "form-group " + (r ?? ""),
+		children: /* @__PURE__ */ N("div", {
+			className: `input-group input-group-outline ${n ? "is-filled" : ""}`,
+			children: [/* @__PURE__ */ M("div", {
+				className: "form-label",
+				children: e + (i ? " *" : "")
+			}), /* @__PURE__ */ M("textarea", {
+				name: t,
+				rows: s,
+				onFocus: xt,
+				onBlur: St,
+				readOnly: o,
+				disabled: a,
+				required: i,
+				"data-required-error": "Vui lòng nhập dữ liệu",
+				"data-error": "Dữ liệu không hợp lệ",
+				className: "form-control",
+				value: n,
+				onChange: (e) => bt(e, c)
+			})]
+		})
+	});
+}, Et = ({ label: e, name: t, value: n = 0, step: r = 1, required: i = !1, disabled: a = !1, readonly: o = !1, cpnClass: s = "", max: c, min: l, onChange: u, style: d = {} }) => {
+	let [f, p] = D("0"), m = E(null);
+	w(() => {
+		if (document.activeElement !== m.current) {
+			n &&= String(n).replace(/\./g, ",");
+			let e = _(String(n));
+			if (Number(e) > 2 ** 53 - 1 || Number(e) < -(2 ** 53 - 1)) return;
+			let r = e.split("."), i = r[0]?.replace(/[^\d-]/g, "");
+			i.indexOf("-") > 0 && (i = "-" + i.replace(/-/g, ""));
+			let a = r[1];
+			i = BigInt(i).toLocaleString("vi-VN");
+			let o = a === void 0 ? i : `${i},${a}`;
+			p(o), u && u(h(t, e));
+		}
+	}, [n]);
+	let g = (e, n) => {
+		let r = String(e.currentTarget.value), i = e.currentTarget.selectionStart ?? 0, a = (r.slice(0, i).match(/\d/g) || []).length, o = _(r);
+		if (Number(o) > 2 ** 53 - 1 || Number(o) < -(2 ** 53 - 1)) return;
+		let s = o.split("."), c = s[0]?.replace(/[^\d-]/g, "");
+		c.indexOf("-") > 0 && (c = "-" + c.replace(/-/g, ""));
+		let l = s[1];
+		c = BigInt(c).toLocaleString("vi-VN");
+		let u = l === void 0 ? c : `${c},${l}`;
+		p(u), n?.(h(t, o));
+		let d = e.currentTarget.closest(".input-group-outline");
+		r.trim() === "" ? d?.classList.remove("is-filled") : d?.classList.add("is-filled"), requestAnimationFrame(() => {
+			let e = v(u, a), t = m.current;
+			if (t) {
+				let n = Math.max(0, Math.min(u.length, e));
+				t.setSelectionRange(n, n);
+			}
+		});
+	};
+	function _(e) {
+		if (!e) return "";
+		let t = e;
+		t = t.replace(/[^\d,-]/g, ""), t = t.replace(/(?!^)-/g, "");
+		let n = t.indexOf(",");
+		return n !== -1 && (t = t.slice(0, n + 1) + t.slice(n + 1).replace(/,/g, "")), t = t.replace(/,/g, "."), t;
+	}
+	function v(e, t) {
+		let n = 0;
+		for (let r = 0; r < e.length; r++) if (/\d/.test(e[r]) && n++, n === t) return r + 1;
+		return e.length;
+	}
+	return /* @__PURE__ */ M("div", {
+		className: "form-group " + (s ?? ""),
+		children: /* @__PURE__ */ N("div", {
+			className: "input-group input-group-outline is-filled",
+			children: [/* @__PURE__ */ M("div", {
+				className: "form-label",
+				children: e + (i ? " *" : "") + (c ? " (Tối đa " + c + ")" : "")
+			}), /* @__PURE__ */ M("input", {
+				ref: m,
+				style: d,
+				type: "text",
+				name: t,
+				step: r,
+				readOnly: o,
+				max: c ?? 2 ** 53 - 1,
+				min: l ?? -(2 ** 53 - 1),
+				disabled: a,
+				required: i,
+				"data-required-error": "Vui lòng nhập dữ liệu",
+				"data-error": "Dữ liệu không hợp lệ",
+				className: "form-control",
+				value: f,
+				onChange: (e) => g(e, u),
+				onFocus: xt,
+				onBlur: St
+			})]
+		})
+	});
+}, Dt = ({ label: e, name: t, value: n = "", cpnClass: r = "", required: i = !1, disabled: a = !1, readonly: o = !1, onChange: s, autoComplete: c = "" }) => /* @__PURE__ */ M("div", {
+	className: "form-group " + (r ?? ""),
+	children: /* @__PURE__ */ N("div", {
+		className: `input-group input-group-outline ${n ? "is-filled" : ""}`,
+		children: [/* @__PURE__ */ M("div", {
+			className: "form-label",
+			children: e + (i ? " *" : "")
+		}), /* @__PURE__ */ M("input", {
+			name: t,
+			type: "password",
+			disabled: a,
+			readOnly: o,
+			required: i,
+			"data-required-error": "Vui lòng nhập dữ liệu",
+			className: "form-control",
+			value: n,
+			onChange: (e) => bt(e, s),
+			onFocus: xt,
+			onBlur: St,
+			autoComplete: c,
+			"data-error": "Vui lòng nhập mật khẩu dài 8-32 ký tự, có ký tự chữ số, chữ hoa và chữ thường, ký tự @#$!%^&*",
+			pattern: "^(?=.*\\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[@#$!%^&*])[0-9a-zA-Z@#$!%^&*.]{8,32}$"
+		})]
+	})
+}), Ot = ({ label: e, name: t = "", value: n = "", cpnClass: r = "", required: i = !1, disabled: a = !1, readonly: o = !1, onChange: s }) => /* @__PURE__ */ M("div", {
+	className: "form-group " + (r ?? ""),
+	children: /* @__PURE__ */ N("div", {
+		className: `input-group input-group-outline ${n ? "is-filled" : ""}`,
+		children: [/* @__PURE__ */ M("div", {
+			className: "form-label",
+			children: e + (i ? " *" : "")
+		}), /* @__PURE__ */ M("input", {
+			type: "text",
+			name: t,
+			disabled: a,
+			readOnly: o,
+			required: i,
+			"data-pattern": "^[03|05|07|08|09]{2}[0-9]{8}$",
+			"data-pattern-error": "Vui lòng nhập đúng số điện thoại thuê bao Việt Nam",
+			"data-required-error": "Vui lòng nhập dữ liệu",
+			className: "form-control",
+			onChange: (e) => bt(e, s),
+			onFocus: xt,
+			onBlur: St,
+			value: n
+		})]
+	})
+}), kt = ({ label: e, lists: t, name: n = "", value: r = "", cpnClass: i = "", required: a = !1, disabled: o = !1 }) => {
+	let s = ee(), c = Array.isArray(t) ? t : [], l = (e) => typeof e == "object" && !!e && !(e instanceof File);
+	return /* @__PURE__ */ N("div", {
+		className: "form-group " + (i ?? ""),
+		children: [/* @__PURE__ */ M("label", {
+			className: "form-label ms-auto font-weight-bold",
+			children: e + (a ? " *" : "")
+		}), /* @__PURE__ */ M("div", {
+			className: "row grid-space-16",
+			children: c.map((e, t) => {
+				let i = l(e) ? e.id : e, c = `${s}-${t}`;
+				return /* @__PURE__ */ M("div", {
+					className: "col-auto",
+					children: /* @__PURE__ */ N("div", {
+						className: "form-check ps-0",
+						children: [/* @__PURE__ */ M("input", {
+							type: "radio",
+							name: n,
+							required: a,
+							disabled: o,
+							id: c,
+							className: "form-check-input",
+							value: String(i ?? ""),
+							defaultChecked: r == i
+						}), /* @__PURE__ */ M("label", {
+							className: "custom-control-label",
+							htmlFor: c,
+							children: l(e) ? String(e.name ?? "") : String(e)
+						})]
+					})
+				}, c);
+			})
+		})]
+	});
+}, At = ({ label: e, name: t, col: n = "col-auto", keyValue: r = "id", keyName: i = "name", lists: a = [], value: o = [], required: s = !1, disabled: c = !1, readonly: l = !1, cpnClass: u = "", onChange: d }) => {
+	let f = Array.isArray(a) ? a : [], p = Array.isArray(o) ? o : [];
+	return /* @__PURE__ */ N("div", {
+		className: "form-group " + (u ?? ""),
+		children: [/* @__PURE__ */ M("div", {
+			className: "form-label",
+			children: e + (s ? " *" : "")
+		}), /* @__PURE__ */ M("div", {
+			className: "row grid-space-16",
+			children: f.map((e) => /* @__PURE__ */ M("div", {
+				className: n,
+				children: /* @__PURE__ */ M("div", {
+					className: "form-check ps-0",
+					children: /* @__PURE__ */ N("label", {
+						className: "form-check-label d-flex",
+						children: [
+							/* @__PURE__ */ M("input", {
+								type: "checkbox",
+								"data-required-error": "Vui lòng nhập dữ liệu",
+								"data-error": "Dữ liệu không hợp lệ",
+								name: t,
+								className: "form-check-input d-none",
+								readOnly: l,
+								disabled: c,
+								required: s,
+								value: String(e[r] ?? ""),
+								checked: p.includes(e[r]),
+								onChange: d
+							}),
+							/* @__PURE__ */ M("span", {
+								className: "form-check-sign",
+								children: /* @__PURE__ */ M("span", { className: "check" })
+							}),
+							/* @__PURE__ */ M("span", {
+								className: "cursor-pointer mb-0 ms-2",
+								children: String(e[i] ?? "")
+							})
+						]
+					})
+				})
+			}))
+		})]
+	});
+}, jt = (e, t) => e.find((e) => e.value === t) || null, Mt = (e, t) => {
+	let n = Array.isArray(t) ? t : [];
+	return e.filter((e) => n.includes(e.value));
+}, Nt = (e, t, n, r, i) => {
+	let a = [];
+	r && a.push({
+		value: -1,
+		label: "Tất cả"
+	}), i && a.push({
+		value: 0,
+		label: "Không có"
+	});
+	let o = Array.isArray(e) ? e.map((e) => ({
+		value: e[t],
+		label: e[n]
+	})) : [];
+	return [...a, ...o];
+}, Pt = ({ label: e, name: t, lists: n = [], keyValue: r = "id", keyName: i = "name", value: a = "", cpnClass: o = "", required: s = !1, disabled: c = !1, all: l = !1, zero: u = !1, onChange: d, style: f = {} }) => {
+	let [p, m] = D([]);
+	w(() => {
+		m(Nt(n, r, i, l, u));
+	}, [n]);
+	let g = E(!1);
+	w(() => {
+		g.current || p.length && (g.current = !0, d?.(h(t, a)));
+	}, [p]);
+	let _ = (e) => {
+		d && d(h(t, e));
+	}, v = E(null);
+	return w(() => {
+		let e = v.current?.querySelector(`input[name="${t}"][required]`);
+		e && e.setCustomValidity(a ? "" : "Vui lòng nhập dữ liệu");
+	}, [
+		a,
+		t,
+		s
+	]), /* @__PURE__ */ M("div", {
+		ref: v,
+		className: "form-group box-select " + (o ?? ""),
+		style: f,
+		children: /* @__PURE__ */ N("div", {
+			className: "input-group input-group-outline is-filled",
+			children: [/* @__PURE__ */ M("span", {
+				className: "form-label",
+				children: e + (s ? " *" : "")
+			}), /* @__PURE__ */ M(O, {
+				menuPortalTarget: document.body,
+				styles: { menuPortal: (e) => ({
+					...e,
+					zIndex: 99999
+				}) },
+				classNamePrefix: "react-select",
+				placeholder: "Chọn",
+				name: t,
+				options: p,
+				value: jt(p, a),
+				onChange: (e) => _(e?.value ?? null),
+				noOptionsMessage: () => "Không có dữ liệu",
+				isDisabled: c,
+				required: s,
+				"data-required-error": "Vui lòng nhập dữ liệu",
+				"data-error": "Dữ liệu không hợp lệ",
+				className: "form-control"
+			})]
+		})
+	});
+}, Ft = ({ label: e, name: t, lists: n = [], keyValue: r = "id", keyName: i = "name", value: a = [], cpnClass: o = "", required: s = !1, disabled: c = !1, all: l = !1, zero: u = !1, onChange: d }) => {
+	let [f, p] = D([]);
+	w(() => {
+		p(Nt(n, r, i, l, u));
+	}, [n]);
+	let m = (e) => {
+		d?.(h(t, e));
+	}, g = E(null);
+	return w(() => {
+		let e = g.current?.querySelector(`input[name="${t}"][required]`);
+		e && e.setCustomValidity(a?.length ? "" : "Vui lòng nhập dữ liệu");
+	}, [
+		a,
+		t,
+		s
+	]), /* @__PURE__ */ M("div", {
+		ref: g,
+		className: "form-group box-select " + (o ?? ""),
+		children: /* @__PURE__ */ N("div", {
+			className: "input-group input-group-outline is-filled",
+			children: [/* @__PURE__ */ M("span", {
+				className: "form-label",
+				children: e + (s ? " *" : "")
+			}), /* @__PURE__ */ M(O, {
+				menuPortalTarget: document.body,
+				styles: { menuPortal: (e) => ({
+					...e,
+					zIndex: 99999
+				}) },
+				classNamePrefix: "react-select",
+				placeholder: "Chọn",
+				name: t,
+				options: f,
+				value: Mt(f, a),
+				onChange: (e) => m((e ?? []).map((e) => e.value)),
+				noOptionsMessage: () => "Không có dữ liệu",
+				isDisabled: c,
+				required: s,
+				isMulti: !0,
+				"data-required-error": "Vui lòng nhập dữ liệu",
+				"data-error": "Dữ liệu không hợp lệ",
+				className: "form-control"
+			})]
+		})
+	});
+}, It = ({ label: e, name: t, cpnClass: n = "", required: r = !1, value: a = "", onChange: o, isEdit: s = !1, ext: c = ".jpg, .jpeg, .png", df: l = "/styles/default.jpg" }) => {
+	let u = E(null), [d, f] = D(a);
+	return w(() => {
+		let e = u.current?.querySelector(".upImage");
+		e && m(e, "#elfinderModal", (e) => {
+			let { data: t, md: n } = e;
+			if (t) {
+				let e = Array.isArray(t) ? t[0] : t;
+				f(e.url?.replace(/^.*\/static/, "")), n?.hide();
+			}
+		});
+	}, []), w(() => {
+		o && o(h(t, d));
+	}, [d]), w(() => {
+		f(a);
+	}, [a]), /* @__PURE__ */ N("div", {
+		ref: u,
+		className: `card ${n}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ M("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: /* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						})
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ M("div", {
+				className: "card-body d-flex justify-content-center p-0",
+				children: /* @__PURE__ */ M("div", {
+					className: "d-flex align-items-center justify-content-center",
+					children: /* @__PURE__ */ M("img", {
+						className: "height-100 object-fit-contain",
+						src: i(d, l),
+						alt: "img"
+					})
+				})
+			}),
+			s && /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M("hr", { className: "my-0" }), /* @__PURE__ */ N("div", {
+				className: "card-footer d-flex justify-content-between",
+				children: [
+					/* @__PURE__ */ M("label", {
+						className: "text-info cursor-pointer m-0 upImage",
+						children: "Tải lên"
+					}),
+					/* @__PURE__ */ M("input", {
+						value: d,
+						required: r,
+						name: t,
+						type: "text",
+						onChange: o,
+						className: "d-none default-file-input",
+						accept: c
+					}),
+					d && /* @__PURE__ */ M("a", {
+						href: "#",
+						onClick: () => {
+							f("");
+						},
+						className: "ml-auto link text-danger",
+						children: "Xóa"
+					})
+				]
+			})] })
+		]
+	});
+}, Lt = { display: "none" };
+function Rt(e) {
+	let { id: t, value: n } = e;
+	return y.createElement("div", {
+		id: t,
+		style: Lt
+	}, n);
+}
+function zt(e) {
+	let { id: t, announcement: n, ariaLiveType: r = "assertive" } = e;
+	return y.createElement("div", {
+		id: t,
+		style: {
+			position: "fixed",
+			top: 0,
+			left: 0,
+			width: 1,
+			height: 1,
+			margin: -1,
+			border: 0,
+			padding: 0,
+			overflow: "hidden",
+			clip: "rect(0 0 0 0)",
+			clipPath: "inset(100%)",
+			whiteSpace: "nowrap"
+		},
+		role: "status",
+		"aria-live": r,
+		"aria-atomic": !0
+	}, n);
+}
+function Bt() {
+	let [e, t] = D("");
+	return {
+		announce: S((e) => {
+			e != null && t(e);
+		}, []),
+		announcement: e
+	};
+}
+//#endregion
+//#region node_modules/@dnd-kit/core/dist/core.esm.js
+var Vt = /*#__PURE__*/ b(null);
+function Ht(e) {
+	let t = C(Vt);
+	w(() => {
+		if (!t) throw Error("useDndMonitor must be used within a children of <DndContext>");
+		return t(e);
+	}, [e, t]);
+}
+function Ut() {
+	let [e] = D(() => /* @__PURE__ */ new Set()), t = S((t) => (e.add(t), () => e.delete(t)), [e]);
+	return [S((t) => {
+		let { type: n, event: r } = t;
+		e.forEach((e) => e[n]?.call(e, r));
+	}, [e]), t];
+}
+var Wt = { draggable: "\n    To pick up a draggable item, press the space bar.\n    While dragging, use the arrow keys to move the item.\n    Press space again to drop the item in its new position, or press escape to cancel.\n  " }, Gt = {
+	onDragStart(e) {
+		let { active: t } = e;
+		return "Picked up draggable item " + t.id + ".";
+	},
+	onDragOver(e) {
+		let { active: t, over: n } = e;
+		return n ? "Draggable item " + t.id + " was moved over droppable area " + n.id + "." : "Draggable item " + t.id + " is no longer over a droppable area.";
+	},
+	onDragEnd(e) {
+		let { active: t, over: n } = e;
+		return n ? "Draggable item " + t.id + " was dropped over droppable area " + n.id : "Draggable item " + t.id + " was dropped.";
+	},
+	onDragCancel(e) {
+		let { active: t } = e;
+		return "Dragging was cancelled. Draggable item " + t.id + " was dropped.";
+	}
+};
+function Kt(e) {
+	let { announcements: t = Gt, container: n, hiddenTextDescribedById: r, screenReaderInstructions: i = Wt } = e, { announce: a, announcement: o } = Bt(), s = _e("DndLiveRegion"), [c, l] = D(!1);
+	if (w(() => {
+		l(!0);
+	}, []), Ht(T(() => ({
+		onDragStart(e) {
+			let { active: n } = e;
+			a(t.onDragStart({ active: n }));
+		},
+		onDragMove(e) {
+			let { active: n, over: r } = e;
+			t.onDragMove && a(t.onDragMove({
+				active: n,
+				over: r
+			}));
+		},
+		onDragOver(e) {
+			let { active: n, over: r } = e;
+			a(t.onDragOver({
+				active: n,
+				over: r
+			}));
+		},
+		onDragEnd(e) {
+			let { active: n, over: r } = e;
+			a(t.onDragEnd({
+				active: n,
+				over: r
+			}));
+		},
+		onDragCancel(e) {
+			let { active: n, over: r } = e;
+			a(t.onDragCancel({
+				active: n,
+				over: r
+			}));
+		}
+	}), [a, t])), !c) return null;
+	let u = y.createElement(y.Fragment, null, y.createElement(Rt, {
+		id: r,
+		value: i.draggable
+	}), y.createElement(zt, {
+		id: s,
+		announcement: o
+	}));
+	return n ? P(u, n) : u;
+}
+var J;
+(function(e) {
+	e.DragStart = "dragStart", e.DragMove = "dragMove", e.DragEnd = "dragEnd", e.DragCancel = "dragCancel", e.DragOver = "dragOver", e.RegisterDroppable = "registerDroppable", e.SetDroppableDisabled = "setDroppableDisabled", e.UnregisterDroppable = "unregisterDroppable";
+})(J ||= {});
+function qt() {}
+var Y = /*#__PURE__*/ Object.freeze({
+	x: 0,
+	y: 0
+});
+function Jt(e, t) {
+	return Math.sqrt((e.x - t.x) ** 2 + (e.y - t.y) ** 2);
+}
+function Yt(e, t) {
+	let { data: { value: n } } = e, { data: { value: r } } = t;
+	return n - r;
+}
+function Xt(e, t) {
+	let { data: { value: n } } = e, { data: { value: r } } = t;
+	return r - n;
+}
+function Zt(e, t) {
+	if (!e || e.length === 0) return null;
+	let [n] = e;
+	return t ? n[t] : n;
+}
+function Qt(e, t, n) {
+	return t === void 0 && (t = e.left), n === void 0 && (n = e.top), {
+		x: t + e.width * .5,
+		y: n + e.height * .5
+	};
+}
+var $t = (e) => {
+	let { collisionRect: t, droppableRects: n, droppableContainers: r } = e, i = Qt(t, t.left, t.top), a = [];
+	for (let e of r) {
+		let { id: t } = e, r = n.get(t);
+		if (r) {
+			let n = Jt(Qt(r), i);
+			a.push({
+				id: t,
+				data: {
+					droppableContainer: e,
+					value: n
+				}
+			});
+		}
+	}
+	return a.sort(Yt);
+};
+function en(e, t) {
+	let n = Math.max(t.top, e.top), r = Math.max(t.left, e.left), i = Math.min(t.left + t.width, e.left + e.width), a = Math.min(t.top + t.height, e.top + e.height), o = i - r, s = a - n;
+	if (r < i && n < a) {
+		let n = t.width * t.height, r = e.width * e.height, i = o * s, a = i / (n + r - i);
+		return Number(a.toFixed(4));
+	}
+	return 0;
+}
+var tn = (e) => {
+	let { collisionRect: t, droppableRects: n, droppableContainers: r } = e, i = [];
+	for (let e of r) {
+		let { id: r } = e, a = n.get(r);
+		if (a) {
+			let n = en(a, t);
+			n > 0 && i.push({
+				id: r,
+				data: {
+					droppableContainer: e,
+					value: n
+				}
+			});
+		}
+	}
+	return i.sort(Xt);
+};
+function nn(e, t, n) {
+	return {
+		...e,
+		scaleX: t && n ? t.width / n.width : 1,
+		scaleY: t && n ? t.height / n.height : 1
+	};
+}
+function rn(e, t) {
+	return e && t ? {
+		x: e.left - t.left,
+		y: e.top - t.top
+	} : Y;
+}
+function an(e) {
+	return function(t) {
+		return [...arguments].slice(1).reduce((t, n) => ({
+			...t,
+			top: t.top + e * n.y,
+			bottom: t.bottom + e * n.y,
+			left: t.left + e * n.x,
+			right: t.right + e * n.x
+		}), { ...t });
+	};
+}
+var on = /*#__PURE__*/ an(1);
+function sn(e) {
+	if (e.startsWith("matrix3d(")) {
+		let t = e.slice(9, -1).split(/, /);
+		return {
+			x: +t[12],
+			y: +t[13],
+			scaleX: +t[0],
+			scaleY: +t[5]
+		};
+	}
+	if (e.startsWith("matrix(")) {
+		let t = e.slice(7, -1).split(/, /);
+		return {
+			x: +t[4],
+			y: +t[5],
+			scaleX: +t[0],
+			scaleY: +t[3]
+		};
+	}
+	return null;
+}
+function cn(e, t, n) {
+	let r = sn(t);
+	if (!r) return e;
+	let { scaleX: i, scaleY: a, x: o, y: s } = r, c = e.left - o - (1 - i) * parseFloat(n), l = e.top - s - (1 - a) * parseFloat(n.slice(n.indexOf(" ") + 1)), u = i ? e.width / i : e.width, d = a ? e.height / a : e.height;
+	return {
+		width: u,
+		height: d,
+		top: l,
+		right: c + u,
+		bottom: l + d,
+		left: c
+	};
+}
+var ln = { ignoreTransform: !1 };
+function un(e, t) {
+	t === void 0 && (t = ln);
+	let n = e.getBoundingClientRect();
+	if (t.ignoreTransform) {
+		let { transform: t, transformOrigin: r } = L(e).getComputedStyle(e);
+		t && (n = cn(n, t, r));
+	}
+	let { top: r, left: i, width: a, height: o, bottom: s, right: c } = n;
+	return {
+		top: r,
+		left: i,
+		width: a,
+		height: o,
+		bottom: s,
+		right: c
+	};
+}
+function dn(e) {
+	return un(e, { ignoreTransform: !0 });
+}
+function fn(e) {
+	let t = e.innerWidth, n = e.innerHeight;
+	return {
+		top: 0,
+		left: 0,
+		right: t,
+		bottom: n,
+		width: t,
+		height: n
+	};
+}
+function pn(e, t) {
+	return t === void 0 && (t = L(e).getComputedStyle(e)), t.position === "fixed";
+}
+function mn(e, t) {
+	t === void 0 && (t = L(e).getComputedStyle(e));
+	let n = /(auto|scroll|overlay)/;
+	return [
+		"overflow",
+		"overflowX",
+		"overflowY"
+	].some((e) => {
+		let r = t[e];
+		return typeof r == "string" && n.test(r);
+	});
+}
+function hn(e, t) {
+	let n = [];
+	function r(i) {
+		if (t != null && n.length >= t || !i) return n;
+		if (R(i) && i.scrollingElement != null && !n.includes(i.scrollingElement)) return n.push(i.scrollingElement), n;
+		if (!le(i) || z(i) || n.includes(i)) return n;
+		let a = L(e).getComputedStyle(i);
+		return i !== e && mn(i, a) && n.push(i), pn(i, a) ? n : r(i.parentNode);
+	}
+	return e ? r(e) : n;
+}
+function gn(e) {
+	let [t] = hn(e, 1);
+	return t ?? null;
+}
+function _n(e) {
+	return !F || !e ? null : fe(e) ? e : de(e) ? R(e) || e === I(e).scrollingElement ? window : le(e) ? e : null : null;
+}
+function vn(e) {
+	return fe(e) ? e.scrollX : e.scrollLeft;
+}
+function yn(e) {
+	return fe(e) ? e.scrollY : e.scrollTop;
+}
+function bn(e) {
+	return {
+		x: vn(e),
+		y: yn(e)
+	};
+}
+var X;
+(function(e) {
+	e[e.Forward = 1] = "Forward", e[e.Backward = -1] = "Backward";
+})(X ||= {});
+function xn(e) {
+	return !F || !e ? !1 : e === document.scrollingElement;
+}
+function Sn(e) {
+	let t = {
+		x: 0,
+		y: 0
+	}, n = xn(e) ? {
+		height: window.innerHeight,
+		width: window.innerWidth
+	} : {
+		height: e.clientHeight,
+		width: e.clientWidth
+	}, r = {
+		x: e.scrollWidth - n.width,
+		y: e.scrollHeight - n.height
+	};
+	return {
+		isTop: e.scrollTop <= t.y,
+		isLeft: e.scrollLeft <= t.x,
+		isBottom: e.scrollTop >= r.y,
+		isRight: e.scrollLeft >= r.x,
+		maxScroll: r,
+		minScroll: t
+	};
+}
+var Cn = {
+	x: .2,
+	y: .2
+};
+function wn(e, t, n, r, i) {
+	let { top: a, left: o, right: s, bottom: c } = n;
+	r === void 0 && (r = 10), i === void 0 && (i = Cn);
+	let { isTop: l, isBottom: u, isLeft: d, isRight: f } = Sn(e), p = {
+		x: 0,
+		y: 0
+	}, m = {
+		x: 0,
+		y: 0
+	}, h = {
+		height: t.height * i.y,
+		width: t.width * i.x
+	};
+	return !l && a <= t.top + h.height ? (p.y = X.Backward, m.y = r * Math.abs((t.top + h.height - a) / h.height)) : !u && c >= t.bottom - h.height && (p.y = X.Forward, m.y = r * Math.abs((t.bottom - h.height - c) / h.height)), !f && s >= t.right - h.width ? (p.x = X.Forward, m.x = r * Math.abs((t.right - h.width - s) / h.width)) : !d && o <= t.left + h.width && (p.x = X.Backward, m.x = r * Math.abs((t.left + h.width - o) / h.width)), {
+		direction: p,
+		speed: m
+	};
+}
+function Tn(e) {
+	if (e === document.scrollingElement) {
+		let { innerWidth: e, innerHeight: t } = window;
+		return {
+			top: 0,
+			left: 0,
+			right: e,
+			bottom: t,
+			width: e,
+			height: t
+		};
+	}
+	let { top: t, left: n, right: r, bottom: i } = e.getBoundingClientRect();
+	return {
+		top: t,
+		left: n,
+		right: r,
+		bottom: i,
+		width: e.clientWidth,
+		height: e.clientHeight
+	};
+}
+function En(e) {
+	return e.reduce((e, t) => oe(e, bn(t)), Y);
+}
+function Dn(e) {
+	return e.reduce((e, t) => e + vn(t), 0);
+}
+function On(e) {
+	return e.reduce((e, t) => e + yn(t), 0);
+}
+function kn(e, t) {
+	if (t === void 0 && (t = un), !e) return;
+	let { top: n, left: r, bottom: i, right: a } = t(e);
+	gn(e) && (i <= 0 || a <= 0 || n >= window.innerHeight || r >= window.innerWidth) && e.scrollIntoView({
+		block: "center",
+		inline: "center"
+	});
+}
+var An = [[
+	"x",
+	["left", "right"],
+	Dn
+], [
+	"y",
+	["top", "bottom"],
+	On
+]], jn = class {
+	constructor(e, t) {
+		this.rect = void 0, this.width = void 0, this.height = void 0, this.top = void 0, this.bottom = void 0, this.right = void 0, this.left = void 0;
+		let n = hn(t), r = En(n);
+		this.rect = { ...e }, this.width = e.width, this.height = e.height;
+		for (let [e, t, i] of An) for (let a of t) Object.defineProperty(this, a, {
+			get: () => {
+				let t = i(n), o = r[e] - t;
+				return this.rect[a] + o;
+			},
+			enumerable: !0
+		});
+		Object.defineProperty(this, "rect", { enumerable: !1 });
+	}
+}, Mn = class {
+	constructor(e) {
+		this.target = void 0, this.listeners = [], this.removeAll = () => {
+			this.listeners.forEach((e) => this.target?.removeEventListener(...e));
+		}, this.target = e;
+	}
+	add(e, t, n) {
+		var r;
+		(r = this.target) == null || r.addEventListener(e, t, n), this.listeners.push([
+			e,
+			t,
+			n
+		]);
+	}
+};
+function Nn(e) {
+	let { EventTarget: t } = L(e);
+	return e instanceof t ? e : I(e);
+}
+function Pn(e, t) {
+	let n = Math.abs(e.x), r = Math.abs(e.y);
+	return typeof t == "number" ? Math.sqrt(n ** 2 + r ** 2) > t : "x" in t && "y" in t ? n > t.x && r > t.y : "x" in t ? n > t.x : "y" in t && r > t.y;
+}
+var Z;
+(function(e) {
+	e.Click = "click", e.DragStart = "dragstart", e.Keydown = "keydown", e.ContextMenu = "contextmenu", e.Resize = "resize", e.SelectionChange = "selectionchange", e.VisibilityChange = "visibilitychange";
+})(Z ||= {});
+function Fn(e) {
+	e.preventDefault();
+}
+function In(e) {
+	e.stopPropagation();
+}
+var Q;
+(function(e) {
+	e.Space = "Space", e.Down = "ArrowDown", e.Right = "ArrowRight", e.Left = "ArrowLeft", e.Up = "ArrowUp", e.Esc = "Escape", e.Enter = "Enter", e.Tab = "Tab";
+})(Q ||= {});
+var Ln = {
+	start: [Q.Space, Q.Enter],
+	cancel: [Q.Esc],
+	end: [
+		Q.Space,
+		Q.Enter,
+		Q.Tab
+	]
+}, Rn = (e, t) => {
+	let { currentCoordinates: n } = t;
+	switch (e.code) {
+		case Q.Right: return {
+			...n,
+			x: n.x + 25
+		};
+		case Q.Left: return {
+			...n,
+			x: n.x - 25
+		};
+		case Q.Down: return {
+			...n,
+			y: n.y + 25
+		};
+		case Q.Up: return {
+			...n,
+			y: n.y - 25
+		};
+	}
+}, zn = class {
+	constructor(e) {
+		this.props = void 0, this.autoScrollEnabled = !1, this.referenceCoordinates = void 0, this.listeners = void 0, this.windowListeners = void 0, this.props = e;
+		let { event: { target: t } } = e;
+		this.props = e, this.listeners = new Mn(I(t)), this.windowListeners = new Mn(L(t)), this.handleKeyDown = this.handleKeyDown.bind(this), this.handleCancel = this.handleCancel.bind(this), this.attach();
+	}
+	attach() {
+		this.handleStart(), this.windowListeners.add(Z.Resize, this.handleCancel), this.windowListeners.add(Z.VisibilityChange, this.handleCancel), setTimeout(() => this.listeners.add(Z.Keydown, this.handleKeyDown));
+	}
+	handleStart() {
+		let { activeNode: e, onStart: t } = this.props, n = e.node.current;
+		n && kn(n), t(Y);
+	}
+	handleKeyDown(e) {
+		if (ue(e)) {
+			let { active: t, context: n, options: r } = this.props, { keyboardCodes: i = Ln, coordinateGetter: a = Rn, scrollBehavior: o = "smooth" } = r, { code: s } = e;
+			if (i.end.includes(s)) {
+				this.handleEnd(e);
+				return;
+			}
+			if (i.cancel.includes(s)) {
+				this.handleCancel(e);
+				return;
+			}
+			let { collisionRect: c } = n.current, l = c ? {
+				x: c.left,
+				y: c.top
+			} : Y;
+			this.referenceCoordinates ||= l;
+			let u = a(e, {
+				active: t,
+				context: n.current,
+				currentCoordinates: l
+			});
+			if (u) {
+				let t = B(u, l), r = {
+					x: 0,
+					y: 0
+				}, { scrollableAncestors: i } = n.current;
+				for (let n of i) {
+					let i = e.code, { isTop: a, isRight: s, isLeft: c, isBottom: l, maxScroll: d, minScroll: f } = Sn(n), p = Tn(n), m = {
+						x: Math.min(i === Q.Right ? p.right - p.width / 2 : p.right, Math.max(i === Q.Right ? p.left : p.left + p.width / 2, u.x)),
+						y: Math.min(i === Q.Down ? p.bottom - p.height / 2 : p.bottom, Math.max(i === Q.Down ? p.top : p.top + p.height / 2, u.y))
+					}, h = i === Q.Right && !s || i === Q.Left && !c, g = i === Q.Down && !l || i === Q.Up && !a;
+					if (h && m.x !== u.x) {
+						let e = n.scrollLeft + t.x, a = i === Q.Right && e <= d.x || i === Q.Left && e >= f.x;
+						if (a && !t.y) {
+							n.scrollTo({
+								left: e,
+								behavior: o
+							});
+							return;
+						}
+						r.x = a ? n.scrollLeft - e : i === Q.Right ? n.scrollLeft - d.x : n.scrollLeft - f.x, r.x && n.scrollBy({
+							left: -r.x,
+							behavior: o
+						});
+						break;
+					}
+					if (g && m.y !== u.y) {
+						let e = n.scrollTop + t.y, a = i === Q.Down && e <= d.y || i === Q.Up && e >= f.y;
+						if (a && !t.x) {
+							n.scrollTo({
+								top: e,
+								behavior: o
+							});
+							return;
+						}
+						r.y = a ? n.scrollTop - e : i === Q.Down ? n.scrollTop - d.y : n.scrollTop - f.y, r.y && n.scrollBy({
+							top: -r.y,
+							behavior: o
+						});
+						break;
+					}
+				}
+				this.handleMove(e, oe(B(u, this.referenceCoordinates), r));
+			}
+		}
+	}
+	handleMove(e, t) {
+		let { onMove: n } = this.props;
+		e.preventDefault(), n(t);
+	}
+	handleEnd(e) {
+		let { onEnd: t } = this.props;
+		e.preventDefault(), this.detach(), t();
+	}
+	handleCancel(e) {
+		let { onCancel: t } = this.props;
+		e.preventDefault(), this.detach(), t();
+	}
+	detach() {
+		this.listeners.removeAll(), this.windowListeners.removeAll();
+	}
+};
+zn.activators = [{
+	eventName: "onKeyDown",
+	handler: (e, t, n) => {
+		let { keyboardCodes: r = Ln, onActivation: i } = t, { active: a } = n, { code: o } = e.nativeEvent;
+		if (r.start.includes(o)) {
+			let t = a.activatorNode.current;
+			return t && e.target !== t ? !1 : (e.preventDefault(), i?.({ event: e.nativeEvent }), !0);
+		}
+		return !1;
+	}
+}];
+function Bn(e) {
+	return !!(e && "distance" in e);
+}
+function Vn(e) {
+	return !!(e && "delay" in e);
+}
+var Hn = class {
+	constructor(e, t, n) {
+		n === void 0 && (n = Nn(e.event.target)), this.props = void 0, this.events = void 0, this.autoScrollEnabled = !0, this.document = void 0, this.activated = !1, this.initialCoordinates = void 0, this.timeoutId = null, this.listeners = void 0, this.documentListeners = void 0, this.windowListeners = void 0, this.props = e, this.events = t;
+		let { event: r } = e, { target: i } = r;
+		this.props = e, this.events = t, this.document = I(i), this.documentListeners = new Mn(this.document), this.listeners = new Mn(n), this.windowListeners = new Mn(L(i)), this.initialCoordinates = ce(r) ?? Y, this.handleStart = this.handleStart.bind(this), this.handleMove = this.handleMove.bind(this), this.handleEnd = this.handleEnd.bind(this), this.handleCancel = this.handleCancel.bind(this), this.handleKeydown = this.handleKeydown.bind(this), this.removeTextSelection = this.removeTextSelection.bind(this), this.attach();
+	}
+	attach() {
+		let { events: e, props: { options: { activationConstraint: t, bypassActivationConstraint: n } } } = this;
+		if (this.listeners.add(e.move.name, this.handleMove, { passive: !1 }), this.listeners.add(e.end.name, this.handleEnd), e.cancel && this.listeners.add(e.cancel.name, this.handleCancel), this.windowListeners.add(Z.Resize, this.handleCancel), this.windowListeners.add(Z.DragStart, Fn), this.windowListeners.add(Z.VisibilityChange, this.handleCancel), this.windowListeners.add(Z.ContextMenu, Fn), this.documentListeners.add(Z.Keydown, this.handleKeydown), t) {
+			if (n != null && n({
+				event: this.props.event,
+				activeNode: this.props.activeNode,
+				options: this.props.options
+			})) return this.handleStart();
+			if (Vn(t)) {
+				this.timeoutId = setTimeout(this.handleStart, t.delay), this.handlePending(t);
+				return;
+			}
+			if (Bn(t)) {
+				this.handlePending(t);
+				return;
+			}
+		}
+		this.handleStart();
+	}
+	detach() {
+		this.listeners.removeAll(), this.windowListeners.removeAll(), setTimeout(this.documentListeners.removeAll, 50), this.timeoutId !== null && (clearTimeout(this.timeoutId), this.timeoutId = null);
+	}
+	handlePending(e, t) {
+		let { active: n, onPending: r } = this.props;
+		r(n, e, this.initialCoordinates, t);
+	}
+	handleStart() {
+		let { initialCoordinates: e } = this, { onStart: t } = this.props;
+		e && (this.activated = !0, this.documentListeners.add(Z.Click, In, { capture: !0 }), this.removeTextSelection(), this.documentListeners.add(Z.SelectionChange, this.removeTextSelection), t(e));
+	}
+	handleMove(e) {
+		let { activated: t, initialCoordinates: n, props: r } = this, { onMove: i, options: { activationConstraint: a } } = r;
+		if (!n) return;
+		let o = ce(e) ?? Y, s = B(n, o);
+		if (!t && a) {
+			if (Bn(a)) {
+				if (a.tolerance != null && Pn(s, a.tolerance)) return this.handleCancel();
+				if (Pn(s, a.distance)) return this.handleStart();
+			}
+			if (Vn(a) && Pn(s, a.tolerance)) return this.handleCancel();
+			this.handlePending(a, s);
+			return;
+		}
+		e.cancelable && e.preventDefault(), i(o);
+	}
+	handleEnd() {
+		let { onAbort: e, onEnd: t } = this.props;
+		this.detach(), this.activated || e(this.props.active), t();
+	}
+	handleCancel() {
+		let { onAbort: e, onCancel: t } = this.props;
+		this.detach(), this.activated || e(this.props.active), t();
+	}
+	handleKeydown(e) {
+		e.code === Q.Esc && this.handleCancel();
+	}
+	removeTextSelection() {
+		var e;
+		(e = this.document.getSelection()) == null || e.removeAllRanges();
+	}
+}, Un = {
+	cancel: { name: "pointercancel" },
+	move: { name: "pointermove" },
+	end: { name: "pointerup" }
+}, Wn = class extends Hn {
+	constructor(e) {
+		let { event: t } = e, n = I(t.target);
+		super(e, Un, n);
+	}
+};
+Wn.activators = [{
+	eventName: "onPointerDown",
+	handler: (e, t) => {
+		let { nativeEvent: n } = e, { onActivation: r } = t;
+		return !n.isPrimary || n.button !== 0 ? !1 : (r?.({ event: n }), !0);
+	}
+}];
+var Gn = {
+	move: { name: "mousemove" },
+	end: { name: "mouseup" }
+}, Kn;
+(function(e) {
+	e[e.RightClick = 2] = "RightClick";
+})(Kn ||= {});
+var qn = class extends Hn {
+	constructor(e) {
+		super(e, Gn, I(e.event.target));
+	}
+};
+qn.activators = [{
+	eventName: "onMouseDown",
+	handler: (e, t) => {
+		let { nativeEvent: n } = e, { onActivation: r } = t;
+		return n.button !== Kn.RightClick && (r?.({ event: n }), !0);
+	}
+}];
+var Jn = {
+	cancel: { name: "touchcancel" },
+	move: { name: "touchmove" },
+	end: { name: "touchend" }
+}, Yn = class extends Hn {
+	constructor(e) {
+		super(e, Jn);
+	}
+	static setup() {
+		return window.addEventListener(Jn.move.name, e, {
+			capture: !1,
+			passive: !1
+		}), function() {
+			window.removeEventListener(Jn.move.name, e);
+		};
+		function e() {}
+	}
+};
+Yn.activators = [{
+	eventName: "onTouchStart",
+	handler: (e, t) => {
+		let { nativeEvent: n } = e, { onActivation: r } = t, { touches: i } = n;
+		return i.length > 1 ? !1 : (r?.({ event: n }), !0);
+	}
+}];
+var Xn;
+(function(e) {
+	e[e.Pointer = 0] = "Pointer", e[e.DraggableRect = 1] = "DraggableRect";
+})(Xn ||= {});
+var Zn;
+(function(e) {
+	e[e.TreeOrder = 0] = "TreeOrder", e[e.ReversedTreeOrder = 1] = "ReversedTreeOrder";
+})(Zn ||= {});
+function Qn(e) {
+	let { acceleration: t, activator: n = Xn.Pointer, canScroll: r, draggingRect: i, enabled: a, interval: o = 5, order: s = Zn.TreeOrder, pointerCoordinates: c, scrollableAncestors: l, scrollableAncestorRects: u, delta: d, threshold: f } = e, p = er({
+		delta: d,
+		disabled: !a
+	}), [m, h] = V(), g = E({
+		x: 0,
+		y: 0
+	}), _ = E({
+		x: 0,
+		y: 0
+	}), v = T(() => {
+		switch (n) {
+			case Xn.Pointer: return c ? {
+				top: c.y,
+				bottom: c.y,
+				left: c.x,
+				right: c.x
+			} : null;
+			case Xn.DraggableRect: return i;
+		}
+	}, [
+		n,
+		i,
+		c
+	]), y = E(null), b = S(() => {
+		let e = y.current;
+		if (!e) return;
+		let t = g.current.x * _.current.x, n = g.current.y * _.current.y;
+		e.scrollBy(t, n);
+	}, []), x = T(() => s === Zn.TreeOrder ? [...l].reverse() : l, [s, l]);
+	w(() => {
+		if (!a || !l.length || !v) {
+			h();
+			return;
+		}
+		for (let e of x) {
+			if (r?.(e) === !1) continue;
+			let n = l.indexOf(e), i = u[n];
+			if (!i) continue;
+			let { direction: a, speed: s } = wn(e, i, v, t, f);
+			for (let e of ["x", "y"]) p[e][a[e]] || (s[e] = 0, a[e] = 0);
+			if (s.x > 0 || s.y > 0) {
+				h(), y.current = e, m(b, o), g.current = s, _.current = a;
+				return;
+			}
+		}
+		g.current = {
+			x: 0,
+			y: 0
+		}, _.current = {
+			x: 0,
+			y: 0
+		}, h();
+	}, [
+		t,
+		b,
+		r,
+		h,
+		a,
+		o,
+		JSON.stringify(v),
+		JSON.stringify(p),
+		m,
+		l,
+		x,
+		u,
+		JSON.stringify(f)
+	]);
+}
+var $n = {
+	x: {
+		[X.Backward]: !1,
+		[X.Forward]: !1
+	},
+	y: {
+		[X.Backward]: !1,
+		[X.Forward]: !1
+	}
+};
+function er(e) {
+	let { delta: t, disabled: n } = e, r = ge(t);
+	return H((e) => {
+		if (n || !r || !e) return $n;
+		let i = {
+			x: Math.sign(t.x - r.x),
+			y: Math.sign(t.y - r.y)
+		};
+		return {
+			x: {
+				[X.Backward]: e.x[X.Backward] || i.x === -1,
+				[X.Forward]: e.x[X.Forward] || i.x === 1
+			},
+			y: {
+				[X.Backward]: e.y[X.Backward] || i.y === -1,
+				[X.Forward]: e.y[X.Forward] || i.y === 1
+			}
+		};
+	}, [
+		n,
+		t,
+		r
+	]);
+}
+function tr(e, t) {
+	let n = t == null ? void 0 : e.get(t), r = n ? n.node.current : null;
+	return H((e) => t == null ? null : r ?? e ?? null, [r, t]);
+}
+function nr(e, t) {
+	return T(() => e.reduce((e, n) => {
+		let { sensor: r } = n, i = r.activators.map((e) => ({
+			eventName: e.eventName,
+			handler: t(e.handler, n)
+		}));
+		return [...e, ...i];
+	}, []), [e, t]);
+}
+var rr;
+(function(e) {
+	e[e.Always = 0] = "Always", e[e.BeforeDragging = 1] = "BeforeDragging", e[e.WhileDragging = 2] = "WhileDragging";
+})(rr ||= {});
+var ir;
+(function(e) {
+	e.Optimized = "optimized";
+})(ir ||= {});
+var ar = /*#__PURE__*/ new Map();
+function or(e, t) {
+	let { dragging: n, dependencies: r, config: i } = t, [a, o] = D(null), { frequency: s, measure: c, strategy: l } = i, u = E(e), d = g(), f = he(d), p = S(function(e) {
+		e === void 0 && (e = []), !f.current && o((t) => t === null ? e : t.concat(e.filter((e) => !t.includes(e))));
+	}, [f]), m = E(null), h = H((t) => {
+		if (d && !n) return ar;
+		if (!t || t === ar || u.current !== e || a != null) {
+			let t = /* @__PURE__ */ new Map();
+			for (let n of e) {
+				if (!n) continue;
+				if (a && a.length > 0 && !a.includes(n.id) && n.rect.current) {
+					t.set(n.id, n.rect.current);
+					continue;
+				}
+				let e = n.node.current, r = e ? new jn(c(e), e) : null;
+				n.rect.current = r, r && t.set(n.id, r);
+			}
+			return t;
+		}
+		return t;
+	}, [
+		e,
+		a,
+		n,
+		d,
+		c
+	]);
+	return w(() => {
+		u.current = e;
+	}, [e]), w(() => {
+		d || p();
+	}, [n, d]), w(() => {
+		a && a.length > 0 && o(null);
+	}, [JSON.stringify(a)]), w(() => {
+		d || typeof s != "number" || m.current !== null || (m.current = setTimeout(() => {
+			p(), m.current = null;
+		}, s));
+	}, [
+		s,
+		d,
+		p,
+		...r
+	]), {
+		droppableRects: h,
+		measureDroppableContainers: p,
+		measuringScheduled: a != null
+	};
+	function g() {
+		switch (l) {
+			case rr.Always: return !1;
+			case rr.BeforeDragging: return n;
+			default: return !n;
+		}
+	}
+}
+function sr(e, t) {
+	return H((n) => e ? n || (typeof t == "function" ? t(e) : e) : null, [t, e]);
+}
+function cr(e, t) {
+	return sr(e, t);
+}
+function lr(e) {
+	let { callback: t, disabled: n } = e, r = pe(t), i = T(() => {
+		if (n || typeof window > "u" || window.MutationObserver === void 0) return;
+		let { MutationObserver: e } = window;
+		return new e(r);
+	}, [r, n]);
+	return w(() => () => i?.disconnect(), [i]), i;
+}
+function ur(e) {
+	let { callback: t, disabled: n } = e, r = pe(t), i = T(() => {
+		if (n || typeof window > "u" || window.ResizeObserver === void 0) return;
+		let { ResizeObserver: e } = window;
+		return new e(r);
+	}, [n]);
+	return w(() => () => i?.disconnect(), [i]), i;
+}
+function dr(e) {
+	return new jn(un(e), e);
+}
+function fr(e, t, n) {
+	t === void 0 && (t = dr);
+	let [r, i] = D(null);
+	function a() {
+		i((r) => {
+			if (!e) return null;
+			if (e.isConnected === !1) return r ?? n ?? null;
+			let i = t(e);
+			return JSON.stringify(r) === JSON.stringify(i) ? r : i;
+		});
+	}
+	let o = lr({ callback(t) {
+		if (e) for (let n of t) {
+			let { type: t, target: r } = n;
+			if (t === "childList" && r instanceof HTMLElement && r.contains(e)) {
+				a();
+				break;
+			}
+		}
+	} }), s = ur({ callback: a });
+	return me(() => {
+		a(), e ? (s?.observe(e), o?.observe(document.body, {
+			childList: !0,
+			subtree: !0
+		})) : (s?.disconnect(), o?.disconnect());
+	}, [e]), r;
+}
+function pr(e) {
+	return rn(e, sr(e));
+}
+var mr = [];
+function hr(e) {
+	let t = E(e), n = H((n) => e ? n && n !== mr && e && t.current && e.parentNode === t.current.parentNode ? n : hn(e) : mr, [e]);
+	return w(() => {
+		t.current = e;
+	}, [e]), n;
+}
+function gr(e) {
+	let [t, n] = D(null), r = E(e), i = S((e) => {
+		let t = _n(e.target);
+		t && n((e) => e ? (e.set(t, bn(t)), new Map(e)) : null);
+	}, []);
+	return w(() => {
+		let t = r.current;
+		if (e !== t) {
+			a(t);
+			let o = e.map((e) => {
+				let t = _n(e);
+				return t ? (t.addEventListener("scroll", i, { passive: !0 }), [t, bn(t)]) : null;
+			}).filter((e) => e != null);
+			n(o.length ? new Map(o) : null), r.current = e;
+		}
+		return () => {
+			a(e), a(t);
+		};
+		function a(e) {
+			e.forEach((e) => {
+				_n(e)?.removeEventListener("scroll", i);
+			});
+		}
+	}, [i, e]), T(() => e.length ? t ? Array.from(t.values()).reduce((e, t) => oe(e, t), Y) : En(e) : Y, [e, t]);
+}
+function _r(e, t) {
+	t === void 0 && (t = []);
+	let n = E(null);
+	return w(() => {
+		n.current = null;
+	}, t), w(() => {
+		let t = e !== Y;
+		t && !n.current && (n.current = e), !t && n.current && (n.current = null);
+	}, [e]), n.current ? B(e, n.current) : Y;
+}
+function vr(e) {
+	w(() => {
+		if (!F) return;
+		let t = e.map((e) => {
+			let { sensor: t } = e;
+			return t.setup == null ? void 0 : t.setup();
+		});
+		return () => {
+			for (let e of t) e?.();
+		};
+	}, e.map((e) => {
+		let { sensor: t } = e;
+		return t;
+	}));
+}
+function yr(e) {
+	return T(() => e ? fn(e) : null, [e]);
+}
+var br = [];
+function xr(e, t) {
+	t === void 0 && (t = un);
+	let [n] = e, r = yr(n ? L(n) : null), [i, a] = D(br);
+	function o() {
+		a(() => e.length ? e.map((e) => xn(e) ? r : new jn(t(e), e)) : br);
+	}
+	let s = ur({ callback: o });
+	return me(() => {
+		s?.disconnect(), o(), e.forEach((e) => s?.observe(e));
+	}, [e]), i;
+}
+function Sr(e) {
+	if (!e) return null;
+	if (e.children.length > 1) return e;
+	let t = e.children[0];
+	return le(t) ? t : e;
+}
+function Cr(e) {
+	let { measure: t } = e, [n, r] = D(null), i = ur({ callback: S((e) => {
+		for (let { target: n } of e) if (le(n)) {
+			r((e) => {
+				let r = t(n);
+				return e ? {
+					...e,
+					width: r.width,
+					height: r.height
+				} : r;
+			});
+			break;
+		}
+	}, [t]) }), a = S((e) => {
+		let n = Sr(e);
+		i?.disconnect(), n && i?.observe(n), r(n ? t(n) : null);
+	}, [t, i]), [o, s] = U(a);
+	return T(() => ({
+		nodeRef: o,
+		rect: n,
+		setRef: s
+	}), [
+		n,
+		o,
+		s
+	]);
+}
+var wr = [{
+	sensor: Wn,
+	options: {}
+}, {
+	sensor: zn,
+	options: {}
+}], Tr = { current: {} }, Er = {
+	draggable: { measure: dn },
+	droppable: {
+		measure: dn,
+		strategy: rr.WhileDragging,
+		frequency: ir.Optimized
+	},
+	dragOverlay: { measure: un }
+}, Dr = class extends Map {
+	get(e) {
+		return e == null ? void 0 : super.get(e) ?? void 0;
+	}
+	toArray() {
+		return Array.from(this.values());
+	}
+	getEnabled() {
+		return this.toArray().filter((e) => {
+			let { disabled: t } = e;
+			return !t;
+		});
+	}
+	getNodeFor(e) {
+		return this.get(e)?.node.current ?? void 0;
+	}
+}, Or = {
+	activatorEvent: null,
+	active: null,
+	activeNode: null,
+	activeNodeRect: null,
+	collisions: null,
+	containerNodeRect: null,
+	draggableNodes: /*#__PURE__*/ new Map(),
+	droppableRects: /*#__PURE__*/ new Map(),
+	droppableContainers: /*#__PURE__*/ new Dr(),
+	over: null,
+	dragOverlay: {
+		nodeRef: { current: null },
+		rect: null,
+		setRef: qt
+	},
+	scrollableAncestors: [],
+	scrollableAncestorRects: [],
+	measuringConfiguration: Er,
+	measureDroppableContainers: qt,
+	windowRect: null,
+	measuringScheduled: !1
+}, kr = /*#__PURE__*/ b({
+	activatorEvent: null,
+	activators: [],
+	active: null,
+	activeNodeRect: null,
+	ariaDescribedById: { draggable: "" },
+	dispatch: qt,
+	draggableNodes: /*#__PURE__*/ new Map(),
+	over: null,
+	measureDroppableContainers: qt
+}), Ar = /*#__PURE__*/ b(Or);
+function jr() {
+	return {
+		draggable: {
+			active: null,
+			initialCoordinates: {
+				x: 0,
+				y: 0
+			},
+			nodes: /* @__PURE__ */ new Map(),
+			translate: {
+				x: 0,
+				y: 0
+			}
+		},
+		droppable: { containers: new Dr() }
+	};
+}
+function Mr(e, t) {
+	switch (t.type) {
+		case J.DragStart: return {
+			...e,
+			draggable: {
+				...e.draggable,
+				initialCoordinates: t.initialCoordinates,
+				active: t.active
+			}
+		};
+		case J.DragMove: return e.draggable.active == null ? e : {
+			...e,
+			draggable: {
+				...e.draggable,
+				translate: {
+					x: t.coordinates.x - e.draggable.initialCoordinates.x,
+					y: t.coordinates.y - e.draggable.initialCoordinates.y
+				}
+			}
+		};
+		case J.DragEnd:
+		case J.DragCancel: return {
+			...e,
+			draggable: {
+				...e.draggable,
+				active: null,
+				initialCoordinates: {
+					x: 0,
+					y: 0
+				},
+				translate: {
+					x: 0,
+					y: 0
+				}
+			}
+		};
+		case J.RegisterDroppable: {
+			let { element: n } = t, { id: r } = n, i = new Dr(e.droppable.containers);
+			return i.set(r, n), {
+				...e,
+				droppable: {
+					...e.droppable,
+					containers: i
+				}
+			};
+		}
+		case J.SetDroppableDisabled: {
+			let { id: n, key: r, disabled: i } = t, a = e.droppable.containers.get(n);
+			if (!a || r !== a.key) return e;
+			let o = new Dr(e.droppable.containers);
+			return o.set(n, {
+				...a,
+				disabled: i
+			}), {
+				...e,
+				droppable: {
+					...e.droppable,
+					containers: o
+				}
+			};
+		}
+		case J.UnregisterDroppable: {
+			let { id: n, key: r } = t, i = e.droppable.containers.get(n);
+			if (!i || r !== i.key) return e;
+			let a = new Dr(e.droppable.containers);
+			return a.delete(n), {
+				...e,
+				droppable: {
+					...e.droppable,
+					containers: a
+				}
+			};
+		}
+		default: return e;
+	}
+}
+function Nr(e) {
+	let { disabled: t } = e, { active: n, activatorEvent: r, draggableNodes: i } = C(kr), a = ge(r), o = ge(n?.id);
+	return w(() => {
+		if (!t && !r && a && o != null) {
+			if (!ue(a) || document.activeElement === a.target) return;
+			let e = i.get(o);
+			if (!e) return;
+			let { activatorNode: t, node: n } = e;
+			if (!t.current && !n.current) return;
+			requestAnimationFrame(() => {
+				for (let e of [t.current, n.current]) {
+					if (!e) continue;
+					let t = se(e);
+					if (t) {
+						t.focus();
+						break;
+					}
+				}
+			});
+		}
+	}, [
+		r,
+		t,
+		i,
+		o,
+		a
+	]), null;
+}
+function Pr(e, t) {
+	let { transform: n, ...r } = t;
+	return e != null && e.length ? e.reduce((e, t) => t({
+		transform: e,
+		...r
+	}), n) : n;
+}
+function Fr(e) {
+	return T(() => ({
+		draggable: {
+			...Er.draggable,
+			...e?.draggable
+		},
+		droppable: {
+			...Er.droppable,
+			...e?.droppable
+		},
+		dragOverlay: {
+			...Er.dragOverlay,
+			...e?.dragOverlay
+		}
+	}), [
+		e?.draggable,
+		e?.droppable,
+		e?.dragOverlay
+	]);
+}
+function Ir(e) {
+	let { activeNode: t, measure: n, initialRect: r, config: i = !0 } = e, a = E(!1), { x: o, y: s } = typeof i == "boolean" ? {
+		x: i,
+		y: i
+	} : i;
+	me(() => {
+		if (!o && !s || !t) {
+			a.current = !1;
+			return;
+		}
+		if (a.current || !r) return;
+		let e = t?.node.current;
+		if (!e || e.isConnected === !1) return;
+		let i = rn(n(e), r);
+		if (o || (i.x = 0), s || (i.y = 0), a.current = !0, Math.abs(i.x) > 0 || Math.abs(i.y) > 0) {
+			let t = gn(e);
+			t && t.scrollBy({
+				top: i.y,
+				left: i.x
+			});
+		}
+	}, [
+		t,
+		o,
+		s,
+		r,
+		n
+	]);
+}
+var Lr = /*#__PURE__*/ b({
+	...Y,
+	scaleX: 1,
+	scaleY: 1
+}), $;
+(function(e) {
+	e[e.Uninitialized = 0] = "Uninitialized", e[e.Initializing = 1] = "Initializing", e[e.Initialized = 2] = "Initialized";
+})($ ||= {});
+var Rr = /*#__PURE__*/ x(function(e) {
+	let { id: t, accessibility: n, autoScroll: r = !0, children: i, sensors: a = wr, collisionDetection: o = tn, measuring: s, modifiers: c, ...l } = e, [u, d] = te(Mr, void 0, jr), [f, p] = Ut(), [m, h] = D($.Uninitialized), g = m === $.Initialized, { draggable: { active: _, nodes: v, translate: b }, droppable: { containers: x } } = u, C = _ == null ? null : v.get(_), ee = E({
+		initial: null,
+		translated: null
+	}), O = T(() => _ == null ? null : {
+		id: _,
+		data: C?.data ?? Tr,
+		rect: ee
+	}, [_, C]), k = E(null), [ne, re] = D(null), [A, j] = D(null), M = he(l, Object.values(l)), N = _e("DndDescribedBy", t), ie = T(() => x.getEnabled(), [x]), P = Fr(s), { droppableRects: F, measureDroppableContainers: se, measuringScheduled: I } = or(ie, {
+		dragging: g,
+		dependencies: [b.x, b.y],
+		config: P.droppable
+	}), R = tr(v, _), le = T(() => A ? ce(A) : null, [A]), ue = Fe(), de = cr(R, P.draggable.measure);
+	Ir({
+		activeNode: _ == null ? null : v.get(_),
+		config: ue.layoutShiftCompensation,
+		initialRect: de,
+		measure: P.draggable.measure
+	});
+	let z = fr(R, P.draggable.measure, de), fe = fr(R ? R.parentElement : null), B = E({
+		activatorEvent: null,
+		active: null,
+		activeNode: R,
+		collisionRect: null,
+		collisions: null,
+		droppableRects: F,
+		draggableNodes: v,
+		draggingNode: null,
+		draggingNodeRect: null,
+		droppableContainers: x,
+		over: null,
+		scrollableAncestors: [],
+		scrollAdjustedTranslate: null
+	}), pe = x.getNodeFor(B.current.over?.id), V = Cr({ measure: P.dragOverlay.measure }), H = V.nodeRef.current ?? R, U = g ? V.rect ?? z : null, ge = !!(V.nodeRef.current && V.rect), ve = pr(ge ? null : z), ye = yr(H ? L(H) : null), W = hr(g ? pe ?? R : null), be = xr(W), xe = Pr(c, {
+		transform: {
+			x: b.x - ve.x,
+			y: b.y - ve.y,
+			scaleX: 1,
+			scaleY: 1
+		},
+		activatorEvent: A,
+		active: O,
+		activeNodeRect: z,
+		containerNodeRect: fe,
+		draggingNodeRect: U,
+		over: B.current.over,
+		overlayNodeRect: V.rect,
+		scrollableAncestors: W,
+		scrollableAncestorRects: be,
+		windowRect: ye
+	}), Se = le ? oe(le, b) : null, Ce = gr(W), we = _r(Ce), Te = _r(Ce, [z]), G = oe(xe, we), K = U ? on(U, xe) : null, Ee = O && K ? o({
+		active: O,
+		collisionRect: K,
+		droppableRects: F,
+		droppableContainers: ie,
+		pointerCoordinates: Se
+	}) : null, De = Zt(Ee, "id"), [q, Oe] = D(null), ke = nn(ge ? xe : oe(xe, Te), q?.rect ?? null, z), Ae = E(null), je = S((e, t) => {
+		let { sensor: n, options: r } = t;
+		if (k.current == null) return;
+		let i = v.get(k.current);
+		if (!i) return;
+		let a = e.nativeEvent, o = new n({
+			active: k.current,
+			activeNode: i,
+			event: a,
+			options: r,
+			context: B,
+			onAbort(e) {
+				if (!v.get(e)) return;
+				let { onDragAbort: t } = M.current, n = { id: e };
+				t?.(n), f({
+					type: "onDragAbort",
+					event: n
+				});
+			},
+			onPending(e, t, n, r) {
+				if (!v.get(e)) return;
+				let { onDragPending: i } = M.current, a = {
+					id: e,
+					constraint: t,
+					initialCoordinates: n,
+					offset: r
+				};
+				i?.(a), f({
+					type: "onDragPending",
+					event: a
+				});
+			},
+			onStart(e) {
+				let t = k.current;
+				if (t == null) return;
+				let n = v.get(t);
+				if (!n) return;
+				let { onDragStart: r } = M.current, i = {
+					activatorEvent: a,
+					active: {
+						id: t,
+						data: n.data,
+						rect: ee
+					}
+				};
+				ae(() => {
+					r?.(i), h($.Initializing), d({
+						type: J.DragStart,
+						initialCoordinates: e,
+						active: t
+					}), f({
+						type: "onDragStart",
+						event: i
+					}), re(Ae.current), j(a);
+				});
+			},
+			onMove(e) {
+				d({
+					type: J.DragMove,
+					coordinates: e
+				});
+			},
+			onEnd: s(J.DragEnd),
+			onCancel: s(J.DragCancel)
+		});
+		Ae.current = o;
+		function s(e) {
+			return async function() {
+				let { active: t, collisions: n, over: r, scrollAdjustedTranslate: i } = B.current, o = null;
+				if (t && i) {
+					let { cancelDrop: s } = M.current;
+					o = {
+						activatorEvent: a,
+						active: t,
+						collisions: n,
+						delta: i,
+						over: r
+					}, e === J.DragEnd && typeof s == "function" && await Promise.resolve(s(o)) && (e = J.DragCancel);
+				}
+				k.current = null, ae(() => {
+					d({ type: e }), h($.Uninitialized), Oe(null), re(null), j(null), Ae.current = null;
+					let t = e === J.DragEnd ? "onDragEnd" : "onDragCancel";
+					if (o) {
+						let e = M.current[t];
+						e?.(o), f({
+							type: t,
+							event: o
+						});
+					}
+				});
+			};
+		}
+	}, [v]), Me = nr(a, S((e, t) => (n, r) => {
+		let i = n.nativeEvent, a = v.get(r);
+		if (k.current !== null || !a || i.dndKit || i.defaultPrevented) return;
+		let o = { active: a };
+		e(n, t.options, o) === !0 && (i.dndKit = { capturedBy: t.sensor }, k.current = r, je(n, t));
+	}, [v, je]));
+	vr(a), me(() => {
+		z && m === $.Initializing && h($.Initialized);
+	}, [z, m]), w(() => {
+		let { onDragMove: e } = M.current, { active: t, activatorEvent: n, collisions: r, over: i } = B.current;
+		if (!t || !n) return;
+		let a = {
+			active: t,
+			activatorEvent: n,
+			collisions: r,
+			delta: {
+				x: G.x,
+				y: G.y
+			},
+			over: i
+		};
+		ae(() => {
+			e?.(a), f({
+				type: "onDragMove",
+				event: a
+			});
+		});
+	}, [G.x, G.y]), w(() => {
+		let { active: e, activatorEvent: t, collisions: n, droppableContainers: r, scrollAdjustedTranslate: i } = B.current;
+		if (!e || k.current == null || !t || !i) return;
+		let { onDragOver: a } = M.current, o = r.get(De), s = o && o.rect.current ? {
+			id: o.id,
+			rect: o.rect.current,
+			data: o.data,
+			disabled: o.disabled
+		} : null, c = {
+			active: e,
+			activatorEvent: t,
+			collisions: n,
+			delta: {
+				x: i.x,
+				y: i.y
+			},
+			over: s
+		};
+		ae(() => {
+			Oe(s), a?.(c), f({
+				type: "onDragOver",
+				event: c
+			});
+		});
+	}, [De]), me(() => {
+		B.current = {
+			activatorEvent: A,
+			active: O,
+			activeNode: R,
+			collisionRect: K,
+			collisions: Ee,
+			droppableRects: F,
+			draggableNodes: v,
+			draggingNode: H,
+			draggingNodeRect: U,
+			droppableContainers: x,
+			over: q,
+			scrollableAncestors: W,
+			scrollAdjustedTranslate: G
+		}, ee.current = {
+			initial: U,
+			translated: K
+		};
+	}, [
+		O,
+		R,
+		Ee,
+		K,
+		v,
+		H,
+		U,
+		F,
+		x,
+		q,
+		W,
+		G
+	]), Qn({
+		...ue,
+		delta: b,
+		draggingRect: K,
+		pointerCoordinates: Se,
+		scrollableAncestors: W,
+		scrollableAncestorRects: be
+	});
+	let Ne = T(() => ({
+		active: O,
+		activeNode: R,
+		activeNodeRect: z,
+		activatorEvent: A,
+		collisions: Ee,
+		containerNodeRect: fe,
+		dragOverlay: V,
+		draggableNodes: v,
+		droppableContainers: x,
+		droppableRects: F,
+		over: q,
+		measureDroppableContainers: se,
+		scrollableAncestors: W,
+		scrollableAncestorRects: be,
+		measuringConfiguration: P,
+		measuringScheduled: I,
+		windowRect: ye
+	}), [
+		O,
+		R,
+		z,
+		A,
+		Ee,
+		fe,
+		V,
+		v,
+		x,
+		F,
+		q,
+		se,
+		W,
+		be,
+		P,
+		I,
+		ye
+	]), Pe = T(() => ({
+		activatorEvent: A,
+		activators: Me,
+		active: O,
+		activeNodeRect: z,
+		ariaDescribedById: { draggable: N },
+		dispatch: d,
+		draggableNodes: v,
+		over: q,
+		measureDroppableContainers: se
+	}), [
+		A,
+		Me,
+		O,
+		z,
+		d,
+		N,
+		v,
+		q,
+		se
+	]);
+	return y.createElement(Vt.Provider, { value: p }, y.createElement(kr.Provider, { value: Pe }, y.createElement(Ar.Provider, { value: Ne }, y.createElement(Lr.Provider, { value: ke }, i)), y.createElement(Nr, { disabled: n?.restoreFocus === !1 })), y.createElement(Kt, {
+		...n,
+		hiddenTextDescribedById: N
+	}));
+	function Fe() {
+		let e = ne?.autoScrollEnabled === !1, t = typeof r == "object" ? r.enabled === !1 : r === !1, n = g && !e && !t;
+		return typeof r == "object" ? {
+			...r,
+			enabled: n
+		} : { enabled: n };
+	}
+}), zr = "\n<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path d=\"M6.66 9.118a.693.693 0 0 1 .956.032l3.65 3.411 2.422-2.238a.695.695 0 0 1 .945 0L17.5 13.6V2.5h-15v11.1zM17.8 1c.652 0 1.2.47 1.2 1.1v14.362c0 .64-.532 1.038-1.184 1.038H2.184C1.532 17.5 1 17.103 1 16.462V2.1C1 1.47 1.537 1 2.2 1zm-5.655 6a2.13 2.13 0 0 1 .157-2.364A2.133 2.133 0 1 1 12.145 7\"/></svg>\n", Br = class extends Ye {
+	init() {
+		let e = this.editor;
+		e.ui.componentFactory.add("elfinder", (t) => {
+			let n = new Ce(t);
+			return n.set({
+				label: "Insert Image",
+				icon: zr,
+				tooltip: !0
+			}), n.on("execute", async () => {
+				let t = e.config.get("elfinder");
+				typeof t == "function" && await t(e);
+			}), n;
+		});
+	}
+}, Vr = "\n<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path d=\"M11.5 5.75a.75.75 0 0 1 0-1.5H15a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0V6.81l-2.72 2.72a.75.75 0 0 1-1.06-1.06l2.72-2.72zm-1.97 4.72a.75.75 0 0 1 0 1.06l-2.72 2.72H8.5a.75.75 0 0 1 0 1.5H5a.75.75 0 0 1-.75-.75v-3.5a.75.75 0 0 1 1.5 0v1.69l2.72-2.72a.75.75 0 0 1 1.06 0\"/><path d=\"M2 0h16a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2m16 1.5H2a.5.5 0 0 0-.5.5v16a.5.5 0 0 0 .5.5h16a.5.5 0 0 0 .5-.5V2a.5.5 0 0 0-.5-.5\"/></svg>\n", Hr = class extends Ye {
+	isFullscreen = !1;
+	originalStyles = {};
+	init() {
+		this.editor.ui.componentFactory.add("fullscreen", (e) => {
+			let t = new Ce(e);
+			return t.set({
+				label: "Toàn màn hình",
+				icon: Vr,
+				tooltip: !0
+			}), t.on("execute", () => this.toggle()), t;
+		});
+	}
+	toggle() {
+		let e = this.editor.ui.getEditableElement()?.closest(".ck-editor");
+		e && (this.isFullscreen ? (Object.assign(e.style, this.originalStyles), document.body.style.overflow = "") : (this.originalStyles = {
+			position: e.style.position,
+			top: e.style.top,
+			left: e.style.left,
+			width: e.style.width,
+			height: e.style.height,
+			zIndex: e.style.zIndex
+		}, Object.assign(e.style, {
+			position: "fixed",
+			top: "0",
+			left: "0",
+			width: "100vw",
+			height: "100vh",
+			zIndex: "9999",
+			background: "#fff"
+		}), document.body.style.overflow = "hidden"), this.isFullscreen = !this.isFullscreen);
+	}
+}, Ur = "\n<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\">\n  <path\n    d=\"M3 1h9l5 5v13H3V1zM12 1v5h5\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-width=\"1\"\n  />\n  <text\n    x=\"10\"\n    y=\"14\"\n    text-anchor=\"middle\"\n    font-size=\"5\"\n    font-weight=\"700\"\n    fill=\"currentColor\"\n    font-family=\"Arial, Helvetica, sans-serif\"\n  >\n    PDF\n  </text>\n</svg>\n", Wr = class extends Ye {
+	init() {
+		let e = this.editor;
+		e.ui.componentFactory.add("pdffinder", (t) => {
+			let n = new Ce(t);
+			return n.set({
+				label: "Insert PDF Viewer",
+				icon: Ur,
+				tooltip: !0
+			}), n.on("execute", async () => {
+				let t = e.config.get("pdffinder");
+				if (typeof t == "function") {
+					let n = await t(e);
+					if (n && n.mime === "application/pdf") {
+						let t = window.prompt("Nhập tiêu đề file PDF:", n.name || "");
+						this.insertPdf(e, n.url, t || "");
+					}
+				}
+			}), n;
+		});
+	}
+	insertPdf(e, t, n) {
+		let i = encodeURIComponent(n), a = n ? `${t}${t.includes("?") ? "&" : "?"}_title=${i}` : t, o = `
+    <div class="pdf-wrapper">
+      ${n ? `<div class="pdf-title">${r(n)}</div>` : ""}
+      <oembed url="${r(a)}"></oembed>
+    </div>
+  `, s = e.data.processor.toView(o), c = e.data.toModel(s);
+		e.model.insertContent(c);
+	}
+}, Gr = class extends we {};
+Gr.builtinPlugins = [
+	Ee,
+	Je,
+	je,
+	Se,
+	Ue,
+	ct,
+	et,
+	tt,
+	nt,
+	Te,
+	Oe,
+	ke,
+	q,
+	De,
+	Me,
+	Xe,
+	be,
+	Ve,
+	He,
+	Ge,
+	st,
+	xe,
+	Ne,
+	We,
+	Fe,
+	Le,
+	Be,
+	ze,
+	Re,
+	Ie,
+	rt,
+	ot,
+	at,
+	it,
+	Ke,
+	G,
+	Qe,
+	$e,
+	K,
+	qe,
+	Ze,
+	Ae,
+	Pe,
+	lt,
+	Br,
+	Wr,
+	Hr
+], Gr.defaultConfig = {
+	licenseKey: "GPL",
+	toolbar: {
+		items: /* @__PURE__ */ "undo.redo.|.fullscreen.sourceEditing.heading.|.fontFamily.fontSize.fontColor.fontBackgroundColor.|.bold.italic.underline.strikethrough.subscript.superscript.code.removeFormat.|.alignment.outdent.indent.|.bulletedList.numberedList.todoList.|.insertImage.elfinder.pdffinder.link.mediaEmbed.insertTable.horizontalLine.|.blockQuote.codeBlock.specialCharacters.emoji.|.htmlEmbed".split("."),
+		shouldNotGroupWhenFull: !0
+	},
+	image: { toolbar: [
+		"imageStyle:inline",
+		"imageStyle:block",
+		"imageStyle:side",
+		"|",
+		"toggleImageCaption",
+		"imageTextAlternative"
+	] },
+	table: { contentToolbar: [
+		"tableColumn",
+		"tableRow",
+		"mergeTableCells",
+		"tableProperties",
+		"tableCellProperties"
+	] },
+	mention: { feeds: [{
+		marker: "@",
+		feed: [],
+		minimumCharacters: 0
+	}] },
+	htmlSupport: { allow: [{
+		name: /.*/,
+		classes: !0,
+		styles: !0,
+		attributes: { "data-*": !0 }
+	}] },
+	language: "vi"
+};
+//#endregion
+//#region src/components/form/Editor.tsx
+var Kr = ({ label: t, name: n, cpnClass: r = "", required: i = !1, disabled: a = !1, value: o = "", onChange: c }) => {
+	let u = E(null), d = E(null), f = E(null), p = E(null), [m, g] = D(!1);
+	w(() => (g(!0), () => g(!1)), []), w(() => {
+		document.activeElement !== p.current && c && c(h(n, o));
+	}, [o]);
+	let _ = (e) => {
+		c && c(h(n, e));
+	}, { editorConfig: v } = T(() => m ? { editorConfig: {
+		elfinder: async (e) => {
+			let { md: t } = await s("#elfinderModal");
+			l("#elfinderStatic").then((n) => {
+				let r = Array.isArray(n) ? n[0] : n;
+				e.execute("imageInsert", { source: r.url }), t.hide();
+			}), t.show();
+		},
+		pdffinder: async () => new Promise((t, n) => {
+			s("#elfinderModal").then(({ md: r }) => {
+				let i = {
+					url: (e().API_URL ?? "") + "/elfinder/connectorFiles",
+					onlyMimes: ["application/pdf"]
+				};
+				l("#elfinderStatic", i).then((e) => {
+					let n = Array.isArray(e) ? e[0] : e;
+					r.hide(), t({
+						url: n.url,
+						name: n.name,
+						mime: n.mime
+					});
+				}).catch(n), r.show();
+			}).catch(n);
+		}),
+		mediaEmbed: {
+			previewsInData: !0,
+			providers: [{
+				name: "pdf",
+				url: /.+\.pdf(\?.*)?$/,
+				html: (e) => {
+					let t = e[0], n = new URL(t, window.location.origin), r = n.searchParams.get("_title") || "";
+					return n.searchParams.delete("_title"), `
+							<div
+								class="pdf-iframe-wrapper"
+								${r ? `data-title="${r}"` : ""}
+								style="width:100%; height:600px; position:relative"
+							>
+								<iframe
+								src="${n.href}"
+								width="100%"
+								height="600"
+								style="border:1px solid #ddd"
+								${r ? `data-title="${r}"` : ""}
+								></iframe>
+							</div>
+							`;
+				}
+			}]
+		}
+	} } : {}, [m]);
+	return /* @__PURE__ */ M(j, { children: /* @__PURE__ */ N("div", {
+		className: "form-group " + (r ?? ""),
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "form-label",
+				children: t + (i ? " *" : "")
+			}),
+			/* @__PURE__ */ M("div", {
+				className: "main-container w-100",
+				children: /* @__PURE__ */ N("div", {
+					className: "editor-container editor-container_classic-editor editor-container_include-block-toolbar editor-container_include-word-count editor-container_include-fullscreen",
+					ref: u,
+					children: [/* @__PURE__ */ M("div", {
+						className: "editor-container__editor",
+						children: /* @__PURE__ */ M("div", {
+							ref: d,
+							children: v && /* @__PURE__ */ M(W, {
+								onReady: (e) => {
+									let t = e.plugins.get(lt);
+									f.current?.appendChild(t.wordCountContainer);
+								},
+								onAfterDestroy: () => {
+									f.current && Array.from(f.current.children).forEach((e) => e.remove());
+								},
+								data: o,
+								editor: Gr,
+								config: v,
+								onChange: (e, t) => {
+									let n = t.getData();
+									_(n);
+								},
+								disabled: a
+							})
+						})
+					}), /* @__PURE__ */ M("div", {
+						className: "editor_container__word-count",
+						ref: f
+					})]
+				})
+			}),
+			/* @__PURE__ */ M("textarea", {
+				className: "form-control",
+				style: { display: "none" },
+				name: n,
+				value: o,
+				readOnly: !0
+			})
+		]
+	}) });
+}, qr = (e, t, n) => {
+	let r = e[t];
+	if (r && typeof r == "object") {
+		let e = r[n];
+		return typeof e == "string" ? e : "";
+	}
+	return typeof r == "string" ? r : "";
+}, Jr = [], Yr = ({ options: e, layout: t = 1, onChange: r, data: i = Jr }) => {
+	let o = Array.isArray(e) ? e : [], [s, c] = D([]);
+	w(() => {
+		if (!Array.isArray(i)) return;
+		let e = i.map((e) => e._uid ? e : {
+			...e,
+			_uid: a(10)
+		});
+		c(e);
+	}, [i]);
+	let l = E([]);
+	l.current = s;
+	let d = () => {
+		let e = { _uid: a(10) };
+		o.forEach((t) => {
+			t.type === "image" ? e[t.name] = "" : t.type === "selectMulti" ? e[t.name] = [] : e[t.name] = "";
+		});
+		let t = [...l.current, e];
+		l.current = t, c(t), r?.(t);
+	}, f = async (e) => {
+		if (!(await n()).isConfirmed) return;
+		let t = s.filter((t, n) => n !== e);
+		c(t), r?.(t);
+	}, p = (e) => {
+		let { active: t, over: n } = e;
+		n && t.id !== n.id && c((e) => {
+			let i = e.findIndex((e) => e._uid === t.id), a = e.findIndex((e) => e._uid === n.id);
+			if (i === -1 || a === -1) return e;
+			let o = ye(e, i, a);
+			return r?.(o), o;
+		});
+	}, m = (e, t) => {
+		let n = g(e), i = s.map((e, r) => r === t ? {
+			...e,
+			[n.name]: n.value
+		} : e);
+		c(i), r?.(i);
+	}, h = (e, t, n) => {
+		let r = o.find((e) => e.name === n);
+		if (!r) return null;
+		let i = u(), a = Array.isArray(i) ? i : [];
+		switch (r.type) {
+			case "text": return /* @__PURE__ */ M(j, { children: a.map((i) => /* @__PURE__ */ M(Ct, {
+				cpnClass: "mb-3",
+				label: `${r.label} - ${i?.name}`,
+				name: `{${r.name}}{${i.id}}`,
+				value: qr(e, n, i.id),
+				onChange: (e) => m(e, t)
+			}, i?.id)) });
+			case "textarea": return /* @__PURE__ */ M(j, { children: a.map((i) => /* @__PURE__ */ M(Tt, {
+				cpnClass: "mb-3",
+				label: `${r.label} - ${i?.name}`,
+				name: `{${r.name}}{${i.id}}`,
+				value: qr(e, n, i.id),
+				onChange: (e) => m(e, t)
+			}, i?.id)) });
+			case "select": return /* @__PURE__ */ M(Pt, {
+				cpnClass: "mb-3",
+				label: r.label,
+				name: r.name,
+				lists: r.options || [],
+				value: e[n],
+				all: r.all,
+				zero: r.zero,
+				onChange: (e) => m(e, t)
+			});
+			case "selectMulti": return /* @__PURE__ */ M(Ft, {
+				cpnClass: "mb-3",
+				label: r.label,
+				name: r.name,
+				lists: r.options || [],
+				value: e[n],
+				all: r.all,
+				zero: r.zero,
+				onChange: (e) => m(e, t)
+			});
+			case "image": return /* @__PURE__ */ M(It, {
+				cpnClass: "border mb-3",
+				label: r.label,
+				name: r.name,
+				value: e[n],
+				df: r.df,
+				ext: r.ext || ".jpg,.jpeg,.png",
+				isEdit: !0,
+				onChange: (e) => m(e, t)
+			});
+			case "editor": return /* @__PURE__ */ M(j, { children: a.map((i) => /* @__PURE__ */ M(Kr, {
+				cpnClass: "mb-3",
+				label: `${r.label} - ${i?.name}`,
+				name: `{${r.name}}{${i.id}}`,
+				value: qr(e, n, i.id),
+				onChange: (e) => m(e, t)
+			}, i?.id)) });
+			default: return null;
+		}
+	};
+	return /* @__PURE__ */ N("div", { children: [Array.isArray(s) && /* @__PURE__ */ M(Rr, {
+		collisionDetection: $t,
+		onDragEnd: p,
+		children: /* @__PURE__ */ M(ve, {
+			items: s.map((e) => e._uid ?? `row-${a(8)}`),
+			children: s.map((e, n) => {
+				if (!e._uid) return;
+				let r = o.filter((e) => e.type !== "image"), i = o.filter((e) => e.type === "image");
+				return /* @__PURE__ */ N(v, {
+					id: e._uid,
+					className: "border border-dark rounded p-3 mb-3 position-relative",
+					iconSize: "20px",
+					iconStyle: {
+						cursor: "move",
+						right: "35px",
+						top: "7px",
+						zIndex: 1e4
+					},
+					children: [
+						/* @__PURE__ */ M("button", {
+							type: "button",
+							className: "btn btn-sm btn-danger position-absolute d-flex align-items-center justify-content-center",
+							style: {
+								top: 5,
+								right: 5,
+								zIndex: 1e4,
+								height: 25,
+								width: 25
+							},
+							onClick: () => f(n),
+							children: /* @__PURE__ */ M("i", {
+								className: "material-icons text-white",
+								children: "delete"
+							})
+						}),
+						t === 1 && /* @__PURE__ */ M("div", {
+							className: "row grid-space-16",
+							children: o.map((t) => /* @__PURE__ */ M("div", {
+								className: `${t?.colClass || "col-12"}`,
+								children: h(e, n, t.name)
+							}, t.name))
+						}),
+						t === 2 && /* @__PURE__ */ N("div", {
+							className: "row grid-space-16",
+							children: [/* @__PURE__ */ M("div", {
+								className: "col-md-8",
+								children: /* @__PURE__ */ M("div", {
+									className: "row grid-space-16",
+									children: r.map((t) => /* @__PURE__ */ M("div", {
+										className: `${t?.colClass || "col-12"}`,
+										children: h(e, n, t.name)
+									}, t.name))
+								})
+							}), /* @__PURE__ */ M("div", {
+								className: "col-md-4",
+								children: /* @__PURE__ */ M("div", {
+									className: "row grid-space-16",
+									children: i.map((t) => /* @__PURE__ */ M("div", {
+										className: "col-12",
+										children: h(e, n, t.name)
+									}, t.name))
+								})
+							})]
+						})
+					]
+				}, e._uid);
+			})
+		})
+	}), /* @__PURE__ */ N("button", {
+		type: "button",
+		className: "btn btn-sm btn-info align-items-center d-flex",
+		onClick: d,
+		children: [/* @__PURE__ */ M("i", {
+			className: "material-icons text-white position-relative text-lg me-1",
+			children: "add"
+		}), " Thêm"]
+	})] });
+}, Xr = ({ label: e, name: t, col: n = "col-auto", keyValue: r = "id", keyName: i = "name", lists: a = [], values: o = [], required: s = !1, disabled: c = !1, readonly: l = !1, cpnClass: u = "", onChange: d }) => {
+	let f = Array.isArray(a) ? a : [], p = Array.isArray(o) ? o : [], m = (e) => {
+		let { checked: n, value: r } = e.target;
+		n && p.push(r);
+		let i = n ? p : p.filter((e) => e !== String(r));
+		d && d({
+			currentTarget: {
+				name: t,
+				value: [...new Set(i)]
+			},
+			preventDefault: () => {}
+		});
+	};
+	return /* @__PURE__ */ N("div", {
+		className: "form-group " + (u ?? ""),
+		children: [e && /* @__PURE__ */ M("label", {
+			className: "form-label ms-auto font-weight-bold",
+			children: e + (s ? " *" : "")
+		}), /* @__PURE__ */ M("div", {
+			className: "row grid-space-16",
+			children: f.map((e) => {
+				let t = Array.isArray(e?.subs) ? e.subs : [];
+				return /* @__PURE__ */ N("div", {
+					className: n + " mb-3",
+					children: [/* @__PURE__ */ M("div", {
+						className: "col-dropdown py-2 ratioChevron cursor-pointer",
+						children: /* @__PURE__ */ M("div", {
+							className: "form-check ps-0 m-0",
+							children: /* @__PURE__ */ N("label", {
+								className: "form-check-label m-0 d-flex align-items-center",
+								children: [
+									/* @__PURE__ */ M("input", {
+										type: "checkbox",
+										"data-required-error": "Vui lòng nhập dữ liệu",
+										"data-error": "Dữ liệu không hợp lệ",
+										className: "form-check-input d-none",
+										readOnly: l,
+										disabled: c,
+										required: s,
+										value: String(e[r]),
+										checked: p.includes(String(e[r])),
+										onChange: m
+									}),
+									/* @__PURE__ */ M("span", {
+										className: "form-check-sign",
+										style: { height: "20px" },
+										children: /* @__PURE__ */ M("span", { className: "check" })
+									}),
+									/* @__PURE__ */ M("span", {
+										className: "cursor-pointer mb-0 ms-2 d-flex align-items-center",
+										children: String(e[i] ?? "")
+									})
+								]
+							})
+						})
+					}), t.length > 0 && /* @__PURE__ */ M("div", {
+						className: "check-dropdown mt-0",
+						children: t.map((e) => {
+							let t = Array.isArray(e?.subs) ? e.subs : [];
+							return /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("div", {
+								className: "form-check",
+								style: { paddingLeft: "30px" },
+								children: /* @__PURE__ */ N("label", {
+									className: "form-check-label m-0 d-flex align-items-center",
+									children: [
+										/* @__PURE__ */ M("input", {
+											type: "checkbox",
+											"data-required-error": "Vui lòng nhập dữ liệu",
+											"data-error": "Dữ liệu không hợp lệ",
+											className: "form-check-input d-none",
+											readOnly: l,
+											disabled: c,
+											required: s,
+											value: String(e[r]),
+											checked: p.includes(String(e[r])),
+											onChange: m
+										}),
+										/* @__PURE__ */ M("span", {
+											className: "form-check-sign",
+											style: { height: "20px" },
+											children: /* @__PURE__ */ M("span", { className: "check" })
+										}),
+										/* @__PURE__ */ M("span", {
+											className: "cursor-pointer mb-0 ms-2",
+											children: String(e[i] ?? "")
+										})
+									]
+								})
+							}), t.length > 0 && /* @__PURE__ */ M("div", {
+								className: "check-dropdown mb-3",
+								children: t.map((e) => /* @__PURE__ */ M("div", {
+									className: "form-check",
+									style: { paddingLeft: "60px" },
+									children: /* @__PURE__ */ N("label", {
+										className: "form-check-label m-0 d-flex align-items-center",
+										children: [
+											/* @__PURE__ */ M("input", {
+												type: "checkbox",
+												"data-required-error": "Vui lòng nhập dữ liệu",
+												"data-error": "Dữ liệu không hợp lệ",
+												className: "form-check-input d-none",
+												readOnly: l,
+												disabled: c,
+												required: s,
+												value: String(e[r]),
+												checked: p.includes(String(e[r])),
+												onChange: m
+											}),
+											/* @__PURE__ */ M("span", {
+												className: "form-check-sign",
+												style: { height: "20px" },
+												children: /* @__PURE__ */ M("span", { className: "check" })
+											}),
+											/* @__PURE__ */ M("span", {
+												className: "cursor-pointer mb-0 ms-2",
+												children: String(e[i] ?? "")
+											})
+										]
+									})
+								}, e.id))
+							})] }, e.id);
+						})
+					})]
+				}, e.id);
+			})
+		})]
+	});
+}, Zr = { textField: { className: "datepicker-custom" } }, Qr = ({ label: e, name: t, value: n = "", cpnClass: r = "", required: i = !1, disabled: a = !1, readonly: o = !1, onChange: s }) => /* @__PURE__ */ M("div", {
+	className: "form-group " + (r ?? ""),
+	children: /* @__PURE__ */ M("div", {
+		className: "input-group input-group-outline",
+		children: /* @__PURE__ */ M(dt, {
+			dateAdapter: ft,
+			adapterLocale: pt,
+			children: /* @__PURE__ */ M(ut, {
+				slotProps: Zr,
+				label: e + (i ? " *" : ""),
+				name: t,
+				value: ((e) => {
+					if (!e) return null;
+					let t = new Date(e);
+					return isNaN(t.getTime()) ? null : t;
+				})(n),
+				onChange: (e) => {
+					s && e && !isNaN(new Date(e).getTime()) && s({
+						target: {
+							name: t,
+							value: ie(new Date(e), "yyyy-MM-dd")
+						},
+						preventDefault: () => {}
+					});
+				},
+				disabled: a,
+				readOnly: o
+			})
+		})
+	})
+}), $r = { textField: { className: "datepicker-custom" } }, ei = ({ label: e, name: t, value: n = "", debug: r = !1, defaultValue: i = "", cpnClass: a = "", required: o, onChange: s, ...c }) => {
+	let l = E(!1);
+	w(() => {
+		if (r && console.log("DateTimeInput mounted", {
+			value: n,
+			defaultValue: i,
+			onChange: !!s
+		}), !l.current && !n && i && s) {
+			let e = u(i);
+			e && (l.current = !0, d(e));
+		}
+	}, [
+		n,
+		i,
+		s
+	]);
+	let u = (e) => {
+		if (!e) return null;
+		if (e instanceof Date) return isNaN(e.getTime()) ? null : e;
+		let t = new Date(e);
+		return isNaN(t.getTime()) ? null : t;
+	}, d = (e) => {
+		r && console.log("handleChange", {
+			name: t,
+			date: e
+		}), s && e && !isNaN(e.getTime()) && s({
+			target: {
+				name: t,
+				value: ie(e, "yyyy-MM-dd HH:mm:ss")
+			},
+			preventDefault: () => {}
+		});
+	}, f = u(n) ?? u(i);
+	return /* @__PURE__ */ M("div", {
+		className: "form-group " + (a ?? ""),
+		children: /* @__PURE__ */ M("div", {
+			className: "input-group input-group-outline",
+			children: /* @__PURE__ */ M(dt, {
+				dateAdapter: ft,
+				adapterLocale: pt,
+				children: /* @__PURE__ */ M(mt, {
+					slotProps: $r,
+					label: e + (o ? " *" : ""),
+					name: t,
+					value: f,
+					onChange: d,
+					...c
+				})
+			})
+		})
+	});
+}, ti = ({ label: e, name: n, cpnClass: r = "", required: i = !1, value: a = "", onChange: o, isEdit: s = !1, ext: c = ".jpg, .jpeg, .png", df: l = "/styles/default.jpg" }) => {
+	let u = E(null), [d, f] = D(a), [m, h] = D("");
+	return w(() => {
+		let e = u.current?.querySelector(".upFile");
+		e && t(e, "#elfinderModal", (e) => {
+			let { data: t, md: n } = e;
+			if (t) {
+				let e = (Array.isArray(t) ? t[0] : t).url?.replace(/^.*\/static/, "") ?? "";
+				f(e);
+				let r = e ? e.split("/").pop() ?? "" : "";
+				h(r), n?.hide();
+			}
+		});
+	}, []), w(() => {
+		o && o({
+			target: {
+				name: n,
+				value: d
+			},
+			preventDefault: () => {}
+		});
+	}, [
+		d,
+		n,
+		o
+	]), w(() => {
+		f(a);
+		let e = a ? a.split("/").pop() : "";
+		h(e ?? "");
+	}, [a, l]), /* @__PURE__ */ N("div", {
+		ref: u,
+		className: `card ${r}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ M("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: /* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						})
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ M("div", {
+				className: "card-body p-0 px-3",
+				children: /* @__PURE__ */ M("div", {
+					className: "d-flex align-items-center",
+					style: { minHeight: 30 },
+					children: d && /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+						className: "text-info text-1-line",
+						href: p(d),
+						target: "_blank",
+						children: m
+					})] })
+				})
+			}),
+			s && /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M("hr", { className: "my-0" }), /* @__PURE__ */ N("div", {
+				className: "card-footer d-flex justify-content-between",
+				children: [
+					/* @__PURE__ */ M("label", {
+						className: "text-info cursor-pointer m-0 upFile",
+						children: "Tải lên"
+					}),
+					/* @__PURE__ */ M("input", {
+						value: d,
+						required: i,
+						name: n,
+						type: "text",
+						onChange: o,
+						className: "d-none default-file-input",
+						accept: c
+					}),
+					d && /* @__PURE__ */ M("a", {
+						href: "#",
+						onClick: (e) => {
+							f("");
+						},
+						className: "ml-auto link text-danger",
+						children: "Xóa"
+					})
+				]
+			})] })
+		]
+	});
+}, ni = ({ label: e, name: t, cpnClass: n = "", required: r = !1, value: a = [], onChange: o, isEdit: s = !1, ext: c = ".jpg, .jpeg, .png" }) => {
+	let l = Array.isArray(a) ? a : [];
+	return /* @__PURE__ */ N("div", {
+		className: `card card-primary card-outline boxSImgs ${n}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ M("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: /* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						})
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ M("div", {
+				className: "card-body d-flex justify-content-center min-height-100 pb-2",
+				children: /* @__PURE__ */ M("div", {
+					className: "row grid-space-10 showImg w-100",
+					children: l.map((e, n) => /* @__PURE__ */ N("div", {
+						className: "col-auto col-img mb-2",
+						children: [/* @__PURE__ */ N("div", {
+							className: "d-flex align-items-center",
+							children: [/* @__PURE__ */ M("a", {
+								target: "_blank",
+								href: i(e),
+								children: /* @__PURE__ */ M("img", {
+									src: i(e),
+									className: "height-50 object-fit-contain"
+								})
+							}), s && /* @__PURE__ */ M("a", {
+								"data-file": e,
+								href: "#",
+								className: "rmImg ms-2 link text-danger",
+								children: "Xóa"
+							})]
+						}), /* @__PURE__ */ M("input", {
+							type: "hidden",
+							name: `${t}Old[]`,
+							value: e
+						})]
+					}, n))
+				})
+			}),
+			s && /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M("hr", { className: "my-0" }), /* @__PURE__ */ N("div", {
+				className: "card-footer d-flex justify-content-between",
+				children: [/* @__PURE__ */ M("label", {
+					className: "text-info cursor-pointer p-0 upMImage",
+					children: "Tải lên"
+				}), /* @__PURE__ */ M("input", {
+					required: r,
+					onChange: o,
+					name: `${t}[]`,
+					type: "file",
+					className: "d-none default-file-input",
+					multiple: !0,
+					accept: c
+				})]
+			})] })
+		]
+	});
+}, ri = ({ label: e, name: t, cpnClass: n = "", required: r = !1, value: i = "", onChange: a, isEdit: o = !1, ext: s = ".jpg, .png, .jpeg, .ico", df: l = "" }) => {
+	let u = E(null), [p, m] = D(""), [g, _] = D(""), [v, y] = D(i || ""), b = (e) => {
+		e.preventDefault();
+		let t = /\.(jpg|png|jpeg|ico)$/i, n = u.current?.querySelector(".default-file-input");
+		if (!n) return;
+		let r = n.files;
+		if (!r) return;
+		let i = n.getAttribute("accept"), a = f(i, t);
+		d(r, 10, a).then(async () => {
+			let e = Array.from(r);
+			e.length && (m(e[0]), _(await S(e[0])));
+		}).catch((e) => {
+			console.error("[PImage] Upload không hợp lệ:", e.message);
+		});
+	}, x = (e) => {
+		e.preventDefault(), m(""), y("");
+	}, S = (e) => new Promise((t, n) => {
+		let r = new FileReader();
+		r.onload = (e) => t(e.target?.result), r.onerror = n, r.readAsDataURL(e);
+	});
+	return w(() => {
+		a && a(h(`${t}_upload`, p, "file"));
+	}, [p]), w(() => {
+		a && a(h(t, v));
+	}, [v]), /* @__PURE__ */ N("div", {
+		ref: u,
+		className: `card boxPImage ${n}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ M("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: /* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						})
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ M("div", {
+				className: "card-body d-flex justify-content-center p-0 showImg",
+				style: { minHeight: "50px" },
+				children: /* @__PURE__ */ N("div", {
+					className: "d-flex align-items-center justify-content-center",
+					children: [
+						p && /* @__PURE__ */ M("img", {
+							className: "height-100 object-fit-contain w-100",
+							src: p ? g : "",
+							alt: "img"
+						}),
+						v && !p && /* @__PURE__ */ M("img", {
+							className: "height-100 object-fit-contain w-100",
+							src: c(v, l),
+							alt: "img"
+						}),
+						!v && !p && l && /* @__PURE__ */ M("img", {
+							className: "height-100 object-fit-contain w-100",
+							src: c(v, l),
+							alt: "img"
+						})
+					]
+				})
+			}),
+			o && /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M("hr", { className: "my-0" }), /* @__PURE__ */ N("div", {
+				className: "card-footer d-flex justify-content-between",
+				children: [/* @__PURE__ */ M("a", {
+					onClick: (e) => x(e),
+					href: "#",
+					className: `ml-auto link text-danger ${p || v ? "" : "d-none"}`,
+					children: "Xóa"
+				}), o && /* @__PURE__ */ N("label", {
+					className: "text-info cursor-pointer m-0",
+					children: ["Tải lên", /* @__PURE__ */ M("input", {
+						required: r,
+						name: t,
+						type: "file",
+						onChange: b,
+						className: "d-none default-file-input",
+						accept: s
+					})]
+				})]
+			})] })
+		]
+	});
+}, ii = ({ itemLabel: e, itemName: t, selectName: n = "", lists: r, rendeRowData: i, detailRow: a, onSubmit: o, onChangeRow: s, keyName: c = "name", keyValue: l = "id", isEdit: u = !0 }) => {
+	let d = E(null), [f, p] = D([]), [m, h] = D([]);
+	w(() => {
+		d?.current && (new _(d?.current).run(), h(Array.isArray(f) ? [...new Set(f.map((e) => e[t]))].filter((e) => typeof e == "string" || typeof e == "number") : []));
+	}, [f, t]), w(() => {
+		p(Array.isArray(a) ? a : []);
+	}, [a]);
+	let g = async (e) => {
+		if (e.preventDefault(), !d?.current) return;
+		let t = new _(d?.current);
+		!t.hasErrors() && !t.isIncomplete() && f?.length && o && o(f, d?.current);
+	}, v = (e) => {
+		let { value: n } = e.target, r = Array.isArray(n) ? n : [], i = f.filter((e) => r.includes(e[t])), a = r.filter((e) => !i.some((n) => n[t] === e)), o = [...i, ...a.map((e) => ({ [t]: e }))];
+		p(o), s && s(o);
+	}, y = (e, t) => {
+		let { name: n, value: r } = e.target, i = [...f];
+		i[t] = {
+			...i[t],
+			[n]: r
+		}, p(i);
+	};
+	return /* @__PURE__ */ M(j, { children: /* @__PURE__ */ M(ht, {
+		ref: d,
+		className: "position-relative",
+		action: "/abc",
+		method: "post",
+		encType: "multipart/form-data",
+		"data-toggle": "validator",
+		role: "form",
+		onSubmit: g,
+		children: /* @__PURE__ */ N("div", {
+			className: "card mb-20",
+			children: [
+				/* @__PURE__ */ N("div", {
+					className: "card-header flex-auto col-auto d-flex align-items-center",
+					children: [/* @__PURE__ */ M("h3", {
+						className: "card-title",
+						children: e
+					}), u && /* @__PURE__ */ M("button", {
+						type: "submit",
+						title: "Cập nhật",
+						className: "btn btn-success btn-sm btn-icon ms-auto",
+						children: /* @__PURE__ */ M("i", {
+							className: "material-icons text-white position-relative text-lg",
+							children: "save"
+						})
+					})]
+				}),
+				/* @__PURE__ */ M("hr", { className: "m-0" }),
+				/* @__PURE__ */ N("div", {
+					className: "card-body pb-0",
+					children: [u && /* @__PURE__ */ M(Ft, {
+						cpnClass: "mb-20",
+						label: n || e,
+						onChange: v,
+						required: !0,
+						lists: r,
+						name: t,
+						value: m,
+						keyName: c,
+						keyValue: l
+					}), Array.isArray(f) && f?.map((e, t) => /* @__PURE__ */ N("div", { children: [i?.(e, t, y), t !== f.length - 1 && /* @__PURE__ */ M("hr", { className: "mt-0 mb-20" })] }, t))]
+				})
+			]
+		})
+	}) });
+}, ai = (e, t) => (Array.isArray(t) ? t : []).map((t) => e.find((e) => e.value === t)).filter((e) => e !== void 0), oi = (e, t, n, r, i) => {
+	let a = [];
+	r && a.push({
+		value: -1,
+		label: "Tất cả"
+	}), i && a.push({
+		value: 0,
+		label: "Không có"
+	});
+	let o = Array.isArray(e) ? e.map((e) => ({
+		value: e[t],
+		label: String(e[n] ?? "")
+	})) : [];
+	return [...a, ...o];
+}, si = ({ label: e, name: t, lists: n = [], keyValue: r = "id", keyName: i = "name", value: a = [], cpnClass: o = "", required: s = !1, disabled: c = !1, all: l = !1, zero: u = !1, onChange: d }) => {
+	let [f, p] = D([]);
+	w(() => {
+		p(oi(n, r, i, l, u));
+	}, [n]);
+	let m = (e) => {
+		if (!e.destination) return;
+		let n = [...ai(f, a)], [r] = n.splice(e.source.index, 1);
+		n.splice(e.destination.index, 0, r), d?.({
+			target: {
+				name: t,
+				value: n.map((e) => e?.value)
+			},
+			preventDefault: () => {}
+		});
+	}, h = (e) => {
+		d?.({
+			target: {
+				name: t,
+				value: e
+			},
+			preventDefault: () => {}
+		});
+	}, g = (e) => /* @__PURE__ */ N(k.Option, {
+		...e,
+		children: [/* @__PURE__ */ M("input", {
+			type: "checkbox",
+			checked: e.isSelected,
+			onChange: () => null,
+			style: { marginRight: 8 }
+		}), /* @__PURE__ */ M("div", { children: e.label })]
+	}), _ = (e) => /* @__PURE__ */ M(re, {
+		draggableId: String(e.data.value),
+		index: e.index,
+		children: (t) => /* @__PURE__ */ M("div", {
+			ref: t.innerRef,
+			...t.draggableProps,
+			...t.dragHandleProps,
+			style: {
+				display: "inline-flex",
+				alignItems: "center",
+				marginRight: 6,
+				...t.draggableProps.style
+			},
+			children: /* @__PURE__ */ M(k.MultiValue, { ...e })
+		})
+	});
+	return /* @__PURE__ */ N("div", {
+		className: "form-group " + (o ?? ""),
+		children: [/* @__PURE__ */ M("div", {
+			className: "form-label mb-1",
+			children: e + (s ? " *" : "")
+		}), /* @__PURE__ */ M(ne, {
+			onDragEnd: m,
+			children: /* @__PURE__ */ M(A, {
+				droppableId: "selected",
+				direction: "horizontal",
+				children: (e) => /* @__PURE__ */ N("div", {
+					ref: e.innerRef,
+					...e.droppableProps,
+					children: [/* @__PURE__ */ M(O, {
+						options: f,
+						value: ai(f, a),
+						isMulti: !0,
+						isSearchable: !0,
+						closeMenuOnSelect: !1,
+						hideSelectedOptions: !1,
+						placeholder: "Chọn và kéo thả để sắp xếp...",
+						noOptionsMessage: () => "Không có dữ liệu",
+						"data-required-error": "Vui lòng nhập dữ liệu",
+						"data-error": "Dữ liệu không hợp lệ",
+						isDisabled: c,
+						components: {
+							Option: g,
+							MultiValue: _
+						},
+						onChange: (e) => h((e ?? []).map((e) => e.value)),
+						menuPortalTarget: document.body,
+						styles: {
+							menuPortal: (e) => ({
+								...e,
+								zIndex: 99999
+							}),
+							input: (e) => ({
+								...e,
+								minHeight: 30
+							}),
+							multiValue: (e) => ({
+								...e,
+								cursor: "grab"
+							}),
+							menuList: (e) => ({
+								...e,
+								display: "flex",
+								flexDirection: "column",
+								alignItems: "center",
+								paddingLeft: 5,
+								paddingRight: 5,
+								paddingTop: 5,
+								paddingBottom: 2
+							}),
+							option: (e, t) => ({
+								...e,
+								minHeight: 40,
+								width: "100%",
+								display: "flex",
+								alignItems: "center",
+								paddingTop: 8,
+								paddingBottom: 8,
+								marginBottom: 5,
+								borderRadius: 6,
+								justifyContent: "flex-start",
+								backgroundColor: t.isFocused ? "#FFC20E" : t.isSelected ? "#ED7D31" : "white",
+								color: t.isFocused ? "#333" : t.isSelected ? "#fff" : "#333",
+								cursor: "pointer"
+							})
+						}
+					}), e.placeholder]
+				})
+			})
+		})]
+	});
+}, ci = ({ itemLabel: e, itemName: t, selectName: n = "", lists: r, rendeRowData: i, detailRow: a, onSubmit: o, keyValue: s = "id", keyName: c = "name", isEdit: l = !0 }) => {
+	let u = E(null), [d, f] = D([]), [p, m] = D([]);
+	w(() => {
+		if (!u?.current) return;
+		new _(u?.current).run();
+		let e = Array.isArray(d) ? [...new Set(d.map((e) => e[t]))] : [];
+		m(e);
+	}, [d]), w(() => {
+		f(Array.isArray(a) ? a : []);
+	}, [a]);
+	let h = async (e) => {
+		if (e.preventDefault(), !u?.current) return;
+		let t = new _(u?.current);
+		!t.hasErrors() && !t.isIncomplete() && d?.length && o && o(d, u?.current);
+	}, g = (e) => {
+		let { value: n } = e.target, r = Array.isArray(n) ? n : [], i = d.filter((e) => r.includes(e[t])), a = r.filter((e) => !i.some((n) => n[t] === e)), o = Array.isArray(a) ? a.map((e) => ({ [t]: e })) : [], s = [...i, ...o];
+		f(s);
+	}, v = (e, t) => {
+		let { name: n, value: r } = e.target, i = [...d];
+		i[t] = {
+			...i[t],
+			[n]: r
+		}, f(i);
+	};
+	return /* @__PURE__ */ M(j, { children: /* @__PURE__ */ M(ht, {
+		ref: u,
+		className: "position-relative",
+		action: "/abc",
+		method: "post",
+		encType: "multipart/form-data",
+		"data-toggle": "validator",
+		role: "form",
+		onSubmit: h,
+		children: /* @__PURE__ */ N("div", {
+			className: "card mb-20",
+			children: [
+				/* @__PURE__ */ N("div", {
+					className: "card-header flex-auto col-auto d-flex align-items-center",
+					children: [/* @__PURE__ */ M("h3", {
+						className: "card-title",
+						children: e
+					}), l && /* @__PURE__ */ M("button", {
+						type: "submit",
+						title: "Cập nhật",
+						className: "btn btn-success btn-sm btn-icon ms-auto",
+						children: /* @__PURE__ */ M("i", {
+							className: "material-icons text-white position-relative text-lg",
+							children: "save"
+						})
+					})]
+				}),
+				/* @__PURE__ */ M("hr", { className: "m-0" }),
+				/* @__PURE__ */ N("div", {
+					className: "card-body pb-0",
+					children: [l && /* @__PURE__ */ M(si, {
+						cpnClass: "mb-20",
+						label: n || e,
+						onChange: g,
+						keyName: c,
+						keyValue: s,
+						required: !0,
+						lists: r,
+						name: t,
+						value: p
+					}), /* @__PURE__ */ M("div", {
+						className: "row grid-space-10",
+						children: Array.isArray(d) && d.map((e, t) => /* @__PURE__ */ M("div", {
+							style: { minWidth: 200 },
+							className: "col-auto flex-1",
+							children: i?.(e, t, v)
+						}, t))
+					})]
+				})
+			]
+		})
+	}) });
+}, li = ({ label: e, name: t, cpnClass: n = "", required: r = !1, disabled: i, readonly: a, value: s = "", onChange: c, isEdit: l = !1, ext: u = ".xlsx, .xls, .docx, .doc, .pdf", df: p = "" }) => {
+	let m = E(null), g = E(null), [_, v] = D(""), [y, b] = D("");
+	w(() => {
+		b((s ?? "").split("/").pop() ?? ""), v(o(s, p));
+	}, [s, p]), w(() => () => {
+		g.current &&= (URL.revokeObjectURL(g.current), null);
+	}, []);
+	let x = (e) => {
+		e.preventDefault();
+		let t = /\.(pdf|docx|doc|xlsx|xls)$/i, n = e.target.files;
+		if (!n || n.length === 0) return;
+		let r = e.target.getAttribute("accept"), i = f(r, t);
+		d(n, 10, i).then(() => {
+			let t = n[0];
+			if (!t) return;
+			g.current && URL.revokeObjectURL(g.current);
+			let r = URL.createObjectURL(t);
+			g.current = r, v(r), b(t.name), c?.(e);
+		}).catch((t) => {
+			console.error("Upload file validation failed:", t), e.target.value = "";
+		});
+	}, S = (e) => {
+		e.preventDefault(), g.current &&= (URL.revokeObjectURL(g.current), null), v(""), b(""), m.current && (m.current.value = ""), c && c(h(t, "", "input"));
+	}, C = l && !i && !a;
+	return /* @__PURE__ */ N("div", {
+		className: `card ${n}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ N("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: [/* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						}), C && /* @__PURE__ */ N("label", {
+							className: "text-info cursor-pointer m-0 ms-auto",
+							children: ["Tải lên", /* @__PURE__ */ M("input", {
+								ref: m,
+								required: r,
+								disabled: i,
+								name: t,
+								type: "file",
+								onChange: x,
+								className: "d-none default-file-input",
+								accept: u
+							})]
+						})]
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ N("div", {
+				className: "card-body d-flex justify-content-between align-items-center px-3 py-0 showFile",
+				style: { minHeight: "50px" },
+				children: [_ && /* @__PURE__ */ N("div", {
+					className: "d-flex align-items-center justify-content-center",
+					children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+						className: "text-info",
+						href: _,
+						target: "_blank",
+						rel: "noopener noreferrer",
+						children: y
+					})]
+				}), C && _ && /* @__PURE__ */ M("a", {
+					onClick: S,
+					href: "#",
+					className: "ml-auto link text-danger",
+					children: "Xóa"
+				})]
+			})
+		]
+	});
+}, ui = ({ label: e, name: t, cpnClass: n = "", required: r = !1, disabled: i, readonly: a, value: s = [], onChange: c, isEdit: l = !1, ext: u = ".xlsx, .xls, .docx, .doc, .pdf", df: p = "" }) => {
+	let [m, g] = D([]), [_, v] = D(Array.isArray(s) ? s : []), [y, b] = D(""), x = E(/* @__PURE__ */ new Map()), S = (e) => {
+		let t = x.current.get(e);
+		return t || (t = URL.createObjectURL(e), x.current.set(e, t)), t;
+	}, C = (t, n) => {
+		r && t.length === 0 && n.length === 0 ? b(e + " không được để trống") : b("");
+	};
+	w(() => () => {
+		x.current.forEach((e) => {
+			URL.revokeObjectURL(e);
+		}), x.current.clear();
+	}, []), w(() => {
+		v((e) => {
+			let t = Array.isArray(s) ? s : [];
+			return e.length === t.length && e.every((e, n) => e === t[n]) ? e : t;
+		});
+	}, [s]);
+	let ee = (e) => {
+		e.preventDefault();
+		let n = /\.(pdf|docx|doc|xlsx|xls)$/i, r = e.currentTarget, i = r.files;
+		if (!i || i.length === 0) return;
+		let a = r.getAttribute("accept"), o = f(a, n);
+		d(i, 10, o).then(() => {
+			let e = Array.from(i), n = [...m, ...e];
+			g(n), b(""), c?.(h(`${t}_upload`, n, "files")), r.value = "";
+		}).catch((e) => {
+			console.error("[UFiles] Upload không hợp lệ:", e.message), r.value = "";
+		});
+	}, T = (e, n) => {
+		e.preventDefault();
+		let r = _.filter((e, t) => t !== n);
+		v(r), C(r, m), c?.(h(t, r));
+	}, te = (e, n) => {
+		e.preventDefault();
+		let r = m[n];
+		if (r) {
+			let e = x.current.get(r);
+			e && (URL.revokeObjectURL(e), x.current.delete(r));
+		}
+		let i = m.filter((e, t) => t !== n);
+		g(i), C(_, i), c?.(h(`${t}_upload`, i, "files"));
+	}, O = l && !i && !a;
+	return /* @__PURE__ */ N("div", {
+		className: `card ${n}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header position-relative",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ N("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: [/* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						}), O && /* @__PURE__ */ N("label", {
+							className: "text-info cursor-pointer m-0 ms-auto",
+							children: ["Tải lên", /* @__PURE__ */ M("input", {
+								disabled: i,
+								name: t,
+								multiple: !0,
+								type: "file",
+								onChange: ee,
+								style: {
+									position: "absolute",
+									left: -9999
+								},
+								accept: u
+							})]
+						})]
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ N("div", {
+				className: "card-body py-2 px-3",
+				style: { minHeight: "50px" },
+				children: [
+					_?.map((e, t) => {
+						let n = (e ? e.split("/").pop() : "")?.split("___");
+						return /* @__PURE__ */ N("div", {
+							className: "d-flex w-100 justify-content-between",
+							children: [/* @__PURE__ */ N("div", {
+								className: "d-flex justify-content-center flex-column",
+								children: [/* @__PURE__ */ N("div", {
+									className: "w-100",
+									children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+										className: "text-info",
+										href: o(e, p),
+										target: "_blank",
+										rel: "noopener noreferrer",
+										children: n?.[1]
+									})]
+								}), /* @__PURE__ */ M("span", { children: n?.[0] ? new Date(Number(n[0])).toLocaleString("vi-VN") : "" })]
+							}), O && /* @__PURE__ */ M("a", {
+								onClick: (e) => T(e, t),
+								href: "#",
+								className: "ml-auto link text-danger",
+								children: "Xóa"
+							})]
+						}, t);
+					}),
+					m?.map((e, t) => /* @__PURE__ */ N("div", {
+						className: "d-flex w-100 justify-content-between",
+						children: [/* @__PURE__ */ N("div", {
+							className: "d-flex align-items-center justify-content-center",
+							children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+								className: "text-info text-1-line",
+								href: S(e),
+								target: "_blank",
+								rel: "noopener noreferrer",
+								children: e?.name
+							})]
+						}), O && /* @__PURE__ */ M("a", {
+							onClick: (e) => te(e, t),
+							href: "#",
+							className: "ml-auto link text-danger",
+							children: "Xóa"
+						})]
+					}, t)),
+					y && /* @__PURE__ */ M("div", {
+						className: "text-danger mt-1",
+						children: y
+					})
+				]
+			})
+		]
+	});
+}, di = (e) => e == null ? !0 : Array.isArray(e) || typeof e == "string" ? e.length === 0 : !1, fi = (e, t, n) => {
+	if (di(e?.[t]) && di(e?.[`${t}_upload`])) throw Error(`${n} không được để trống`);
+	return !0;
+}, pi = ({ label: e, name: t, cpnClass: n = "", required: r = !1, value: i = [], onChange: a, isEdit: s = !1, ext: c = ".png, .jpg, .jpeg, .ico", df: l = "" }) => {
+	let u = E(null), [p, m] = D([]), [g, _] = D(Array.isArray(i) ? i : []), v = E(/* @__PURE__ */ new Map()), y = (e) => {
+		let t = v.current.get(e);
+		return t || (t = URL.createObjectURL(e), v.current.set(e, t)), t;
+	};
+	w(() => () => {
+		v.current.forEach((e) => URL.revokeObjectURL(e)), v.current.clear();
+	}, []), w(() => {
+		_((e) => {
+			let t = Array.isArray(i) ? i : [];
+			return e.length === t.length && e.every((e, n) => e === t[n]) ? e : t;
+		});
+	}, [i]);
+	let b = (e) => {
+		e.preventDefault();
+		let t = /\.(png|jpg|jpeg|ico)$/i, n = u.current?.querySelector(".default-file-input");
+		if (!n) return;
+		let r = n.files;
+		if (!r) return;
+		let i = n.getAttribute("accept"), a = f(i, t);
+		d(r, 10, a).then(() => {
+			let e = Array.from(r);
+			m((t) => [...t, ...e]);
+		}).catch((e) => {
+			console.error("[UImages] Upload không hợp lệ:", e.message);
+		});
+	}, x = (e, t) => {
+		e.preventDefault(), _((e) => e.filter((e, n) => n !== t));
+	}, S = (e, t) => {
+		e.preventDefault();
+		let n = p[t];
+		if (n) {
+			let e = v.current.get(n);
+			e && (URL.revokeObjectURL(e), v.current.delete(n));
+		}
+		m((e) => e.filter((e, n) => n !== t));
+	};
+	return w(() => {
+		a && a(h(`${t}_upload`, p, "files"));
+	}, [p]), w(() => {
+		a && a(h(t, g));
+	}, [g]), /* @__PURE__ */ N("div", {
+		ref: u,
+		className: `card boxUImage ${n}`,
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "card-header",
+				children: /* @__PURE__ */ M("div", {
+					className: "row",
+					children: /* @__PURE__ */ N("div", {
+						className: "flex-auto col-auto d-flex align-items-center",
+						children: [/* @__PURE__ */ M("h3", {
+							className: "card-title",
+							children: e
+						}), s && /* @__PURE__ */ N("label", {
+							className: "text-info cursor-pointer m-0 ms-auto",
+							children: ["Tải lên", /* @__PURE__ */ M("input", {
+								required: r,
+								name: t,
+								multiple: !0,
+								type: "file",
+								onChange: b,
+								className: "d-none default-file-input",
+								accept: c
+							})]
+						})]
+					})
+				})
+			}),
+			/* @__PURE__ */ M("hr", { className: "my-0" }),
+			/* @__PURE__ */ N("div", {
+				className: "card-body py-2 px-3",
+				style: { minHeight: "50px" },
+				children: [g?.map((e, t) => {
+					let n = (e ? e.split("/").pop() ?? "" : "").split("___");
+					return /* @__PURE__ */ N("div", {
+						className: "d-flex w-100 justify-content-between",
+						children: [/* @__PURE__ */ N("div", {
+							className: `d-flex justify-content-center flex-column ${e ? "" : "d-none"}`,
+							children: [/* @__PURE__ */ N("div", {
+								className: "w-100",
+								children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+									className: "text-info",
+									href: o(e, l),
+									target: "_blank",
+									children: n?.[1]
+								})]
+							}), /* @__PURE__ */ M("span", { children: n[0] ? new Date(Number(n[0])).toLocaleString("vi-VN") : "" })]
+						}), s && /* @__PURE__ */ M("a", {
+							onClick: (e) => x(e, t),
+							href: "#",
+							className: `ml-auto link text-danger ${e ? "" : "d-none"}`,
+							children: "Xóa"
+						})]
+					}, t);
+				}), p?.map((e, t) => /* @__PURE__ */ N("div", {
+					className: "d-flex w-100 justify-content-between",
+					children: [/* @__PURE__ */ N("div", {
+						className: `d-flex align-items-center justify-content-center ${e ? "" : "d-none"}`,
+						children: [/* @__PURE__ */ M("i", { className: "fal fa-file me-1" }), /* @__PURE__ */ M("a", {
+							className: "text-info text-1-line",
+							href: y(e),
+							target: "_blank",
+							rel: "noopener noreferrer",
+							children: e?.name
+						})]
+					}), s && /* @__PURE__ */ M("a", {
+						onClick: (e) => S(e, t),
+						href: "#",
+						className: `ml-auto link text-danger ${e ? "" : "d-none"}`,
+						children: "Xóa"
+					})]
+				}, t))]
+			})
+		]
+	});
+};
+//#endregion
+export { kt as C, vt as D, yt as E, Ot as S, Tt as T, Ft as _, ci as a, Et as b, ni as c, Qr as d, Xr as f, Pt as g, It as h, li as i, ti as l, Kr as m, ui as n, ii as o, Yr as p, fi as r, ri as s, pi as t, ei as u, At as v, Ct as w, Dt as x, wt as y };