aq-fe-framework 0.1.574 → 0.1.575

package/dist/{chunk-JK76ZIUG.mjs → chunk-L6LB6QBU.mjs}

@@ -3,7 +3,7 @@ import {
   MyFieldset,
   MyFlexColumn,
   MyFlexRow
-} from "./chunk-MBFTZJMN.mjs";
+} from "./chunk-A77K2YFL.mjs";
 import {
   const_object_colors
 } from "./chunk-OMJJAHOC.mjs";
@@ -11,6 +11,7 @@ import {
   enum_daysOfWeek
 } from "./chunk-K6S7R6LU.mjs";
 import {
+  baseAxios_default,
   useMyReactMutation,
   useMyReactQuery
 } from "./chunk-I6PPEZBF.mjs";
@@ -470,9 +471,160 @@ function MyButtonPrintPDF({
   ] });
 }
 
+// src/core/button/MyButtonViewFile.tsx
+import {
+  ActionIcon as ActionIcon3,
+  Button as Button5,
+  Group,
+  Image,
+  LoadingOverlay,
+  Modal as Modal3,
+  Paper,
+  Text,
+  Tooltip
+} from "@mantine/core";
+import { useDisclosure as useDisclosure2 } from "@mantine/hooks";
+import { IconLivePhoto, IconMaximize, IconMinimize } from "@tabler/icons-react";
+import { useQuery } from "@tanstack/react-query";
+import { useEffect, useState } from "react";
+import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
+function MyButtonViewFile({
+  id,
+  modalSize = "80%",
+  label = "Xem file",
+  src,
+  isActionIcon = false,
+  filePath
+}) {
+  var _a;
+  const [opened, { open, close }] = useDisclosure2(false);
+  const [fullscreen, setFullscreen] = useState(false);
+  const [height, setHeight] = useState("80vh");
+  const [blobUrl, setBlobUrl] = useState(null);
+  const [isImage, setIsImage] = useState(false);
+  const [isProcessing, setIsProcessing] = useState(false);
+  const query = useQuery({
+    queryKey: ["MyButtonViewPDF", id, filePath],
+    queryFn: async () => {
+      if (filePath) {
+        const res2 = await baseAxios_default.get("/AQ/GetFile?filePath=" + filePath);
+        return res2.data.data;
+      }
+      const res = await baseAxios_default.get("/Document/Get?id=" + id);
+      return res.data.data;
+    },
+    enabled: opened
+  });
+  useEffect(() => {
+    var _a2, _b, _c, _d, _e;
+    if (!query.data) return;
+    setIsProcessing(true);
+    const base64String = filePath ? (_a2 = query.data) == null ? void 0 : _a2.fileBase64String : (_c = (_b = query.data) == null ? void 0 : _b.fileDetail) == null ? void 0 : _c.fileBase64String;
+    const fileExtension = (_e = (_d = query.data) == null ? void 0 : _d.fileExtension) == null ? void 0 : _e.toLowerCase();
+    if (!base64String || !fileExtension) {
+      setIsProcessing(false);
+      return;
+    }
+    setIsImage(/\.(jpg|jpeg|png|gif)$/i.test(fileExtension));
+    if (fileExtension === ".docx") {
+      const byteCharacters2 = atob(base64String);
+      const byteNumbers2 = new Array(byteCharacters2.length);
+      for (let i = 0; i < byteCharacters2.length; i++) {
+        byteNumbers2[i] = byteCharacters2.charCodeAt(i);
+      }
+      const byteArray2 = new Uint8Array(byteNumbers2);
+      const blob2 = new Blob([byteArray2], {
+        type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+      });
+      const link = document.createElement("a");
+      link.href = URL.createObjectURL(blob2);
+      link.download = "document.docx";
+      document.body.appendChild(link);
+      link.click();
+      link.remove();
+      setBlobUrl(null);
+      setIsProcessing(false);
+      return;
+    }
+    const byteCharacters = atob(base64String);
+    const byteNumbers = new Array(byteCharacters.length);
+    for (let i = 0; i < byteCharacters.length; i++) {
+      byteNumbers[i] = byteCharacters.charCodeAt(i);
+    }
+    const byteArray = new Uint8Array(byteNumbers);
+    const mimeType = /\.(jpg|jpeg)$/i.test(fileExtension) ? "image/jpeg" : /\.(png)$/i.test(fileExtension) ? "image/png" : /\.(gif)$/i.test(fileExtension) ? "image/gif" : fileExtension === ".pdf" ? "application/pdf" : `application/${fileExtension.replace(".", "")}`;
+    const blob = new Blob([byteArray], { type: mimeType });
+    const newBlobUrl = URL.createObjectURL(blob);
+    setBlobUrl(newBlobUrl);
+    setIsProcessing(false);
+    return () => {
+      URL.revokeObjectURL(newBlobUrl);
+    };
+  }, [query.data]);
+  return /* @__PURE__ */ jsxs5(Fragment4, { children: [
+    /* @__PURE__ */ jsx9(Tooltip, { label: "Xem t\xE0i li\u1EC7u tr\u1EF1c ti\u1EBFp", children: isActionIcon ? /* @__PURE__ */ jsx9(ActionIcon3, { onClick: open, children: /* @__PURE__ */ jsx9(IconLivePhoto, {}) }) : /* @__PURE__ */ jsx9(Button5, { color: "cyan", onClick: open, leftSection: /* @__PURE__ */ jsx9(IconLivePhoto, {}), children: label }) }),
+    /* @__PURE__ */ jsx9(
+      Modal3,
+      {
+        fullScreen: fullscreen,
+        opened,
+        onClose: () => {
+          close();
+          setBlobUrl(null);
+        },
+        size: modalSize,
+        title: /* @__PURE__ */ jsxs5(Group, { children: [
+          /* @__PURE__ */ jsx9(Text, { children: "Xem t\xE0i li\u1EC7u tr\u1EF1c ti\u1EBFp" }),
+          /* @__PURE__ */ jsx9(
+            ActionIcon3,
+            {
+              onClick: () => {
+                setFullscreen(!fullscreen);
+                setHeight(fullscreen ? "80vh" : "90vh");
+              },
+              children: fullscreen ? /* @__PURE__ */ jsx9(IconMinimize, {}) : /* @__PURE__ */ jsx9(IconMaximize, {})
+            }
+          )
+        ] }),
+        children: /* @__PURE__ */ jsxs5(Paper, { h: height, p: "lg", pos: "relative", children: [
+          /* @__PURE__ */ jsx9(
+            LoadingOverlay,
+            {
+              visible: query.isLoading || isProcessing,
+              zIndex: 1e3,
+              overlayProps: { radius: "sm", blur: 2 }
+            }
+          ),
+          blobUrl || src ? isImage ? /* @__PURE__ */ jsx9(
+            Image,
+            {
+              src: blobUrl != null ? blobUrl : src,
+              alt: "Xem t\xE0i li\u1EC7u",
+              style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain" }
+            }
+          ) : /* @__PURE__ */ jsx9(
+            "iframe",
+            {
+              src: blobUrl != null ? blobUrl : src,
+              width: "100%",
+              height: "100%",
+              allow: "fullscreen",
+              style: { border: "none" }
+            }
+          ) : filePath && ((_a = query.data) == null ? void 0 : _a.fileExtension) === ".docx" ? /* @__PURE__ */ jsxs5(Text, { c: "red", children: [
+            "File ",
+            /* @__PURE__ */ jsx9("b", { children: ".docx" }),
+            " kh\xF4ng th\u1EC3 xem tr\u1EF1c ti\u1EBFp. T\xE0i li\u1EC7u \u0111\xE3 \u0111\u01B0\u1EE3c t\u1EA3i xu\u1ED1ng v\u1EC1 m\xE1y c\u1EE7a b\u1EA1n."
+          ] }) : /* @__PURE__ */ jsx9(Text, { color: "dimmed", children: "Kh\xF4ng th\u1EC3 hi\u1EC3n th\u1ECB n\u1ED9i dung t\xE0i li\u1EC7u." })
+        ] })
+      }
+    )
+  ] });
+}
+
 // src/core/dataDisplay/MyDataTableSelectOne.tsx
-import { useEffect, useMemo } from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { useEffect as useEffect2, useMemo } from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function MyDataTableSelectOne({
   columns,
   queryResult,
@@ -480,11 +632,11 @@ function MyDataTableSelectOne({
   setIdSelection
 }) {
   const columnsState = useMemo(() => columns, []);
-  useEffect(() => {
+  useEffect2(() => {
     if (!queryResult.data) return;
     setIdSelection(queryResult.data[0].id);
   }, [queryResult.data]);
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     MyDataTable,
     {
       columns: columnsState,
@@ -509,31 +661,31 @@ function MyDataTableSelectOne({
 }
 
 // src/core/dataDisplay/MyFlexIconTitle.tsx
-import { Flex as Flex2, Text } from "@mantine/core";
-import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Flex as Flex2, Text as Text2 } from "@mantine/core";
+import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
 function MyFlexIconTitle(props) {
-  return /* @__PURE__ */ jsxs5(Flex2, __spreadProps(__spreadValues({ direction: "row", align: "center", gap: "xs" }, props), { children: [
+  return /* @__PURE__ */ jsxs6(Flex2, __spreadProps(__spreadValues({ direction: "row", align: "center", gap: "xs" }, props), { children: [
     props.icon,
-    /* @__PURE__ */ jsx10(Text, __spreadProps(__spreadValues({ size: "lg", fw: 700 }, props.textProps), { children: props == null ? void 0 : props.children }))
+    /* @__PURE__ */ jsx11(Text2, __spreadProps(__spreadValues({ size: "lg", fw: 700 }, props.textProps), { children: props == null ? void 0 : props.children }))
   ] }));
 }
 
 // src/core/dataDisplay/MyInfoBox.tsx
-import { Group, Paper, Stack as Stack2, Text as Text2 } from "@mantine/core";
-import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Group as Group2, Paper as Paper2, Stack as Stack2, Text as Text3 } from "@mantine/core";
+import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
 function MyInfoBox({ title, data, paperProps }) {
-  return /* @__PURE__ */ jsx11(Paper, __spreadProps(__spreadValues({ withBorder: true, shadow: "xs", radius: "md", p: "md", bg: const_object_colors.mantineBackgroundBlueLight }, paperProps), { children: /* @__PURE__ */ jsxs6(Stack2, { children: [
-    title && /* @__PURE__ */ jsx11(Text2, { fw: 600, size: "sm", children: title }),
-    data.map((item, index) => /* @__PURE__ */ jsxs6(Group, { justify: "space-between", children: [
-      /* @__PURE__ */ jsx11(Text2, { size: "sm", fw: 500, c: "dimmed", children: item.label }),
-      /* @__PURE__ */ jsx11(Text2, { size: "sm", fw: 500, children: item.value })
+  return /* @__PURE__ */ jsx12(Paper2, __spreadProps(__spreadValues({ withBorder: true, shadow: "xs", radius: "md", p: "md", bg: const_object_colors.mantineBackgroundBlueLight }, paperProps), { children: /* @__PURE__ */ jsxs7(Stack2, { children: [
+    title && /* @__PURE__ */ jsx12(Text3, { fw: 600, size: "sm", children: title }),
+    data.map((item, index) => /* @__PURE__ */ jsxs7(Group2, { justify: "space-between", children: [
+      /* @__PURE__ */ jsx12(Text3, { size: "sm", fw: 500, c: "dimmed", children: item.label }),
+      /* @__PURE__ */ jsx12(Text3, { size: "sm", fw: 500, children: item.value })
     ] }, index))
   ] }) }));
 }
 
 // src/core/dataDisplay/MyLabelValueRow.tsx
-import { Group as Group2, Text as Text3 } from "@mantine/core";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Group as Group3, Text as Text4 } from "@mantine/core";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
 function MyLabelValueRow({
   label,
   value,
@@ -541,18 +693,18 @@ function MyLabelValueRow({
   valueProps,
   groupProps
 }) {
-  return /* @__PURE__ */ jsxs7(Group2, __spreadProps(__spreadValues({ gap: 5, wrap: "nowrap" }, groupProps), { children: [
-    /* @__PURE__ */ jsxs7(Text3, __spreadProps(__spreadValues({ fw: 600 }, labelProps), { children: [
+  return /* @__PURE__ */ jsxs8(Group3, __spreadProps(__spreadValues({ gap: 5, wrap: "nowrap" }, groupProps), { children: [
+    /* @__PURE__ */ jsxs8(Text4, __spreadProps(__spreadValues({ fw: 600 }, labelProps), { children: [
       label,
       ":"
     ] })),
-    /* @__PURE__ */ jsx12(Text3, __spreadProps(__spreadValues({}, valueProps), { children: value }))
+    /* @__PURE__ */ jsx13(Text4, __spreadProps(__spreadValues({}, valueProps), { children: value }))
   ] }));
 }
 
 // src/core/dataDisplay/MyStatsCartd.tsx
 import { Box, Card, ThemeIcon } from "@mantine/core";
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
 function MyStatsCard({
   title,
   value,
@@ -561,22 +713,22 @@ function MyStatsCard({
   color,
   themeIconProps
 }) {
-  return /* @__PURE__ */ jsxs8(Card, { children: [
-    /* @__PURE__ */ jsx13("div", { className: `absolute inset-0 bg-gradient-to-br ${color} opacity-5` }),
-    /* @__PURE__ */ jsx13(Box, { className: "p-6", children: /* @__PURE__ */ jsxs8("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxs8("div", { children: [
-        /* @__PURE__ */ jsx13("p", { className: "text-sm font-medium text-muted-foreground", children: title }),
-        /* @__PURE__ */ jsx13("p", { className: "text-3xl font-bold", children: value }),
-        /* @__PURE__ */ jsx13("p", { className: "text-xs text-muted-foreground mt-1", children: subtitle })
+  return /* @__PURE__ */ jsxs9(Card, { children: [
+    /* @__PURE__ */ jsx14("div", { className: `absolute inset-0 bg-gradient-to-br ${color} opacity-5` }),
+    /* @__PURE__ */ jsx14(Box, { className: "p-6", children: /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs9("div", { children: [
+        /* @__PURE__ */ jsx14("p", { className: "text-sm font-medium text-muted-foreground", children: title }),
+        /* @__PURE__ */ jsx14("p", { className: "text-3xl font-bold", children: value }),
+        /* @__PURE__ */ jsx14("p", { className: "text-xs text-muted-foreground mt-1", children: subtitle })
       ] }),
-      /* @__PURE__ */ jsx13(ThemeIcon, __spreadProps(__spreadValues({ size: "xl", radius: "xl" }, themeIconProps), { children: icon }))
+      /* @__PURE__ */ jsx14(ThemeIcon, __spreadProps(__spreadValues({ size: "xl", radius: "xl" }, themeIconProps), { children: icon }))
     ] }) })
   ] });
 }
 
 // src/core/input/MyDayOfWeekPicker.tsx
-import { Badge, Group as Group3 } from "@mantine/core";
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { Badge, Group as Group4 } from "@mantine/core";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var days = Object.entries(enum_daysOfWeek).filter(([key]) => isNaN(Number(key))).map(([label, value]) => ({ label, value }));
 function MyDayOfWeekPicker({ value = [], onChange }) {
   const toggle = (val) => {
@@ -584,7 +736,7 @@ function MyDayOfWeekPicker({ value = [], onChange }) {
     const newValue = value.includes(val) ? value.filter((v) => v !== val) : [...value, val].sort((a, b) => a - b);
     onChange(newValue);
   };
-  return /* @__PURE__ */ jsx14(MyFlexRow, { align: "center", children: /* @__PURE__ */ jsx14(Group3, { gap: "xs", children: days.map((d) => /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15(MyFlexRow, { align: "center", children: /* @__PURE__ */ jsx15(Group4, { gap: "xs", children: days.map((d) => /* @__PURE__ */ jsx15(
     Badge,
     {
       variant: value.includes(d.value) ? "filled" : "outline",
@@ -604,15 +756,15 @@ import { Input, ScrollArea as ScrollArea2 } from "@mantine/core";
 import { Link, RichTextEditor as MantineRichTextEditor, RichTextEditor } from "@mantine/tiptap";
 import FileHandler from "@tiptap-pro/extension-file-handler";
 import Highlight from "@tiptap/extension-highlight";
-import Image from "@tiptap/extension-image";
+import Image2 from "@tiptap/extension-image";
 import SubScript from "@tiptap/extension-subscript";
 import Superscript from "@tiptap/extension-superscript";
 import TextAlign from "@tiptap/extension-text-align";
 import Underline from "@tiptap/extension-underline";
 import { useEditor } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
-import { useEffect as useEffect2 } from "react";
-import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useEffect as useEffect3 } from "react";
+import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
 function MyRichTextEditor(props) {
   const editor = useEditor({
     extensions: [
@@ -622,7 +774,7 @@ function MyRichTextEditor(props) {
       Superscript,
       SubScript,
       Highlight,
-      Image.extend({
+      Image2.extend({
         addAttributes() {
           return {
             src: {
@@ -691,58 +843,58 @@ function MyRichTextEditor(props) {
       (_a = props.onBlur) == null ? void 0 : _a.call(props, editor2.getHTML());
     }
   });
-  useEffect2(() => {
+  useEffect3(() => {
     if (editor && props.value !== editor.getHTML()) {
       editor.commands.setContent(props.value || "", false);
     }
   }, [props.value, editor]);
-  return /* @__PURE__ */ jsx15(Input.Wrapper, __spreadProps(__spreadValues({}, props.inputWrapperProps), { children: /* @__PURE__ */ jsxs9(MantineRichTextEditor, __spreadProps(__spreadValues({ editor }, props.richTextEditorProps), { children: [
-    /* @__PURE__ */ jsxs9(MantineRichTextEditor.Toolbar, __spreadProps(__spreadValues({}, props.richTextEditorToolBarProps), { children: [
-      /* @__PURE__ */ jsxs9(MantineRichTextEditor.ControlsGroup, { children: [
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Bold, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Italic, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Underline, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Strikethrough, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.ClearFormatting, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Highlight, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Code, {})
+  return /* @__PURE__ */ jsx16(Input.Wrapper, __spreadProps(__spreadValues({}, props.inputWrapperProps), { children: /* @__PURE__ */ jsxs10(MantineRichTextEditor, __spreadProps(__spreadValues({ editor }, props.richTextEditorProps), { children: [
+    /* @__PURE__ */ jsxs10(MantineRichTextEditor.Toolbar, __spreadProps(__spreadValues({}, props.richTextEditorToolBarProps), { children: [
+      /* @__PURE__ */ jsxs10(MantineRichTextEditor.ControlsGroup, { children: [
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Bold, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Italic, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Underline, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Strikethrough, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.ClearFormatting, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Highlight, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Code, {})
       ] }),
-      /* @__PURE__ */ jsxs9(MantineRichTextEditor.ControlsGroup, { children: [
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.H1, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.H2, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.H3, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.H4, {})
+      /* @__PURE__ */ jsxs10(MantineRichTextEditor.ControlsGroup, { children: [
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.H1, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.H2, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.H3, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.H4, {})
       ] }),
-      /* @__PURE__ */ jsxs9(MantineRichTextEditor.ControlsGroup, { children: [
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Blockquote, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Hr, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.BulletList, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.OrderedList, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Subscript, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Superscript, {})
+      /* @__PURE__ */ jsxs10(MantineRichTextEditor.ControlsGroup, { children: [
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Blockquote, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Hr, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.BulletList, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.OrderedList, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Subscript, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Superscript, {})
       ] }),
-      /* @__PURE__ */ jsxs9(MantineRichTextEditor.ControlsGroup, { children: [
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Link, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.Unlink, {})
+      /* @__PURE__ */ jsxs10(MantineRichTextEditor.ControlsGroup, { children: [
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Link, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.Unlink, {})
       ] }),
-      /* @__PURE__ */ jsxs9(MantineRichTextEditor.ControlsGroup, { children: [
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.AlignLeft, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.AlignCenter, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.AlignJustify, {}),
-        /* @__PURE__ */ jsx15(MantineRichTextEditor.AlignRight, {})
+      /* @__PURE__ */ jsxs10(MantineRichTextEditor.ControlsGroup, { children: [
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.AlignLeft, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.AlignCenter, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.AlignJustify, {}),
+        /* @__PURE__ */ jsx16(MantineRichTextEditor.AlignRight, {})
       ] }),
       props.extraControlsGroup
     ] })),
-    /* @__PURE__ */ jsx15(
+    /* @__PURE__ */ jsx16(
       ScrollArea2.Autosize,
       __spreadProps(__spreadValues({
         onMouseDown: () => {
           editor == null ? void 0 : editor.commands.focus();
         },
-        mah: "200",
+        mah: "130",
         style: { cursor: "text" }
       }, props.scrollAreaAutosizeProps), {
-        children: /* @__PURE__ */ jsx15(RichTextEditor.Content, __spreadValues({ mih: "200" }, props.richTextEditorContentProps))
+        children: /* @__PURE__ */ jsx16(RichTextEditor.Content, __spreadValues({ mih: "130" }, props.richTextEditorContentProps))
       })
     )
   ] })) }));
@@ -751,7 +903,7 @@ function MyRichTextEditor(props) {
 // src/core/input/MySelect.tsx
 import { Loader, Select } from "@mantine/core";
 import React from "react";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 function extractTextFromReactNode(node) {
   if (typeof node === "string" || typeof node === "number") return String(node);
   if (Array.isArray(node)) return node.map(extractTextFromReactNode).join(" ");
@@ -769,7 +921,7 @@ function MySelect(_a) {
     const plainTextLabel = extractTextFromReactNode(label).toLowerCase().trim();
     placeholder = `Ch\u1ECDn ${plainTextLabel}`;
   }
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(
     Select,
     __spreadValues({
       searchable: true,
@@ -777,7 +929,7 @@ function MySelect(_a) {
       placeholder,
       data: data != null ? data : [],
       error: isError ? true : void 0,
-      rightSection: isLoading ? /* @__PURE__ */ jsx16(Loader, { size: "xs" }) : void 0,
+      rightSection: isLoading ? /* @__PURE__ */ jsx17(Loader, { size: "xs" }) : void 0,
       disabled: isLoading || isError,
       styles: (theme) => ({
         input: rest.readOnly ? {
@@ -792,8 +944,8 @@ function MySelect(_a) {
 }
 
 // src/core/input/MySelectFromAPI.tsx
-import { useCallback, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef2 } from "react";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { useCallback, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef2 } from "react";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function MySelectFromAPI(_a) {
   var _b = _a, {
     queryKey,
@@ -846,7 +998,7 @@ function MySelectFromAPI(_a) {
       setObjectData(selected);
     }
   };
-  useEffect3(() => {
+  useEffect4(() => {
     var _a2, _b2, _c;
     if (autoSelectFirstItem && !hasAutoSelected.current && ((_a2 = query.data) == null ? void 0 : _a2.length) && (value === void 0 || value === null || value === "")) {
       const firstItem = query.data[0];
@@ -857,7 +1009,7 @@ function MySelectFromAPI(_a) {
       hasAutoSelected.current = true;
     }
   }, [autoSelectFirstItem, query.data, value, getLabel, onChange, setObjectData]);
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(
     MySelect,
     __spreadValues({
       isLoading: query.isLoading,
@@ -871,10 +1023,10 @@ function MySelectFromAPI(_a) {
 
 // src/core/input/MyTextInput.tsx
 import { TextInput } from "@mantine/core";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 function MyTextInput(_a) {
   var _b = _a, { label, isPhoneNumber } = _b, rest = __objRest(_b, ["label", "isPhoneNumber"]);
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx19(
     TextInput,
     __spreadValues({
       onKeyDown: (e) => {
@@ -913,23 +1065,23 @@ function MyTextInput(_a) {
 
 // src/core/input/MyWeeklySessionSchedulerPicker.tsx
 import {
-  Button as Button5,
+  Button as Button6,
   Center,
   Divider,
-  Group as Group4,
+  Group as Group5,
   NumberInput,
-  Paper as Paper2,
+  Paper as Paper3,
   ScrollArea as ScrollArea3,
-  Text as Text5
+  Text as Text6
 } from "@mantine/core";
 import { IconPlus as IconPlus4, IconTrash as IconTrash3 } from "@tabler/icons-react";
-import { useState } from "react";
-import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
+import { useState as useState2 } from "react";
+import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
 function MyWeeklySessionSchedulerPicker({
   value = [],
   onChange
 }) {
-  const [selectedDays, setSelectedDays] = useState([]);
+  const [selectedDays, setSelectedDays] = useState2([]);
   const handleAddSession = (dayOfWeek) => {
     const newSession = {
       dayOfWeek,
@@ -955,8 +1107,8 @@ function MyWeeklySessionSchedulerPicker({
     return acc;
   }, {});
   const getLabel = (day) => enum_daysOfWeek[day] || `Day ${day}`;
-  return /* @__PURE__ */ jsx19(Paper2, { w: "100%", p: "md", children: /* @__PURE__ */ jsxs10(MyFlexColumn, { children: [
-    /* @__PURE__ */ jsx19(Center, { children: /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx20(Paper3, { w: "100%", p: "md", children: /* @__PURE__ */ jsxs11(MyFlexColumn, { children: [
+    /* @__PURE__ */ jsx20(Center, { children: /* @__PURE__ */ jsx20(
       MyDayOfWeekPicker,
       {
         value: selectedDays,
@@ -966,41 +1118,41 @@ function MyWeeklySessionSchedulerPicker({
         }
       }
     ) }),
-    /* @__PURE__ */ jsx19(Divider, { my: "xs" }),
-    /* @__PURE__ */ jsx19(Center, { children: /* @__PURE__ */ jsx19(ScrollArea3.Autosize, { h: "40vh", children: /* @__PURE__ */ jsx19(MyFlexColumn, { w: { base: "100%", sm: "70%" }, children: selectedDays.map((dayOfWeek) => {
+    /* @__PURE__ */ jsx20(Divider, { my: "xs" }),
+    /* @__PURE__ */ jsx20(Center, { children: /* @__PURE__ */ jsx20(ScrollArea3.Autosize, { h: "40vh", children: /* @__PURE__ */ jsx20(MyFlexColumn, { w: { base: "100%", sm: "70%" }, children: selectedDays.map((dayOfWeek) => {
       var _a;
-      return /* @__PURE__ */ jsxs10(
-        Paper2,
+      return /* @__PURE__ */ jsxs11(
+        Paper3,
         {
           w: "100%",
           p: "md",
           bg: const_object_colors.mantineBackgroundBlueLight,
           children: [
-            /* @__PURE__ */ jsxs10(Group4, { gap: "apart", children: [
-              /* @__PURE__ */ jsx19(Text5, { w: "70px", fw: 500, children: getLabel(dayOfWeek) }),
-              /* @__PURE__ */ jsx19(
-                Button5,
+            /* @__PURE__ */ jsxs11(Group5, { gap: "apart", children: [
+              /* @__PURE__ */ jsx20(Text6, { w: "70px", fw: 500, children: getLabel(dayOfWeek) }),
+              /* @__PURE__ */ jsx20(
+                Button6,
                 {
                   color: "teal.5",
-                  leftSection: /* @__PURE__ */ jsx19(IconPlus4, { size: 14 }),
+                  leftSection: /* @__PURE__ */ jsx20(IconPlus4, { size: 14 }),
                   onClick: () => handleAddSession(dayOfWeek),
                   children: "Th\xEAm bu\u1ED5i"
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx19(Divider, { my: "sm" }),
+            /* @__PURE__ */ jsx20(Divider, { my: "sm" }),
             (_a = grouped[dayOfWeek]) == null ? void 0 : _a.map((item, indexInDay) => {
               const globalIndex = value.findIndex(
                 (v) => v === item
               );
-              return /* @__PURE__ */ jsxs10(
-                Group4,
+              return /* @__PURE__ */ jsxs11(
+                Group5,
                 {
                   mt: "xs",
                   gap: "xs",
                   align: "flex-end",
                   children: [
-                    /* @__PURE__ */ jsx19(
+                    /* @__PURE__ */ jsx20(
                       NumberInput,
                       {
                         label: "Ti\u1EBFt b\u1EAFt \u0111\u1EA7u",
@@ -1012,7 +1164,7 @@ function MyWeeklySessionSchedulerPicker({
                         )
                       }
                     ),
-                    /* @__PURE__ */ jsx19(
+                    /* @__PURE__ */ jsx20(
                       NumberInput,
                       {
                         label: "S\u1ED1 ti\u1EBFt",
@@ -1024,7 +1176,7 @@ function MyWeeklySessionSchedulerPicker({
                         )
                       }
                     ),
-                    /* @__PURE__ */ jsx19(
+                    /* @__PURE__ */ jsx20(
                       NumberInput,
                       {
                         label: "S\u1ED1 ph\xFAt  ",
@@ -1033,13 +1185,13 @@ function MyWeeklySessionSchedulerPicker({
                         value: item.durationMinutes
                       }
                     ),
-                    /* @__PURE__ */ jsx19(
-                      Button5,
+                    /* @__PURE__ */ jsx20(
+                      Button6,
                       {
                         variant: "light",
                         color: "red",
                         onClick: () => handleRemove(globalIndex),
-                        leftSection: /* @__PURE__ */ jsx19(IconTrash3, { size: 14 }),
+                        leftSection: /* @__PURE__ */ jsx20(IconTrash3, { size: 14 }),
                         children: "X\xF3a bu\u1ED5i"
                       }
                     )
@@ -1058,13 +1210,13 @@ function MyWeeklySessionSchedulerPicker({
 
 // src/core/layout/MyDroppablePlaceholder.tsx
 import { useDroppable } from "@dnd-kit/core";
-import { Card as Card2, Text as Text6 } from "@mantine/core";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { Card as Card2, Text as Text7 } from "@mantine/core";
+import { jsx as jsx21 } from "react/jsx-runtime";
 function DroppablePlaceholder({ id }) {
   const { setNodeRef } = useDroppable({
     id
   });
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx21(
     Card2,
     {
       ref: setNodeRef,
@@ -1072,21 +1224,21 @@ function DroppablePlaceholder({ id }) {
       radius: "md",
       p: "sm",
       style: { opacity: 0.5, minHeight: 40 },
-      children: /* @__PURE__ */ jsx20(Text6, { size: "sm", c: "dimmed", ta: "center", children: "K\xE9o item v\xE0o \u0111\xE2y" })
+      children: /* @__PURE__ */ jsx21(Text7, { size: "sm", c: "dimmed", ta: "center", children: "K\xE9o item v\xE0o \u0111\xE2y" })
     }
   );
 }
 
 // src/core/layout/MyFlexEnd.tsx
-import { Group as Group5 } from "@mantine/core";
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { Group as Group6 } from "@mantine/core";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function MyFlexEnd(_a) {
   var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
-  return /* @__PURE__ */ jsx21(Group5, __spreadProps(__spreadValues({ justify: "end", mt: "md" }, rest), { children }));
+  return /* @__PURE__ */ jsx22(Group6, __spreadProps(__spreadValues({ justify: "end", mt: "md" }, rest), { children }));
 }
 
 // src/core/overlays/MyPrintContent.tsx
-import { jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
 function MyPrintContent({
   children,
   autoPadding = true,
@@ -1104,9 +1256,9 @@ function MyPrintContent({
         return ``;
     }
   };
-  return /* @__PURE__ */ jsxs11("div", { children: [
-    /* @__PURE__ */ jsx22("style", { children: getPageSizeCSS() }),
-    /* @__PURE__ */ jsx22("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsxs12("div", { children: [
+    /* @__PURE__ */ jsx23("style", { children: getPageSizeCSS() }),
+    /* @__PURE__ */ jsx23("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx23(
       "div",
       {
         ref: printRef,
@@ -1122,17 +1274,17 @@ function MyPrintContent({
 
 // src/core/overlays/MyModalStackImport/Usecase/Usecase_FileFieldMappingModal.tsx
 import {
-  Button as Button6,
-  Group as Group6,
-  Modal as Modal3,
+  Button as Button7,
+  Group as Group7,
+  Modal as Modal4,
   Select as Select2,
   Stack as Stack3,
   Table,
   Title
 } from "@mantine/core";
 import { IconChevronLeft, IconChevronRight, IconPlus as IconPlus5, IconRowRemove } from "@tabler/icons-react";
-import { useMemo as useMemo3, useState as useState2 } from "react";
-import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useMemo as useMemo3, useState as useState3 } from "react";
+import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
 function Usecase_FileFieldMappingModal(_a) {
   var _b = _a, {
     jsonData,
@@ -1147,8 +1299,8 @@ function Usecase_FileFieldMappingModal(_a) {
     "handleBack",
     "onCloseAll"
   ]);
-  const [selectedFields, setSelectedFields] = useState2([]);
-  const [columnMapping, setColumnMapping] = useState2({});
+  const [selectedFields, setSelectedFields] = useState3([]);
+  const [columnMapping, setColumnMapping] = useState3({});
   const excelColumns = useMemo3(() => {
     if (jsonData.length === 0) return [];
     return Object.keys(jsonData[0]);
@@ -1191,25 +1343,25 @@ function Usecase_FileFieldMappingModal(_a) {
     });
     onContinute(mapped);
   };
-  return /* @__PURE__ */ jsxs12(
-    Modal3,
+  return /* @__PURE__ */ jsxs13(
+    Modal4,
     __spreadProps(__spreadValues({
       title: "Mapping d\u1EEF li\u1EC7u",
       size: "80%"
     }, rest), {
       children: [
-        /* @__PURE__ */ jsxs12(Group6, { align: "start", grow: true, children: [
-          /* @__PURE__ */ jsxs12(Stack3, { w: "45%", children: [
-            /* @__PURE__ */ jsx23(Title, { order: 5, children: "Danh s\xE1ch tr\u01B0\u1EDDng th\xF4ng tin" }),
-            /* @__PURE__ */ jsxs12(Table, { striped: true, children: [
-              /* @__PURE__ */ jsx23(Table.Thead, { children: /* @__PURE__ */ jsxs12(Table.Tr, { children: [
-                /* @__PURE__ */ jsx23(Table.Th, { children: "M\xE3 field" }),
-                /* @__PURE__ */ jsx23(Table.Th, { children: "T\xEAn field" }),
-                /* @__PURE__ */ jsx23(Table.Th, { children: /* @__PURE__ */ jsx23(
-                  Button6,
+        /* @__PURE__ */ jsxs13(Group7, { align: "start", grow: true, children: [
+          /* @__PURE__ */ jsxs13(Stack3, { w: "45%", children: [
+            /* @__PURE__ */ jsx24(Title, { order: 5, children: "Danh s\xE1ch tr\u01B0\u1EDDng th\xF4ng tin" }),
+            /* @__PURE__ */ jsxs13(Table, { striped: true, children: [
+              /* @__PURE__ */ jsx24(Table.Thead, { children: /* @__PURE__ */ jsxs13(Table.Tr, { children: [
+                /* @__PURE__ */ jsx24(Table.Th, { children: "M\xE3 field" }),
+                /* @__PURE__ */ jsx24(Table.Th, { children: "T\xEAn field" }),
+                /* @__PURE__ */ jsx24(Table.Th, { children: /* @__PURE__ */ jsx24(
+                  Button7,
                   {
                     size: "xs",
-                    leftSection: /* @__PURE__ */ jsx23(IconPlus5, {}),
+                    leftSection: /* @__PURE__ */ jsx24(IconPlus5, {}),
                     onClick: () => {
                       const newlyAdded = unselectedFields;
                       setSelectedFields((prev) => [...prev, ...newlyAdded]);
@@ -1228,33 +1380,33 @@ function Usecase_FileFieldMappingModal(_a) {
                   }
                 ) })
               ] }) }),
-              /* @__PURE__ */ jsx23(Table.Tbody, { children: unselectedFields.map((field) => /* @__PURE__ */ jsxs12(Table.Tr, { children: [
-                /* @__PURE__ */ jsx23(Table.Td, { children: field.key }),
-                /* @__PURE__ */ jsx23(Table.Td, { children: field.label }),
-                /* @__PURE__ */ jsx23(Table.Td, { children: /* @__PURE__ */ jsx23(
-                  Button6,
+              /* @__PURE__ */ jsx24(Table.Tbody, { children: unselectedFields.map((field) => /* @__PURE__ */ jsxs13(Table.Tr, { children: [
+                /* @__PURE__ */ jsx24(Table.Td, { children: field.key }),
+                /* @__PURE__ */ jsx24(Table.Td, { children: field.label }),
+                /* @__PURE__ */ jsx24(Table.Td, { children: /* @__PURE__ */ jsx24(
+                  Button7,
                   {
                     variant: "light",
                     onClick: () => handleAddField(field),
-                    leftSection: /* @__PURE__ */ jsx23(IconChevronRight, { size: 14 }),
+                    leftSection: /* @__PURE__ */ jsx24(IconChevronRight, { size: 14 }),
                     children: "Th\xEAm"
                   }
                 ) })
               ] }, field.key)) })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs12(Stack3, { w: "55%", children: [
-            /* @__PURE__ */ jsx23(Title, { order: 5, children: "Tr\u01B0\u1EDDng \u0111\xE3 ch\u1ECDn & c\u1ED9t map" }),
-            /* @__PURE__ */ jsxs12(Table, { striped: true, children: [
-              /* @__PURE__ */ jsx23(Table.Thead, { children: /* @__PURE__ */ jsxs12(Table.Tr, { children: [
-                /* @__PURE__ */ jsx23(Table.Th, { children: "M\xE3 field" }),
-                /* @__PURE__ */ jsx23(Table.Th, { children: "T\xEAn field" }),
-                /* @__PURE__ */ jsx23(Table.Th, { children: "C\u1ED9t map" }),
-                /* @__PURE__ */ jsx23(Table.Th, { children: /* @__PURE__ */ jsx23(
-                  Button6,
+          /* @__PURE__ */ jsxs13(Stack3, { w: "55%", children: [
+            /* @__PURE__ */ jsx24(Title, { order: 5, children: "Tr\u01B0\u1EDDng \u0111\xE3 ch\u1ECDn & c\u1ED9t map" }),
+            /* @__PURE__ */ jsxs13(Table, { striped: true, children: [
+              /* @__PURE__ */ jsx24(Table.Thead, { children: /* @__PURE__ */ jsxs13(Table.Tr, { children: [
+                /* @__PURE__ */ jsx24(Table.Th, { children: "M\xE3 field" }),
+                /* @__PURE__ */ jsx24(Table.Th, { children: "T\xEAn field" }),
+                /* @__PURE__ */ jsx24(Table.Th, { children: "C\u1ED9t map" }),
+                /* @__PURE__ */ jsx24(Table.Th, { children: /* @__PURE__ */ jsx24(
+                  Button7,
                   {
                     size: "xs",
-                    leftSection: /* @__PURE__ */ jsx23(IconRowRemove, {}),
+                    leftSection: /* @__PURE__ */ jsx24(IconRowRemove, {}),
                     color: "red",
                     onClick: () => {
                       setSelectedFields([]);
@@ -1264,10 +1416,10 @@ function Usecase_FileFieldMappingModal(_a) {
                   }
                 ) })
               ] }) }),
-              /* @__PURE__ */ jsx23(Table.Tbody, { children: selectedFields.map((field) => /* @__PURE__ */ jsxs12(Table.Tr, { children: [
-                /* @__PURE__ */ jsx23(Table.Td, { children: field.key }),
-                /* @__PURE__ */ jsx23(Table.Td, { children: field.label }),
-                /* @__PURE__ */ jsx23(Table.Td, { children: /* @__PURE__ */ jsx23(
+              /* @__PURE__ */ jsx24(Table.Tbody, { children: selectedFields.map((field) => /* @__PURE__ */ jsxs13(Table.Tr, { children: [
+                /* @__PURE__ */ jsx24(Table.Td, { children: field.key }),
+                /* @__PURE__ */ jsx24(Table.Td, { children: field.label }),
+                /* @__PURE__ */ jsx24(Table.Td, { children: /* @__PURE__ */ jsx24(
                   Select2,
                   {
                     placeholder: "Ch\u1ECDn c\u1ED9t",
@@ -1279,12 +1431,12 @@ function Usecase_FileFieldMappingModal(_a) {
                     searchable: true
                   }
                 ) }),
-                /* @__PURE__ */ jsx23(Table.Td, { children: /* @__PURE__ */ jsx23(
-                  Button6,
+                /* @__PURE__ */ jsx24(Table.Td, { children: /* @__PURE__ */ jsx24(
+                  Button7,
                   {
                     variant: "light",
                     onClick: () => handleRemoveField(field),
-                    leftSection: /* @__PURE__ */ jsx23(IconChevronLeft, { size: 14 }),
+                    leftSection: /* @__PURE__ */ jsx24(IconChevronLeft, { size: 14 }),
                     children: "B\u1ECF"
                   }
                 ) })
@@ -1292,10 +1444,10 @@ function Usecase_FileFieldMappingModal(_a) {
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs12(Group6, { justify: "end", mt: "md", children: [
-          /* @__PURE__ */ jsx23(Button6, { onClick: handleBack, children: "Quay l\u1EA1i" }),
-          /* @__PURE__ */ jsx23(Button6, { onClick: handleContinute, children: "Ti\u1EBFp t\u1EE5c" }),
-          /* @__PURE__ */ jsx23(Button6, { variant: "outline", onClick: onCloseAll, children: "\u0110\xF3ng" })
+        /* @__PURE__ */ jsxs13(Group7, { justify: "end", mt: "md", children: [
+          /* @__PURE__ */ jsx24(Button7, { onClick: handleBack, children: "Quay l\u1EA1i" }),
+          /* @__PURE__ */ jsx24(Button7, { onClick: handleContinute, children: "Ti\u1EBFp t\u1EE5c" }),
+          /* @__PURE__ */ jsx24(Button7, { variant: "outline", onClick: onCloseAll, children: "\u0110\xF3ng" })
         ] })
       ]
     })
@@ -1304,18 +1456,18 @@ function Usecase_FileFieldMappingModal(_a) {
 
 // src/core/overlays/MyModalStackImport/Usecase/Usecase_FileImportConfigModal.tsx
 import {
-  Button as Button7,
+  Button as Button8,
   FileInput,
   Grid,
-  Group as Group7,
-  Modal as Modal4,
+  Group as Group8,
+  Modal as Modal5,
   Select as Select3,
   Stack as Stack4
 } from "@mantine/core";
 import { IconCopy } from "@tabler/icons-react";
-import { useEffect as useEffect4, useMemo as useMemo4, useState as useState3 } from "react";
+import { useEffect as useEffect5, useMemo as useMemo4, useState as useState4 } from "react";
 import * as XLSX from "xlsx";
-import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
 function Usecase_FileImportConfigModal(_a) {
   var _b = _a, {
     onChange,
@@ -1326,11 +1478,11 @@ function Usecase_FileImportConfigModal(_a) {
     "onContinute",
     "onExportStructure"
   ]);
-  const [file, setFile] = useState3(null);
-  const [rawData, setRawData] = useState3([]);
-  const [parsedValueOnly, setParsedValueOnly] = useState3([]);
-  const [titleIndex, setTitleIndex] = useState3("2");
-  const [dataStartIndex, setDataStartIndex] = useState3("3");
+  const [file, setFile] = useState4(null);
+  const [rawData, setRawData] = useState4([]);
+  const [parsedValueOnly, setParsedValueOnly] = useState4([]);
+  const [titleIndex, setTitleIndex] = useState4("2");
+  const [dataStartIndex, setDataStartIndex] = useState4("3");
   const parseExcel = async (file2) => {
     const data = await file2.arrayBuffer();
     const workbook = XLSX.read(data);
@@ -1346,7 +1498,7 @@ function Usecase_FileImportConfigModal(_a) {
     setDataStartIndex("3");
     if (file2) parseExcel(file2);
   };
-  useEffect4(() => {
+  useEffect5(() => {
     const headerRowIndex = titleIndex ? parseInt(titleIndex) - 1 : null;
     const dataRowIndex = dataStartIndex ? parseInt(dataStartIndex) - 1 : null;
     if (!rawData || headerRowIndex === null || dataRowIndex === null || dataRowIndex >= rawData.length || headerRowIndex >= rawData.length) {
@@ -1382,15 +1534,15 @@ function Usecase_FileImportConfigModal(_a) {
       return obj;
     });
   }, [rawData]);
-  return /* @__PURE__ */ jsx24(
-    Modal4,
+  return /* @__PURE__ */ jsx25(
+    Modal5,
     __spreadProps(__spreadValues({
       title: "Import",
       size: "80%"
     }, rest), {
-      children: /* @__PURE__ */ jsxs13(Stack4, { children: [
-        /* @__PURE__ */ jsxs13(Grid, { children: [
-          /* @__PURE__ */ jsx24(Grid.Col, { span: 8, children: /* @__PURE__ */ jsx24(
+      children: /* @__PURE__ */ jsxs14(Stack4, { children: [
+        /* @__PURE__ */ jsxs14(Grid, { children: [
+          /* @__PURE__ */ jsx25(Grid.Col, { span: 8, children: /* @__PURE__ */ jsx25(
             FileInput,
             {
               clearable: true,
@@ -1400,8 +1552,8 @@ function Usecase_FileImportConfigModal(_a) {
               onChange: handleSelectFile
             }
           ) }),
-          /* @__PURE__ */ jsx24(Grid.Col, { span: 4, children: /* @__PURE__ */ jsx24(Group7, { align: "end", h: "100%", children: /* @__PURE__ */ jsx24(Button7, { leftSection: /* @__PURE__ */ jsx24(IconCopy, {}), w: "100%", children: "D\xE1n t\u1EEB b\u1ED9 nh\u1EDB" }) }) }),
-          /* @__PURE__ */ jsx24(Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx25(Grid.Col, { span: 4, children: /* @__PURE__ */ jsx25(Group8, { align: "end", h: "100%", children: /* @__PURE__ */ jsx25(Button8, { leftSection: /* @__PURE__ */ jsx25(IconCopy, {}), w: "100%", children: "D\xE1n t\u1EEB b\u1ED9 nh\u1EDB" }) }) }),
+          /* @__PURE__ */ jsx25(Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ jsx25(
             Select3,
             {
               value: titleIndex,
@@ -1411,7 +1563,7 @@ function Usecase_FileImportConfigModal(_a) {
               disabled: !file
             }
           ) }),
-          /* @__PURE__ */ jsx24(Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx25(Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ jsx25(
             Select3,
             {
               value: dataStartIndex,
@@ -1422,19 +1574,19 @@ function Usecase_FileImportConfigModal(_a) {
             }
           ) })
         ] }),
-        /* @__PURE__ */ jsx24(MyFieldset, { title: "Danh s\xE1ch tr\u01B0\u1EDDng th\xF4ng tin trong file d\u1EEF li\u1EC7u", children: /* @__PURE__ */ jsx24(MyDataTable, { columns, data: tableDisplayData }) }),
-        /* @__PURE__ */ jsxs13(Group7, { justify: "end", children: [
-          /* @__PURE__ */ jsx24(
-            Button7,
+        /* @__PURE__ */ jsx25(MyFieldset, { title: "Danh s\xE1ch tr\u01B0\u1EDDng th\xF4ng tin trong file d\u1EEF li\u1EC7u", children: /* @__PURE__ */ jsx25(MyDataTable, { columns, data: tableDisplayData }) }),
+        /* @__PURE__ */ jsxs14(Group8, { justify: "end", children: [
+          /* @__PURE__ */ jsx25(
+            Button8,
             {
               onClick: onExportStructure,
               children: "Xu\u1EA5t file c\u1EA5u tr\xFAc"
             }
           ),
-          /* @__PURE__ */ jsx24(Button7, { onClick: () => {
+          /* @__PURE__ */ jsx25(Button8, { onClick: () => {
             onContinute == null ? void 0 : onContinute();
           }, children: "Ti\u1EBFp t\u1EE5c" }),
-          /* @__PURE__ */ jsx24(Button7, { variant: "outline", onClick: rest.onClose, children: "\u0110\xF3ng" })
+          /* @__PURE__ */ jsx25(Button8, { variant: "outline", onClick: rest.onClose, children: "\u0110\xF3ng" })
         ] })
       ] })
     })
@@ -1442,12 +1594,12 @@ function Usecase_FileImportConfigModal(_a) {
 }
 
 // src/core/overlays/MyModalStackImport/MyModalStackImport.tsx
-import { Modal as Modal7 } from "@mantine/core";
-import { useState as useState4 } from "react";
+import { Modal as Modal8 } from "@mantine/core";
+import { useState as useState5 } from "react";
 
 // src/core/overlays/MyModalStackImport/Usecase/Usecase_FileImportValidationDetailModal.tsx
-import { Modal as Modal5, Table as Table2, Text as Text7 } from "@mantine/core";
-import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Modal as Modal6, Table as Table2, Text as Text8 } from "@mantine/core";
+import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
 function Usecase_FileImportValidationDetailModal(_a) {
   var _b = _a, {
     data
@@ -1455,19 +1607,19 @@ function Usecase_FileImportValidationDetailModal(_a) {
     "data"
   ]);
   if (!data || data.length === 0) {
-    return /* @__PURE__ */ jsx25(Modal5, __spreadProps(__spreadValues({}, props), { title: "Chi ti\u1EBFt l\u1ED7i", children: /* @__PURE__ */ jsx25(Text7, { children: "Kh\xF4ng c\xF3 d\u1EEF li\u1EC7u." }) }));
+    return /* @__PURE__ */ jsx26(Modal6, __spreadProps(__spreadValues({}, props), { title: "Chi ti\u1EBFt l\u1ED7i", children: /* @__PURE__ */ jsx26(Text8, { children: "Kh\xF4ng c\xF3 d\u1EEF li\u1EC7u." }) }));
   }
   const columns = Object.keys(data[0].values || {});
-  return /* @__PURE__ */ jsx25(Modal5, __spreadProps(__spreadValues({}, props), { title: "Chi ti\u1EBFt l\u1ED7i", size: "70%", zIndex: 1e3, children: /* @__PURE__ */ jsxs14(Table2, { withTableBorder: true, striped: true, children: [
-    /* @__PURE__ */ jsx25(Table2.Thead, { children: /* @__PURE__ */ jsxs14(Table2.Tr, { children: [
-      columns.map((col) => /* @__PURE__ */ jsx25(Table2.Th, { children: col }, col)),
-      /* @__PURE__ */ jsx25(Table2.Th, { children: "L\u1ED7i" })
+  return /* @__PURE__ */ jsx26(Modal6, __spreadProps(__spreadValues({}, props), { title: "Chi ti\u1EBFt l\u1ED7i", size: "70%", zIndex: 1e3, children: /* @__PURE__ */ jsxs15(Table2, { withTableBorder: true, striped: true, children: [
+    /* @__PURE__ */ jsx26(Table2.Thead, { children: /* @__PURE__ */ jsxs15(Table2.Tr, { children: [
+      columns.map((col) => /* @__PURE__ */ jsx26(Table2.Th, { children: col }, col)),
+      /* @__PURE__ */ jsx26(Table2.Th, { children: "L\u1ED7i" })
     ] }) }),
-    /* @__PURE__ */ jsx25(Table2.Tbody, { children: data.map((row, i) => {
+    /* @__PURE__ */ jsx26(Table2.Tbody, { children: data.map((row, i) => {
       var _a2;
-      return /* @__PURE__ */ jsxs14(Table2.Tr, { children: [
-        columns.map((col) => /* @__PURE__ */ jsx25(Table2.Td, { children: row.values[col] }, col)),
-        /* @__PURE__ */ jsx25(Table2.Td, { children: (_a2 = row.error) != null ? _a2 : "" })
+      return /* @__PURE__ */ jsxs15(Table2.Tr, { children: [
+        columns.map((col) => /* @__PURE__ */ jsx26(Table2.Td, { children: row.values[col] }, col)),
+        /* @__PURE__ */ jsx26(Table2.Td, { children: (_a2 = row.error) != null ? _a2 : "" })
       ] }, i);
     }) })
   ] }) }));
@@ -1475,12 +1627,12 @@ function Usecase_FileImportValidationDetailModal(_a) {
 
 // src/core/overlays/MyModalStackImport/Usecase/Usecase_FileImportValidationModal.tsx
 import {
-  Button as Button8,
-  Group as Group8,
-  Modal as Modal6,
+  Button as Button9,
+  Group as Group9,
+  Modal as Modal7,
   Table as Table3
 } from "@mantine/core";
-import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
 function Usecase_FileImportValidationModal(_a) {
   var _b = _a, {
     data,
@@ -1495,38 +1647,38 @@ function Usecase_FileImportValidationModal(_a) {
     "onCloseAll",
     "onOpenDetail"
   ]);
-  return /* @__PURE__ */ jsxs15(Modal6, __spreadProps(__spreadValues({}, modalProps), { title: "K\u1EBFt qu\u1EA3 ki\u1EC3m tra", children: [
-    /* @__PURE__ */ jsxs15(Table3, { withTableBorder: true, striped: true, children: [
-      /* @__PURE__ */ jsx26(Table3.Thead, { children: /* @__PURE__ */ jsxs15(Table3.Tr, { children: [
-        /* @__PURE__ */ jsx26(Table3.Th, { children: "K\u1EBFt qu\u1EA3" }),
-        /* @__PURE__ */ jsx26(Table3.Th, { children: "S\u1ED1 l\u01B0\u1EE3ng" }),
-        /* @__PURE__ */ jsx26(Table3.Th, {})
+  return /* @__PURE__ */ jsxs16(Modal7, __spreadProps(__spreadValues({}, modalProps), { title: "K\u1EBFt qu\u1EA3 ki\u1EC3m tra", children: [
+    /* @__PURE__ */ jsxs16(Table3, { withTableBorder: true, striped: true, children: [
+      /* @__PURE__ */ jsx27(Table3.Thead, { children: /* @__PURE__ */ jsxs16(Table3.Tr, { children: [
+        /* @__PURE__ */ jsx27(Table3.Th, { children: "K\u1EBFt qu\u1EA3" }),
+        /* @__PURE__ */ jsx27(Table3.Th, { children: "S\u1ED1 l\u01B0\u1EE3ng" }),
+        /* @__PURE__ */ jsx27(Table3.Th, {})
       ] }) }),
-      /* @__PURE__ */ jsx26(Table3.Tbody, { children: data.map((item, i) => /* @__PURE__ */ jsxs15(Table3.Tr, { children: [
-        /* @__PURE__ */ jsx26(Table3.Td, { children: item.result }),
-        /* @__PURE__ */ jsx26(Table3.Td, { children: item.count }),
-        /* @__PURE__ */ jsx26(Table3.Td, { children: item.rows && item.rows.length > 0 && /* @__PURE__ */ jsx26(Button8, { variant: "light", onClick: () => onOpenDetail(item.rows), children: "Xem chi ti\u1EBFt" }) })
+      /* @__PURE__ */ jsx27(Table3.Tbody, { children: data.map((item, i) => /* @__PURE__ */ jsxs16(Table3.Tr, { children: [
+        /* @__PURE__ */ jsx27(Table3.Td, { children: item.result }),
+        /* @__PURE__ */ jsx27(Table3.Td, { children: item.count }),
+        /* @__PURE__ */ jsx27(Table3.Td, { children: item.rows && item.rows.length > 0 && /* @__PURE__ */ jsx27(Button9, { variant: "light", onClick: () => onOpenDetail(item.rows), children: "Xem chi ti\u1EBFt" }) })
       ] }, i)) })
     ] }),
-    /* @__PURE__ */ jsxs15(Group8, { justify: "space-between", mt: "md", children: [
-      /* @__PURE__ */ jsx26(Button8, { variant: "default", onClick: onBack, children: "Quay l\u1EA1i" }),
-      /* @__PURE__ */ jsx26(Button8, { onClick: onExecute, children: "Th\u1EF1c hi\u1EC7n import" })
+    /* @__PURE__ */ jsxs16(Group9, { justify: "space-between", mt: "md", children: [
+      /* @__PURE__ */ jsx27(Button9, { variant: "default", onClick: onBack, children: "Quay l\u1EA1i" }),
+      /* @__PURE__ */ jsx27(Button9, { onClick: onExecute, children: "Th\u1EF1c hi\u1EC7n import" })
     ] })
   ] }));
 }
 
 // src/core/overlays/MyModalStackImport/MyModalStackImport.tsx
-import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
 function MyModalImport({
   fieldDefinition = [],
   stack,
   onExecute
 }) {
-  const value = useState4([]);
-  const valueMapping = useState4([]);
-  const [detailRows, setDetailRows] = useState4([]);
-  return /* @__PURE__ */ jsxs16(Modal7.Stack, { children: [
-    /* @__PURE__ */ jsx27(
+  const value = useState5([]);
+  const valueMapping = useState5([]);
+  const [detailRows, setDetailRows] = useState5([]);
+  return /* @__PURE__ */ jsxs17(Modal8.Stack, { children: [
+    /* @__PURE__ */ jsx28(
       Usecase_FileImportConfigModal,
       __spreadValues({
         value: value[0],
@@ -1540,7 +1692,7 @@ function MyModalImport({
         }
       }, stack.register("FileImportConfig"))
     ),
-    /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx28(
       Usecase_FileFieldMappingModal,
       __spreadValues({
         jsonData: value[0],
@@ -1559,7 +1711,7 @@ function MyModalImport({
         }
       }, stack.register("FileFieldMapping"))
     ),
-    /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx28(
       Usecase_FileImportValidationModal,
       __spreadValues({
         data: value[0],
@@ -1577,7 +1729,7 @@ function MyModalImport({
         }
       }, stack.register("FileImportValidation"))
     ),
-    /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx28(
       Usecase_FileImportValidationDetailModal,
       __spreadValues({
         data: detailRows
@@ -1594,6 +1746,7 @@ export {
   MyButtonModal,
   MyButtonModalForm,
   MyButtonPrintPDF,
+  MyButtonViewFile,
   MyDataTableSelectOne,
   MyFlexIconTitle,
   MyInfoBox,