[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-10117":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":23,"hasPages":23,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":36,"readmeContent":37,"aiSummary":38,"trendingCount":16,"starSnapshotCount":16,"syncStatus":39,"lastSyncTime":40,"discoverSource":41},10117,"puck","puckeditor\u002Fpuck","puckeditor","The visual editor for React.","https:\u002F\u002Fpuckeditor.com",null,"TypeScript",12793,919,65,181,0,6,22,150,28,101.89,"MIT License",false,"main",[26,27,28,29,30,31,32,33,34,35],"ai","builder","drag-and-drop","draganddrop","no-code","nocode","page-builder","pagebuilder","react","visual-editor","2026-06-12 04:00:48","\u003Cbr \u002F>\u003Cbr \u002F>\u003Cbr \u002F>\n\n\u003Cdiv align=\"center\">\n\n\u003Ca href=\"https:\u002F\u002Fpuckeditor.com?utm_source=readme&utm_medium=code&utm_campaign=repo&utm_contents=logo\">\n  \u003Cpicture>\n    \u003Csource media=\"(prefers-color-scheme: dark)\" srcset=\"https:\u002F\u002Fres.cloudinary.com\u002Fdie3nptcg\u002Fimage\u002Fupload\u002FPuck_Logo_White_RGB_j2rwgg.svg\" height=\"100px\" aria-label=\"Puck logo\">\n    \u003Cimg src=\"https:\u002F\u002Fres.cloudinary.com\u002Fdie3nptcg\u002Fimage\u002Fupload\u002FPuck_Logo_Black_RGB_dqsjag.svg\" height=\"100px\" aria-label=\"Puck logo\">\n  \u003C\u002Fpicture>\n\u003C\u002Fa>\n\n_The visual editor for React_\n\n[Documentation](https:\u002F\u002Fpuckeditor.com\u002Fdocs?utm_source=readme&utm_medium=code&utm_campaign=repo&utm_contents=docs_link) • [Demo](https:\u002F\u002Fdemo.puckeditor.com\u002Fedit?utm_source=readme&utm_medium=code&utm_campaign=repo&utm_contents=demo_link) • [Discord](https:\u002F\u002Fdiscord.gg\u002FV9mDAhuxyZ) • [Contributing](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Fblob\u002Fmain\u002FCONTRIBUTING.md)\n\n⭐️ Enjoying Puck? Please [leave a star](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck)!\n\n\u003Cbr \u002F>\n\n[![GIF showing a page being created in the Puck Editor, with components being added, arranged, and customized in real time](https:\u002F\u002Fgithub.com\u002Fuser-attachments\u002Fassets\u002F25e1ae25-ca5e-450f-afa0-01816830b731)](https:\u002F\u002Fdemo.puckeditor.com\u002Fedit)\n\n\u003C\u002Fdiv>\n\n## What is Puck?\n\nPuck is a modular, open-source visual editor for React.js. You can use Puck to build custom drag-and-drop experiences with your own application and React components.\n\nBecause Puck is just a React component, it plays well with all React.js environments, including Next.js. You own your data and there’s no vendor lock-in.\n\nPuck is also [licensed under MIT](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck?tab=MIT-1-ov-file#readme), making it suitable for both internal systems and commercial applications.\n\n## Quick start\n\nInstall the package:\n\n```sh\nnpm i @puckeditor\u002Fcore --save # or npx create-puck-app my-app\n```\n\nRender the editor:\n\n```jsx\n\u002F\u002F Editor.jsx\nimport { Puck } from \"@puckeditor\u002Fcore\";\nimport \"@puckeditor\u002Fcore\u002Fpuck.css\";\n\n\u002F\u002F Create Puck component config\nconst config = {\n  components: {\n    HeadingBlock: {\n      fields: {\n        children: {\n          type: \"text\",\n        },\n      },\n      render: ({ children }) => {\n        return \u003Ch1>{children}\u003C\u002Fh1>;\n      },\n    },\n  },\n};\n\n\u002F\u002F Describe the initial data\nconst initialData = {};\n\n\u002F\u002F Save the data to your database\nconst save = (data) => {};\n\n\u002F\u002F Render Puck editor\nexport function Editor() {\n  return \u003CPuck config={config} data={initialData} onPublish={save} \u002F>;\n}\n```\n\nRender the page:\n\n```jsx\n\u002F\u002F Page.jsx\nimport { Render } from \"@puckeditor\u002Fcore\";\nimport \"@puckeditor\u002Fcore\u002Fpuck.css\";\n\nexport function Page() {\n  return \u003CRender config={config} data={data} \u002F>;\n}\n```\n\n## Recipes\n\nUse `create-puck-app` to quickly spin up a a pre-configured app based on our provided [recipes](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Ftree\u002Fmain\u002Frecipes):\n\n```sh\nnpx create-puck-app my-app\n```\n\nAvailable recipes include:\n\n- [**next**](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Ftree\u002Fmain\u002Frecipes\u002Fnext): Next.js example, using App Router and static page generation\n- [**remix**](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Ftree\u002Fmain\u002Frecipes\u002Fremix): Remix Run v2 example, using dynamic routes at root-level\n- [**react-router**](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Ftree\u002Fmain\u002Frecipes\u002Freact-router): React Router v7 app example, using dynamic routes to create pages at any level\n\n## Community\n\n- [Discord server](https:\u002F\u002Fdiscord.gg\u002FD9e4E3MQVZ) for discussions\n- [awesome-puck](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fawesome-puck) community repo for plugins, custom fields & more\n\n## Get support\n\nIf you have any questions about Puck, please open a [GitHub issue](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Fissues) or join us on [Discord](https:\u002F\u002Fdiscord.gg\u002FD9e4E3MQVZ).\n\nOr [book a discovery call](https:\u002F\u002Fapp.cal.com\u002Fchrisvxd\u002Fpuck-enquiry\u002F) for hands-on support and consultancy.\n\n## License\n\nMIT © [The Puck Contributors](https:\u002F\u002Fgithub.com\u002Fpuckeditor\u002Fpuck\u002Fgraphs\u002Fcontributors)\n","Puck 是一个用于 React 的可视化编辑器，允许开发者通过拖放自定义组件来构建页面。其核心功能包括模块化设计、支持自定义组件的拖放与实时预览，以及与所有 React.js 环境（如 Next.js）的良好兼容性。Puck 仅作为一个 React 组件存在，确保了数据所有权和无供应商锁定。此外，该项目采用 MIT 许可证发布，适用于内部系统开发及商业应用。特别适合需要快速搭建或调整用户界面且希望保持代码灵活性的场景，如企业级网站构建、内容管理系统等。",2,"2026-06-11 03:26:39","top_topic"]