@cclr/react-model 0.1.14 → 0.1.16

package/lib/cjs/index.js

@@ -93,29 +93,28 @@ function _unsupportedIterableToArray(r, a) {
 }
 
 /**
- * 获取指定模型的状态和操作
- * @param modelName
+ * 获取精简的模型状态和操作
  * @param model
  * @returns
  */
-var useStore = function useStore(modelName, model) {
+var useSimpleStore = function useSimpleStore(model) {
   var _useState = react.useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     setState = _useState2[1];
   react.useEffect(function () {
-    return model.subscribe(modelName, function () {
+    return model.subscribe(function () {
       setState({});
     });
   }, []);
-  return [model.getState(modelName), model.getActions(modelName)];
+  return [model.getState().value, model.getActions().setValue];
 };
 
 /**
- * 获取精简的模型状态和操作
+ * 获取精简的模型值
  * @param model
  * @returns
  */
-var useSimpleStore = function useSimpleStore(model) {
+var useSimpleValue = function useSimpleValue(model) {
   var _useState3 = react.useState({}),
     _useState4 = _slicedToArray(_useState3, 2),
     setState = _useState4[1];
@@ -124,33 +123,69 @@ var useSimpleStore = function useSimpleStore(model) {
       setState({});
     });
   }, []);
-  return [model.getState().value, model.getActions().setValue];
+  return model.getState().value;
 };
 
 /**
- * 获取精简的模型值
+ * 获取精简的模型值设置
  * @param model
  * @returns
  */
-var useSimpleValue = function useSimpleValue(model) {
-  var _useState5 = react.useState({}),
-    _useState6 = _slicedToArray(_useState5, 2),
-    setState = _useState6[1];
-  react.useEffect(function () {
-    return model.subscribe(function () {
-      setState({});
+var useSimpleSet = function useSimpleSet(model) {
+  return model.getActions().setValue;
+};
+
+/**
+ * 对于对象类型的模型，获取对象的状态和操作
+ * 依赖 ModelSimple
+ * @param model
+ * @returns
+ */
+var useObjStore = function useObjStore(model) {
+  var _useSimpleStore = useSimpleStore(model),
+    _useSimpleStore2 = _slicedToArray(_useSimpleStore, 2),
+    val = _useSimpleStore2[0],
+    set = _useSimpleStore2[1];
+  var handleUpdate = function handleUpdate(map) {
+    return set(function (prev) {
+      return _objectSpread2(_objectSpread2({}, prev), map);
     });
-  }, []);
-  return model.getState().value;
+  };
+  var handleForce = function handleForce(map) {
+    return set(map);
+  };
+  var handleDel = function handleDel(keys) {
+    return set(function (prev) {
+      var next = _objectSpread2({}, prev);
+      keys.forEach(function (key) {
+        delete next[key];
+      });
+      return next;
+    });
+  };
+  return [val, {
+    handleUpdate: handleUpdate,
+    handleForce: handleForce,
+    handleDel: handleDel
+  }];
 };
 
 /**
- * 获取精简的模型值设置
+ * 获取指定模型的状态和操作
+ * @param modelName
  * @param model
  * @returns
  */
-var useSimpleSet = function useSimpleSet(model) {
-  return model.getActions().setValue;
+var useStore = function useStore(modelName, model) {
+  var _useState = react.useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    setState = _useState2[1];
+  react.useEffect(function () {
+    return model.subscribe(modelName, function () {
+      setState({});
+    });
+  }, []);
+  return [model.getState(modelName), model.getActions(modelName)];
 };
 
 var ReactModel = function ReactModel(models) {
@@ -163,6 +198,7 @@ var ReactModel = function ReactModel(models) {
 };
 
 exports.ReactModel = ReactModel;
+exports.useObjStore = useObjStore;
 exports.useSimpleSet = useSimpleSet;
 exports.useSimpleStore = useSimpleStore;
 exports.useSimpleValue = useSimpleValue;

package/lib/esm/index.js

@@ -91,29 +91,28 @@ function _unsupportedIterableToArray(r, a) {
 }
 
 /**
- * 获取指定模型的状态和操作
- * @param modelName
+ * 获取精简的模型状态和操作
  * @param model
  * @returns
  */
-var useStore = function useStore(modelName, model) {
+var useSimpleStore = function useSimpleStore(model) {
   var _useState = useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     setState = _useState2[1];
   useEffect(function () {
-    return model.subscribe(modelName, function () {
+    return model.subscribe(function () {
       setState({});
     });
   }, []);
-  return [model.getState(modelName), model.getActions(modelName)];
+  return [model.getState().value, model.getActions().setValue];
 };
 
 /**
- * 获取精简的模型状态和操作
+ * 获取精简的模型值
  * @param model
  * @returns
  */
-var useSimpleStore = function useSimpleStore(model) {
+var useSimpleValue = function useSimpleValue(model) {
   var _useState3 = useState({}),
     _useState4 = _slicedToArray(_useState3, 2),
     setState = _useState4[1];
@@ -122,33 +121,69 @@ var useSimpleStore = function useSimpleStore(model) {
       setState({});
     });
   }, []);
-  return [model.getState().value, model.getActions().setValue];
+  return model.getState().value;
 };
 
 /**
- * 获取精简的模型值
+ * 获取精简的模型值设置
  * @param model
  * @returns
  */
-var useSimpleValue = function useSimpleValue(model) {
-  var _useState5 = useState({}),
-    _useState6 = _slicedToArray(_useState5, 2),
-    setState = _useState6[1];
-  useEffect(function () {
-    return model.subscribe(function () {
-      setState({});
+var useSimpleSet = function useSimpleSet(model) {
+  return model.getActions().setValue;
+};
+
+/**
+ * 对于对象类型的模型，获取对象的状态和操作
+ * 依赖 ModelSimple
+ * @param model
+ * @returns
+ */
+var useObjStore = function useObjStore(model) {
+  var _useSimpleStore = useSimpleStore(model),
+    _useSimpleStore2 = _slicedToArray(_useSimpleStore, 2),
+    val = _useSimpleStore2[0],
+    set = _useSimpleStore2[1];
+  var handleUpdate = function handleUpdate(map) {
+    return set(function (prev) {
+      return _objectSpread2(_objectSpread2({}, prev), map);
     });
-  }, []);
-  return model.getState().value;
+  };
+  var handleForce = function handleForce(map) {
+    return set(map);
+  };
+  var handleDel = function handleDel(keys) {
+    return set(function (prev) {
+      var next = _objectSpread2({}, prev);
+      keys.forEach(function (key) {
+        delete next[key];
+      });
+      return next;
+    });
+  };
+  return [val, {
+    handleUpdate: handleUpdate,
+    handleForce: handleForce,
+    handleDel: handleDel
+  }];
 };
 
 /**
- * 获取精简的模型值设置
+ * 获取指定模型的状态和操作
+ * @param modelName
  * @param model
  * @returns
  */
-var useSimpleSet = function useSimpleSet(model) {
-  return model.getActions().setValue;
+var useStore = function useStore(modelName, model) {
+  var _useState = useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    setState = _useState2[1];
+  useEffect(function () {
+    return model.subscribe(modelName, function () {
+      setState({});
+    });
+  }, []);
+  return [model.getState(modelName), model.getActions(modelName)];
 };
 
 var ReactModel = function ReactModel(models) {
@@ -160,4 +195,4 @@ var ReactModel = function ReactModel(models) {
   }, model);
 };
 
-export { ReactModel, useSimpleSet, useSimpleStore, useSimpleValue };
+export { ReactModel, useObjStore, useSimpleSet, useSimpleStore, useSimpleValue };

package/lib/type/index.d.ts

@@ -1,4 +1,17 @@
 import { ModelsSingleApi, ModelType, TGetStateType, TGetActionsType, ModelsType, TActionMapApi, TSubscribesFun } from '@cclr/model';
+import { TPlainObject } from '@cclr/lang';
+
+/**
+ * 对于对象类型的模型，获取对象的状态和操作
+ * 依赖 ModelSimple
+ * @param model
+ * @returns
+ */
+declare const useObjStore: <T extends ModelsSingleApi<ModelType>>(model: T) => readonly [ReturnType<T["getState"]>["value"], {
+    readonly handleUpdate: (map: TPlainObject) => Promise<any>;
+    readonly handleForce: (map: TPlainObject) => Promise<any>;
+    readonly handleDel: (keys: string[]) => Promise<any>;
+}];
 
 /**
  * 获取精简的模型状态和操作
@@ -37,4 +50,4 @@ type TReactModelsApi<MS extends ModelsType> = {
 
 declare const ReactModel: <MT extends ModelsType>(models: MT) => TReactModelsApi<MT>;
 
-export { ReactModel, useSimpleSet, useSimpleStore, useSimpleValue };
+export { ReactModel, useObjStore, useSimpleSet, useSimpleStore, useSimpleValue };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cclr/react-model",
-  "version": "0.1.14",
+  "version": "0.1.16",
   "description": "前端开发状态管理",
   "author": "cclr <18843152354@163.com>",
   "homepage": "",
@@ -27,14 +27,16 @@
     "g:test": "vitest run",
     "g:build": "ccm lib"
   },
-  "gitHead": "c0359e7db68cd14df406cb2c8d56b5fe14a2c3bb",
+  "gitHead": "8960f7c796054f1f0bbf0e7d0064af5f6abc4e05",
   "dependencies": {
-    "@cclr/lang": "0.1.14",
-    "@cclr/model": "0.1.14",
-    "@cclr/utils": "0.1.14",
+    "@cclr/lang": "0.1.16",
+    "@cclr/model": "0.1.16",
+    "@cclr/utils": "0.1.16",
+    "immer": "^10.1.1"
+  },
+  "devDependencies": {
     "@testing-library/react-hooks": "^8.0.1",
     "@types/react": "^18.3.12",
-    "immer": "^10.1.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   }

package/lib/umd/index.js

@@ -1 +0,0 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@cclr/model"),require("react")):"function"==typeof define&&define.amd?define(["exports","@cclr/model","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).MyBundle={},e.model,e.react)}(this,(function(e,t,r){"use strict";function n(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);r<t;r++)n[r]=e[r];return n}function o(e,t,r){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function i(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function u(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i,u,c=[],f=!0,l=!1;try{if(i=(r=r.call(e)).next,0===t);else for(;!(f=(n=i.call(r)).done)&&(c.push(n.value),c.length!==t);f=!0);}catch(e){l=!0,o=e}finally{try{if(!f&&null!=r.return&&(u=r.return(),Object(u)!==u))return}finally{if(l)throw o}}return c}}(e,t)||function(e,t){if(e){if("string"==typeof e)return n(e,t);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}e.ReactModel=function(e){var n=t.Model(e);return function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?i(Object(r),!0).forEach((function(t){o(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):i(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({useStore:function(e){return function(e,t){var n=u(r.useState(),2)[1];return r.useEffect((function(){return t.subscribe(e,n),function(){t.unsubscribe(e,n)}}),[]),[t.getState(e),t.getActions(e)]}(e,n)}},n)}}));