@etsoo/react 1.5.76 → 1.5.79

package/src/mu/Tiplist.tsx

@@ -1,4 +1,4 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType, ListType } from '@etsoo/shared';
 import { Autocomplete, AutocompleteRenderInputParams } from '@mui/material';
 import React from 'react';
 import { ReactUtils } from '../app/ReactUtils';
@@ -10,8 +10,10 @@ import { SearchField } from './SearchField';
 /**
  * Tiplist props
  */
-export interface TiplistProps<T extends {}, D extends DataTypes.Keys<T>>
-    extends Omit<AutocompleteExtendedProps<T, D>, 'open'> {
+export type TiplistProps<T extends object, D extends DataTypes.Keys<T>> = Omit<
+    AutocompleteExtendedProps<T, D>,
+    'open'
+> & {
     /**
      * Load data callback
      */
@@ -19,10 +21,10 @@ export interface TiplistProps<T extends {}, D extends DataTypes.Keys<T>>
         keyword?: string,
         id?: T[D]
     ) => PromiseLike<T[] | null | undefined>;
-}
+};
 
 // Multiple states
-interface States<T extends {}> {
+interface States<T extends object> {
     open: boolean;
     options: T[];
     value?: T | null;
@@ -34,13 +36,14 @@ interface States<T extends {}> {
  * @param props Props
  * @returns Component
  */
-export function Tiplist<T extends {}, D extends DataTypes.Keys<T>>(
-    props: TiplistProps<T, D>
-) {
+export function Tiplist<
+    T extends object = ListType,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+>(props: TiplistProps<T, D>) {
     // Destruct
     const {
         search = false,
-        idField,
+        idField = 'id' as D,
         idValue,
         inputAutoComplete = 'off',
         inputError,
@@ -66,10 +69,10 @@ export function Tiplist<T extends {}, D extends DataTypes.Keys<T>>(
 
     // Local value
     let localValue = value ?? defaultValue;
-    if (localValue === undefined) localValue = null;
 
     // One time calculation for input's default value (uncontrolled)
-    const localIdValue = idValue ?? (localValue && localValue[idField]);
+    const localIdValue =
+        idValue ?? DataTypes.getValue(localValue, idField as any);
 
     // Changable states
     const [states, stateUpdate] = React.useReducer(
@@ -216,7 +219,7 @@ export function Tiplist<T extends {}, D extends DataTypes.Keys<T>>(
                 onChange={inputOnChange}
             />
             {/* Previous input will reset first with "disableClearable = false", next input trigger change works */}
-            <Autocomplete
+            <Autocomplete<T, undefined, false, false>
                 filterOptions={(options, _state) => options}
                 value={states.value}
                 options={states.options}

package/src/mu/pages/CommonPageProps.ts

@@ -52,7 +52,7 @@ export interface CommonPageProps extends Omit<ContainerProps, 'id'> {
     /**
      * Paddings
      */
-    paddings?: {};
+    paddings?: Record<string, string | number>;
 
     /**
      * Scroll container

package/src/mu/pages/DataGridPage.tsx

@@ -1,11 +1,11 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import { Box, Stack } from '@mui/material';
 import React from 'react';
 import { GridDataGet, GridLoadDataProps } from '../../components/GridLoader';
 import { ScrollerGridForwardRef } from '../../components/ScrollerGrid';
 import useCombinedRefs from '../../uses/useCombinedRefs';
 import { useDimensions } from '../../uses/useDimensions';
-import { DataGridEx } from '../DataGridEx';
+import { DataGridEx, DataGridExProps } from '../DataGridEx';
 import { MUGlobal } from '../MUGlobal';
 import { SearchBar } from '../SearchBar';
 import { CommonPage } from './CommonPage';
@@ -24,9 +24,10 @@ interface LocalStates {
  * @returns Component
  */
 export function DataGridPage<
-    T,
-    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate
->(props: DataGridPageProps<T, F>) {
+    T extends object,
+    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+>(props: DataGridPageProps<T, F, D>) {
     // Destruct
     const {
         adjustHeight,
@@ -52,11 +53,14 @@ export function DataGridPage<
         }
     );
 
-    const refs = useCombinedRefs(mRef, (ref: ScrollerGridForwardRef) => {
-        if (ref == null) return;
-        states.ref = ref;
-        //setStates({ ref });
-    });
+    const refs = useCombinedRefs<ScrollerGridForwardRef>(
+        mRef,
+        (ref: ScrollerGridForwardRef | null) => {
+            if (ref == null) return;
+            states.ref = ref;
+            //setStates({ ref });
+        }
+    );
 
     // On submit callback
     const onSubmit = (data: FormData, _reset: boolean) => {
@@ -95,7 +99,7 @@ export function DataGridPage<
         if (gridHeight == null) return;
 
         return (
-            <DataGridEx<T>
+            <DataGridEx<T, D>
                 autoLoad={false}
                 height={gridHeight}
                 loadData={localLoadData}

package/src/mu/pages/DataGridPageProps.ts

@@ -1,21 +1,24 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import { DataGridExProps } from '../DataGridEx';
 import { SearchPageProps } from './SearchPageProps';
 
 /**
  * DataGrid page props
  */
-export interface DataGridPageProps<T, F extends DataTypes.BasicTemplate>
-    extends SearchPageProps<T, F>,
-        Omit<DataGridExProps<T>, 'loadData' | 'height'> {
-    /**
-     * Height will be deducted
-     * @param height Current calcuated height
-     */
-    adjustHeight?: (height: number) => number;
+export type DataGridPageProps<
+    T extends object,
+    F extends DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+> = SearchPageProps<T, F> &
+    Omit<DataGridExProps<T, D>, 'loadData' | 'height'> & {
+        /**
+         * Height will be deducted
+         * @param height Current calcuated height
+         */
+        adjustHeight?: (height: number) => number;
 
-    /**
-     * Grid height
-     */
-    height?: number;
-}
+        /**
+         * Grid height
+         */
+        height?: number;
+    };

package/src/mu/pages/FixedListPage.tsx

@@ -1,4 +1,4 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import { Box, Stack } from '@mui/material';
 import React from 'react';
 import { GridDataGet, GridLoadDataProps } from '../../components/GridLoader';
@@ -17,10 +17,11 @@ import { ListPageProps } from './ListPageProps';
  * @returns Component
  */
 export function FixedListPage<
-    T extends {},
-    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate
+    T extends object,
+    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
 >(
-    props: ListPageProps<T, F> & {
+    props: ListPageProps<T, F, D> & {
         /**
          * Height will be deducted
          * @param height Current calcuated height
@@ -99,7 +100,7 @@ export function FixedListPage<
                         height: height + 'px'
                     }}
                 >
-                    <ScrollerListEx<T>
+                    <ScrollerListEx<T, D>
                         autoLoad={false}
                         height={height}
                         loadData={localLoadData}

package/src/mu/pages/ListPage.tsx

@@ -1,4 +1,4 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import { Box, Stack } from '@mui/material';
 import React from 'react';
 import { GridDataGet, GridLoadDataProps } from '../../components/GridLoader';
@@ -16,9 +16,10 @@ import { ListPageProps } from './ListPageProps';
  * @returns Component
  */
 export function ListPage<
-    T extends {},
-    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate
->(props: ListPageProps<T, F>) {
+    T extends object,
+    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+>(props: ListPageProps<T, F, D>) {
     // Destruct
     const {
         fields,
@@ -74,7 +75,7 @@ export function ListPage<
                 >
                     <SearchBar fields={fields} onSubmit={onSubmit} />
                 </Box>
-                <ScrollerListEx<T>
+                <ScrollerListEx<T, D>
                     autoLoad={false}
                     loadData={localLoadData}
                     mRef={refs}

package/src/mu/pages/ListPageProps.ts

@@ -5,6 +5,8 @@ import { SearchPageProps } from './SearchPageProps';
 /**
  * List page props
  */
-export interface ListPageProps<T, F extends DataTypes.BasicTemplate>
-    extends SearchPageProps<T, F>,
-        Omit<ScrollerListExProps<T>, 'loadData'> {}
+export type ListPageProps<
+    T extends object,
+    F extends DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T>
+> = SearchPageProps<T, F> & Omit<ScrollerListExProps<T, D>, 'loadData'>;

package/src/mu/pages/ResponsivePage.tsx

@@ -1,4 +1,4 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import React from 'react';
 import { MUGlobal } from '../MUGlobal';
 import { ResponsibleContainer } from '../ResponsibleContainer';
@@ -11,9 +11,10 @@ import { ResponsePageProps } from './ResponsivePageProps';
  * @returns Component
  */
 export function ResponsivePage<
-    T extends {},
-    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate
->(props: ResponsePageProps<T, F>) {
+    T extends object,
+    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+>(props: ResponsePageProps<T, F, D>) {
     // Destruct
     const { pageProps = {}, ...rest } = props;
 
@@ -32,7 +33,7 @@ export function ResponsivePage<
             scrollContainer={scrollContainer}
             fabColumnDirection={direction}
         >
-            <ResponsibleContainer<T, F>
+            <ResponsibleContainer<T, F, D>
                 paddings={paddings}
                 containerBoxSx={(paddings, hasField, _dataGrid) => {
                     // Half

package/src/mu/pages/ResponsivePageProps.ts

@@ -1,4 +1,4 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import { ListChildComponentProps } from 'react-window';
 import { GridMethodRef } from '../GridMethodRef';
 import {
@@ -10,11 +10,14 @@ import { DataGridPageProps } from './DataGridPageProps';
 /**
  * Response page props
  */
-export interface ResponsePageProps<T, F extends DataTypes.BasicTemplate>
-    extends Omit<
-        DataGridPageProps<T, F>,
-        'mRef' | 'itemKey' | 'onScroll' | 'onItemsRendered'
-    > {
+export type ResponsePageProps<
+    T extends object,
+    F extends DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+> = Omit<
+    DataGridPageProps<T, F, D>,
+    'mRef' | 'itemKey' | 'onScroll' | 'onItemsRendered'
+> & {
     /**
      * Min width to show Datagrid
      */
@@ -51,4 +54,4 @@ export interface ResponsePageProps<T, F extends DataTypes.BasicTemplate>
      * Quick action for double click or click under mobile
      */
     quickAction?: (data: T) => void;
-}
+};

package/src/mu/pages/SearchPageProps.ts

@@ -5,8 +5,10 @@ import { CommonPageProps } from './CommonPageProps';
 /**
  * Search page props
  */
-export interface SearchPageProps<T, F extends DataTypes.BasicTemplate>
-    extends Omit<GridLoader<T>, 'loadData'> {
+export type SearchPageProps<
+    T extends object,
+    F extends DataTypes.BasicTemplate
+> = Omit<GridLoader<T>, 'loadData'> & {
     /**
      * Search fields
      */
@@ -34,4 +36,4 @@ export interface SearchPageProps<T, F extends DataTypes.BasicTemplate>
      * @default 100
      */
     sizeReadyMiliseconds?: number;
-}
+};

package/src/mu/pages/TablePage.tsx

@@ -1,4 +1,4 @@
-import { DataTypes } from '@etsoo/shared';
+import { DataTypes, IdDefaultType } from '@etsoo/shared';
 import { Box, Stack } from '@mui/material';
 import React from 'react';
 import { GridDataGet, GridLoadDataProps } from '../../components/GridLoader';
@@ -16,9 +16,10 @@ import { TablePageProps } from './TablePageProps';
  * @returns Component
  */
 export function TablePage<
-    T extends {},
-    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate
->(props: TablePageProps<T, F>) {
+    T extends object,
+    F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T> = IdDefaultType<T>
+>(props: TablePageProps<T, F, D>) {
     // Destruct
     const {
         columns,
@@ -88,7 +89,7 @@ export function TablePage<
             if (!isNaN(paddingBottom)) maxHeight -= paddingBottom;
 
             return (
-                <TableEx<T>
+                <TableEx<T, D>
                     autoLoad={false}
                     columns={columns}
                     loadData={localLoadData}

package/src/mu/pages/TablePageProps.ts

@@ -5,6 +5,8 @@ import { SearchPageProps } from './SearchPageProps';
 /**
  * Table page props
  */
-export interface TablePageProps<T, F extends DataTypes.BasicTemplate>
-    extends SearchPageProps<T, F>,
-        Omit<TableExProps<T>, 'loadData'> {}
+export type TablePageProps<
+    T extends object,
+    F extends DataTypes.BasicTemplate,
+    D extends DataTypes.Keys<T>
+> = SearchPageProps<T, F> & Omit<TableExProps<T, D>, 'loadData'>;

package/src/mu/pages/ViewPage.tsx

@@ -1,4 +1,4 @@
-import { Utils } from '@etsoo/shared';
+import { DataTypes, Utils } from '@etsoo/shared';
 import {
     Grid,
     GridProps,
@@ -22,7 +22,7 @@ import { CommonPageProps } from './CommonPageProps';
 /**
  * View page display field
  */
-export interface ViewPageField<T extends {}> extends GridProps {
+export interface ViewPageField<T extends object> extends GridProps {
     /**
      * Data field
      */
@@ -49,7 +49,7 @@ export interface ViewPageField<T extends {}> extends GridProps {
     renderProps?: GridColumnRenderProps;
 }
 
-type ViewPageFieldType<T> =
+type ViewPageFieldType<T extends object> =
     | (string & keyof T)
     | [string & keyof T, GridDataType, GridColumnRenderProps?]
     | ViewPageField<T>;
@@ -57,7 +57,7 @@ type ViewPageFieldType<T> =
 /**
  * View page props
  */
-export interface ViewPageProps<T extends {}>
+export interface ViewPageProps<T extends DataTypes.StringRecord>
     extends Omit<CommonPageProps, 'children'> {
     /**
      * Actions
@@ -101,7 +101,7 @@ function formatItemData(fieldData: unknown): string | undefined {
     return `${fieldData}`;
 }
 
-function getItemField<T>(
+function getItemField<T extends object>(
     field: ViewPageFieldType<T>,
     data: T
 ): [React.ReactNode, React.ReactNode, GridProps] {
@@ -163,7 +163,9 @@ function getItemField<T>(
  * View page
  * @param props Props
  */
-export function ViewPage<T extends {}>(props: ViewPageProps<T>) {
+export function ViewPage<T extends DataTypes.StringRecord>(
+    props: ViewPageProps<T>
+) {
     // Destruct
     const {
         actions,

package/src/states/IState.ts

@@ -4,7 +4,7 @@ import React, { ReactNode } from 'react';
 /**
  * State UI creator
  */
-export interface IUICreator<S extends IState, A extends IAction, P = {}> {
+export interface IUICreator<S extends IState, A extends IAction, P = object> {
     (state: S, dispatch: React.Dispatch<A>, props: P): React.ReactElement;
 }
 

package/src/states/UserState.ts

@@ -122,7 +122,7 @@ export class UserState<D extends IUser> {
         this.provider = provider;
     }
 
-    private getChangedFields(input: {}, init: {}) {
+    private getChangedFields(input: object, init: object) {
         return Utils.objectUpdated(input, init, [
             'authorized',
             'seconds',

package/src/uses/useCombinedRefs.ts

@@ -3,10 +3,10 @@
  * @param refs Refs
  * @returns Callback
  */
-export default function useCombinedRefs(
-    ...refs: (React.Ref<unknown> | undefined)[]
+export default function useCombinedRefs<T>(
+    ...refs: (React.Ref<T> | undefined)[]
 ) {
-    return (target: unknown) => {
+    return (target: T | null) => {
         // Ignore null reference
         if (target == null) return;