@etsoo/materialui 1.5.33 → 1.5.35

package/lib/cjs/DnDList.d.ts

@@ -48,7 +48,9 @@ export interface DnDListRef<D extends object> {
 /**
  * DnD sortable list properties
  */
-export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
+export interface DnDListPros<D extends {
+    id: UniqueIdentifier;
+}> {
     /**
      * Get list item style callback
      */
@@ -65,14 +67,10 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
      * List items
      */
     items: D[];
-    /**
-     * Unique key field
-     */
-    keyField: K;
     /**
      * Label field
      */
-    labelField: K;
+    labelField: DataTypes.Keys<D>;
     /**
      * Methods ref
      */
@@ -101,4 +99,4 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
  */
 export declare function DnDList<D extends {
     id: UniqueIdentifier;
-}, K extends DataTypes.Keys<D, UniqueIdentifier> = DataTypes.Keys<D, UniqueIdentifier>>(props: DnDListPros<D, K>): import("react/jsx-runtime").JSX.Element;
+}>(props: DnDListPros<D>): import("react/jsx-runtime").JSX.Element;

package/lib/cjs/DnDList.js

@@ -54,7 +54,7 @@ exports.DnDItemStyle = DnDItemStyle;
  */
 function DnDList(props) {
     // Destruct
-    const { keyField, height = 360, itemRenderer, labelField, mRef, sortingStrategy, onChange, onFormChange, onDragEnd } = props;
+    const { height = 360, itemRenderer, labelField, mRef, sortingStrategy, onChange, onFormChange, onDragEnd } = props;
     // Theme
     const theme = (0, styles_1.useTheme)();
     // States
@@ -210,7 +210,7 @@ function DnDList(props) {
             .forEach((input) => input.addEventListener("change", () => doFormChange()));
     };
     const children = ((0, jsx_runtime_1.jsx)(DndContextType, { onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: (0, jsx_runtime_1.jsx)(SortableContextType, { items: items, strategy: strategy, children: items.map((item, index) => {
-                const id = item[keyField];
+                const id = item.id;
                 return ((0, jsx_runtime_1.jsx)(SortableItem, { id: id, useSortableType: useSortableType, CSSType: CSSType, style: getItemStyle(index, id === activeId), itemRenderer: (nodeRef, actionNodeRef) => itemRenderer(item, index, nodeRef, actionNodeRef) }, id));
             }) }) }));
     if (onFormChange) {

package/lib/cjs/app/ReactApp.d.ts

@@ -183,6 +183,11 @@ export declare class ReactApp<S extends IAppSettings, D extends IUser> extends C
      * @param dispatch User state dispatch
      */
     userLogin(user: D, refreshToken: string, dispatch?: boolean): void;
+    /**
+     * User login dispatch
+     * @param user New user
+     */
+    protected doLoginDispatch(user: D): void;
     /**
      * User logout
      * @param clearToken Clear refresh token or not

package/lib/cjs/app/ReactApp.js

@@ -311,7 +311,16 @@ class ReactApp extends appscript_1.CoreApp {
         // Super call, set token
         super.userLogin(user, refreshToken);
         // Dispatch action
-        if (this.userStateDispatch != null && dispatch !== false)
+        if (dispatch !== false) {
+            this.doLoginDispatch(user);
+        }
+    }
+    /**
+     * User login dispatch
+     * @param user New user
+     */
+    doLoginDispatch(user) {
+        if (this.userStateDispatch != null)
             this.userStateDispatch({
                 type: react_2.UserActionType.Login,
                 user

package/lib/cjs/app/ServiceApp.d.ts

@@ -70,6 +70,11 @@ export declare class ServiceApp<U extends IServiceUser = IServiceUser, S extends
      * @param data Data
      */
     protected saveCoreToken(data: ApiRefreshTokenDto): void;
+    /**
+     * On switch organization handler
+     * This method is called when the organization is switched successfully
+     */
+    protected onSwitchOrg(): Promise<void> | void;
     /**
      * Switch organization
      * @param organizationId Organization ID

package/lib/cjs/app/ServiceApp.js

@@ -157,6 +157,11 @@ class ServiceApp extends ReactApp_1.ReactApp {
         // Exchange tokens
         this.exchangeTokenAll(data);
     }
+    /**
+     * On switch organization handler
+     * This method is called when the organization is switched successfully
+     */
+    onSwitchOrg() { }
     /**
      * Switch organization
      * @param organizationId Organization ID
@@ -183,8 +188,12 @@ class ServiceApp extends ReactApp_1.ReactApp {
         }
         // Override the user data's refresh token
         const user = refreshToken ? { ...result.data, refreshToken } : result.data;
-        // User login
-        this.userLoginEx(user, core, true);
+        // User login without dispatch
+        this.userLoginEx(user, core, false);
+        // Handle the switch organization
+        await this.onSwitchOrg();
+        // Trigger the dispatch at last
+        this.doLoginDispatch(user);
         return result;
     }
     async refreshTokenSucceed(user, token, callback) {

package/lib/cjs/html/HtmlDiv.js

@@ -32,7 +32,7 @@ class HtmlDivElement extends HTMLElement {
         // Comply with @etsoo/editor default styles
         const style = document.createElement("style");
         style.textContent = `
-    :host {
+    * {
       box-sizing: border-box;
     }
     img { 

package/lib/mjs/DnDList.d.ts

@@ -48,7 +48,9 @@ export interface DnDListRef<D extends object> {
 /**
  * DnD sortable list properties
  */
-export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
+export interface DnDListPros<D extends {
+    id: UniqueIdentifier;
+}> {
     /**
      * Get list item style callback
      */
@@ -65,14 +67,10 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
      * List items
      */
     items: D[];
-    /**
-     * Unique key field
-     */
-    keyField: K;
     /**
      * Label field
      */
-    labelField: K;
+    labelField: DataTypes.Keys<D>;
     /**
      * Methods ref
      */
@@ -101,4 +99,4 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
  */
 export declare function DnDList<D extends {
     id: UniqueIdentifier;
-}, K extends DataTypes.Keys<D, UniqueIdentifier> = DataTypes.Keys<D, UniqueIdentifier>>(props: DnDListPros<D, K>): import("react/jsx-runtime").JSX.Element;
+}>(props: DnDListPros<D>): import("react/jsx-runtime").JSX.Element;

package/lib/mjs/DnDList.js

@@ -46,7 +46,7 @@ export const DnDItemStyle = (index, isDragging, theme) => ({
  */
 export function DnDList(props) {
     // Destruct
-    const { keyField, height = 360, itemRenderer, labelField, mRef, sortingStrategy, onChange, onFormChange, onDragEnd } = props;
+    const { height = 360, itemRenderer, labelField, mRef, sortingStrategy, onChange, onFormChange, onDragEnd } = props;
     // Theme
     const theme = useTheme();
     // States
@@ -202,7 +202,7 @@ export function DnDList(props) {
             .forEach((input) => input.addEventListener("change", () => doFormChange()));
     };
     const children = (_jsx(DndContextType, { onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: _jsx(SortableContextType, { items: items, strategy: strategy, children: items.map((item, index) => {
-                const id = item[keyField];
+                const id = item.id;
                 return (_jsx(SortableItem, { id: id, useSortableType: useSortableType, CSSType: CSSType, style: getItemStyle(index, id === activeId), itemRenderer: (nodeRef, actionNodeRef) => itemRenderer(item, index, nodeRef, actionNodeRef) }, id));
             }) }) }));
     if (onFormChange) {

package/lib/mjs/app/ReactApp.d.ts

@@ -183,6 +183,11 @@ export declare class ReactApp<S extends IAppSettings, D extends IUser> extends C
      * @param dispatch User state dispatch
      */
     userLogin(user: D, refreshToken: string, dispatch?: boolean): void;
+    /**
+     * User login dispatch
+     * @param user New user
+     */
+    protected doLoginDispatch(user: D): void;
     /**
      * User logout
      * @param clearToken Clear refresh token or not

package/lib/mjs/app/ReactApp.js

@@ -303,7 +303,16 @@ export class ReactApp extends CoreApp {
         // Super call, set token
         super.userLogin(user, refreshToken);
         // Dispatch action
-        if (this.userStateDispatch != null && dispatch !== false)
+        if (dispatch !== false) {
+            this.doLoginDispatch(user);
+        }
+    }
+    /**
+     * User login dispatch
+     * @param user New user
+     */
+    doLoginDispatch(user) {
+        if (this.userStateDispatch != null)
             this.userStateDispatch({
                 type: UserActionType.Login,
                 user

package/lib/mjs/app/ServiceApp.d.ts

@@ -70,6 +70,11 @@ export declare class ServiceApp<U extends IServiceUser = IServiceUser, S extends
      * @param data Data
      */
     protected saveCoreToken(data: ApiRefreshTokenDto): void;
+    /**
+     * On switch organization handler
+     * This method is called when the organization is switched successfully
+     */
+    protected onSwitchOrg(): Promise<void> | void;
     /**
      * Switch organization
      * @param organizationId Organization ID

package/lib/mjs/app/ServiceApp.js

@@ -154,6 +154,11 @@ export class ServiceApp extends ReactApp {
         // Exchange tokens
         this.exchangeTokenAll(data);
     }
+    /**
+     * On switch organization handler
+     * This method is called when the organization is switched successfully
+     */
+    onSwitchOrg() { }
     /**
      * Switch organization
      * @param organizationId Organization ID
@@ -180,8 +185,12 @@ export class ServiceApp extends ReactApp {
         }
         // Override the user data's refresh token
         const user = refreshToken ? { ...result.data, refreshToken } : result.data;
-        // User login
-        this.userLoginEx(user, core, true);
+        // User login without dispatch
+        this.userLoginEx(user, core, false);
+        // Handle the switch organization
+        await this.onSwitchOrg();
+        // Trigger the dispatch at last
+        this.doLoginDispatch(user);
         return result;
     }
     async refreshTokenSucceed(user, token, callback) {

package/lib/mjs/html/HtmlDiv.js

@@ -29,7 +29,7 @@ class HtmlDivElement extends HTMLElement {
         // Comply with @etsoo/editor default styles
         const style = document.createElement("style");
         style.textContent = `
-    :host {
+    * {
       box-sizing: border-box;
     }
     img { 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.5.33",
+  "version": "1.5.35",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",
@@ -40,13 +40,13 @@
     "@dnd-kit/sortable": "^10.0.0",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@etsoo/appscript": "^1.6.26",
+    "@etsoo/appscript": "^1.6.29",
     "@etsoo/notificationbase": "^1.1.60",
     "@etsoo/react": "^1.8.40",
     "@etsoo/shared": "^1.2.69",
     "@mui/icons-material": "^7.0.2",
     "@mui/material": "^7.0.2",
-    "@mui/x-data-grid": "^8.0.0",
+    "@mui/x-data-grid": "^8.1.0",
     "chart.js": "^4.4.9",
     "chartjs-plugin-datalabels": "^2.2.0",
     "dompurify": "^3.2.5",

package/src/DnDList.tsx

@@ -119,7 +119,7 @@ export interface DnDListRef<D extends object> {
 /**
  * DnD sortable list properties
  */
-export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
+export interface DnDListPros<D extends { id: UniqueIdentifier }> {
   /**
    * Get list item style callback
    */
@@ -145,15 +145,10 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
    */
   items: D[];
 
-  /**
-   * Unique key field
-   */
-  keyField: K;
-
   /**
    * Label field
    */
-  labelField: K;
+  labelField: DataTypes.Keys<D>;
 
   /**
    * Methods ref
@@ -191,16 +186,11 @@ export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
  * @param props Props
  * @returns Component
  */
-export function DnDList<
-  D extends { id: UniqueIdentifier },
-  K extends DataTypes.Keys<D, UniqueIdentifier> = DataTypes.Keys<
-    D,
-    UniqueIdentifier
-  >
->(props: DnDListPros<D, K>) {
+export function DnDList<D extends { id: UniqueIdentifier }>(
+  props: DnDListPros<D>
+) {
   // Destruct
   const {
-    keyField,
     height = 360,
     itemRenderer,
     labelField,
@@ -465,7 +455,7 @@ export function DnDList<
     <DndContextType onDragStart={handleDragStart} onDragEnd={handleDragEnd}>
       <SortableContextType items={items} strategy={strategy}>
         {items.map((item, index) => {
-          const id = item[keyField] as unknown as UniqueIdentifier;
+          const id = item.id;
           return (
             <SortableItem
               id={id}

package/src/app/ReactApp.ts

@@ -483,7 +483,17 @@ export class ReactApp<S extends IAppSettings, D extends IUser>
     super.userLogin(user, refreshToken);
 
     // Dispatch action
-    if (this.userStateDispatch != null && dispatch !== false)
+    if (dispatch !== false) {
+      this.doLoginDispatch(user);
+    }
+  }
+
+  /**
+   * User login dispatch
+   * @param user New user
+   */
+  protected doLoginDispatch(user: D) {
+    if (this.userStateDispatch != null)
       this.userStateDispatch({
         type: UserActionType.Login,
         user

package/src/app/ServiceApp.ts

@@ -209,6 +209,12 @@ export class ServiceApp<
     this.exchangeTokenAll(data);
   }
 
+  /**
+   * On switch organization handler
+   * This method is called when the organization is switched successfully
+   */
+  protected onSwitchOrg(): Promise<void> | void {}
+
   /**
    * Switch organization
    * @param organizationId Organization ID
@@ -248,8 +254,14 @@ export class ServiceApp<
     // Override the user data's refresh token
     const user = refreshToken ? { ...result.data, refreshToken } : result.data;
 
-    // User login
-    this.userLoginEx(user, core, true);
+    // User login without dispatch
+    this.userLoginEx(user, core, false);
+
+    // Handle the switch organization
+    await this.onSwitchOrg();
+
+    // Trigger the dispatch at last
+    this.doLoginDispatch(user);
 
     return result;
   }

package/src/html/HtmlDiv.tsx

@@ -36,7 +36,7 @@ class HtmlDivElement extends HTMLElement {
     // Comply with @etsoo/editor default styles
     const style = document.createElement("style");
     style.textContent = `
-    :host {
+    * {
       box-sizing: border-box;
     }
     img {