{"id":16485828,"url":"https://github.com/zamotany/react-slate","last_synced_at":"2025-04-04T11:10:40.315Z","repository":{"id":40003222,"uuid":"106585305","full_name":"zamotany/react-slate","owner":"zamotany","description":"Write interactive CLI apps with React","archived":false,"fork":false,"pushed_at":"2023-01-13T01:55:29.000Z","size":7899,"stargazers_count":405,"open_issues_count":28,"forks_count":13,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-29T06:01:54.278Z","etag":null,"topics":["cli","layout","nodejs","react","react-reconciler","reactjs","reconciliation","rendering","terminal"],"latest_commit_sha":null,"homepage":"https://zamotany.github.io/react-slate/#/","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/zamotany.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-10-11T17:16:01.000Z","updated_at":"2025-03-28T21:48:05.000Z","dependencies_parsed_at":"2023-02-09T14:15:29.967Z","dependency_job_id":null,"html_url":"https://github.com/zamotany/react-slate","commit_stats":null,"previous_names":[],"tags_count":19,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zamotany%2Freact-slate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zamotany%2Freact-slate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zamotany%2Freact-slate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zamotany%2Freact-slate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zamotany","download_url":"https://codeload.github.com/zamotany/react-slate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247166168,"owners_count":20894654,"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":["cli","layout","nodejs","react","react-reconciler","reactjs","reconciliation","rendering","terminal"],"created_at":"2024-10-11T13:27:25.349Z","updated_at":"2025-04-04T11:10:40.274Z","avatar_url":"https://github.com/zamotany.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg alt=\"react-slate\" src=\"docs/_assets/react_slate_logo.png\" width=\"700\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  Write interactive CLI apps with React\n\u003c/p\u003e\n\n---\n\n[![Build Status][build-badge]][build]\n[![MIT License][license-badge]][license]\n\n[![All Contributors](https://img.shields.io/badge/all_contributors-5-orange.svg?style=flat-square)](#contributors)\n[![PRs Welcome][prs-welcome-badge]][prs-welcome]\n[![Chat][chat-badge]][chat]\n[![Code of Conduct][coc-badge]][coc]\n\n[![tweet][tweet-badge]][tweet]\n\n| Package             | Description                       | Version                                                          |\n| ------------------- | --------------------------------- | ---------------------------------------------------------------- |\n| `@react-slate/core` | The core functionality and logic. | [![Version][react-slate-core-version]][react-slate-core-package] |\n\n---\n\n### Website \u0026 documentation\n\nhttps://zamotany.github.io/react-slate/\n\n### Features\n\n* Render React apps to:\n  * terminal with [`render`](api/render)\n  * terminal in fullscreen mode with [`renderFullscreen`](api/render-fullscreen)\n  * a string with [`renderToString`](api/render-to-string)\n  * a JSON tree [`renderToJson`](api/render-to-json)\n* Use `for await` to continuously render your app using [`renderToString`](api/render-to-string) or [`renderToJson`](api/render-to-json).\n* Render your app to alternative screen buffer and go back to the previous content upon exit with [`renderFullscreen`](api/render-fullscreen).\n* Log messages to main screen buffer with `console` when exiting when in fullscreen mode ([`renderFullscreen`](api/render-fullscreen)).\n* Build layouts with FlexBox (https://github.com/vislyhq/stretch).\n* Disable colors with [`NO_COLOR`](https://no-color.org/) environment variable.\n* Use standard ANSI colors, RBG, Hex and CSS keywords to style your app.\n* Use built-in [`\u003cProgress /\u003e`](components/progress) and [`\u003cSpinner /\u003e`](components/spinner) components.\n* Get layout information using [`onLayout`](handlers/on-layout) prop.\n* Handle clicks using [`onClick`](handlers/on-click) prop.\n* Detect mouse wheel events using [`onWheel`](handlers/on-wheel) prop.\n* Support for absolute positioning and depth (`zIndex`).\n* Built with TypeScript.\n\nPlease check out [Roadmap](https://github.com/zamotany/react-slate/issues/99) for in-progress and planned features. \n\n### Limitations\n\n* Web components are not compatible.\n* Strings must be wrapped in a `\u003cText\u003e` component.\n\n## Installation\n\n```bash\nyarn add react @react-slate/core\n```\n\n## Usage\n\n```js\nimport React from 'react';\nimport { render, View, Text } from '@react-slate/core';\n\nfunction App() {\n  return (\n    \u003cView width=\"100%\" flexDirection=\"row\" justifyContent=\"center\"\u003e\n      \u003cText color=\"green\" bold\u003eHello world!\u003c/Text\u003e\n    \u003c/View\u003e\n  );\n}\n\nrender(\u003cApp /\u003e);\n```\n\n\u003c!-- badges (common) --\u003e\n\n[build-badge]: https://img.shields.io/circleci/project/github/zamotany/react-slate/master.svg?style=flat-square\n[build]: https://circleci.com/gh/zamotany/react-slate\n[license-badge]: https://img.shields.io/npm/l/react-slate.svg?style=flat-square\n[license]: https://opensource.org/licenses/MIT\n[prs-welcome-badge]: https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square\n[prs-welcome]: http://makeapullrequest.com\n[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square\n[coc]: https://github.com/zamotany/react-slate/blob/master/CODE_OF_CONDUCT.md\n[chat-badge]: https://img.shields.io/badge/chat-discord-brightgreen.svg?style=flat-square\u0026colorB=7289DA\u0026logo=discord\n[chat]: https://discord.gg/zwR2Cdh\n[tweet-badge]: https://img.shields.io/badge/tweet-react--slate-blue.svg?style=flat-square\u0026colorB=1DA1F2\u0026logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAUCAYAAACXtf2DAAAAAXNSR0IArs4c6QAAAaRJREFUOBGtlM8rBGEYx3cWtRHJRaKcuMtBSitxkCQ3LtzkP9iUUu5ODspRHLhRLtq0FxeicEBC2cOivcge%2FMgan3fNM8bbzL4zm6c%2BPT%2Fe7%2FO8887svrFYBWbbtgWzsAt3sAcpqJFxxF1QV8oJFqFPFst5dLWQAT87oTgPB7DtziFRT1EA4yZolsFkhwjGYFRO8Op0KD8HVe7unoB6PRTBZG8IctAmG1xrHcfkQ2B55sfI%2ByGMXSBqV71xZ8CWdxBxN6ThFuECDEAL%2Bc9HIzDYumVZ966GZnX0SzCZvEqTbkaGywkyFE6hKAsBPhFQ18uPUqh2ggJ%2BUor%2F4M%2F%2FzOC8g6YzR1i%2F8g4vvSI%2ByD7FFNjexQrjHd8%2BnjABI3AU4Wl16TuF1qANGll81jsi5qu%2Bw6XIsCn4ijhU5FmCJpkV6BGNw410hfSf6JKBQ%2FUFxHGYBnWnmOwDwYQ%2BwzdHqO75HtiAMJfaC7ph32FSRJCENUhDHsLaJkL%2FX4wMF4%2BwA5bgAcrZE4sr0Cu9Jq9fxyrvBHWbNkMD5CEHWTjjT2m6r5D92jfmbbKJEWuMMAAAAABJRU5ErkJggg%3D%3D\n[tweet]: https://twitter.com/intent/tweet?text=Check%20out%20react-slate!%20https://github.com/zamotany/react-slate%20%F0%9F%91%8D\n\n\u003c!-- badges (packages) --\u003e\n\n[react-slate-core-version]: https://img.shields.io/npm/v/@react-slate/core.svg?style=flat-square\n[react-slate-core-package]: https://www.npmjs.com/package/@react-slate/core\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzamotany%2Freact-slate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzamotany%2Freact-slate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzamotany%2Freact-slate/lists"}