@etsoo/react 1.5.75 → 1.5.78

package/lib/app/CommonApp.d.ts

@@ -28,12 +28,12 @@ export declare abstract class CommonApp<U extends IUser = IUser, P extends IPage
      * Refresh token
      * @param props Props
      */
-    refreshToken<D = RefreshTokenRQ>(props?: RefreshTokenProps<D>): Promise<boolean>;
+    refreshToken<D extends object = RefreshTokenRQ>(props?: RefreshTokenProps<D>): Promise<boolean>;
     /**
      * Try login
      * @param data Additional data
      * @param showLoading Show loading bar or not
      * @returns Result
      */
-    tryLogin<D = RefreshTokenRQ>(data?: D, showLoading?: boolean): Promise<boolean>;
+    tryLogin<D extends object = RefreshTokenRQ>(data?: D, showLoading?: boolean): Promise<boolean>;
 }

package/lib/app/Labels.d.ts

@@ -61,5 +61,5 @@ export declare namespace Labels {
      * @param labels Labels
      * @param reference Key reference
      */
-    const setLabels: (labels: {}, reference?: setLabelsReference) => void;
+    const setLabels: (labels: DataTypes.StringRecord, reference?: setLabelsReference) => void;
 }

package/lib/app/ServiceApp.d.ts

@@ -45,7 +45,7 @@ export declare class ServiceApp<U extends IServiceUser = IServiceUser, P extends
      * Refresh token
      * @param props Props
      */
-    refreshToken<D = RefreshTokenRQ>(props?: RefreshTokenProps<D>): Promise<boolean>;
+    refreshToken<D extends object = RefreshTokenRQ>(props?: RefreshTokenProps<D>): Promise<boolean>;
     /**
      * Service decrypt message
      * @param messageEncrypted Encrypted message
@@ -67,7 +67,7 @@ export declare class ServiceApp<U extends IServiceUser = IServiceUser, P extends
      * @param showLoading Show loading bar or not
      * @returns Result
      */
-    tryLogin<D extends {} = {}>(data?: D, showLoading?: boolean): Promise<boolean>;
+    tryLogin<D extends object = {}>(data?: D, showLoading?: boolean): Promise<boolean>;
     /**
      * User login extended
      * @param user Core system user

package/lib/components/GridColumn.d.ts

@@ -23,7 +23,7 @@ export declare type GridCellValueType = string | number | Date | boolean | undef
 /**
  * Grid cell formatter props
  */
-export interface GridCellFormatterProps<T> {
+export declare type GridCellFormatterProps<T> = {
     /**
      * Current data
      */
@@ -40,11 +40,11 @@ export interface GridCellFormatterProps<T> {
      * Column index
      */
     columnIndex: number;
-}
+};
 /**
  * Grid cell renderer props
  */
-export interface GridCellRendererProps<T, P = any> extends GridCellFormatterProps<T> {
+export declare type GridCellRendererProps<T, P = any> = GridCellFormatterProps<T> & {
     /**
      * Cell props
      */
@@ -65,11 +65,11 @@ export interface GridCellRendererProps<T, P = any> extends GridCellFormatterProp
      * Render props
      */
     renderProps?: GridColumnRenderProps;
-}
+};
 /**
  * Grid header cell renderer props
  */
-export interface GridHeaderCellRendererProps<T, P = any> {
+export declare type GridHeaderCellRendererProps<T, P = any> = {
     /**
      * Cell props
      */
@@ -86,11 +86,11 @@ export interface GridHeaderCellRendererProps<T, P = any> {
      * States
      */
     states: GridLoaderStates<T>;
-}
+};
 /**
  * Grid column render props
  */
-export interface GridColumnRenderProps {
+export declare type GridColumnRenderProps = {
     /**
      * Culture, like zh-CN
      */
@@ -115,11 +115,11 @@ export interface GridColumnRenderProps {
      * Additional data
      */
     readonly data?: Readonly<Record<string, any>>;
-}
+};
 /**
  * Grid column
  */
-export interface GridColumn<T> {
+export declare type GridColumn<T> = {
     /**
      * The column identifier. It's used to map with row data
      */
@@ -169,4 +169,4 @@ export interface GridColumn<T> {
      * Header cell renderer
      */
     headerCellRenderer?: (props: GridHeaderCellRendererProps<T>) => React.ReactNode;
-}
+};

package/lib/components/GridLoader.d.ts

@@ -22,12 +22,11 @@ export declare function GridDataGet<F extends DataTypes.BasicTemplate>(props: Gr
 /**
  * Grid Json data
  */
-export interface GridJsonData extends Omit<GridLoadDataProps, 'data'> {
-}
+export declare type GridJsonData = Omit<GridLoadDataProps, 'data'>;
 /**
  * Grid data load props
  */
-export interface GridLoadDataProps {
+export declare type GridLoadDataProps = {
     /**
      * Current page
      */
@@ -48,11 +47,11 @@ export interface GridLoadDataProps {
      * Data related
      */
     data?: GridData;
-}
+};
 /**
  * Grid data loader
  */
-export interface GridLoader<T> {
+export declare type GridLoader<T extends object> = {
     /**
      * Auto load data, otherwise call reset
      * @default true
@@ -74,11 +73,11 @@ export interface GridLoader<T> {
      * Threshold at which to pre-fetch data; default is half of loadBatchSize
      */
     threshold?: number | undefined;
-}
+};
 /**
  * Grid loader states
  */
-export interface GridLoaderStates<T> extends GridLoadDataProps {
+export declare type GridLoaderStates<T> = GridLoadDataProps & {
     /**
      * Auto load data, otherwise call reset
      * @default true
@@ -108,4 +107,4 @@ export interface GridLoaderStates<T> extends GridLoadDataProps {
      * Selected items of id
      */
     selectedItems: T[];
-}
+};

package/lib/components/ScrollerGrid.d.ts

@@ -1,8 +1,9 @@
+import { DataTypes } from '@etsoo/shared';
 import React from 'react';
 import { Align, GridChildComponentProps, VariableSizeGridProps } from 'react-window';
 import { GridMethodRef } from '../mu/GridMethodRef';
 import { GridLoader, GridLoaderStates } from './GridLoader';
-export interface ScrollerGridItemRendererProps<T> extends Omit<GridChildComponentProps<T>, 'data'> {
+export declare type ScrollerGridItemRendererProps<T> = Omit<GridChildComponentProps<T>, 'data'> & {
     /**
      * Selected items
      */
@@ -11,11 +12,11 @@ export interface ScrollerGridItemRendererProps<T> extends Omit<GridChildComponen
      * Data
      */
     data?: T;
-}
+};
 /**
  * Scroller vertical grid props
  */
-export interface ScrollerGridProps<T> extends GridLoader<T>, Omit<VariableSizeGridProps<T>, 'children' | 'rowCount' | 'rowHeight' | 'ref'> {
+export declare type ScrollerGridProps<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = GridLoader<T> & Omit<VariableSizeGridProps<T>, 'children' | 'rowCount' | 'rowHeight' | 'ref'> & {
     /**
      * Default order by asc
      * @default true
@@ -31,9 +32,8 @@ export interface ScrollerGridProps<T> extends GridLoader<T>, Omit<VariableSizeGr
     headerRenderer?: (states: GridLoaderStates<T>) => React.ReactNode;
     /**
      * Id field
-     * @default id
      */
-    idField?: string & keyof T;
+    idField?: D;
     /**
      * Item renderer
      */
@@ -50,7 +50,7 @@ export interface ScrollerGridProps<T> extends GridLoader<T>, Omit<VariableSizeGr
      * Returns the height of the specified row.
      */
     rowHeight?: ((index: number) => number) | number;
-}
+};
 /**
  * Scroller grid forward ref
  */
@@ -109,4 +109,4 @@ export interface ScrollerGridForwardRef extends GridMethodRef {
  * @param props Props
  * @returns Component
  */
-export declare const ScrollerGrid: <T extends Record<string, unknown>>(props: ScrollerGridProps<T>) => JSX.Element;
+export declare const ScrollerGrid: <T extends object, D extends DataTypes.Keys<T, string | number> = DataTypes.Keys<T, string | number>>(props: ScrollerGridProps<T, D>) => JSX.Element;

package/lib/components/ScrollerList.d.ts

@@ -5,7 +5,7 @@ import { GridLoader } from './GridLoader';
 /**
  * Scroller vertical list props
  */
-export interface ScrollerListProps<T> extends GridLoader<T>, Omit<ListProps<T>, 'ref' | 'outerRef' | 'height' | 'width' | 'children' | 'itemCount'> {
+export interface ScrollerListProps<T extends object> extends GridLoader<T>, Omit<ListProps<T>, 'ref' | 'outerRef' | 'height' | 'width' | 'children' | 'itemCount'> {
     /**
      * Default order by asc/desc
      */
@@ -59,5 +59,5 @@ export interface ScrollerListForwardRef extends GridMethodRef, ScrollerListRef {
  * @param props Props
  * @returns Component
  */
-export declare const ScrollerList: <T extends Record<string, any>>(props: ScrollerListProps<T>) => JSX.Element;
+export declare const ScrollerList: <T extends object>(props: ScrollerListProps<T>) => JSX.Element;
 export {};

package/lib/mu/AutocompleteExtendedProps.d.ts

@@ -4,15 +4,11 @@ import { ChangeEventHandler } from 'react';
 /**
  * Autocomplete extended props
  */
-export interface AutocompleteExtendedProps<T extends Record<string, unknown>> extends Omit<AutocompleteProps<T, undefined, false, false>, 'renderInput' | 'options'> {
-    /**
-     * Id field, default is id
-     */
-    idField?: string & keyof T;
+export declare type AutocompleteExtendedProps<T extends object, D extends DataTypes.Keys<T>> = Omit<AutocompleteProps<T, undefined, false, false>, 'renderInput' | 'options'> & {
     /**
      * Id value
      */
-    idValue?: DataTypes.IdType;
+    idValue?: T[D];
     /**
      * Autocomplete for the input
      */
@@ -61,4 +57,10 @@ export interface AutocompleteExtendedProps<T extends Record<string, unknown>> ex
      * Is search field?
      */
     search?: boolean;
-}
+} & (T extends {
+    id: DataTypes.IdType;
+} ? {
+    idField?: D;
+} : {
+    idField: D;
+});

package/lib/mu/ComboBox.d.ts

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-import { IdLabelDto } from '@etsoo/appscript';
+import { DataTypes } from '@etsoo/shared';
 import { AutocompleteExtendedProps } from './AutocompleteExtendedProps';
 /**
  * ComboBox props
  */
-export interface ComboBoxProps<T extends {}> extends AutocompleteExtendedProps<T> {
+export declare type ComboBoxProps<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = AutocompleteExtendedProps<T, D> & {
     /**
      * Auto add blank item
      */
@@ -13,10 +13,6 @@ export interface ComboBoxProps<T extends {}> extends AutocompleteExtendedProps<T
      * Data readonly
      */
     dataReadonly?: boolean;
-    /**
-     * Label field
-     */
-    labelField?: string & keyof T;
     /**
      * Load data callback
      */
@@ -29,10 +25,16 @@ export interface ComboBoxProps<T extends {}> extends AutocompleteExtendedProps<T
      * Array of options.
      */
     options?: ReadonlyArray<T>;
-}
+} & (T extends {
+    label: string;
+} ? {
+    labelField?: D;
+} : {
+    labelField: D;
+});
 /**
  * ComboBox
  * @param props Props
  * @returns Component
  */
-export declare function ComboBox<T extends {} = IdLabelDto>(props: ComboBoxProps<T>): JSX.Element;
+export declare function ComboBox<T extends object = DataTypes.IdLabelItem, D extends DataTypes.Keys<T> = DataTypes.Keys<T>>(props: ComboBoxProps<T, D>): JSX.Element;

package/lib/mu/ComboBox.js

@@ -12,7 +12,7 @@ import { ReactUtils } from '../app/ReactUtils';
  */
 export function ComboBox(props) {
     // Destruct
-    const { search = false, autoAddBlankItem = search, idField = 'id', idValue, inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, defaultValue, label, labelField = 'label', loadData, onLoadData, name, inputAutoComplete = 'off', options, dataReadonly = true, readOnly, onChange, openOnFocus = true, value, getOptionLabel = (option) => String(Reflect.get(option, labelField)), sx = { minWidth: '150px' }, ...rest } = props;
+    const { search = false, autoAddBlankItem = search, idField = 'id', idValue, inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, defaultValue, label, labelField = 'label', loadData, onLoadData, name, inputAutoComplete = 'off', options, dataReadonly = true, readOnly, onChange, openOnFocus = true, value, getOptionLabel = (option) => `${option[labelField]}`, sx = { minWidth: '150px' }, ...rest } = props;
     // Value input ref
     const inputRef = React.createRef();
     // Options state
@@ -27,7 +27,7 @@ export function ComboBox(props) {
     }, [JSON.stringify(options), propertyWay]);
     // Local default value
     let localValue = idValue != null
-        ? localOptions.find((o) => Reflect.get(o, idField) === idValue)
+        ? localOptions.find((o) => o[idField] === idValue)
         : defaultValue !== null && defaultValue !== void 0 ? defaultValue : value;
     if (localValue === undefined)
         localValue = null;
@@ -36,7 +36,7 @@ export function ComboBox(props) {
     const [stateValue, setStateValue] = React.useState(null);
     // Current id value
     // One time calculation for input's default value (uncontrolled)
-    const localIdValue = stateValue && Reflect.get(stateValue, idField);
+    const localIdValue = stateValue && stateValue[idField];
     React.useEffect(() => {
         if (localValue != null)
             setStateValue(localValue);
@@ -68,7 +68,7 @@ export function ComboBox(props) {
         const input = inputRef.current;
         if (input) {
             // Update value
-            const newValue = value != null ? `${Reflect.get(value, idField)}` : '';
+            const newValue = value != null ? `${value[idField]}` : '';
             if (newValue !== input.value) {
                 // Different value, trigger change event
                 ReactUtils.triggerChange(input, newValue, false);
@@ -97,8 +97,8 @@ export function ComboBox(props) {
     }, []);
     // Layout
     return (React.createElement("div", null,
-        React.createElement("input", { ref: inputRef, "data-reset": "true", type: "text", style: { display: 'none' }, name: name, value: localIdValue !== null && localIdValue !== void 0 ? localIdValue : '', readOnly: true, onChange: inputOnChange }),
-        React.createElement(Autocomplete, { value: stateValue, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => Reflect.get(option, idField) === Reflect.get(value, idField), onChange: (event, value, reason, details) => {
+        React.createElement("input", { ref: inputRef, "data-reset": "true", type: "text", style: { display: 'none' }, name: name, value: `${localIdValue !== null && localIdValue !== void 0 ? localIdValue : ''}`, readOnly: true, onChange: inputOnChange }),
+        React.createElement(Autocomplete, { value: stateValue, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
                 // Set value
                 setInputValue(value);
                 // Custom

package/lib/mu/DataGridEx.d.ts

@@ -1,3 +1,4 @@
+import { DataTypes } from '@etsoo/shared';
 import React from 'react';
 import { GridColumn } from '../components/GridColumn';
 import { GridLoaderStates } from '../components/GridLoader';
@@ -6,17 +7,17 @@ import { MouseEventWithDataHandler } from './MUGlobal';
 /**
  * Footer item renderer props
  */
-export interface DataGridExFooterItemRendererProps<T extends Record<string, any>> {
+export declare type DataGridExFooterItemRendererProps<T extends object> = {
     column: GridColumn<T>;
     index: number;
     states: GridLoaderStates<T>;
     cellProps: any;
     checkable: boolean;
-}
+};
 /**
  * Extended DataGrid with VariableSizeGrid props
  */
-export interface DataGridExProps<T extends Record<string, any>> extends Omit<ScrollerGridProps<T>, 'itemRenderer' | 'columnCount' | 'columnWidth' | 'width'> {
+export declare type DataGridExProps<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = Omit<ScrollerGridProps<T, D>, 'itemRenderer' | 'columnCount' | 'columnWidth' | 'width'> & {
     /**
      * Alternating colors for odd/even rows
      */
@@ -77,7 +78,7 @@ export interface DataGridExProps<T extends Record<string, any>> extends Omit<Scr
      * Width
      */
     width?: number;
-}
+};
 /**
  * Extended datagrid columns calculation
  * @param columns
@@ -92,4 +93,4 @@ export declare function DataGridExCalColumns<T>(columns: GridColumn<T>[]): {
  * @param props Props
  * @returns Component
  */
-export declare function DataGridEx<T extends Record<string, any>>(props: DataGridExProps<T>): JSX.Element;
+export declare function DataGridEx<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>>(props: DataGridExProps<T, D>): JSX.Element;

package/lib/mu/DataGridRenderers.d.ts

@@ -18,5 +18,5 @@ export declare namespace DataGridRenderers {
      * @param location Renderer location (column index)
      * @returns Component
      */
-    function defaultFooterItemRenderer<T>(_rows: T[], { index, states, checkable }: DataGridExFooterItemRendererProps<T>, location?: number): string | undefined;
+    function defaultFooterItemRenderer<T extends object>(_rows: T[], { index, states, checkable }: DataGridExFooterItemRendererProps<T>, location?: number): string | undefined;
 }

package/lib/mu/DnDList.d.ts

@@ -17,7 +17,7 @@ export declare const DnDItemStyle: (index: number, isDragging: boolean, theme: T
 /**
  * DnD list forward ref
  */
-export interface DnDListRef<D extends {}> {
+export interface DnDListRef<D extends object> {
     /**
      * Add item
      * @param item New item
@@ -43,7 +43,7 @@ export interface DnDListRef<D extends {}> {
 /**
  * DnD sortable list properties
  */
-export interface DnDListPros<D extends {}, K extends DataTypes.Keys<D>> {
+export interface DnDListPros<D extends object, K extends DataTypes.Keys<D>> {
     /**
      * Get list item style callback
      */

package/lib/mu/ListMoreDisplay.d.ts

@@ -5,7 +5,7 @@ import { GridData, GridLoader } from '../components/GridLoader';
 /**
  * ListMoreDisplay props
  */
-export interface ListMoreDisplayProps<T, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate> extends Omit<CardProps, 'children'>, GridLoader<T> {
+export interface ListMoreDisplayProps<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate> extends Omit<CardProps, 'children'>, GridLoader<T> {
     /**
      * Children to display the list
      */
@@ -32,4 +32,4 @@ export interface ListMoreDisplayProps<T, F extends DataTypes.BasicTemplate = Dat
  * @param props Props
  * @returns Component
  */
-export declare function ListMoreDisplay<T extends {}, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate>(props: ListMoreDisplayProps<T, F>): JSX.Element;
+export declare function ListMoreDisplay<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate>(props: ListMoreDisplayProps<T, F>): JSX.Element;

package/lib/mu/MUGlobal.d.ts

@@ -55,13 +55,13 @@ export declare class MUGlobal {
      * @param input Input object
      * @returns Updated object
      */
-    static half(input: {}): {};
+    static half(input: object): {};
     /**
      * Reverse object number properties, like 5 to -5
      * @param input Input object
      * @returns Updated object
      */
-    static reverse(input: {}): {};
+    static reverse(input: object): {};
     /**
      * Update object number properties with adjustment
      * @param input Input object
@@ -69,7 +69,7 @@ export declare class MUGlobal {
      * @param field Specific field
      * @returns Updated object
      */
-    static increase(input: {}, adjust: number | {}, field?: string): {};
+    static increase(input: object, adjust: number | object, field?: string): {};
     /**
      * Adjust size with theme update
      * @param size Base size
@@ -77,7 +77,7 @@ export declare class MUGlobal {
      * @param updateFunc Theme update function
      * @returns Updated object
      */
-    static adjustWithTheme(size: number, adjust: {}, updateFunc: (value: number) => string): {};
+    static adjustWithTheme(size: number, adjust: object, updateFunc: (value: number) => string): {};
     /**
      * Break points defined
      */
@@ -91,7 +91,7 @@ export declare class MUGlobal {
      * @param theme Theme
      * @returns Result
      */
-    static getSpace(spaces: {}, theme: Theme): number;
+    static getSpace(spaces: object, theme: Theme): number;
     /**
      * Update object number properties with theme
      * @param input Input object

package/lib/mu/OptionGroup.d.ts

@@ -1,31 +1,22 @@
 /// <reference types="react" />
-import { IdLabelDto } from '@etsoo/appscript';
 import { DataTypes } from '@etsoo/shared';
 import { FormControlProps } from '@mui/material';
 /**
  * OptionGroup props
  */
-export interface OptionGroupProps<T extends Record<string, any> = IdLabelDto, D extends DataTypes.IdType = string> extends Omit<FormControlProps<'fieldset'>, 'defaultValue'> {
+export declare type OptionGroupProps<T extends object = DataTypes.IdLabelItem, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = Omit<FormControlProps<'fieldset'>, 'defaultValue'> & {
     /**
      * Default value
      */
-    defaultValue?: D | D[];
+    defaultValue?: T[D] | T[D][];
     /**
      * Get option label function
      */
     getOptionLabel?: (option: T) => string;
-    /**
-     * Id field, default is id
-     */
-    idField?: string & keyof T;
     /**
      * Label
      */
     label?: string;
-    /**
-     * Label field, default is label
-     */
-    labelField?: string & keyof T;
     /**
      * Multiple choose item
      */
@@ -37,7 +28,7 @@ export interface OptionGroupProps<T extends Record<string, any> = IdLabelDto, D
     /**
      * On value change handler
      */
-    onValueChange?: (value: D | D[] | undefined) => void;
+    onValueChange?: (value: T[D] | T[D][] | undefined) => void;
     /**
      * Array of options.
      */
@@ -50,10 +41,22 @@ export interface OptionGroupProps<T extends Record<string, any> = IdLabelDto, D
      * Display group of elements in a compact row
      */
     row?: boolean;
-}
+} & (T extends {
+    id: DataTypes.IdType;
+} ? {
+    idField?: D;
+} : {
+    idField: D;
+}) & (T extends {
+    label: string;
+} ? {
+    labelField?: D;
+} : {
+    labelField: D;
+});
 /**
  * OptionGroup
  * @param props Props
  * @returns Component
  */
-export declare function OptionGroup<T extends Record<string, unknown> = IdLabelDto, D extends DataTypes.IdType = string>(props: OptionGroupProps<T, D>): JSX.Element;
+export declare function OptionGroup<T extends object = DataTypes.IdLabelItem, D extends DataTypes.Keys<T> = DataTypes.Keys<T>>(props: OptionGroupProps<T, D>): JSX.Element;

package/lib/mu/ResponsibleContainer.d.ts

@@ -10,7 +10,7 @@ import { ScrollerListExInnerItemRendererProps, ScrollerListExItemSize } from './
 /**
  * ResponsibleContainer props
  */
-export interface ResponsibleContainerProps<T extends {}, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate> extends Omit<DataGridExProps<T>, 'height' | 'itemKey' | 'loadData' | 'mRef' | 'onScroll' | 'onItemsRendered'> {
+export declare type ResponsibleContainerProps<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = Omit<DataGridExProps<T, D>, 'height' | 'itemKey' | 'loadData' | 'mRef' | 'onScroll' | 'onItemsRendered'> & {
     /**
      * Height will be deducted
      * @param height Current calcuated height
@@ -23,7 +23,7 @@ export interface ResponsibleContainerProps<T extends {}, F extends DataTypes.Bas
     /**
      * Container box SX (dataGrid determines the case)
      */
-    containerBoxSx?: (paddings: {}, hasFields: boolean, dataGrid?: boolean) => SxProps<Theme>;
+    containerBoxSx?: (paddings: Record<string, string | number>, hasFields: boolean, dataGrid?: boolean) => SxProps<Theme>;
     /**
      * Min width to show Datagrid
      */
@@ -67,7 +67,7 @@ export interface ResponsibleContainerProps<T extends {}, F extends DataTypes.Bas
     /**
      * Paddings
      */
-    paddings?: {};
+    paddings?: Record<string, string | number>;
     /**
      * Pull to refresh data
      */
@@ -80,10 +80,10 @@ export interface ResponsibleContainerProps<T extends {}, F extends DataTypes.Bas
      * Size ready to read miliseconds span
      */
     sizeReadyMiliseconds?: number;
-}
+};
 /**
  * Responsible container
  * @param props Props
  * @returns Layout
  */
-export declare function ResponsibleContainer<T extends {}, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate>(props: ResponsibleContainerProps<T, F>): JSX.Element;
+export declare function ResponsibleContainer<T extends object, F extends DataTypes.BasicTemplate = DataTypes.BasicTemplate, D extends DataTypes.Keys<T> = DataTypes.Keys<T>>(props: ResponsibleContainerProps<T, F, D>): JSX.Element;

package/lib/mu/ScrollerListEx.d.ts

@@ -1,3 +1,4 @@
+import { DataTypes } from '@etsoo/shared';
 import React from 'react';
 import { ListChildComponentProps } from 'react-window';
 import { ScrollerListProps } from '../components/ScrollerList';
@@ -21,7 +22,7 @@ export interface ScrollerListExInnerItemRendererProps<T> extends ListChildCompon
     /**
      * Default margins
      */
-    margins: {};
+    margins: object;
 }
 /**
  * Extended ScrollerList ItemSize type
@@ -29,19 +30,15 @@ export interface ScrollerListExInnerItemRendererProps<T> extends ListChildCompon
  * 2. Static sets
  * 3. Dynamic calculation
  */
-export declare type ScrollerListExItemSize = ((index: number) => [number, number] | [number, number, {}]) | [number, number] | [number, {}, boolean?];
+export declare type ScrollerListExItemSize = ((index: number) => [number, number] | [number, number, object]) | [number, number] | [number, object, boolean?];
 /**
  * Extended ScrollerList Props
  */
-export interface ScrollerListExProps<T> extends Omit<ScrollerListProps<T>, 'itemRenderer' | 'itemSize'> {
+export declare type ScrollerListExProps<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = Omit<ScrollerListProps<T>, 'itemRenderer' | 'itemSize'> & {
     /**
      * Alternating colors for odd/even rows
      */
     alternatingColors?: [string?, string?];
-    /**
-     * Id field
-     */
-    idField?: string & keyof T;
     /**
      * Inner item renderer
      */
@@ -50,6 +47,11 @@ export interface ScrollerListExProps<T> extends Omit<ScrollerListProps<T>, 'item
      * Item renderer
      */
     itemRenderer?: (props: ListChildComponentProps<T>) => React.ReactElement;
+    /**
+     * Id field
+     * Failed: D extends { id: DataTypes.IdType } ? { idField?: D } : { idField: D }
+     */
+    idField?: D;
     /**
      * Item size, a function indicates its a variable size list
      */
@@ -70,10 +72,10 @@ export interface ScrollerListExProps<T> extends Omit<ScrollerListProps<T>, 'item
      * Selected color
      */
     selectedColor?: string;
-}
+};
 /**
  * Extended ScrollerList
  * @param props Props
  * @returns Component
  */
-export declare function ScrollerListEx<T extends Record<string, unknown>>(props: ScrollerListExProps<T>): JSX.Element;
+export declare function ScrollerListEx<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>>(props: ScrollerListExProps<T, D>): JSX.Element;

package/lib/mu/ScrollerListEx.js

@@ -112,7 +112,7 @@ export function ScrollerListEx(props) {
         return selected;
     };
     // Destruct
-    const { alternatingColors = [undefined, undefined], className, idField = 'id', innerItemRenderer, itemSize, itemKey = (index, data) => { var _a; return (_a = DataTypes.getValue(data, idField)) !== null && _a !== void 0 ? _a : index; }, itemRenderer = (itemProps) => {
+    const { alternatingColors = [undefined, undefined], className, idField = 'id', innerItemRenderer, itemSize, itemKey = (index, data) => { var _a; return (_a = DataTypes.getIdValue1(data, idField)) !== null && _a !== void 0 ? _a : index; }, itemRenderer = (itemProps) => {
         const [itemHeight, space, margins] = calculateItemSize(itemProps.index);
         return defaultItemRenderer({
             itemHeight,