{"id":18309982,"url":"https://github.com/ne-smalltown/doni","last_synced_at":"2025-06-15T04:40:00.802Z","repository":{"id":57215125,"uuid":"460856023","full_name":"NE-SmallTown/doni","owner":"NE-SmallTown","description":"基于 Mobx 的高性能 UI 组件库。A high performance UI library using magic Mobx and Antd! ","archived":false,"fork":false,"pushed_at":"2022-02-19T07:05:36.000Z","size":124,"stargazers_count":6,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-21T08:34:53.536Z","etag":null,"topics":["ant-design","antd","component-library","library","react","ui"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NE-SmallTown.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-02-18T13:04:23.000Z","updated_at":"2023-09-02T00:25:09.000Z","dependencies_parsed_at":"2022-08-26T13:41:44.237Z","dependency_job_id":null,"html_url":"https://github.com/NE-SmallTown/doni","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NE-SmallTown%2Fdoni","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NE-SmallTown%2Fdoni/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NE-SmallTown%2Fdoni/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NE-SmallTown%2Fdoni/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NE-SmallTown","download_url":"https://codeload.github.com/NE-SmallTown/doni/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247375768,"owners_count":20929103,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ant-design","antd","component-library","library","react","ui"],"created_at":"2024-11-05T16:12:55.304Z","updated_at":"2025-04-05T17:33:06.619Z","avatar_url":"https://github.com/NE-SmallTown.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Doni\n\nA high performance UI library using magic Mobx and Antd!\n\n# What magic it has?\n\nSee https://zhuanlan.zhihu.com/p/469224590\n\n# Install\n\n`npm i doni`\n\n# Example\n\n```jsx\nimport { Table, BodyCell, ModalButton, DoniTableColumn } from 'doni';\nimport { types } from 'mobx-state-tree';\n\nconst ModelArticle = types.model({\n  id: types.string,\n  images: types.array(types.string),\n});\n\nconst columns: DoniTableColumn\u003cIModelArticle\u003e[] = [\n  {\n    title: 'id',\n    width: '10%',\n    fixed: 'left',\n    render: (article) =\u003e article.id,\n  },\n  {\n    title: 'images',\n    width: '15%',\n    render: ({ images }) =\u003e {\n      return (\n        \u003cBodyCell className='image-wrap'\u003e\n          \u003cImage src={ images[0] } className='image'/\u003e\n        \u003c/BodyCell\u003e\n      )\n    },\n  },\n  {\n    title: 'Action',\n    width: '15%',\n    fixed: 'right',\n    render: (article, { modals: [ changeTitleModal ], action }) =\u003e {\n      const handleSubmitChangeForm = async (submitData: any) =\u003e {\n        action.setRecord((article: IModelArticle) =\u003e {\n          article.title = submitData.newTitle;\n        });\n\n        await new Promise(r =\u003e {\n          setTimeout(r, 3000);\n        });\n\n        changeTitleModal.closeModal();\n      };\n\n      return (\n        \u003cBodyCell className='action-wrap'\u003e\n          \u003cModalButton\n            className='action-change'\n            button='Change'\n            modal={ changeTitleModal }\n            modalProps={{\n              title: 'Change title',\n            }}\n          \u003e\n            \u003cForm\n              layout='horizontal'\n              submitter={{\n                render: (_, dom) =\u003e \u003cdiv className='modal-form-footer'\u003e{ dom }\u003c/div\u003e,\n              }}\n              onFinish={ handleSubmitChangeForm }\n            \u003e\n              \u003cInput\n                name='newTitle'\n                label={\u003cdiv className='modal-label'\u003eNew Title\u003c/div\u003e}\n                placeholder='Please input new title.'\n                rules={[{ required: true, message: 'Please input new title.' }]}\n              /\u003e\n            \u003c/ProForm\u003e\n          \u003c/ModalButton\u003e\n        \u003c/BodyCell\u003e\n      );\n    },\n  },\n];\n\n\u003cTable\n  recordMobxType={ ModelArticle }\n  initData={ articles }\n  columns={ columns }\n  loading={ articles.length === 0 }\n  pagination={{ defaultPageSize: 4 }}\n/\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fne-smalltown%2Fdoni","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fne-smalltown%2Fdoni","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fne-smalltown%2Fdoni/lists"}