{"_id":"@anotherlover/dtc-func-plugin","_rev":"1-bb01c5a253bc5f7abcd3928786fcb772","name":"@anotherlover/dtc-func-plugin","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.0":{"name":"@anotherlover/dtc-func-plugin","version":"0.1.0","_id":"@anotherlover/dtc-func-plugin@0.1.0","maintainers":[{"name":"anotherlover","email":"1031506109@qq.com"}],"dist":{"shasum":"7acb86230c34bac68c982948596f277af83be33d","tarball":"https://registry.npmjs.org/@anotherlover/dtc-func-plugin/-/dtc-func-plugin-0.1.0.tgz","fileCount":4,"integrity":"sha512-TBVk52Rmt/ACllfQE0p2Ty/xhfgDSCFw5oDRt127NlBimfp3Z8q6MfiboKkZlyFr0m3TLh3UAkHea/rvoaJbGw==","signatures":[{"sig":"MEUCIANSvUT8U+0/yaGOQEMUfLkmeiYJtAmnd5ApsBUN1+TRAiEAmEvoMbKnuwYrPVpICrUXJkddkRZxDw/wmfEr1BoOINg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":97058},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"beeb1fda900f42aaa1fe4d279e2b195cafb8ae2e","private":false,"scripts":{"build":"rollup -c","start":"react-scripts start","prepare":"npm run build"},"_npmUser":{"name":"anotherlover","email":"1031506109@qq.com"},"_npmVersion":"10.2.4","description":"基于 SpreadJS 和 Ant Design 的 React 表格插件。","directories":{},"_nodeVersion":"20.11.1","browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"dependencies":{"@ant-design/icons":"^5.0.0"},"eslintConfig":{"extends":["react-app"]},"_hasShrinkwrap":false,"devDependencies":{"antd":"^5.0.0","react":"^18.0.0","rollup":"^2.79.1","react-dom":"^18.0.0","typescript":"^4.9.0","@types/node":"^16.0.0","@types/react":"^18.0.0","react-scripts":"^5.0.1","@types/react-dom":"^18.0.0","@rollup/plugin-commonjs":"^22.0.2","@grapecity/spread-sheets":"^15.0.0","@rollup/plugin-typescript":"^8.3.3","@rollup/plugin-node-resolve":"^14.1.0","@grapecity/spread-sheets-react":"^15.0.0"},"peerDependencies":{"antd":">=5.0.0","react":">=16.8.0","react-dom":">=16.8.0","@grapecity/spread-sheets":">=15.0.0","@grapecity/spread-sheets-react":">=15.0.0"},"_npmOperationalInternal":{"tmp":"tmp/dtc-func-plugin_0.1.0_1731926612704_0.019082731583911938","host":"s3://npm-registry-packages"}},"0.1.1":{"name":"@anotherlover/dtc-func-plugin","version":"0.1.1","private":false,"main":"dist/index.js","module":"dist/index.esm.js","types":"dist/index.d.ts","peerDependencies":{"@grapecity/spread-sheets":">=15.0.0","@grapecity/spread-sheets-react":">=15.0.0","antd":">=5.0.0","react":">=16.8.0","react-dom":">=16.8.0"},"dependencies":{"@ant-design/icons":"^5.0.0"},"devDependencies":{"@grapecity/spread-sheets":"^15.0.0","@grapecity/spread-sheets-react":"^15.0.0","@rollup/plugin-commonjs":"^22.0.2","@rollup/plugin-node-resolve":"^14.1.0","@rollup/plugin-typescript":"^8.3.3","@types/node":"^16.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","antd":"^5.0.0","react":"^18.0.0","react-dom":"^18.0.0","react-scripts":"^5.0.1","rollup":"^2.79.1","typescript":"^4.9.0"},"scripts":{"start":"react-scripts start","build":"rollup -c","prepare":"npm run build"},"eslintConfig":{"extends":["react-app"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"_id":"@anotherlover/dtc-func-plugin@0.1.1","gitHead":"36f9fe55a8387cb49d2ed1af1e123dd98d9806e0","description":"基于 SpreadJS 和 Ant Design 的 React 表格插件。","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-qwL9HCIT+ImGLt5t7AD7x/yvAq1DOTYaF4CNwNlogr0w9MN7ERGs67YE1VT8pVKPaQlak4At5s8bQE049QCdjg==","shasum":"e0d7ca915d3780a1cb67b13f4a91290edd7f9a36","tarball":"https://registry.npmjs.org/@anotherlover/dtc-func-plugin/-/dtc-func-plugin-0.1.1.tgz","fileCount":4,"unpackedSize":104058,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDbfv4gtMut69s2Hv+l0Vse/ZdHxXNOowIpT++MqGyEaQIhAK/qh44GbPrF8rtXWaKu5pG8/eOo5BjaHuIgilUNuSG8"}]},"_npmUser":{"name":"anotherlover","email":"1031506109@qq.com"},"directories":{},"maintainers":[{"name":"anotherlover","email":"1031506109@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/dtc-func-plugin_0.1.1_1731927744550_0.5172068067562787"},"_hasShrinkwrap":false}},"time":{"created":"2024-11-18T10:43:32.627Z","modified":"2024-11-18T11:02:24.951Z","0.1.0":"2024-11-18T10:43:32.881Z","0.1.1":"2024-11-18T11:02:24.760Z"},"description":"基于 SpreadJS 和 Ant Design 的 React 表格插件。","maintainers":[{"name":"anotherlover","email":"1031506109@qq.com"}],"readme":"# SpreadJS React Plugin\r\n\r\n基于 SpreadJS 和 Ant Design 的 React 表格插件。\r\n\r\n## 功能特点\r\n\r\n- 基于 SpreadJS 的强大表格功能\r\n- 集成 Ant Design 组件库\r\n- TypeScript 支持\r\n- 易于集成和使用\r\n\r\n## 安装\r\n\r\n```bash\r\nnpm install @anotherlover/dtc-func-plugin\r\n```\r\n\r\n## 安装必须的依赖\r\n\r\n```bash\r\nnpm install @grapecity/spread-sheets @grapecity/spread-sheets-react antd\r\n```\r\n\r\n## 使用\r\n\r\n```tsx\r\nimport React from 'react';\r\nimport SpreadSheet from '@anotherlover/dtc-func-plugin';\r\n\r\nconst App = () => {\r\n  const handleChange = (data) => {\r\n    console.log('表格数据变化:', data);\r\n  };\r\n\r\n  const handleCellClick = (row, col, value) => {\r\n    console.log(`点击单元格: 行${row}, 列${col}, 值${value}`);\r\n  };\r\n\r\n  return (\r\n    <SpreadSheet \r\n      data={[[\"姓名\", \"年龄\"], [\"张三\", 25]]}\r\n      readOnly={false}\r\n      onChange={handleChange}\r\n      onCellClick={handleCellClick}\r\n    />\r\n  );\r\n};\r\n\r\nexport default App;\r\n```\r\n\r\n## API\r\n\r\n### Props\r\n\r\n| 参数 | 说明 | 类型 | 默认值 |\r\n| --- | --- | --- | --- |\r\n| width | 表格宽度 | string \\| number | '100%' |\r\n| height | 表格高度 | string \\| number | '600px' |\r\n| data | 表格数据 | any[][] | [] |\r\n| readOnly | 是否只读 | boolean | false |\r\n| showGrid | 是否显示网格线 | boolean | true |\r\n| showHeader | 是否显示表头 | boolean | true |\r\n| theme | 主题 | 'light' \\| 'dark' | 'light' |\r\n| allowSort | 是否允许排序 | boolean | true |\r\n| allowFilter | 是否允许筛选 | boolean | true |\r\n| allowResize | 是否允许调整大小 | boolean | true |\r\n\r\n### 事件\r\n\r\n| 事件名 | 说明 | 参数 |\r\n| --- | --- | --- |\r\n| onChange | 数据变化时的回调 | (data: any[][]) => void |\r\n| onSelectionChange | 选择范围变化时的回调 | (range: { row: number; col: number; rowCount: number; colCount: number }) => void |\r\n| onCellClick | 单元格点击时的回调 | (row: number, col: number, value: any) => void |\r\n\r\n## 示例\r\n\r\n### 只读模式\r\n```tsx\r\n<SpreadSheet \r\n  data={[[\"姓名\", \"年龄\"], [\"张三\", 25]]}\r\n  readOnly={true}\r\n/>\r\n```\r\n\r\n### 自定义样式\r\n```tsx\r\n<SpreadSheet \r\n  width={800}\r\n  height={400}\r\n  showGrid={false}\r\n  theme=\"dark\"\r\n/>\r\n```\r\n\r\n### 监听事件\r\n```tsx\r\n<SpreadSheet \r\n  onChange={(data) => console.log('数据变化:', data)}\r\n  onSelectionChange={(range) => console.log('选择范围:', range)}\r\n  onCellClick={(row, col, value) => console.log('点击单元格:', row, col, value)}\r\n/>\r\n```\r\n","readmeFilename":"README.md"}