@etsoo/react 1.5.83 → 1.5.86

package/lib/components/ScrollerList.js

@@ -1,7 +1,7 @@
 import { Utils } from '@etsoo/shared';
 import React from 'react';
 import { FixedSizeList, VariableSizeList } from 'react-window';
-import useCombinedRefs from '../uses/useCombinedRefs';
+import { useCombinedRefs } from '../uses/useCombinedRefs';
 import { GridSizeGet } from './GridLoader';
 // Calculate loadBatchSize
 const calculateBatchSize = (height, itemSize) => {

package/lib/index.d.ts

@@ -5,6 +5,7 @@ export * from './app/RefreshTokenRQ';
 export * from './components/DnDList';
 export * from './components/GridColumn';
 export * from './components/GridLoader';
+export * from './components/GridMethodRef';
 export * from './components/HRouter';
 export * from './components/ListItemReact';
 export * from './components/ScrollerGrid';
@@ -20,6 +21,7 @@ export * from './uses/useCombinedRefs';
 export * from './uses/useDelayedExecutor';
 export * from './uses/useDimensions';
 export * from './uses/useParamsEx';
+export * from './uses/useSearchParamsEx';
 export * from './uses/useTimeout';
 export * from './uses/useWindowScroll';
 export * from './uses/useWindowSize';

package/lib/index.js

@@ -7,6 +7,7 @@ export * from './app/RefreshTokenRQ';
 export * from './components/DnDList';
 export * from './components/GridColumn';
 export * from './components/GridLoader';
+export * from './components/GridMethodRef';
 export * from './components/HRouter';
 export * from './components/ListItemReact';
 export * from './components/ScrollerGrid';
@@ -25,6 +26,7 @@ export * from './uses/useCombinedRefs';
 export * from './uses/useDelayedExecutor';
 export * from './uses/useDimensions';
 export * from './uses/useParamsEx';
+export * from './uses/useSearchParamsEx';
 export * from './uses/useTimeout';
 export * from './uses/useWindowScroll';
 export * from './uses/useWindowSize';

package/lib/uses/useCombinedRefs.d.ts

@@ -4,4 +4,4 @@
  * @param refs Refs
  * @returns Callback
  */
-export default function useCombinedRefs<T>(...refs: (React.Ref<T> | undefined)[]): (target: T | null) => void;
+export declare function useCombinedRefs<T>(...refs: (React.Ref<T> | undefined)[]): (target: T | null) => void;

package/lib/uses/useCombinedRefs.js

@@ -3,7 +3,7 @@
  * @param refs Refs
  * @returns Callback
  */
-export default function useCombinedRefs(...refs) {
+export function useCombinedRefs(...refs) {
     return (target) => {
         // Ignore null reference
         if (target == null)

package/lib/uses/useSearchParamsEx.d.ts

@@ -0,0 +1,6 @@
+import { DataTypes } from '@etsoo/shared';
+/**
+ * Extended useSearchParams of react-router-dom
+ * Provide exact type data
+ */
+export declare function useSearchParamsEx<T extends DataTypes.BasicTemplate>(template: T): DataTypes.BasicTemplateType<T>;

package/lib/uses/useSearchParamsEx.js

@@ -0,0 +1,16 @@
+import { DomUtils } from '@etsoo/shared';
+import { useSearchParams } from 'react-router-dom';
+/**
+ * Extended useSearchParams of react-router-dom
+ * Provide exact type data
+ */
+export function useSearchParamsEx(template) {
+    // Get parameters
+    const [sp] = useSearchParams();
+    const paras = Object.fromEntries(Object.keys(template).map((key) => {
+        const type = template[key];
+        return [key, type.endsWith('[]') ? sp.getAll(key) : sp.get(key)];
+    }));
+    // Return
+    return DomUtils.dataAs(paras, template, false);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.5.83",
+    "version": "1.5.86",
     "description": "TypeScript ReactJs UI Independent Framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -48,12 +48,12 @@
         "@dnd-kit/core": "^6.0.5",
         "@dnd-kit/sortable": "^7.0.1",
         "@emotion/css": "^11.10.0",
-        "@emotion/react": "^11.10.0",
-        "@emotion/styled": "^11.10.0",
+        "@emotion/react": "^11.10.4",
+        "@emotion/styled": "^11.10.4",
         "@etsoo/appscript": "^1.2.88",
         "@etsoo/notificationbase": "^1.1.7",
         "@etsoo/shared": "^1.1.51",
-        "@types/react": "^18.0.17",
+        "@types/react": "^18.0.18",
         "@types/react-dom": "^18.0.6",
         "@types/react-window": "^1.8.5",
         "react": "^18.2.0",
@@ -69,9 +69,9 @@
         "@babel/runtime-corejs3": "^7.18.9",
         "@testing-library/jest-dom": "^5.16.5",
         "@testing-library/react": "^13.3.0",
-        "@types/jest": "^28.1.8",
-        "@typescript-eslint/eslint-plugin": "^5.35.1",
-        "@typescript-eslint/parser": "^5.35.1",
+        "@types/jest": "^29.0.0",
+        "@typescript-eslint/eslint-plugin": "^5.36.1",
+        "@typescript-eslint/parser": "^5.36.1",
         "eslint": "^8.23.0",
         "eslint-config-airbnb-base": "^15.0.0",
         "eslint-plugin-import": "^2.26.0",

package/src/components/ScrollerList.tsx

@@ -8,7 +8,7 @@ import {
     ListProps,
     VariableSizeList
 } from 'react-window';
-import useCombinedRefs from '../uses/useCombinedRefs';
+import { useCombinedRefs } from '../uses/useCombinedRefs';
 import {
     GridLoadDataProps,
     GridLoader,

package/src/index.ts

@@ -8,6 +8,7 @@ export * from './app/RefreshTokenRQ';
 export * from './components/DnDList';
 export * from './components/GridColumn';
 export * from './components/GridLoader';
+export * from './components/GridMethodRef';
 export * from './components/HRouter';
 export * from './components/ListItemReact';
 export * from './components/ScrollerGrid';
@@ -29,6 +30,7 @@ export * from './uses/useCombinedRefs';
 export * from './uses/useDelayedExecutor';
 export * from './uses/useDimensions';
 export * from './uses/useParamsEx';
+export * from './uses/useSearchParamsEx';
 export * from './uses/useTimeout';
 export * from './uses/useWindowScroll';
 export * from './uses/useWindowSize';

package/src/uses/useCombinedRefs.ts

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

package/src/uses/useSearchParamsEx.ts

@@ -0,0 +1,22 @@
+import { DataTypes, DomUtils } from '@etsoo/shared';
+import { useSearchParams } from 'react-router-dom';
+
+/**
+ * Extended useSearchParams of react-router-dom
+ * Provide exact type data
+ */
+export function useSearchParamsEx<T extends DataTypes.BasicTemplate>(
+    template: T
+) {
+    // Get parameters
+    const [sp] = useSearchParams();
+    const paras = Object.fromEntries(
+        Object.keys(template).map((key) => {
+            const type = template[key];
+            return [key, type.endsWith('[]') ? sp.getAll(key) : sp.get(key)];
+        })
+    );
+
+    // Return
+    return DomUtils.dataAs(paras, template, false);
+}