@cassiewang/cassie-store 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,43 @@
+# laf-test-store
+
+[![NPM version](https://img.shields.io/npm/v/laf-test-store.svg?style=flat)](https://npmjs.org/package/laf-test-store)
+[![NPM downloads](http://img.shields.io/npm/dm/laf-test-store.svg?style=flat)](https://npmjs.org/package/laf-test-store)
+
+A react library developed with dumi
+
+## Usage
+
+TODO
+
+## Options
+
+TODO
+
+## Development
+
+```bash
+# install dependencies
+$ pnpm install
+
+# develop library by docs demo
+$ pnpm start
+
+# build library source code
+$ pnpm run build
+
+# build library source code in watch mode
+$ pnpm run build:watch
+
+# build docs
+$ pnpm run docs:build
+
+# Locally preview the production build.
+$ pnpm run docs:preview
+
+# check your project for potential problems
+$ pnpm run doctor
+```
+
+## LICENSE
+
+MIT

package/dist/AsyncDemo/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare function AsyncDemo(): React.JSX.Element;
+export default AsyncDemo;

package/dist/AsyncDemo/index.js

@@ -0,0 +1,209 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+// AsyncDemo.tsx
+import React, { useState } from 'react';
+import { userStore, fetchUser, fetchUserList, searchUsers } from "./userStore";
+function AsyncDemo() {
+  var _useState = useState('1'),
+    _useState2 = _slicedToArray(_useState, 2),
+    userId = _useState2[0],
+    setUserId = _useState2[1];
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    searchQuery = _useState4[0],
+    setSearchQuery = _useState4[1];
+
+  // 使用选择性订阅，监听我们需要的字段
+  var _userStore$useGetStat = userStore.useGetState(['user', 'userList', 'loading', 'userListLoading', 'error', 'userListError']),
+    user = _userStore$useGetStat.user,
+    userList = _userStore$useGetStat.userList,
+    loading = _userStore$useGetStat.loading,
+    userListLoading = _userStore$useGetStat.userListLoading,
+    error = _userStore$useGetStat.error,
+    userListError = _userStore$useGetStat.userListError;
+
+  // 处理搜索（防抖）
+  var handleSearch = function handleSearch(query) {
+    setSearchQuery(query);
+    // 简单的防抖处理
+    setTimeout(function () {
+      if (query === searchQuery) {
+        searchUsers(query);
+      }
+    }, 300);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: '20px',
+      maxWidth: '800px'
+    }
+  }, /*#__PURE__*/React.createElement("h2", null, "\uD83D\uDE80 AsyncManager\u529F\u80FD\u6F14\u793A"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginBottom: '30px',
+      padding: '20px',
+      border: '1px solid #ddd',
+      borderRadius: '8px'
+    }
+  }, /*#__PURE__*/React.createElement("h3", null, "\uD83D\uDC64 \u83B7\u53D6\u7528\u6237\u4FE1\u606F"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginBottom: '15px'
+    }
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "text",
+    value: userId,
+    onChange: function onChange(e) {
+      return setUserId(e.target.value);
+    },
+    placeholder: "\u8F93\u5165\u7528\u6237ID (1-5, \u6216 'error', 'network-error')",
+    style: {
+      marginRight: '10px',
+      padding: '8px',
+      width: '250px'
+    }
+  }), /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      return fetchUser(userId);
+    },
+    disabled: loading,
+    style: {
+      padding: '8px 16px',
+      backgroundColor: loading ? '#ccc' : '#007bff',
+      color: 'white',
+      border: 'none',
+      borderRadius: '4px',
+      marginRight: '10px'
+    }
+  }, loading ? '获取中...' : '获取用户'), /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      fetchUser('error').then(function () {}).catch(function (err) {
+        debugger;
+      });
+    },
+    disabled: loading,
+    style: {
+      padding: '8px 16px',
+      backgroundColor: loading ? '#ccc' : '#dc3545',
+      color: 'white',
+      border: 'none',
+      borderRadius: '4px',
+      marginRight: '10px'
+    }
+  }, "\u6D4B\u8BD5\u9519\u8BEF"), /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      return fetchUser('network-error').catch(function (err) {});
+    },
+    disabled: loading,
+    style: {
+      padding: '8px 16px',
+      backgroundColor: loading ? '#ccc' : '#fd7e14',
+      color: 'white',
+      border: 'none',
+      borderRadius: '4px'
+    }
+  }, "\u6D4B\u8BD5\u91CD\u8BD5")), user && /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: '10px',
+      backgroundColor: '#f8f9fa',
+      borderRadius: '4px'
+    }
+  }, /*#__PURE__*/React.createElement("strong", null, user.name), " (", user.email, ")"), error && /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: '10px',
+      backgroundColor: '#f8d7da',
+      color: '#721c24',
+      borderRadius: '4px'
+    }
+  }, "\u9519\u8BEF: ", error.message)), /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginBottom: '30px',
+      padding: '20px',
+      border: '1px solid #ddd',
+      borderRadius: '8px'
+    }
+  }, /*#__PURE__*/React.createElement("h3", null, "\uD83D\uDCCB \u7528\u6237\u5217\u8868\u548C\u641C\u7D22"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginBottom: '15px'
+    }
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "text",
+    value: searchQuery,
+    onChange: function onChange(e) {
+      return handleSearch(e.target.value);
+    },
+    placeholder: "\u641C\u7D22\u7528\u6237...",
+    style: {
+      marginRight: '10px',
+      padding: '8px',
+      width: '200px'
+    }
+  }), /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      return fetchUserList(1, 10);
+    },
+    disabled: userListLoading,
+    style: {
+      padding: '8px 16px',
+      backgroundColor: userListLoading ? '#ccc' : '#28a745',
+      color: 'white',
+      border: 'none',
+      borderRadius: '4px',
+      marginRight: '10px'
+    }
+  }, userListLoading ? '加载中...' : '获取用户列表'), /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      // 快速连续搜索，测试竞态条件
+      searchUsers('张');
+      setTimeout(function () {
+        return searchUsers('李');
+      }, 100);
+      setTimeout(function () {
+        return searchUsers('王');
+      }, 200);
+    },
+    style: {
+      padding: '8px 16px',
+      backgroundColor: '#ffc107',
+      color: '#333',
+      border: 'none',
+      borderRadius: '4px'
+    }
+  }, "\u6D4B\u8BD5\u7ADE\u6001\u6761\u4EF6")), userList.length > 0 && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h4", null, "\u7528\u6237\u5217\u8868 (", userList.length, "\u4E2A\u7528\u6237)"), /*#__PURE__*/React.createElement("div", {
+    style: {
+      maxHeight: '200px',
+      overflowY: 'auto'
+    }
+  }, userList.map(function (user) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: user.id,
+      style: {
+        padding: '8px',
+        borderBottom: '1px solid #eee',
+        display: 'flex',
+        justifyContent: 'space-between'
+      }
+    }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("strong", null, user.name)), /*#__PURE__*/React.createElement("span", {
+      style: {
+        color: '#666'
+      }
+    }, user.email));
+  }))), userListError && /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: '10px',
+      backgroundColor: '#f8d7da',
+      color: '#721c24',
+      borderRadius: '4px'
+    }
+  }, "\u5217\u8868\u9519\u8BEF: ", userListError.message)), /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: '20px',
+      backgroundColor: '#e8f4fd',
+      borderRadius: '8px',
+      border: '1px solid #bee5eb'
+    }
+  }, /*#__PURE__*/React.createElement("h4", null, "\uD83C\uDFAF \u89C2\u5BDF\u8981\u70B9\uFF1A"), /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "Mock\u6570\u636E\u6D4B\u8BD5"), "\uFF1A\u4F7F\u7528\u5185\u7F6Emock\u6570\u636E\uFF0C\u65E0\u9700\u771F\u5B9EAPI"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u81EA\u52A8\u72B6\u6001\u7BA1\u7406"), "\uFF1Aloading\u548Cerror\u72B6\u6001\u81EA\u52A8\u5904\u7406"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u7ADE\u6001\u6761\u4EF6\u89E3\u51B3"), "\uFF1A\u5FEB\u901F\u8FDE\u7EED\u8BF7\u6C42\u53EA\u663E\u793A\u6700\u65B0\u7ED3\u679C"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u91CD\u8BD5\u673A\u5236"), "\uFF1A\u5931\u8D25\u65F6\u81EA\u52A8\u91CD\u8BD5\uFF08\u67E5\u770B\u63A7\u5236\u53F0\u65E5\u5FD7\uFF09"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u9519\u8BEF\u6D4B\u8BD5"), "\uFF1A\u70B9\u51FB\"\u6D4B\u8BD5\u9519\u8BEF\"\u548C\"\u6D4B\u8BD5\u91CD\u8BD5\"\u6309\u94AE"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u8BF7\u6C42\u53D6\u6D88"), "\uFF1A\u65B0\u8BF7\u6C42\u4F1A\u53D6\u6D88\u65E7\u8BF7\u6C42"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u8BA1\u7B97\u5C5E\u6027\u548CWatch"), "\uFF1A\u4E0E\u7B2C9\u300110\u7AE0\u529F\u80FD\u5B8C\u7F8E\u7ED3\u5408"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u6253\u5F00\u63A7\u5236\u53F0"), "\uFF1A\u89C2\u5BDF\u5F02\u6B65\u64CD\u4F5C\u7684\u8BE6\u7EC6\u6267\u884C\u8FC7\u7A0B")), /*#__PURE__*/React.createElement("h4", null, "\uD83D\uDCDD \u53EF\u7528\u7684\u6D4B\u8BD5\u6570\u636E\uFF1A"), /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u7528\u6237ID 1-5"), "\uFF1A\u6B63\u5E38\u7684\u7528\u6237\u6570\u636E"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "'error'"), "\uFF1A\u6A21\u62DF\u7528\u6237\u4E0D\u5B58\u5728\u9519\u8BEF"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "'network-error'"), "\uFF1A\u6A21\u62DF\u7F51\u7EDC\u8FDE\u63A5\u5931\u8D25\uFF0C\u89E6\u53D1\u91CD\u8BD5\u673A\u5236"), /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("strong", null, "\u641C\u7D22\u5173\u952E\u8BCD"), "\uFF1A\u5F20\u3001\u674E\u3001\u738B\u3001\u8D75\u3001\u94B1\u7B49\u59D3\u540D\u6216\u90AE\u7BB1"))));
+}
+export default AsyncDemo;

package/dist/AsyncDemo/userStore.d.ts

@@ -0,0 +1,22 @@
+import { Model } from '../Model';
+interface User {
+    id: string;
+    name: string;
+    email: string;
+    avatar?: string;
+}
+interface UserState {
+    user: User | null;
+    userList: User[];
+    loading: boolean;
+    userListLoading: boolean;
+    error: Error | null;
+    userListError: Error | null;
+    userCount: number;
+    hasUsers: boolean;
+}
+declare const userStore: Model<UserState, Record<string, any>>;
+declare function fetchUser(userId: string): Promise<Partial<UserState>>;
+declare function fetchUserList(page?: number, pageSize?: number): Promise<Partial<UserState>>;
+declare function searchUsers(query: string): Promise<Partial<UserState> | undefined>;
+export { userStore, fetchUser, fetchUserList, searchUsers };