{"_id":"@alan404/discordjsx","_rev":"2-15dd2d9c23156a26b9e84ac7924d833e","name":"@alan404/discordjsx","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@alan404/discordjsx","version":"0.1.0","keywords":["discord.js","react","jsx"],"author":{"name":"alan404"},"license":"LICENSE","_id":"@alan404/discordjsx@0.1.0","maintainers":[{"name":"alan404","email":"gokdenizbektas@gmail.com"}],"dist":{"shasum":"7bec033f9bbaa26ca2df33203d10c288be6496ad","tarball":"https://registry.npmjs.org/@alan404/discordjsx/-/discordjsx-0.1.0.tgz","fileCount":10,"integrity":"sha512-MifyQ+zMIYuPB5zNjyF7F1sj9sbV9to3eoAl1ZNa1u0dAf5CiH94ebVvkVtkaEDQZQE/Fs68iAADt9OrqY8JSg==","signatures":[{"sig":"MEQCIDDOUYoGrrKx4EE+odJwg12ToEEmP9ttuMvL3erYejz3AiA+SjdNPTPn14RiGDbpc6gsy02PYhG1twHlWBNGp/ZQ5A==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":56302},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","gitHead":"204f26dfc0bfd280ebe128a20ebe34022a29efc1","scripts":{"tsx":"tsx"},"_npmUser":{"name":"alan404","email":"gokdenizbektas@gmail.com"},"_npmVersion":"9.8.1","description":"Use React JSX-based discord messages in your discord.js project","directories":{},"_nodeVersion":"21.6.1","dependencies":{"react":"^18.2.0","dotenv":"^16.3.2","discord.js":"^14.14.1","@types/react":"^18.2.48","react-reconciler":"^0.29.0"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.7.0","typescript":"^5.4.3","@types/node":"^20.11.5","@types/react-reconciler":"^0.28.8"},"_npmOperationalInternal":{"tmp":"tmp/discordjsx_0.1.0_1711989617926_0.2810136078561507","host":"s3://npm-registry-packages"},"deprecated":"Please use discord-jsx-renderer instead"}},"time":{"created":"2024-04-01T16:40:17.804Z","modified":"2026-03-12T18:04:43.957Z","0.1.0":"2024-04-01T16:40:18.137Z"},"author":{"name":"alan404"},"license":"LICENSE","keywords":["discord.js","react","jsx"],"description":"Use React JSX-based discord messages in your discord.js project","maintainers":[{"name":"alan404","email":"gokdenizbektas@gmail.com"}],"readme":"# @alan404/discordjsx\r\n\r\nAllows you to use React/JSX in your discord.js projects\r\n\r\nExamples in [examples folder](./examples)\r\n\r\nNormal react hooks DO work, such as useState and useEffect.\r\n\r\n## Installation\r\n\r\n```\r\npnpm add @alan404/discordjsx\r\n```\r\n\r\nor if you are old:\r\n\r\n```\r\nnpm i @alan404/discordjsx\r\n```\r\n\r\n## Usage\r\n\r\n```js\r\nimport { createJSXRenderer } from \"@alan404/discordjsx\"; \r\n\r\ncreateJSXRenderer(client, <Test />, async (msg) => {\r\n    // send msg by either of these methods:\r\n    await interaction.editReply(msg);\r\n    await message.channel.send(msg);\r\n    // etc.\r\n});\r\n```\r\n\r\n### createJSXRenderer\r\n\r\n```ts\r\ncreateJSXRenderer(\r\n    discordClient: Discord.Client,\r\n    component: React.ReactNode,\r\n    updateMessage: (message) => void,\r\n)\r\n```\r\n\r\n### Elements\r\n\r\n- `<msg>`: Message\r\n- `<embed title=\"\" color=\"\">`: An embed\r\n- `<row>`: Action Row\r\n\r\n### Buttons!\r\n\r\nDefine a button:\r\n\r\n```jsx\r\n<button id=\"a\">\r\n    Hi\r\n</button>\r\n```\r\n\r\nYou can also add a callback!\r\n\r\n```jsx\r\n<button onClick={...}>\r\n    Hi\r\n</button>\r\n```\r\n\r\n### Notes\r\n\r\nplease dont use this abomination in prod\r\n\r\ntodo: select menus\r\n","readmeFilename":"README.md"}