@base-stone/hooks 0.8.0 → 0.8.5

package/README.md

@@ -1,11 +1,52 @@
 # design-hooks
 
 
-## 安装
+### 安装
 
 ```
 
-  pnpm add @base-stone/design-hooks
+  pnpm add @base-stone/hooks
 
 ```
 
+
+### useTableList 使用
+
+
+```
+
+  const { tableProps, reload } = useTableList<ListItemData>(getCooperateList, {
+    orderField: 'createDate',
+    orderType: 'DESC',
+    taskStatuses: taskStatusesArr,
+    scope: scopeType
+  })
+  
+  <Table rowKey="id" scroll={{ x: 'max-content' }} columns={columns} {...tableProps} />
+
+```
+
+### useCreateModal 使用
+
+
+``` 
+
+  const { editModal, infoModal, memberModal, toggle } = useCreateModal(['edit', 'member', 'info'])
+
+  const onSetModalData = (type: string, data?: any) => {
+    toggle(type, data)
+  }
+
+```
+
+
+### useSelectOptions 使用
+
+
+```
+  const { sceneOptions, sceneMap } = useSelectOptions<string>(getRecruitSceneList, {
+    selectKey: 'scene',
+    fieldNames: { label: 'recruitTypeName', value: 'recruitEncrypt' }
+  })
+
+```

package/dist/design-hooks.es.prod.d.ts

@@ -22,9 +22,26 @@ declare interface GlobalTableConfig {
 
 declare type MapData<T extends string | number = string | number> = Map<T, string | number | undefined>;
 
+declare interface ModalConfig {
+    width: number;
+    title: string;
+    maskClosable?: boolean;
+    centered?: boolean;
+    destroyOnHidden?: boolean;
+}
+
 declare type ModalInstance<T = any> = {
     visible: boolean;
     data: T;
+    props: {
+        width: number;
+        title: string;
+        open: boolean;
+        maskClosable: boolean;
+        centered: boolean;
+        destroyOnHidden: boolean;
+        onCancel: () => void;
+    };
     toggle: (data?: T) => void;
     open: (data?: T) => void;
     close: () => void;
@@ -45,14 +62,14 @@ declare interface RequestFn {
     }>;
 }
 
-declare interface SelectConfig<K> {
+declare type SelectConfig<K extends string> = Readonly<{
     params?: Record<string, any>;
     selectKey: K;
     fieldNames?: {
         label: string;
         value: string;
     };
-}
+}>;
 
 declare type SelectOption<T extends string | number = string | number> = {
     label: string;
@@ -66,7 +83,7 @@ declare type SelectOptionsResult<K extends string, T extends string | number> =
 } & {
     [P in `${K}Options`]: (SelectOption<T> & Record<string, any>)[];
 } & {
-    [P in `${K}Map`]: MapData<T>;
+    [P in `${K}Map`]?: MapData<T>;
 }>;
 
 declare interface SuccessFn {
@@ -108,15 +125,12 @@ declare interface TableResponse<T> {
     };
 }
 
-/**
- * 批量创建多个模态框 hook
- * @param suffixes 模态框后缀数组
- * @returns 包含所有模态框实例的对象，以及统一的 toggle/open/close 函数
- */
-export declare function useCreateModal<const T extends readonly string[] = readonly string[]>(suffixes: T): Record<`${T[number]}Modal`, ModalInstance> & {
-    toggle: (type: string, data?: any) => void;
-    open: (type: string, data?: any) => void;
-    close: (type: string) => void;
+export declare function useCreateModal<const T extends Record<string, ModalConfig>>(configs: T): {
+    [K in keyof T as `${string & K}Modal`]: ModalInstance;
+} & {
+    open: (type: keyof T, data?: any) => void;
+    close: (type: keyof T) => void;
+    toggle: (type: keyof T, data?: any) => void;
 };
 
 export declare function useFormSubmit(requestFn: RequestFn, successFn: SuccessFn): FormSubmitResult;

package/dist/design-hooks.es.prod.js

@@ -1,239 +1,250 @@
-import { useState as M, useRef as J, useMemo as j, useCallback as m, useEffect as L, useId as W } from "react";
-import { Empty as q, App as X } from "antd";
+import { useState as E, useRef as I, useMemo as L, useCallback as S, useEffect as D, useId as W } from "react";
+import { Empty as O, App as X } from "antd";
 import { create as K } from "zustand";
-var P = { exports: {} }, x = {};
-var D;
+var P = { exports: {} }, y = {};
+var j;
 function ee() {
-  if (D) return x;
-  D = 1;
-  var i = /* @__PURE__ */ Symbol.for("react.transitional.element"), a = /* @__PURE__ */ Symbol.for("react.fragment");
-  function r(e, s, n) {
-    var d = null;
-    if (n !== void 0 && (d = "" + n), s.key !== void 0 && (d = "" + s.key), "key" in s) {
-      n = {};
-      for (var l in s)
-        l !== "key" && (n[l] = s[l]);
-    } else n = s;
-    return s = n.ref, {
-      $$typeof: i,
-      type: e,
-      key: d,
-      ref: s !== void 0 ? s : null,
-      props: n
+  if (j) return y;
+  j = 1;
+  var n = /* @__PURE__ */ Symbol.for("react.transitional.element"), r = /* @__PURE__ */ Symbol.for("react.fragment");
+  function a(t, o, s) {
+    var f = null;
+    if (s !== void 0 && (f = "" + s), o.key !== void 0 && (f = "" + o.key), "key" in o) {
+      s = {};
+      for (var i in o)
+        i !== "key" && (s[i] = o[i]);
+    } else s = o;
+    return o = s.ref, {
+      $$typeof: n,
+      type: t,
+      key: f,
+      ref: o !== void 0 ? o : null,
+      props: s
     };
   }
-  return x.Fragment = a, x.jsx = r, x.jsxs = r, x;
+  return y.Fragment = r, y.jsx = a, y.jsxs = a, y;
 }
-var I;
+var q;
 function te() {
-  return I || (I = 1, P.exports = ee()), P.exports;
+  return q || (q = 1, P.exports = ee()), P.exports;
 }
 var oe = te();
-const b = {
+const w = {
   sortField: ["orderType", "orderField"],
   sortOrder: ["ASC", "DESC"],
   pageSize: 10
 };
-function ie(i) {
-  Object.keys(i).forEach((a) => {
-    b[a] = i[a];
+function ie(n) {
+  Object.keys(n).forEach((r) => {
+    w[r] = n[r];
   });
 }
-function le(i, a = {}) {
-  const { rowSelection: r, ...e } = a, s = b.pageSize, [n, d] = M({
+function le(n, r = {}) {
+  const { rowSelection: a, ...t } = r, o = w.pageSize, [s, f] = E({
     pagination: {
       showSizeChanger: !0,
       showQuickJumper: !0,
       total: 0,
-      pageSize: s,
+      pageSize: o,
       current: 1
     },
     list: [],
     queryParams: {
       pageNo: 1,
-      pageSize: s,
-      ...e
+      pageSize: o,
+      ...t
     }
-  }), { pagination: l, list: o, queryParams: t } = n, { pageNo: p, pageSize: u } = t, [f, R] = M(!0), $ = J(t), [y, h] = M([]), E = j(() => {
-    if (r)
+  }), { pagination: i, list: d, queryParams: e } = s, { pageNo: c, pageSize: p } = e, [g, m] = E(!0), b = I(e), [M, x] = E([]), h = L(() => {
+    if (a)
       return {
-        selectedRowKeys: y,
-        onChange: (c) => h(c)
+        selectedRowKeys: M,
+        onChange: (l) => x(l)
       };
-  }, [r, y]), v = m(
-    (c) => `共 ${c} 条记录 第 ${p}/${Math.ceil(c / u)} 页 `,
-    [p, u]
-  ), g = m(
-    async (c) => {
-      const { pageNo: _ } = c;
-      R(!0);
-      const S = { ...e, pageSize: u, ...c };
-      c.pageNo === void 0 && (S.pageNo = 1), c.pageSize === void 0 && (S.pageSize = u);
-      const { data: z } = await i(S), { list: k = [], totalCount: w = 0 } = z || {};
-      r && h([]), d({
-        list: k,
-        queryParams: S,
+  }, [a, M]), R = S(
+    (l) => `共 ${l} 条记录 第 ${c}/${Math.ceil(l / p)} 页 `,
+    [c, p]
+  ), u = S(
+    async (l) => {
+      const { pageNo: k } = l;
+      m(!0);
+      const v = { ...t, pageSize: p, ...l };
+      l.pageNo === void 0 && (v.pageNo = 1), l.pageSize === void 0 && (v.pageSize = p);
+      const { data: C } = await n(v), { list: T = [], totalCount: z = 0 } = C || {};
+      a && x([]), f({
+        list: T,
+        queryParams: v,
         pagination: {
-          ...l,
-          current: _,
-          pageSize: S.pageSize,
-          total: w
+          ...i,
+          current: k,
+          pageSize: v.pageSize,
+          total: z
         }
-      }), R(!1);
+      }), m(!1);
     },
-    [t, e, r, u, i, l]
-  ), C = m(
-    (c) => {
-      g({ ...t, ...c, pageNo: 1 });
+    [e, t, a, p, n, i]
+  ), N = S(
+    (l) => {
+      u({ ...e, ...l, pageNo: 1 });
     },
-    [g, t]
-  ), O = m(
-    (c) => {
-      g({ ...t, ...c });
+    [u, e]
+  ), J = S(
+    (l) => {
+      u({ ...e, ...l });
     },
-    [g, t]
-  ), F = m(
-    (c) => {
-      g({ ...c, pageSize: u, pageNo: 1 });
+    [u, e]
+  ), F = S(
+    (l) => {
+      u({ ...l, pageSize: p, pageNo: 1 });
     },
-    [g, u]
-  ), N = m(
-    (c, _, S, z) => {
-      const { action: k } = z;
-      if (["paginate", "sort"].includes(k)) {
-        const { current: w, pageSize: V } = c, { field: Q, order: A } = S, [Y, Z] = b.sortField, [B, H] = b.sortOrder, U = {
-          ...t,
-          [Y]: A ? A === "ascend" ? B : H : void 0,
-          [Z]: Q,
-          pageNo: w,
+    [u, p]
+  ), _ = S(
+    (l, k, v, C) => {
+      const { action: T } = C;
+      if (["paginate", "sort"].includes(T)) {
+        const { current: z, pageSize: V } = l, { field: H, order: A } = v, [Q, Y] = w.sortField, [Z, B] = w.sortOrder, U = {
+          ...e,
+          [Q]: A ? A === "ascend" ? Z : B : void 0,
+          [Y]: H,
+          pageNo: z,
           pageSize: V
         };
-        g(U);
+        u(U);
       }
     },
-    [t, g]
-  ), G = j(() => ({
+    [e, u]
+  ), G = L(() => ({
     bordered: !0,
     size: "middle",
     sticky: !0,
-    rowSelection: E,
-    pagination: { ...l, showTotal: v },
-    loading: f,
-    dataSource: o,
-    onChange: N,
+    rowSelection: h,
+    pagination: { ...i, showTotal: R },
+    loading: g,
+    dataSource: d,
+    onChange: _,
     locale: {
-      emptyText: f ? "" : /* @__PURE__ */ oe.jsx(q, { image: q.PRESENTED_IMAGE_SIMPLE })
+      emptyText: g ? "" : /* @__PURE__ */ oe.jsx(O, { image: O.PRESENTED_IMAGE_SIMPLE })
     }
-  }), [E, l, v, f, o, N]);
-  return L(() => {
-    C($.current);
+  }), [h, i, R, g, d, _]);
+  return D(() => {
+    N(b.current);
   }, []), {
-    queryParams: t,
-    reload: C,
-    refresh: O,
+    queryParams: e,
+    reload: N,
+    refresh: J,
     reset: F,
-    selectedRowKeys: y,
+    selectedRowKeys: M,
     tableProps: G
   };
 }
-const T = K((i) => ({
+const $ = K((n) => ({
   modals: {},
-  toggleModal: (a, r) => i((e) => {
-    const n = e.modals[a]?.visible || !1;
+  toggleModal: (r, a) => n((t) => {
+    const s = t.modals[r]?.visible || !1;
     return {
       modals: {
-        ...e.modals,
-        [a]: {
-          visible: !n,
-          data: n ? {} : r || {}
+        ...t.modals,
+        [r]: {
+          visible: !s,
+          data: s ? {} : a || {}
         }
       }
     };
   }),
-  setModal: (a, r, e) => i((s) => ({
+  setModal: (r, a, t) => n((o) => ({
     modals: {
-      ...s.modals,
-      [a]: {
-        visible: r,
-        data: r ? e || {} : {}
+      ...o.modals,
+      [r]: {
+        visible: a,
+        data: a ? t || {} : {}
       }
     }
   })),
-  clearModals: (a) => i((r) => {
-    const e = { ...r.modals };
-    return a.forEach((s) => {
-      delete e[s];
-    }), { modals: e };
+  clearModals: (r) => n((a) => {
+    const t = { ...a.modals };
+    return r.forEach((o) => {
+      delete t[o];
+    }), { modals: t };
   })
 }));
-function ce(i) {
-  const a = T((o) => o.modals), r = T((o) => o.toggleModal), e = T((o) => o.setModal), s = T((o) => o.clearModals), n = W(), d = J(i.map((o) => `${n}-${o}`));
-  L(() => () => {
-    s(d.current);
-  }, []);
-  const l = {};
-  for (const o of i) {
-    const t = `${n}-${o}`, u = a[t] ?? { visible: !1, data: {} };
-    l[`${o}Modal`] = {
-      visible: u.visible,
-      data: u.data,
-      toggle: (f) => r(t, f),
-      open: (f) => e(t, !0, f),
-      close: () => e(t, !1)
+function ce(n) {
+  const r = $((e) => e.modals), a = $((e) => e.toggleModal), t = $((e) => e.setModal), o = $((e) => e.clearModals), s = W(), f = I([]), i = Object.keys(n);
+  D(() => (f.current = i.map(
+    (e) => `${s}-${e}`
+  ), () => {
+    o(f.current);
+  }), []);
+  const d = {};
+  return i.forEach((e) => {
+    const c = `${s}-${e}`, p = r[c] ?? { visible: !1, data: {} }, g = n[e];
+    d[`${e}Modal`] = {
+      visible: p.visible,
+      data: p.data,
+      props: {
+        width: g.width,
+        title: g.title,
+        open: p.visible,
+        maskClosable: g.maskClosable ?? !1,
+        centered: g.centered ?? !0,
+        destroyOnHidden: g.destroyOnHidden ?? !0,
+        onCancel: t(c, !1)
+      },
+      toggle: (m) => a(c, m),
+      open: (m) => t(c, !0, m),
+      close: () => t(c, !1)
     };
-  }
-  return l.toggle = (o, t) => {
-    const p = `${n}-${o}`;
-    r(p, t);
-  }, l.open = (o, t) => {
-    const p = `${n}-${o}`;
-    e(p, !0, t);
-  }, l.close = (o) => {
-    const t = `${n}-${o}`;
-    e(t, !1);
-  }, l;
+  }), d.toggle = (e, c) => {
+    a(`${s}-${e}`, c);
+  }, d.open = (e, c) => {
+    t(`${s}-${e}`, !0, c);
+  }, d.close = (e) => {
+    t(`${s}-${e}`, !1);
+  }, d;
 }
-const se = (i, a = "value", r = "label") => new Map(i.map((e) => [e[a], e[r]]));
-function ue(i, a) {
-  const [r, e] = M([]), [s, n] = M(/* @__PURE__ */ new Map()), [d, l] = M(!0), { params: o, fieldNames: t } = a, p = a.selectKey, u = async () => {
-    l(!0);
-    const { data: R } = await i(o), $ = R || [];
-    if (t) {
-      const { label: y, value: h } = t, E = $.map((v) => ({
-        data: v,
-        label: v[y],
-        value: v[h]
-      }));
-      e(E), n(se(E));
+const ae = (n, r = "value", a = "label") => new Map(n.map((t) => [t[r], t[a]]));
+function ue(n, r) {
+  const [a, t] = E({
+    options: [],
+    mapData: /* @__PURE__ */ new Map()
+  }), [o, s] = E(!0), { params: f, selectKey: i, fieldNames: d } = r, e = async () => {
+    s(!0);
+    const { data: m } = await n(f), b = m || [];
+    if (d) {
+      const { label: M, value: x } = d, h = b.map((u) => ({
+        data: u,
+        label: u[M],
+        value: u[x]
+      })), R = ae(h);
+      t((u) => ({ ...u, options: h, mapData: R }));
     } else
-      e($);
-    l(!1);
-  }, f = m(() => {
-    u();
-  }, [u]);
-  return L(() => {
-    f();
-  }, []), {
-    loading: d,
-    refresh: f,
-    [`${p}Options`]: r,
-    [`${p}Map`]: s
+      t((M) => ({ ...M, options: b }));
+    s(!1);
+  }, c = S(() => {
+    e();
+  }, [e]);
+  D(() => {
+    c();
+  }, []);
+  const { options: p, mapData: g } = a;
+  return {
+    loading: o,
+    refresh: c,
+    [`${i}Options`]: p,
+    [`${i}Map`]: g
   };
 }
-function de(i, a) {
-  const [r, e] = M(!1), { message: s } = X.useApp(), n = m(async (d) => {
+function de(n, r) {
+  const [a, t] = E(!1), { message: o } = X.useApp(), s = S(async (f) => {
     try {
-      const l = await i(d);
-      e(!0);
-      const { status: o, info: t } = l;
-      o == "success" && (a(l), s.success(t));
+      t(!0);
+      const i = await n(f), { status: d, info: e } = i;
+      d == "success" && (r(i), o.success(e));
     } catch {
     }
-    e(!1);
-  }, [i, a, s]);
+    t(!1);
+  }, [n, r, o]);
   return {
-    loading: r,
-    submit: n
+    loading: a,
+    submit: s
   };
 }
 export {

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@base-stone/hooks",
   "license": "MIT",
-  "version": "0.8.0",
+  "version": "0.8.5",
   "author": {
-    "name": "yeliang",
+    "name": "leafront",
     "email": "leafront@126.com"
   },
   "publishConfig": {

package/dist/design-hooks.global.prod.js

@@ -1 +0,0 @@
-(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("react"),require("antd"),require("zustand")):typeof define=="function"&&define.amd?define(["exports","react","antd","zustand"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d.DesignReact={},d.React,d.antd,d.zustand))})(this,(function(d,e,z,O){"use strict";var $={exports:{}},b={};var L;function D(){if(L)return b;L=1;var l=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function r(t,a,i){var f=null;if(i!==void 0&&(f=""+i),a.key!==void 0&&(f=""+a.key),"key"in a){i={};for(var u in a)u!=="key"&&(i[u]=a[u])}else i=a;return a=i.ref,{$$typeof:l,type:t,key:f,ref:a!==void 0?a:null,props:i}}return b.Fragment=n,b.jsx=r,b.jsxs=r,b}var N;function F(){return N||(N=1,$.exports=D()),$.exports}var I=F();const k={sortField:["orderType","orderField"],sortOrder:["ASC","DESC"],pageSize:10};function J(l){Object.keys(l).forEach(n=>{k[n]=l[n]})}function G(l,n={}){const{rowSelection:r,...t}=n,a=k.pageSize,[i,f]=e.useState({pagination:{showSizeChanger:!0,showQuickJumper:!0,total:0,pageSize:a,current:1},list:[],queryParams:{pageNo:1,pageSize:a,...t}}),{pagination:u,list:o,queryParams:s}=i,{pageNo:g,pageSize:p}=s,[S,T]=e.useState(!0),h=e.useRef(s),[E,C]=e.useState([]),v=e.useMemo(()=>{if(r)return{selectedRowKeys:E,onChange:c=>C(c)}},[r,E]),y=e.useCallback(c=>`共 ${c} 条记录 第 ${g}/${Math.ceil(c/p)} 页 `,[g,p]),m=e.useCallback(async c=>{const{pageNo:q}=c;T(!0);const M={...t,pageSize:p,...c};c.pageNo===void 0&&(M.pageNo=1),c.pageSize===void 0&&(M.pageSize=p);const{data:x}=await l(M),{list:P=[],totalCount:w=0}=x||{};r&&C([]),f({list:P,queryParams:M,pagination:{...u,current:q,pageSize:M.pageSize,total:w}}),T(!1)},[s,t,r,p,l,u]),_=e.useCallback(c=>{m({...s,...c,pageNo:1})},[m,s]),B=e.useCallback(c=>{m({...s,...c})},[m,s]),H=e.useCallback(c=>{m({...c,pageSize:p,pageNo:1})},[m,p]),j=e.useCallback((c,q,M,x)=>{const{action:P}=x;if(["paginate","sort"].includes(P)){const{current:w,pageSize:W}=c,{field:X,order:A}=M,[K,ee]=k.sortField,[te,se]=k.sortOrder,oe={...s,[K]:A?A==="ascend"?te:se:void 0,[ee]:X,pageNo:w,pageSize:W};m(oe)}},[s,m]),U=e.useMemo(()=>({bordered:!0,size:"middle",sticky:!0,rowSelection:v,pagination:{...u,showTotal:y},loading:S,dataSource:o,onChange:j,locale:{emptyText:S?"":I.jsx(z.Empty,{image:z.Empty.PRESENTED_IMAGE_SIMPLE})}}),[v,u,y,S,o,j]);return e.useEffect(()=>{_(h.current)},[]),{queryParams:s,reload:_,refresh:B,reset:H,selectedRowKeys:E,tableProps:U}}const R=O.create(l=>({modals:{},toggleModal:(n,r)=>l(t=>{const i=t.modals[n]?.visible||!1;return{modals:{...t.modals,[n]:{visible:!i,data:i?{}:r||{}}}}}),setModal:(n,r,t)=>l(a=>({modals:{...a.modals,[n]:{visible:r,data:r?t||{}:{}}}})),clearModals:n=>l(r=>{const t={...r.modals};return n.forEach(a=>{delete t[a]}),{modals:t}})}));function V(l){const n=R(o=>o.modals),r=R(o=>o.toggleModal),t=R(o=>o.setModal),a=R(o=>o.clearModals),i=e.useId(),f=e.useRef(l.map(o=>`${i}-${o}`));e.useEffect(()=>()=>{a(f.current)},[]);const u={};for(const o of l){const s=`${i}-${o}`,p=n[s]??{visible:!1,data:{}};u[`${o}Modal`]={visible:p.visible,data:p.data,toggle:S=>r(s,S),open:S=>t(s,!0,S),close:()=>t(s,!1)}}return u.toggle=(o,s)=>{const g=`${i}-${o}`;r(g,s)},u.open=(o,s)=>{const g=`${i}-${o}`;t(g,!0,s)},u.close=o=>{const s=`${i}-${o}`;t(s,!1)},u}const Q=(l,n="value",r="label")=>new Map(l.map(t=>[t[n],t[r]]));function Y(l,n){const[r,t]=e.useState([]),[a,i]=e.useState(new Map),[f,u]=e.useState(!0),{params:o,fieldNames:s}=n,g=n.selectKey,p=async()=>{u(!0);const{data:T}=await l(o),h=T||[];if(s){const{label:E,value:C}=s,v=h.map(y=>({data:y,label:y[E],value:y[C]}));t(v),i(Q(v))}else t(h);u(!1)},S=e.useCallback(()=>{p()},[p]);return e.useEffect(()=>{S()},[]),{loading:f,refresh:S,[`${g}Options`]:r,[`${g}Map`]:a}}function Z(l,n){const[r,t]=e.useState(!1),{message:a}=z.App.useApp(),i=e.useCallback(async f=>{try{const u=await l(f);t(!0);const{status:o,info:s}=u;o=="success"&&(n(u),a.success(s))}catch{}t(!1)},[l,n,a]);return{loading:r,submit:i}}d.configureTableOption=J,d.useCreateModal=V,d.useFormSubmit=Z,d.useSelectOptions=Y,d.useTableList=G,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));