@etsoo/materialui 1.6.89 → 1.6.91

package/__tests__/NotifierMUTests.tsx

@@ -12,10 +12,7 @@ import {
 } from "../src";
 import TextField from "@mui/material/TextField";
 import { screen } from "@testing-library/react";
-
-// Without it will popup error:
-// The current testing environment is not configured to support act
-(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true;
+import "@testing-library/jest-dom/vitest";
 
 // Root
 const root = document.body;
@@ -34,258 +31,257 @@ act(() => {
 // Notifier
 const notifier = NotifierMU.instance;
 
-// Timer mock
-// https://jestjs.io/docs/en/timer-mocks
-vi.useFakeTimers();
-
-test("Alert tests", async () => {
-  // Click
-  const handleClick = vi.fn();
-
-  act(() => {
-    // Add the notification
-    notifier.alert("Alert message", handleClick);
+describe("NotifierMU Tests", () => {
+  beforeEach(() => {
+    // Timer mock
+    // https://jestjs.io/docs/en/timer-mocks
+    vi.useFakeTimers();
   });
 
-  // Button
-  const button = root.getElementsByTagName("button");
-
-  expect(button.length).toBe(1);
-  expect(button[0].innerHTML).toContain("OK");
-
-  await act(async () => {
-    button[0].click();
+  afterEach(() => {
+    //vi.useRealTimers();
+    vi.runOnlyPendingTimers();
   });
 
-  expect(handleClick).toHaveBeenCalled();
+  it("Alert tests", async () => {
+    // Click
+    const handleClick = vi.fn();
 
-  // Fast forward
-  vi.runOnlyPendingTimers();
-});
-
-test("Confirm tests", async () => {
-  // Click
-  const handleClick = vi.fn();
+    act(() => {
+      // Add the notification
+      notifier.alert("Alert message", handleClick);
+    });
 
-  act(() => {
-    // Add the notification
-    notifier.confirm("Confirm message", undefined, handleClick);
-  });
+    // Button
+    const button = root.getElementsByTagName("button");
 
-  // Button
-  const button = root.getElementsByTagName("button");
+    expect(button.length).toBe(1);
+    expect(button[0].innerHTML).toContain("OK");
 
-  expect(button.length).toBe(2);
-  expect(button[0].innerHTML).toContain("Cancel");
+    await act(async () => {
+      button[0].click();
+    });
 
-  await act(async () => {
-    button[0].click();
+    expect(handleClick).toHaveBeenCalled();
   });
 
-  expect(handleClick).toHaveBeenCalled();
+  it("Confirm tests", async () => {
+    // Click
+    const handleClick = vi.fn();
 
-  // Fast forward
-  vi.runOnlyPendingTimers();
-});
+    act(() => {
+      // Add the notification
+      notifier.confirm("Confirm message", undefined, handleClick);
+    });
 
-test("Confirm tests without cancel button", async () => {
-  // Click
-  const handleClick = vi.fn();
+    // Button
+    const button = root.getElementsByTagName("button");
 
-  act(() => {
-    // Add the notification
-    notifier.confirm("Confirm message", undefined, handleClick, {
-      cancelButton: false
+    expect(button.length).toBe(2);
+    expect(button[0].innerHTML).toContain("Cancel");
+
+    await act(async () => {
+      button[0].click();
     });
+
+    expect(handleClick).toHaveBeenCalled();
   });
 
-  // Button
-  const button = root.getElementsByTagName("button");
+  it("Confirm tests without cancel button", async () => {
+    // Click
+    const handleClick = vi.fn();
 
-  expect(button.length).toBe(1);
-  expect(button[0].innerHTML).toContain("OK");
+    act(() => {
+      // Add the notification
+      notifier.confirm("Confirm message", undefined, handleClick, {
+        cancelButton: false
+      });
+    });
 
-  await act(async () => {
-    button[0].click();
-  });
+    // Button
+    const button = root.getElementsByTagName("button");
 
-  expect(handleClick).toHaveBeenCalled();
+    expect(button.length).toBe(1);
+    expect(button[0].innerHTML).toContain("OK");
 
-  // Fast forward
-  vi.runOnlyPendingTimers();
-});
+    await act(async () => {
+      button[0].click();
+    });
 
-test("Prompt tests", async () => {
-  // Click
-  const handleClick = vi.fn((result: boolean) => {
-    expect(result).toBeTruthy();
+    expect(handleClick).toHaveBeenCalled();
   });
 
-  act(() => {
-    // Add the notification
-    notifier.prompt<boolean>("Prompt message", handleClick, undefined, {
-      type: "switch",
-      inputProps: { required: false }
+  it("Prompt tests", async () => {
+    // Click
+    const handleClick = vi.fn((result: boolean) => {
+      expect(result).toBeTruthy();
     });
-  });
 
-  // Button
-  const button = root.getElementsByTagName("button");
+    act(() => {
+      // Add the notification
+      notifier.prompt<boolean>("Prompt message", handleClick, undefined, {
+        type: "switch",
+        inputProps: { required: false }
+      });
+    });
+
+    // Button
+    const button = root.getElementsByTagName("button");
+
+    expect(button.length).toBe(2); // Switch will generate a button
+    expect(button[1].innerHTML).toContain("OK");
 
-  expect(button.length).toBe(2); // Switch will generate a button
-  expect(button[1].innerHTML).toContain("OK");
+    await act(async () => {
+      button[1].click();
+    });
 
-  await act(async () => {
-    button[1].click();
+    expect(handleClick).toHaveBeenCalled();
   });
 
-  expect(handleClick).toHaveBeenCalled();
+  type DataType = {
+    name: string;
+    age: number;
+  };
 
-  vi.runOnlyPendingTimers();
-});
+  function DataCollector(props: NotificationMUDataProps) {
+    const { mRef } = props;
+    const nameRef = React.createRef<HTMLInputElement>();
+    const ageRef = React.createRef<HTMLInputElement>();
 
-type DataType = {
-  name: string;
-  age: number;
-};
+    function getValue(): DataType | undefined {
+      if (!nameRef.current?.value) {
+        nameRef.current?.focus();
+        return undefined;
+      }
 
-function DataCollector(props: NotificationMUDataProps) {
-  const { mRef } = props;
-  const nameRef = React.createRef<HTMLInputElement>();
-  const ageRef = React.createRef<HTMLInputElement>();
+      if (!ageRef.current?.valueAsNumber) {
+        ageRef.current?.focus();
+        return undefined;
+      }
 
-  function getValue(): DataType | undefined {
-    if (!nameRef.current?.value) {
-      nameRef.current?.focus();
-      return undefined;
+      return {
+        name: nameRef.current.value,
+        age: ageRef.current.valueAsNumber
+      };
     }
 
-    if (!ageRef.current?.valueAsNumber) {
-      ageRef.current?.focus();
-      return undefined;
-    }
+    React.useImperativeHandle(mRef, () => ({
+      getValue
+    }));
 
-    return {
-      name: nameRef.current.value,
-      age: ageRef.current.valueAsNumber
-    };
+    return (
+      <VBox>
+        <TextField name="name" required inputRef={nameRef} />
+        <TextField name="age" type="number" required inputRef={ageRef} />
+      </VBox>
+    );
   }
 
-  React.useImperativeHandle(mRef, () => ({
-    getValue
-  }));
-
-  return (
-    <VBox>
-      <TextField name="name" required inputRef={nameRef} />
-      <TextField name="age" type="number" required inputRef={ageRef} />
-    </VBox>
-  );
-}
-
-test("Data tests", async () => {
-  const name = "John Doe";
-  const age = 30;
-
-  act(() => {
-    // Add the notification
-    notifier.data<DataType>(
-      <DataCollector mRef={React.createRef<NotificationMUDataMethods>()} />,
-      (result) => {
-        expect(result).toEqual({ name, age });
-        return true;
-      },
-      "Data Modal"
-    );
-  });
+  it("Data tests", async () => {
+    const name = "John Doe";
+    const age = 30;
+
+    act(() => {
+      // Add the notification
+      notifier.data<DataType>(
+        <DataCollector mRef={React.createRef<NotificationMUDataMethods>()} />,
+        (result) => {
+          expect(result).toEqual({ name, age });
+          return true;
+        },
+        "Data Modal"
+      );
+    });
 
-  const button = screen.getByText("OK");
-  expect(button).toBeInTheDocument();
+    const button = screen.getByText("OK");
+    expect(button).toBeInTheDocument();
 
-  const nameInput = root.querySelector<HTMLInputElement>('input[name="name"]');
-  expect(nameInput).not.toBeNull();
-  nameInput!.value = name;
+    const nameInput =
+      root.querySelector<HTMLInputElement>('input[name="name"]');
+    expect(nameInput).not.toBeNull();
+    nameInput!.value = name;
 
-  const ageInput = root.querySelector<HTMLInputElement>('input[name="age"]');
-  expect(ageInput).not.toBeNull();
-  ageInput!.value = age.toString();
+    const ageInput = root.querySelector<HTMLInputElement>('input[name="age"]');
+    expect(ageInput).not.toBeNull();
+    ageInput!.value = age.toString();
 
-  await act(async () => {
-    button.click();
+    await act(async () => {
+      button.click();
+    });
   });
-});
 
-test("Prompt tests with form submit", async () => {
-  // Click
-  const handleClick = vi.fn((result: boolean) => {
-    expect(result).toBeTruthy();
-  });
+  it("Prompt tests with form submit", async () => {
+    // Click
+    const handleClick = vi.fn((result: boolean) => {
+      expect(result).toBeTruthy();
+    });
 
-  act(() => {
-    // Add the notification
-    notifier.prompt<boolean>("Prompt message", handleClick, undefined, {
-      type: "switch",
-      inputProps: { required: false }
+    act(() => {
+      // Add the notification
+      notifier.prompt<boolean>("Prompt message", handleClick, undefined, {
+        type: "switch",
+        inputProps: { required: false }
+      });
     });
-  });
 
-  const button = screen.getByText("OK");
-  expect(button).toBeInTheDocument();
+    const button = screen.getByText("OK");
+    expect(button).toBeInTheDocument();
+
+    await act(async () => {
+      button.click();
+    });
 
-  await act(async () => {
-    button.click();
+    expect(handleClick).toHaveBeenCalled();
   });
 
-  expect(handleClick).toHaveBeenCalled();
-});
+  it("Message tests", () => {
+    // Callback
+    const callback = vi.fn();
+
+    let n: INotification<React.ReactNode, any> | undefined;
+    act(() => {
+      // Add the notification
+      n = notifier.message(
+        NotificationMessageType.Danger,
+        "Error Message",
+        undefined,
+        {
+          callback
+        }
+      );
+    });
 
-test("Message tests", () => {
-  // Callback
-  const callback = vi.fn();
-
-  let n: INotification<React.ReactNode, any> | undefined;
-  act(() => {
-    // Add the notification
-    n = notifier.message(
-      NotificationMessageType.Danger,
-      "Error Message",
-      undefined,
-      {
-        callback
-      }
-    );
-  });
+    expect(n?.timespan).toBe(5);
 
-  expect(n?.timespan).toBe(5);
+    expect(root.innerHTML).toContain("Error Message");
 
-  expect(root.innerHTML).toContain("Error Message");
+    act(() => {
+      // Here is the bug need further study...
+      n?.dismiss();
 
-  act(() => {
-    // Here is the bug need further study...
-    n?.dismiss();
+      // Fast forward
+      vi.runOnlyPendingTimers();
+    });
 
-    // Fast forward
-    vi.runOnlyPendingTimers();
+    expect(root.innerHTML).not.toContain("Error Message");
+    expect(callback).toHaveBeenCalled();
   });
 
-  expect(root.innerHTML).not.toContain("Error Message");
-  expect(callback).toHaveBeenCalled();
-});
+  it("Loading tests", () => {
+    act(() => {
+      // Add the notification
+      notifier.showLoading("Loading");
+    });
 
-test("Loading tests", () => {
-  act(() => {
-    // Add the notification
-    notifier.showLoading("Loading");
-  });
+    expect(root.innerHTML).toContain("Loading");
 
-  expect(root.innerHTML).toContain("Loading");
+    act(() => {
+      notifier.hideLoading();
 
-  act(() => {
-    notifier.hideLoading();
+      // Fast forward
+      vi.runOnlyPendingTimers();
+    });
 
-    // Fast forward
-    vi.runOnlyPendingTimers();
+    expect(root.innerHTML).not.toContain("Loading");
   });
-
-  expect(root.innerHTML).not.toContain("Loading");
 });

package/__tests__/tsconfig.json

@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
-    "target": "ES2022",
-    "module": "ES2022",
+    "target": "ES2025",
+    "module": "esnext",
     "moduleResolution": "bundler",
     "allowJs": false,
     "skipLibCheck": false,

package/lib/cjs/HtmlDescriptionBase.js

@@ -11,6 +11,7 @@ const react_2 = require("@etsoo/react");
 const InputAdornment_1 = __importDefault(require("@mui/material/InputAdornment"));
 const IconButton_1 = __importDefault(require("@mui/material/IconButton"));
 const Edit_1 = __importDefault(require("@mui/icons-material/Edit"));
+const ReactApp_1 = require("./app/ReactApp");
 /**
  * HTML Description component base
  * HTML 描述组件属性基础
@@ -18,8 +19,10 @@ const Edit_1 = __importDefault(require("@mui/icons-material/Edit"));
  * @returns Component
  */
 function HtmlDescriptionBase(props) {
+    // Global app
+    const app = (0, ReactApp_1.useAppContext)();
     // Destruct
-    const { fullWidth = true, inputRef, label, maxLength = 1280, name = "description", onEdit, rows = 3, ...rest } = props;
+    const { fullWidth = true, inputRef, label = app?.get("description"), maxLength = 1280, name = "description", onEdit, rows = 3, ...rest } = props;
     const localRef = react_1.default.useRef(null);
     const refs = (0, react_2.useCombinedRefs)(localRef, inputRef);
     return ((0, jsx_runtime_1.jsx)(InputField_1.InputField, { fullWidth: fullWidth, inputRef: refs, name: name, slotProps: {

package/lib/cjs/NotifierMU.js

@@ -110,7 +110,7 @@ class NotificationMU extends react_2.NotificationReact {
             return true;
         };
         const base = () => primaryButton && ((0, jsx_runtime_1.jsx)(LoadingButton_1.LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButtonProps, children: okLabel }));
-        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [icon, (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), inputs] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
+        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, disableRestoreFocus: true, ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [icon, (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), inputs] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
     }
     // Create confirm
     createConfirm(_props, className) {
@@ -124,7 +124,7 @@ class NotificationMU extends react_2.NotificationReact {
             return true;
         };
         const base = () => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [cancelButton && ((0, jsx_runtime_1.jsx)(LoadingButton_1.LoadingButton, { color: "secondary", onClick: async (event) => await callback(event, false), children: cancelLabel })), primaryButton && ((0, jsx_runtime_1.jsx)(LoadingButton_1.LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButtonProps, children: okLabel }))] }));
-        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [(0, jsx_runtime_1.jsx)(Help_1.default, { color: "action" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), inputs] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
+        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, disableRestoreFocus: true, ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [(0, jsx_runtime_1.jsx)(Help_1.default, { color: "action" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), inputs] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
     }
     createMessageColor() {
         if (this.type === notificationbase_1.NotificationMessageType.Danger)
@@ -190,7 +190,7 @@ class NotificationMU extends react_2.NotificationReact {
                             this.onReturn(undefined);
                         this.dismiss();
                     }, children: cancelLabel })), primaryButton && ((0, jsx_runtime_1.jsx)(LoadingButton_1.LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] }));
-        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [(0, jsx_runtime_1.jsx)(Info_1.default, { color: "primary" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { ...inputProps, children: [content, (0, jsx_runtime_1.jsx)(Typography_1.default, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
+        return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent_1.DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", disableRestoreFocus: true, ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [(0, jsx_runtime_1.jsx)(Info_1.default, { color: "primary" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { ...inputProps, children: [content, (0, jsx_runtime_1.jsx)(Typography_1.default, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
     }
     // Create prompt
     createPrompt(_props, className) {
@@ -277,7 +277,7 @@ class NotificationMU extends react_2.NotificationReact {
                         overflow: "hidden"
                     }
                 }
-            }, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [(0, jsx_runtime_1.jsx)(Info_1.default, { color: "primary" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { dividers: true, children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), localInputs, (0, jsx_runtime_1.jsx)(Typography_1.default, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
+            }, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", disableRestoreFocus: true, ...options, children: [(0, jsx_runtime_1.jsxs)(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [(0, jsx_runtime_1.jsx)(Info_1.default, { color: "primary" }), (0, jsx_runtime_1.jsx)("span", { className: "dialogTitle", children: title }), closable && ((0, jsx_runtime_1.jsx)(IconButton_1.default, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: (0, jsx_runtime_1.jsx)(Close_1.default, {}) }))] }), (0, jsx_runtime_1.jsxs)(DialogContent_1.default, { dividers: true, children: [typeof this.content === "string" ? ((0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: this.content })) : (this.content), localInputs, (0, jsx_runtime_1.jsx)(Typography_1.default, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
     }
     createPopup(_props, className) {
         // Destruct

package/lib/cjs/utils/SVGUtils.js

@@ -22,9 +22,7 @@ var SVGUtils;
     function createIcon(icon, filterColor) {
         if (!icon)
             return undefined;
-        if (icon.startsWith("/"))
-            icon = "https://localhost:9002/" + icon;
-        else if (icon.startsWith("<path "))
+        if (icon.startsWith("<path "))
             icon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">${icon}</svg>`;
         if (icon.startsWith("<svg "))
             icon = `data:image/svg+xml;utf8,${encodeURIComponent(icon)}`;

package/lib/mjs/HtmlDescriptionBase.js

@@ -5,6 +5,7 @@ import { useCombinedRefs } from "@etsoo/react";
 import InputAdornment from "@mui/material/InputAdornment";
 import IconButton from "@mui/material/IconButton";
 import EditIcon from "@mui/icons-material/Edit";
+import { useAppContext } from "./app/ReactApp";
 /**
  * HTML Description component base
  * HTML 描述组件属性基础
@@ -12,8 +13,10 @@ import EditIcon from "@mui/icons-material/Edit";
  * @returns Component
  */
 export function HtmlDescriptionBase(props) {
+    // Global app
+    const app = useAppContext();
     // Destruct
-    const { fullWidth = true, inputRef, label, maxLength = 1280, name = "description", onEdit, rows = 3, ...rest } = props;
+    const { fullWidth = true, inputRef, label = app?.get("description"), maxLength = 1280, name = "description", onEdit, rows = 3, ...rest } = props;
     const localRef = React.useRef(null);
     const refs = useCombinedRefs(localRef, inputRef);
     return (_jsx(InputField, { fullWidth: fullWidth, inputRef: refs, name: name, slotProps: {

package/lib/mjs/NotifierMU.js

@@ -104,7 +104,7 @@ export class NotificationMU extends NotificationReact {
             return true;
         };
         const base = () => primaryButton && (_jsx(LoadingButton, { ...setupProps, onClick: callback, autoFocus: true, ...primaryButtonProps, children: okLabel }));
-        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [icon, _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
+        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, disableRestoreFocus: true, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [icon, _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
     }
     // Create confirm
     createConfirm(_props, className) {
@@ -118,7 +118,7 @@ export class NotificationMU extends NotificationReact {
             return true;
         };
         const base = () => (_jsxs(React.Fragment, { children: [cancelButton && (_jsx(LoadingButton, { color: "secondary", onClick: async (event) => await callback(event, false), children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", onClick: async (event) => await callback(event, true), autoFocus: true, ...primaryButtonProps, children: okLabel }))] }));
-        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [_jsx(HelpIcon, { color: "action" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
+        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, disableRestoreFocus: true, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [_jsx(HelpIcon, { color: "action" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), inputs] }), _jsx(DialogActions, { children: buttons ? buttons(this, callback, base) : base() })] }, this.id));
     }
     createMessageColor() {
         if (this.type === NotificationMessageType.Danger)
@@ -184,7 +184,7 @@ export class NotificationMU extends NotificationReact {
                             this.onReturn(undefined);
                         this.dismiss();
                     }, children: cancelLabel })), primaryButton && (_jsx(LoadingButton, { color: "primary", autoFocus: true, onClick: handleSubmit, name: "okButton", ...primaryButtonProps, children: okLabel }))] }));
-        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [_jsx(InfoIcon, { color: "primary" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { ...inputProps, children: [content, _jsx(Typography, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), _jsx(DialogActions, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
+        return (_jsxs(Dialog, { open: this.open, PaperComponent: draggable ? DraggablePaperComponent : undefined, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", disableRestoreFocus: true, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [_jsx(InfoIcon, { color: "primary" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { ...inputProps, children: [content, _jsx(Typography, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), _jsx(DialogActions, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
     }
     // Create prompt
     createPrompt(_props, className) {
@@ -271,7 +271,7 @@ export class NotificationMU extends NotificationReact {
                         overflow: "hidden"
                     }
                 }
-            }, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [_jsx(InfoIcon, { color: "primary" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { dividers: true, children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), localInputs, _jsx(Typography, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), _jsx(DialogActions, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
+            }, className: className, fullWidth: fullWidth, maxWidth: maxWidth, fullScreen: fullScreen, scroll: "paper", disableRestoreFocus: true, ...options, children: [_jsxs(IconDialogTitle, { draggable: draggable, className: `dialog-title${draggable ? " draggable-dialog-title" : ""}`, children: [_jsx(InfoIcon, { color: "primary" }), _jsx("span", { className: "dialogTitle", children: title }), closable && (_jsx(IconButton, { className: "MuiDialogContent-root-close-button", size: "small", onClick: () => this.returnValue("CLOSE"), children: _jsx(CloseIcon, {}) }))] }), _jsxs(DialogContent, { dividers: true, children: [typeof this.content === "string" ? (_jsx(DialogContentText, { children: this.content })) : (this.content), localInputs, _jsx(Typography, { component: "div", variant: "caption", ref: errorRef, color: "error", align: "center" })] }), _jsx(DialogActions, { children: buttons ? buttons(this, handleSubmit, base) : base() })] }, this.id));
     }
     createPopup(_props, className) {
         // Destruct

package/lib/mjs/utils/SVGUtils.js

@@ -16,9 +16,7 @@ export var SVGUtils;
     function createIcon(icon, filterColor) {
         if (!icon)
             return undefined;
-        if (icon.startsWith("/"))
-            icon = "https://localhost:9002/" + icon;
-        else if (icon.startsWith("<path "))
+        if (icon.startsWith("<path "))
             icon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">${icon}</svg>`;
         if (icon.startsWith("<svg "))
             icon = `data:image/svg+xml;utf8,${encodeURIComponent(icon)}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.6.89",
+  "version": "1.6.91",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",
@@ -40,13 +40,13 @@
     "@dnd-kit/react": "^0.5.0",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
-    "@etsoo/appscript": "^1.6.78",
+    "@etsoo/appscript": "^1.6.79",
     "@etsoo/notificationbase": "^1.1.75",
-    "@etsoo/react": "^1.9.4",
+    "@etsoo/react": "^1.9.5",
     "@etsoo/shared": "^1.2.91",
     "@mui/icons-material": "^9.4.0",
     "@mui/material": "^9.4.0",
-    "@mui/x-data-grid": "^9.13.0",
+    "@mui/x-data-grid": "^9.14.0",
     "chart.js": "^4.5.1",
     "chartjs-plugin-datalabels": "^2.2.0",
     "css-filter-converter": "^1.0.115",
@@ -58,7 +58,7 @@
     "react-avatar-editor": "^15.1.0",
     "react-chartjs-2": "^5.3.1",
     "react-dom": "^19.3.0",
-    "react-draggable": "^4.7.1",
+    "react-draggable": "^4.7.2",
     "react-imask": "7.6.1",
     "signature_pad": "^5.1.4"
   },
@@ -80,7 +80,5 @@
     "typescript": "^7.0.2",
     "vitest": "^5.0.0"
   },
-  "allowScripts": {
-    "core-js-pure@3.49.0": true
-  }
+  "allowScripts": {}
 }

package/src/HtmlDescriptionBase.tsx

@@ -4,6 +4,7 @@ import { useCombinedRefs } from "@etsoo/react";
 import InputAdornment from "@mui/material/InputAdornment";
 import IconButton from "@mui/material/IconButton";
 import EditIcon from "@mui/icons-material/Edit";
+import { useAppContext } from "./app/ReactApp";
 
 /**
  * HTML Description component base props
@@ -30,11 +31,14 @@ export type HtmlDescriptionBaseProps = Omit<InputFieldProps, "multiline"> & {
  * @returns Component
  */
 export function HtmlDescriptionBase(props: HtmlDescriptionBaseProps) {
+  // Global app
+  const app = useAppContext();
+
   // Destruct
   const {
     fullWidth = true,
     inputRef,
-    label,
+    label = app?.get("description"),
     maxLength = 1280,
     name = "description",
     onEdit,

package/src/NotifierMU.tsx

@@ -177,6 +177,7 @@ export class NotificationMU extends NotificationReact {
         fullWidth={fullWidth}
         maxWidth={maxWidth}
         fullScreen={fullScreen}
+        disableRestoreFocus
         {...options}
       >
         <IconDialogTitle
@@ -273,6 +274,7 @@ export class NotificationMU extends NotificationReact {
         fullWidth={fullWidth}
         maxWidth={maxWidth}
         fullScreen={fullScreen}
+        disableRestoreFocus
         {...options}
       >
         <IconDialogTitle
@@ -453,6 +455,7 @@ export class NotificationMU extends NotificationReact {
         maxWidth={maxWidth}
         fullScreen={fullScreen}
         scroll="paper"
+        disableRestoreFocus
         {...options}
       >
         <IconDialogTitle
@@ -656,6 +659,7 @@ export class NotificationMU extends NotificationReact {
         maxWidth={maxWidth}
         fullScreen={fullScreen}
         scroll="paper"
+        disableRestoreFocus
         {...options}
       >
         <IconDialogTitle

package/src/utils/SVGUtils.tsx

@@ -18,8 +18,7 @@ export namespace SVGUtils {
   ) {
     if (!icon) return undefined;
 
-    if (icon.startsWith("/")) icon = "https://localhost:9002/" + icon;
-    else if (icon.startsWith("<path "))
+    if (icon.startsWith("<path "))
       icon = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">${icon}</svg>`;
 
     if (icon.startsWith("<svg "))