{"_id":"@bywin/drawer-hoc","_rev":"3-1962b21a8225769298dbc62d945b4666","name":"@bywin/drawer-hoc","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.0":{"name":"@bywin/drawer-hoc","version":"1.0.0","description":"A higher-order component for Ant Design Drawer.","main":"index.tsx","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"keywords":["Drawer"],"author":{"name":"wengzhijie"},"license":"ISC","dependencies":{"nanoid":"^3.1.18"},"_id":"@bywin/drawer-hoc@1.0.0","_nodeVersion":"12.16.2","_npmVersion":"6.14.4","dist":{"integrity":"sha512-2Xd/Sg/qcuQGfTkPJZ0Pyn2aVdC5XlfcZ842mx59e0kKER/22ftKbMglZASjgQ8fuh6797BRZbvafO0TNCEq2Q==","shasum":"2aab43a37279be18f2230f01ea165d453c452c84","tarball":"https://registry.npmjs.org/@bywin/drawer-hoc/-/drawer-hoc-1.0.0.tgz","fileCount":5,"unpackedSize":12214,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfugd9CRA9TVsSAnZWagAAak0P/RyF3xgkBHORM0XQJqj1\nodk2uRErQP7jUXH5wpMzhAm5uquJstXZSx6Ce/m1QhE1HffF5XlaFQWH7iHU\nfBTIDm1lQcr3pRq4JKxVAkBzSbPMJZhdtqS5OauubKn11CrGd8SauAGWszJl\nxAI/JdpcpgrXoYeFcegPvXyYlHdOUFGIUfjep7x6CMIx/1lg/+SgkaMbQ/Uz\n/mcf7/IMXod5+z0UMSb9IcjcFSOWLdkPZ/mrwdvKnqwb8X0MPNeFfyD4+hNn\nLyzveaSaKVo/4/qXdWnEBi53YUqK38RHsubDKzZSmd9XpneYD3q9wF5+fjy/\nEvjTPG2Y0DCwMf+6MZHVIiLZqy+qvUssdVFuu+pWbgzW9l/s19VSK9Qv9Aej\nW8pKbGy3glC2DaZ6ZsZhnNmkTZMRHvLynY4VerkJQTQyQaAKaiVe9f4d4U2N\n/qdWXRslPnsO1mk8oC0y9snSHGspI+crNLzwIh+esecCgySEUyuVYQMCqYdB\nVEuD6Wg1lS5NOTQdhZfrI+WjeOlPupduf+A/CfIFQf0uvbEEzAGz20wcciJv\npCAm0plBvaLP5p3lllVqzSS56OF91bADUWu6if/6pGd62TYxGPB78YZ3QdNU\ndu2fGd2DJlXS+zp2IWZzzM3B/0Arug/qXsdr24gy+nbU/GAOxc29dRmN2aP/\nZOEi\r\n=flnK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD928kpqQXCQfqh10JyTNa8x8zqr0qCshmAURDPfuIvcAIgeDOXj87uxkM3s6OaJjmUHea/UbBF5mx+R1gfFeZjhgc="}]},"_npmUser":{"name":"bytrix","email":"wengzhijie@126.com"},"directories":{},"maintainers":[{"name":"bytrix","email":"wengzhijie@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/drawer-hoc_1.0.0_1606027133512_0.2271614525385468"},"_hasShrinkwrap":false},"1.0.1":{"name":"@bywin/drawer-hoc","version":"1.0.1","description":"A higher-order component for Ant Design Drawer.","main":"index.tsx","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"keywords":["Drawer"],"author":{"name":"wengzhijie"},"license":"ISC","dependencies":{"nanoid":"^3.1.18"},"_id":"@bywin/drawer-hoc@1.0.1","_nodeVersion":"12.16.2","_npmVersion":"6.14.4","dist":{"integrity":"sha512-goIXNcZgI9EGWg0P91waHbqObtf8+tNrnEozVrjwFCt2S5LzKzXXsOycp/Qv9liPCIfJm8XnPcGNCAjOMuf1uA==","shasum":"fe3872bee563740ff357e0615610a8b727587689","tarball":"https://registry.npmjs.org/@bywin/drawer-hoc/-/drawer-hoc-1.0.1.tgz","fileCount":5,"unpackedSize":13910,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfugzVCRA9TVsSAnZWagAApD8P/j+Fext8Chw3fdheFbfb\nQMmfrEPf/aXmU0VxGIYDYWvRv63CdBRXVUcSEONGZHTCgy14/nlBHZ5v0Ckt\nUFL0HctZj97vh6AOINBNRaV+uhdHocBsHEZWMnu6pcj+D+SGMO/lSC1pUE7y\nYYdJDnkcFRkWpoDRB9Krr5PuQxUroabuhztYKM5W1Fn+rmJvUZVwNNTW1J4B\n7lQtI44OeCd0MtH/kvBL9F7Ac1RAdI0nnxO3Cld4FKmiMCvJjvREwqjsCMth\nJb9x/fujOms/MPpJkgLbZVCzsFfT3F2T80d3TggblAtZ26uVGthaqThBbznE\ndOHyQBh16YoJe1wi+79Kvcx4ZNi8zJYIvg//UfxtJB5ojRsHCmGCv9MYlXUh\nhvJC1K/Ve2ZmO06q/Xts+MJc9vrSwFSO9AHzOIXhtBvy66906vcljUVvzri+\nntsL1qMKYa3eAwuHWLjVgnuhYDprH8uBt5Mq+Hk6IrUWSxY7o0VTwWvP/aI4\nb66AdCd2EXHLkjz2rzBAuDr1qvYr6Kavwm1S5V/9z9MQlrjh8e9EZ1WZoMCA\n0EZglAZEJ1/DqMG04bnbEgm0X1zq2h4bOqVo8TAvB+AJVaDBsWClQUlfJtdV\nxaK+hwozguRZs+hssDV9QhIOy6Cfii+Ky58a1h5Cgz7e2sChhIVQp2cZIRVN\nDNAe\r\n=UkGV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCN0AKB9Agdxfxf8gykNwboEtwTRjVH8ULK37lGyvHRCAIhAI3FkXbFVcIalKB00tapJk/Ui49ZBl6582pZ0HUoY2rO"}]},"_npmUser":{"name":"bytrix","email":"wengzhijie@126.com"},"directories":{},"maintainers":[{"name":"bytrix","email":"wengzhijie@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/drawer-hoc_1.0.1_1606028501318_0.4421418036793945"},"_hasShrinkwrap":false},"1.0.2":{"name":"@bywin/drawer-hoc","version":"1.0.2","description":"A higher-order component for Ant Design Drawer.","main":"index.tsx","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"keywords":["Drawer"],"author":{"name":"wengzhijie"},"license":"ISC","dependencies":{"nanoid":"^3.1.18"},"_id":"@bywin/drawer-hoc@1.0.2","_nodeVersion":"12.16.2","_npmVersion":"6.14.4","dist":{"integrity":"sha512-HTJMkoZ6oAB7EwzyYZ9K5w4ejuZxyw0FoqkCwBg32lq+0Bn5E7qgBJyrjfNzMYdHBVRqEvmF94kn6Lh9fDsaIw==","shasum":"f47a05b5c9bad7231e380528b7ae8b3ffb354a58","tarball":"https://registry.npmjs.org/@bywin/drawer-hoc/-/drawer-hoc-1.0.2.tgz","fileCount":5,"unpackedSize":14029,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfw28rCRA9TVsSAnZWagAAN2wP/iWkZr+cdk1TSDBU+4bK\nePVCLl+kmQefWARVvG14VeVQxgOO09qEKPEhJnJpH64S0KBYuiaZHZBenc9l\n7xBcqVZsit6rSQJs1L+9veiYYpda48Vb526qYY58occOlLXecOQ987MOkm/6\nplU0/IgiRksBct0z6Uam4HrUNSvl07WaUXMKQZIx3tSLb0XU6jfQr01vVMiM\n6ewrzBH10IyVmFwC2KMQ3J3ncuouAYMehs52NegW0R1Hdm3kGPdCXdGkIeG/\nuqKzlczHCIGBAW2BqARKqaAnNQQ226V/yb4XRM8eCCpoGxY6+97HadFXgyJM\niYdPkqNgjbV4pWQXHSKO+vjMHMFexq0UDVyoAaqAISrIq4l1CnCZveYmIYhO\ned07YL/gxGzamVhGh7aTARApnOEfYBhuxYJSIgibUldvszqRG8E5n9fw7kAV\n/5RZIfs7TW6dM8DFkbdkRHHvlhOGah1SP/dPwoJL5SFynTEPxfu0J8e7KoDu\n939FXaCtl2f7VZRC9FLlC0qbau3OQVLyRPLGev5jyRI+94RPj+qqW47cUPqP\nrdVE9u4mcl/b/GFDFj5BMSnWLBEpLXONOg/pwZqF+4XezDNwSFgXFyKdPgih\nVjSD5mr1q79+6NWPPTiA5e8k0XGFW7IA8doDgXa4wA4au3rUmPWITfjSf9Az\nMwFT\r\n=NoRM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFrE1VmG/L/FRmOOcP51z1jsnKmPZR2h9Pqo2XlppEoXAiEA3pP9QC104TuGhZdrYxW3p0389kQWBdkxiis6xshihDg="}]},"_npmUser":{"name":"bytrix","email":"wengzhijie@126.com"},"directories":{},"maintainers":[{"name":"bytrix","email":"wengzhijie@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/drawer-hoc_1.0.2_1606643499538_0.24187923921198107"},"_hasShrinkwrap":false}},"time":{"created":"2020-11-22T06:38:53.258Z","1.0.0":"2020-11-22T06:38:53.645Z","modified":"2022-04-04T21:23:19.895Z","1.0.1":"2020-11-22T07:01:41.483Z","1.0.2":"2020-11-29T09:51:39.662Z"},"maintainers":[{"name":"bytrix","email":"wengzhijie@126.com"}],"description":"A higher-order component for Ant Design Drawer.","keywords":["Drawer"],"author":{"name":"wengzhijie"},"license":"ISC","readme":"# DrawerHOC Usage Guide\n\nA high-order component for Ant Design Drawer.\n\n## Encapsulate Drawer\n\n1. Create the component and wrap it with DrawerHOC.\n\n```javascript\nimport DrawerHOC from '@bywin/drawer-hoc'\nimport React from 'react'\nconst XxxDrawer = (props) => {\nconst [form] = Form.useForm()\nconst model = {\n  [key]: value\n}\nreturn (\n  props.bindForm(form, model)({\n    schema: {\n      properties: [\n        [\n          {\n            key: 'form field key',\n            title: 'form field label',\n            value: 'string or form field component'\n          }\n        ]\n      ]\n    }\n  })\n  )\n}\nexport default DrawerHOC(XxxDrawer, {\n  title: 'drawer title',\n  type: 'ADD' | 'UPDATE' | 'DETAIL',\n  events: {\n    onOk: (dispatch, data) => {\n      // TODO: handle form submition here with dispatch.\n    }\n  }\n})\n```\n\n2. Dispatch UI change\n\n```javascript\nconst dispatch = useDispatch()\ndispatch({\n  type: 'DrawerHOC/updateUI',\n  payload: {\n    XxxDrawer: {\n      visible: true\n    }\n  }\n})\n```\n\n3. Add the corresponding component state in `src/models/DrawerHOC.js` file.\n\n```javascript\nstate: {\n  UIState: {\n    DispositionCreateDrawer: {\n      visible: false\n    },\n    DispositionFeatureCreateDrawer: {\n      visible: false\n    },\n    FeatureListUpdateDrawer: {\n      visible: false\n    },\n    XxxDrawer: {\n      visible: false\n    },\n  }\n}\n```\n\n4. Import the component in your page.\n\n```jsx\n<XxxDrawer />\n```\n\n5. Naming style of DrawerHOC.\n\n  - XxxDetailDrawer\n  - XxxCreateDrawer\n  - XxxUpdateDrawer\n\n## Encapsulate Form\n\n```javascript\nFormBuilder.createForm({\n  schema: {\n    properties: [\n      [\n        {\n          key: 'form field key',\n          title: 'form field label',\n          value: 'string or form field component'\n        }\n      ]\n    ]\n  }\n})\n```\n","readmeFilename":"README.md"}