@etsoo/react 1.7.94 → 1.7.96

package/src/custom/CustomFieldReact.ts

@@ -1,17 +1,17 @@
 import {
-    CustomFieldData,
-    CustomFieldProps,
-    CustomFieldRef,
-    ICustomField
-} from '@etsoo/appscript';
+  CustomFieldData,
+  CustomFieldProps,
+  CustomFieldRef,
+  ICustomField
+} from "@etsoo/appscript";
 
 /**
  * React custom field interface
  * React自定义字段接口
  */
 export interface ICustomFieldReact<
-    V,
-    D extends CustomFieldData = CustomFieldData
+  V,
+  D extends CustomFieldData = CustomFieldData
 > extends ICustomField<V, D, CustomFieldReactProps<V, D>, React.JSX.Element> {}
 
 /**
@@ -19,10 +19,10 @@ export interface ICustomFieldReact<
  * React自定义字段属性
  */
 export type CustomFieldReactProps<
-    V,
-    D extends CustomFieldData = CustomFieldData
+  V,
+  D extends CustomFieldData = CustomFieldData
 > = CustomFieldProps<D, V> & {
-    mref: React.Ref<CustomFieldRef<V>>;
+  mref: React.Ref<CustomFieldRef<V>>;
 };
 
 /**
@@ -30,6 +30,6 @@ export type CustomFieldReactProps<
  * React自定义字段渲染结果集合
  */
 export type CustomFieldReactCollection<D extends CustomFieldData> = Record<
-    string,
-    [React.RefObject<CustomFieldRef<unknown>>, D]
+  string,
+  [React.RefObject<CustomFieldRef<unknown>>, D]
 >;

package/src/index.ts

@@ -1,47 +1,47 @@
 // app
-export * from './app/CoreConstants';
-export * from './app/EventWatcher';
-export * from './app/InputDialogProps';
-export * from './app/ReactUtils';
+export * from "./app/CoreConstants";
+export * from "./app/EventWatcher";
+export * from "./app/InputDialogProps";
+export * from "./app/ReactUtils";
 
 // components
-export * from './components/DnDList';
-export * from './components/DynamicRouter';
-export * from './components/GridColumn';
-export * from './components/GridLoader';
-export * from './components/GridMethodRef';
-export * from './components/ListItemReact';
-export * from './components/ScrollerGrid';
-export * from './components/ScrollerList';
-export * from './components/ScrollRestoration';
+export * from "./components/DnDList";
+export * from "./components/DynamicRouter";
+export * from "./components/GridColumn";
+export * from "./components/GridLoader";
+export * from "./components/GridMethodRef";
+export * from "./components/ListItemReact";
+export * from "./components/ScrollerGrid";
+export * from "./components/ScrollerList";
+export * from "./components/ScrollRestoration";
 export type {
-    ListOnScrollProps,
-    GridOnScrollProps,
-    VariableSizeGrid
-} from 'react-window';
+  ListOnScrollProps,
+  GridOnScrollProps,
+  VariableSizeGrid
+} from "react-window";
 
 // custom
-export * from './custom/CustomFieldReact';
+export * from "./custom/CustomFieldReact";
 
 // notifier
-export * from './notifier/Notifier';
-export * from '@etsoo/notificationbase';
+export * from "./notifier/Notifier";
+export * from "@etsoo/notificationbase";
 
 // states
-export * from './states/CultureState';
-export * from './states/IState';
-export * from './states/PageState';
-export * from './states/State';
-export * from './states/UserState';
+export * from "./states/CultureState";
+export * from "./states/IState";
+export * from "./states/PageState";
+export * from "./states/State";
+export * from "./states/UserState";
 
 // uses
-export * from './uses/useAsyncState';
-export * from './uses/useCombinedRefs';
-export * from './uses/useDelayedExecutor';
-export * from './uses/useDimensions';
-export * from './uses/useParamsEx';
-export * from './uses/useRefs';
-export * from './uses/useSearchParamsEx';
-export * from './uses/useTimeout';
-export * from './uses/useWindowScroll';
-export * from './uses/useWindowSize';
+export * from "./uses/useAsyncState";
+export * from "./uses/useCombinedRefs";
+export * from "./uses/useDelayedExecutor";
+export * from "./uses/useDimensions";
+export * from "./uses/useParamsEx";
+export * from "./uses/useRefs";
+export * from "./uses/useSearchParamsEx";
+export * from "./uses/useTimeout";
+export * from "./uses/useWindowScroll";
+export * from "./uses/useWindowSize";

package/src/notifier/Notifier.ts

@@ -1,290 +1,279 @@
-import React from 'react';
+import React from "react";
 import {
-    INotificaseBase,
-    INotification,
-    INotifier,
-    Notification,
-    NotificationAlign,
-    NotificationCallProps,
-    NotificationContainer,
-    NotificationDictionary,
-    NotificationRenderProps
-} from '@etsoo/notificationbase';
-import { IAction } from '@etsoo/appscript';
-import { State } from '../states/State';
-import { IProviderProps, IUpdate } from '../states/IState';
+  INotificaseBase,
+  INotification,
+  INotifier,
+  Notification,
+  NotificationAlign,
+  NotificationCallProps,
+  NotificationContainer,
+  NotificationDictionary,
+  NotificationRenderProps
+} from "@etsoo/notificationbase";
+import { IAction } from "@etsoo/appscript";
+import { State } from "../states/State";
+import { IProviderProps, IUpdate } from "../states/IState";
 
 /**
  * React notification call props
  */
 export interface NotificationReactCallProps extends NotificationCallProps {
-    /**
-     * Full width
-     */
-    fullWidth?: boolean;
-
-    /**
-     * Full screen
-     */
-    fullScreen?: boolean;
-
-    /**
-     * Inputs layout
-     */
-    inputs?: React.ReactNode;
-
-    /**
-     * Max width
-     */
-    maxWidth?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
-
-    /**
-     * OK label
-     */
-    okLabel?: string;
-
-    /**
-     * false to hide cancel button
-     */
-    cancelButton?: boolean;
-
-    /**
-     * Cancel label
-     */
-    cancelLabel?: string;
-
-    /**
-     * Window is closable
-     */
-    closable?: boolean;
-
-    /**
-     * Draggable
-     */
-    draggable?: boolean;
-
-    /**
-     * Type
-     */
-    type?: string;
-
-    /**
-     * false to hide primary button
-     */
-    primaryButton?: boolean;
-
-    /**
-     * Primary button props
-     */
-    primaryButtonProps?: {};
-
-    /**
-     * Buttons to override default buttons
-     */
-    buttons?: (
-        notification: INotificationReact,
-        callback: (
-            event: React.MouseEvent<HTMLButtonElement>,
-            value?: any
-        ) => Promise<boolean>
-    ) => React.ReactNode;
+  /**
+   * Full width
+   */
+  fullWidth?: boolean;
+
+  /**
+   * Full screen
+   */
+  fullScreen?: boolean;
+
+  /**
+   * Inputs layout
+   */
+  inputs?: React.ReactNode;
+
+  /**
+   * Max width
+   */
+  maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | false;
+
+  /**
+   * OK label
+   */
+  okLabel?: string;
+
+  /**
+   * false to hide cancel button
+   */
+  cancelButton?: boolean;
+
+  /**
+   * Cancel label
+   */
+  cancelLabel?: string;
+
+  /**
+   * Window is closable
+   */
+  closable?: boolean;
+
+  /**
+   * Draggable
+   */
+  draggable?: boolean;
+
+  /**
+   * Type
+   */
+  type?: string;
+
+  /**
+   * false to hide primary button
+   */
+  primaryButton?: boolean;
+
+  /**
+   * Primary button props
+   */
+  primaryButtonProps?: {};
+
+  /**
+   * Buttons to override default buttons
+   */
+  buttons?: (
+    notification: INotificationReact,
+    callback: (
+      event: React.MouseEvent<HTMLButtonElement>,
+      value?: any
+    ) => Promise<boolean>
+  ) => React.ReactNode;
 }
 
 /**
  * React notification interface
  */
 export interface INotificationReact
-    extends INotification<React.ReactNode, NotificationReactCallProps> {}
+  extends INotification<React.ReactNode, NotificationReactCallProps> {}
 
 /**
  * React notification base interface
  */
 export interface INotificationBaseReact
-    extends INotificaseBase<React.ReactNode, NotificationReactCallProps> {}
+  extends INotificaseBase<React.ReactNode, NotificationReactCallProps> {}
 
 interface ReactNotifications
-    extends NotificationDictionary<
-        React.ReactNode,
-        NotificationReactCallProps
-    > {}
+  extends NotificationDictionary<React.ReactNode, NotificationReactCallProps> {}
 
 /**
  * Action to manage the notifier
  */
 interface INotifierAction extends IAction {
-    /**
-     * Notification
-     */
-    notification: INotificationReact;
-
-    /**
-     * Add or dismiss
-     */
-    dismiss: boolean;
+  /**
+   * Notification
+   */
+  notification: INotificationReact;
+
+  /**
+   * Add or dismiss
+   */
+  dismiss: boolean;
 }
 
 /**
  * React notification
  */
 export abstract class NotificationReact
-    extends Notification<React.ReactNode, NotificationReactCallProps>
-    implements INotificationReact {}
+  extends Notification<React.ReactNode, NotificationReactCallProps>
+  implements INotificationReact {}
 
 /**
  * React notification render props
  */
 export interface NotificationReactRenderProps
-    extends NotificationRenderProps,
-        IProviderProps<INotifierAction> {}
+  extends NotificationRenderProps,
+    IProviderProps<INotifierAction> {}
 
 /**
  * Notifier interface
  */
 export interface INotifierReact
-    extends INotifier<React.ReactNode, NotificationReactCallProps> {
-    /**
-     * Create state provider
-     * @param className Style class name
-     * @param debug Is debug mode
-     * @returns Provider
-     */
-    createProvider(
-        className?: string,
-        debug?: boolean
-    ): React.FunctionComponent<NotificationReactRenderProps>;
+  extends INotifier<React.ReactNode, NotificationReactCallProps> {
+  /**
+   * Create state provider
+   * @param className Style class name
+   * @param debug Is debug mode
+   * @returns Provider
+   */
+  createProvider(
+    className?: string,
+    debug?: boolean
+  ): React.FunctionComponent<NotificationReactRenderProps>;
 }
 
 /**
  * Notifier for React
  */
 export abstract class NotifierReact
-    extends NotificationContainer<React.ReactNode, NotificationReactCallProps>
-    implements INotifierReact
+  extends NotificationContainer<React.ReactNode, NotificationReactCallProps>
+  implements INotifierReact
 {
-    // Instance
-    private static _instance: INotifierReact;
-
-    /**
-     * Singleton instance
-     */
-    static get instance() {
-        return NotifierReact._instance;
-    }
-
-    /**
-     * Update notifier
-     * @param notifier Notifier
-     */
-    protected static updateInstance(notifier: INotifierReact) {
-        NotifierReact._instance = notifier;
-    }
-
-    /**
-     * Constructor
-     */
-    protected constructor() {
-        super((notification, dismiss) => {
-            // Debug
-            if (this.debug) {
-                console.debug(
-                    'NotifierReact.updateCallback',
-                    notification,
-                    dismiss,
-                    this.loadingCount
-                );
-            }
-
-            // Make sure the state update is set
-            if (this.stateUpdate) this.stateUpdate({ notification, dismiss });
-        });
-    }
-
-    /**
-     * State update
-     */
-    protected stateUpdate?: React.Dispatch<INotifierAction>;
-
-    /**
-     * Create align container
-     * @param align Align
-     * @param children Children
-     * @param options Other options
-     */
-    protected abstract createContainer(
-        align: NotificationAlign,
-        children: React.ReactNode[]
-    ): React.ReactElement;
-
-    /**
-     * Create state provider
-     * @param className Style class name
-     * @returns Provider
-     */
-    createProvider(className?: string, debug?: boolean) {
-        // Custom creator
-        const creator = (
-            state: ReactNotifications,
-            update: React.Dispatch<INotifierAction>,
-            props: NotificationReactRenderProps
-        ) => {
-            // Hold the current state update
-            this.stateUpdate = update;
-
-            // Aligns collection
-            const aligns: React.ReactNode[] = [];
-            for (const align in state) {
-                // Notifications under the align
-                const notifications = state[align];
-
-                // UI collections
-                const ui = notifications.map((notification) =>
-                    notification.render(
-                        props,
-                        className ? className + '-item' : className
-                    )
-                );
-
-                // Add to the collection
-                aligns.push(this.createContainer(Number(align), ui));
-            }
-
-            // Debug
-            if (debug) {
-                console.debug(
-                    'NotifierReact.createProvider',
-                    className,
-                    state,
-                    aligns
-                );
-            }
-
-            // Generate the component
-            return React.createElement('div', { className }, aligns);
-        };
-
-        // Create state
-        const { provider } = State.create(
-            (
-                state: NotificationDictionary<
-                    React.ReactNode,
-                    NotificationReactCallProps
-                >,
-                _action: INotifierAction
-            ) => {
-                // Collection update is done with NotificationContainer
-                return { ...state };
-            },
-            this.notifications,
-            {} as IUpdate<
-                NotificationDictionary<
-                    React.ReactNode,
-                    NotificationReactCallProps
-                >,
-                INotifierAction
-            >,
-            creator
+  // Instance
+  private static _instance: INotifierReact;
+
+  /**
+   * Singleton instance
+   */
+  static get instance() {
+    return NotifierReact._instance;
+  }
+
+  /**
+   * Update notifier
+   * @param notifier Notifier
+   */
+  protected static updateInstance(notifier: INotifierReact) {
+    NotifierReact._instance = notifier;
+  }
+
+  /**
+   * Constructor
+   */
+  protected constructor() {
+    super((notification, dismiss) => {
+      // Debug
+      if (this.debug) {
+        console.debug(
+          "NotifierReact.updateCallback",
+          notification,
+          dismiss,
+          this.loadingCount
+        );
+      }
+
+      // Make sure the state update is set
+      if (this.stateUpdate) this.stateUpdate({ notification, dismiss });
+    });
+  }
+
+  /**
+   * State update
+   */
+  protected stateUpdate?: React.Dispatch<INotifierAction>;
+
+  /**
+   * Create align container
+   * @param align Align
+   * @param children Children
+   * @param options Other options
+   */
+  protected abstract createContainer(
+    align: NotificationAlign,
+    children: React.ReactNode[]
+  ): React.ReactElement;
+
+  /**
+   * Create state provider
+   * @param className Style class name
+   * @returns Provider
+   */
+  createProvider(className?: string, debug?: boolean) {
+    // Custom creator
+    const creator = (
+      state: ReactNotifications,
+      update: React.Dispatch<INotifierAction>,
+      props: NotificationReactRenderProps
+    ) => {
+      // Hold the current state update
+      this.stateUpdate = update;
+
+      // Aligns collection
+      const aligns: React.ReactNode[] = [];
+      for (const align in state) {
+        // Notifications under the align
+        const notifications = state[align];
+
+        // UI collections
+        const ui = notifications.map((notification) =>
+          notification.render(
+            props,
+            className ? className + "-item" : className
+          )
         );
 
-        return provider;
-    }
+        // Add to the collection
+        aligns.push(this.createContainer(Number(align), ui));
+      }
+
+      // Debug
+      if (debug) {
+        console.debug("NotifierReact.createProvider", className, state, aligns);
+      }
+
+      // Generate the component
+      return React.createElement("div", { className }, aligns);
+    };
+
+    // Create state
+    const { provider } = State.create(
+      (
+        state: NotificationDictionary<
+          React.ReactNode,
+          NotificationReactCallProps
+        >,
+        _action: INotifierAction
+      ) => {
+        // Collection update is done with NotificationContainer
+        return { ...state };
+      },
+      this.notifications,
+      {} as IUpdate<
+        NotificationDictionary<React.ReactNode, NotificationReactCallProps>,
+        INotifierAction
+      >,
+      creator
+    );
+
+    return provider;
+  }
 }