@etsoo/react 1.8.10 → 1.8.12

package/__tests__/GridLoader.ts

@@ -0,0 +1,55 @@
+import { DataTypes } from "@etsoo/shared";
+import {
+  GridDataGetData,
+  GridTemplateType
+} from "../src/components/GridLoader";
+
+const template = {
+  keyword: "string",
+  deviceId: "number",
+  creationStart: "date",
+  creationEnd: "date"
+} as const satisfies DataTypes.BasicTemplate;
+
+test("Tests for GridTemplateType", () => {
+  const data: GridTemplateType<typeof template> = {
+    keyword: "test",
+    deviceId: 1,
+    creationStart: new Date()
+  };
+
+  expect(data.keyword).toBe("test");
+  expect(data.deviceId).toBe(1);
+});
+
+test("Tests for GridDataGetData with keeping source", () => {
+  const data = {
+    keyword: "test",
+    deviceId: 1,
+    creationStart: "2024/12/06",
+    other: false
+  };
+
+  const result = GridDataGetData(data, template, true);
+
+  expect(result.keyword).toBe("test");
+  expect(result.deviceId).toBe(1);
+  expect(result.creationStart).toBeInstanceOf(Date);
+  expect((result as any).other).toBe(false);
+});
+
+test("Tests for GridDataGetData without keeping source", () => {
+  const data = {
+    keyword: "test",
+    deviceId: 1,
+    creationStart: "2024/12/06",
+    other: false
+  };
+
+  const result = GridDataGetData(data, template, false);
+
+  expect(result.keyword).toBe("test");
+  expect(result.deviceId).toBe(1);
+  expect(result.creationStart).toBeInstanceOf(Date);
+  expect((result as any).other).toBeUndefined();
+});

package/lib/components/GridLoader.d.ts

@@ -17,8 +17,8 @@ export type GridData = FormData | DataTypes.StringRecord;
 /**
  * Grid template type
  */
-export type GridTemplateType<o extends object> = DataTypes.BasicTemplateType<{
-    [k in keyof o]: k extends "date" ? "date" | "string" : k extends DataTypes.BasicNames ? DataTypes.BasicNames : never;
+export type GridTemplateType<T> = DataTypes.BasicTemplateType<{
+    [k in keyof T]: T[k] extends "date" ? "date" | "string" : T[k] extends DataTypes.BasicNames ? T[k] : never;
 }>;
 /**
  * Grid data get with format
@@ -27,7 +27,7 @@ export type GridTemplateType<o extends object> = DataTypes.BasicTemplateType<{
  * @param keepSource Keep source data
  * @returns Json data
  */
-export declare function GridDataGet(props: GridLoadDataProps, template?: object, keepSource?: boolean): GridJsonData & GridTemplateType<typeof template>;
+export declare function GridDataGet<const T>(props: GridLoadDataProps, template?: T, keepSource?: boolean): GridJsonData & GridTemplateType<T>;
 /**
  * Grid data get with format
  * @param data Data
@@ -35,7 +35,7 @@ export declare function GridDataGet(props: GridLoadDataProps, template?: object,
  * @param keepSource Keep source data
  * @returns Json data
  */
-export declare function GridDataGetData(data?: GridData, template?: object, keepSource?: boolean): GridTemplateType<typeof template>;
+export declare function GridDataGetData<const T>(data?: GridData, template?: T, keepSource?: boolean): GridTemplateType<T>;
 /**
  * Grid Json data
  */
@@ -69,7 +69,7 @@ export type GridLoadDataPartialProps = {
 /**
  * Grid data loader
  */
-export interface GridLoader<T extends object> {
+export type GridLoader<T extends object> = {
     /**
      * Auto load data, otherwise call reset
      * @default true
@@ -103,7 +103,7 @@ export interface GridLoader<T extends object> {
      * Threshold at which to pre-fetch data; default is half of loadBatchSize
      */
     threshold?: number | undefined;
-}
+};
 type GridLoaderProps<T> = {
     /**
      * Auto load data, otherwise call reset

package/lib/components/GridLoader.js

@@ -16,7 +16,7 @@ export const GridSizeGet = (size, input) => {
  * @param keepSource Keep source data
  * @returns Json data
  */
-export function GridDataGet(props, template = {}, keepSource = true) {
+export function GridDataGet(props, template, keepSource) {
     // Destruct
     const { data, ...rest } = props;
     // DomUtils.dataAs(data, template);
@@ -29,7 +29,7 @@ export function GridDataGet(props, template = {}, keepSource = true) {
  * @param keepSource Keep source data
  * @returns Json data
  */
-export function GridDataGetData(data, template = {}, keepSource = true) {
+export function GridDataGetData(data, template, keepSource) {
     // Clear form empty value
     if (data instanceof FormData) {
         DomUtils.clearFormData(data);

package/lib/components/ScrollerGrid.d.ts

@@ -21,7 +21,7 @@ export type ScrollerGridItemRendererProps<T> = Omit<GridChildComponentProps<T>,
 /**
  * Scroller vertical grid props
  */
-export interface ScrollerGridProps<T extends object> extends GridLoader<T>, Omit<VariableSizeGridProps<T>, "children" | "rowCount" | "rowHeight"> {
+export type ScrollerGridProps<T extends object> = GridLoader<T> & Omit<VariableSizeGridProps<T>, "children" | "rowCount" | "rowHeight"> & {
     /**
      * Footer renderer
      */
@@ -50,7 +50,7 @@ export interface ScrollerGridProps<T extends object> extends GridLoader<T>, Omit
      * Returns the height of the specified row.
      */
     rowHeight?: ((index: number) => number) | number;
-}
+};
 /**
  * Scroller grid forward ref
  */

package/lib/components/ScrollerList.d.ts

@@ -6,7 +6,7 @@ import { GridMethodRef } from "./GridMethodRef";
 /**
  * Scroller vertical list props
  */
-export interface ScrollerListProps<T extends object> extends GridLoader<T>, Omit<ListProps<T>, "outerRef" | "height" | "width" | "children" | "itemCount"> {
+export type ScrollerListProps<T extends object> = GridLoader<T> & Omit<ListProps<T>, "outerRef" | "height" | "width" | "children" | "itemCount"> & {
     /**
      * Methods ref
      */
@@ -35,7 +35,7 @@ export interface ScrollerListProps<T extends object> extends GridLoader<T>, Omit
      * Item size, a function indicates its a variable size list
      */
     itemSize: ((index: number) => number) | number;
-}
+};
 /**
  * Scroller list ref
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/react",
-  "version": "1.8.10",
+  "version": "1.8.12",
   "description": "TypeScript ReactJs UI Independent Framework",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

package/src/components/GridLoader.ts

@@ -24,11 +24,11 @@ export type GridData = FormData | DataTypes.StringRecord;
 /**
  * Grid template type
  */
-export type GridTemplateType<o extends object> = DataTypes.BasicTemplateType<{
-  [k in keyof o]: k extends "date"
+export type GridTemplateType<T> = DataTypes.BasicTemplateType<{
+  [k in keyof T]: T[k] extends "date"
     ? "date" | "string"
-    : k extends DataTypes.BasicNames
-    ? DataTypes.BasicNames
+    : T[k] extends DataTypes.BasicNames
+    ? T[k]
     : never;
 }>;
 
@@ -39,16 +39,16 @@ export type GridTemplateType<o extends object> = DataTypes.BasicTemplateType<{
  * @param keepSource Keep source data
  * @returns Json data
  */
-export function GridDataGet(
+export function GridDataGet<const T>(
   props: GridLoadDataProps,
-  template: object = {} satisfies DataTypes.BasicTemplate,
-  keepSource: boolean = true
-): GridJsonData & GridTemplateType<typeof template> {
+  template?: T,
+  keepSource?: boolean
+): GridJsonData & GridTemplateType<T> {
   // Destruct
   const { data, ...rest } = props;
 
   // DomUtils.dataAs(data, template);
-  return { ...GridDataGetData(data, template, keepSource), ...rest };
+  return { ...GridDataGetData<T>(data, template, keepSource), ...rest };
 }
 
 /**
@@ -58,11 +58,11 @@ export function GridDataGet(
  * @param keepSource Keep source data
  * @returns Json data
  */
-export function GridDataGetData(
+export function GridDataGetData<const T>(
   data?: GridData,
-  template: object = {} satisfies DataTypes.BasicTemplate,
-  keepSource: boolean = true
-): GridTemplateType<typeof template> {
+  template?: T,
+  keepSource?: boolean
+): GridTemplateType<T> {
   // Clear form empty value
   if (data instanceof FormData) {
     DomUtils.clearFormData(data);
@@ -70,12 +70,12 @@ export function GridDataGetData(
 
   // Conditions
   // Set keepSource to true to hold form data, even they are invisible from the conditions
-  const conditions: GridTemplateType<typeof template> =
+  const conditions =
     data == null
       ? {}
       : DomUtils.dataAs(data, template as DataTypes.BasicTemplate, keepSource);
 
-  return conditions;
+  return conditions as any;
 }
 
 /**
@@ -116,7 +116,7 @@ export type GridLoadDataPartialProps = {
 /**
  * Grid data loader
  */
-export interface GridLoader<T extends object> {
+export type GridLoader<T extends object> = {
   /**
    * Auto load data, otherwise call reset
    * @default true
@@ -161,7 +161,7 @@ export interface GridLoader<T extends object> {
    * Threshold at which to pre-fetch data; default is half of loadBatchSize
    */
   threshold?: number | undefined;
-}
+};
 
 type GridLoaderProps<T> = {
   /**

package/src/components/ScrollerGrid.tsx

@@ -44,44 +44,48 @@ export type ScrollerGridItemRendererProps<T> = Omit<
 /**
  * Scroller vertical grid props
  */
-export interface ScrollerGridProps<T extends object>
-  extends GridLoader<T>,
-    Omit<VariableSizeGridProps<T>, "children" | "rowCount" | "rowHeight"> {
-  /**
-   * Footer renderer
-   */
-  footerRenderer?: (rows: T[], states: GridLoaderStates<T>) => React.ReactNode;
-
-  /**
-   * Header renderer
-   */
-  headerRenderer?: (states: GridLoaderStates<T>) => React.ReactNode;
-
-  /**
-   * Id field
-   */
-  idField?: DataTypes.Keys<T>;
-
-  /**
-   * Item renderer
-   */
-  itemRenderer: (props: ScrollerGridItemRendererProps<T>) => React.ReactElement;
-
-  /**
-   * Methods
-   */
-  mRef?: React.Ref<ScrollerGridForwardRef<T>>;
-
-  /**
-   * On items select change
-   */
-  onSelectChange?: (selectedItems: T[]) => void;
-
-  /**
-   * Returns the height of the specified row.
-   */
-  rowHeight?: ((index: number) => number) | number;
-}
+export type ScrollerGridProps<T extends object> = GridLoader<T> &
+  Omit<VariableSizeGridProps<T>, "children" | "rowCount" | "rowHeight"> & {
+    /**
+     * Footer renderer
+     */
+    footerRenderer?: (
+      rows: T[],
+      states: GridLoaderStates<T>
+    ) => React.ReactNode;
+
+    /**
+     * Header renderer
+     */
+    headerRenderer?: (states: GridLoaderStates<T>) => React.ReactNode;
+
+    /**
+     * Id field
+     */
+    idField?: DataTypes.Keys<T>;
+
+    /**
+     * Item renderer
+     */
+    itemRenderer: (
+      props: ScrollerGridItemRendererProps<T>
+    ) => React.ReactElement;
+
+    /**
+     * Methods
+     */
+    mRef?: React.Ref<ScrollerGridForwardRef<T>>;
+
+    /**
+     * On items select change
+     */
+    onSelectChange?: (selectedItems: T[]) => void;
+
+    /**
+     * Returns the height of the specified row.
+     */
+    rowHeight?: ((index: number) => number) | number;
+  };
 
 /**
  * Scroller grid forward ref

package/src/components/ScrollerList.tsx

@@ -21,47 +21,46 @@ import { GridMethodRef } from "./GridMethodRef";
 /**
  * Scroller vertical list props
  */
-export interface ScrollerListProps<T extends object>
-  extends GridLoader<T>,
-    Omit<
-      ListProps<T>,
-      "outerRef" | "height" | "width" | "children" | "itemCount" // Exclude these props, shoud be exisited otherwise will be failed
-    > {
-  /**
-   * Methods ref
-   */
-  mRef?: React.Ref<ScrollerListForwardRef<T>>;
-
-  /**
-   * Outer div ref
-   */
-  oRef?: React.Ref<HTMLDivElement>;
-
-  /**
-   * Height of the list
-   */
-  height?: number;
-
-  /**
-   * Width of the list
-   */
-  width?: number | string;
-
-  /**
-   * Id field
-   */
-  idField?: DataTypes.Keys<T>;
-
-  /**
-   * Item renderer
-   */
-  itemRenderer: (props: ListChildComponentProps<T>) => React.ReactElement;
-
-  /**
-   * Item size, a function indicates its a variable size list
-   */
-  itemSize: ((index: number) => number) | number;
-}
+export type ScrollerListProps<T extends object> = GridLoader<T> &
+  Omit<
+    ListProps<T>,
+    "outerRef" | "height" | "width" | "children" | "itemCount" // Exclude these props, shoud be exisited otherwise will be failed
+  > & {
+    /**
+     * Methods ref
+     */
+    mRef?: React.Ref<ScrollerListForwardRef<T>>;
+
+    /**
+     * Outer div ref
+     */
+    oRef?: React.Ref<HTMLDivElement>;
+
+    /**
+     * Height of the list
+     */
+    height?: number;
+
+    /**
+     * Width of the list
+     */
+    width?: number | string;
+
+    /**
+     * Id field
+     */
+    idField?: DataTypes.Keys<T>;
+
+    /**
+     * Item renderer
+     */
+    itemRenderer: (props: ListChildComponentProps<T>) => React.ReactElement;
+
+    /**
+     * Item size, a function indicates its a variable size list
+     */
+    itemSize: ((index: number) => number) | number;
+  };
 
 /**
  * Scroller list ref