{"id":26447302,"url":"https://github.com/cevr/re-tailwind-rn","last_synced_at":"2025-10-28T06:17:08.678Z","repository":{"id":57156723,"uuid":"301006004","full_name":"cevr/re-tailwind-rn","owner":"cevr","description":"Rescript bindings for tailwind-rn","archived":false,"fork":false,"pushed_at":"2020-10-04T02:52:58.000Z","size":13,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-18T12:58:55.066Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Reason","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cevr.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-10-04T00:00:30.000Z","updated_at":"2020-10-26T12:00:43.000Z","dependencies_parsed_at":"2022-08-30T03:21:35.532Z","dependency_job_id":null,"html_url":"https://github.com/cevr/re-tailwind-rn","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cevr%2Fre-tailwind-rn","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cevr%2Fre-tailwind-rn/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cevr%2Fre-tailwind-rn/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cevr%2Fre-tailwind-rn/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cevr","download_url":"https://codeload.github.com/cevr/re-tailwind-rn/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244227400,"owners_count":20419239,"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":[],"created_at":"2025-03-18T13:51:40.923Z","updated_at":"2025-10-28T06:17:08.584Z","avatar_url":"https://github.com/cevr.png","language":"Reason","funding_links":[],"categories":[],"sub_categories":[],"readme":"# re-tailwind-rn\n\nRescript bindings for [rn-tailwind](https://github.com/vadimdemedes/tailwind-rn)\n\n## Install\n\n```bash\nnpm install tailwind-rn re-tailwind-rn\n```\n\n## bsconfig.json\n\n```\n{\n  ...\n  \"bs-dependencies\": [\"reason-react-native\", \"reason-react\", \"re-tailwind-rn\"]\n}\n```\n\n## Usage\n\nUse the `Tw` module\n\n```reason\nopen ReactNative;\n\n[@react.component]\nlet make = () =\u003e\n  \u003cSafeAreaView style={Tw.make(\"h-full\")}\u003e\n    \u003cView style={Tw.make(\"pt-12 items-center\")}\u003e\n      \u003cView style={Tw.make(\"bg-blue-200 px-3 py-1 rounded-full\")}\u003e\n        \u003cText style={Tw.make(\"text-blue-800 font-semibold\")}\u003e\n          \"Hello Tailwind\"-\u003eReact.string\n        \u003c/Text\u003e\n      \u003c/View\u003e\n    \u003c/View\u003e\n  \u003c/SafeAreaView\u003e;\n```\n\n## Usage with [custom config](https://github.com/vadimdemedes/tailwind-rn#customization)\n\n```reason\nopen ReactNative;\n\n[@module \"./styles.json\"] external stylesConfig: Js.Json.t = \"default\"\n\nlet tw = Tw.create(stylesConfig)\n\n[@react.component]\nlet make = () =\u003e\n  \u003cSafeAreaView style={tw.make(\"h-full\")}\u003e\n    \u003cView style={tw.make(\"pt-12 items-center\")}\u003e\n      \u003cView style={tw.make(\"bg-blue-200 px-3 py-1 rounded-full\")}\u003e\n        \u003cText style={tw.make(\"text-blue-800 font-semibold\")}\u003e\n          \"Hello Tailwind\"-\u003eReact.string\n        \u003c/Text\u003e\n      \u003c/View\u003e\n    \u003c/View\u003e\n  \u003c/SafeAreaView\u003e;\n```\n\n### Recommended to use with [re-classnames](https://github.com/MinimaHQ/re-classnames)\n\n```reason\nopen ReactNative;\n\ntype styles = {\n  container: Style.t,\n  text: Style.t,\n};\n\nlet styles = {\n  container: Tw.make(\"flex justify-start rounded-md px-2 py-2 my-2\"),\n  text: Tw.make(\"flex-grow text-gray-700 font-medium px-2\"),\n};\n\n\n[@react.component]\nlet make = (~todo, ~completed) =\u003e {\n  \u003cView style={styles.container}\u003e\n    \u003cText\n      style={Style.array([|\n        styles.text,\n        Tw.(make(\"line-through\"-\u003eCn.on(completed))),\n      |])}\u003e\n      todo-\u003eReact.string\n    \u003c/Text\u003e\n  \u003c/View\u003e;\n};\n```\n\n## API\n\n### make\n\n```reason\ntype make = string =\u003e ReactNative.Style.t;\n```\n\n### color\n\n```reason\ntype color = string =\u003e string;\n```\n\n### create\n\n```reason\ntype created = {\n  [@as \"tailwind\"]\n  make,\n  [@as \"getColor\"]\n  color,\n};\n\ntype create = Js.Json.t =\u003e created;\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcevr%2Fre-tailwind-rn","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcevr%2Fre-tailwind-rn","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcevr%2Fre-tailwind-rn/lists"}