{"id":28625644,"url":"https://github.com/bearstudio/ui-state","last_synced_at":"2026-01-20T13:00:56.257Z","repository":{"id":294654503,"uuid":"987643420","full_name":"BearStudio/ui-state","owner":"BearStudio","description":"A lightweight utility to handle dynamic UI display states like loading, error, or any custom-defined state — based on your app logic.","archived":false,"fork":false,"pushed_at":"2025-07-02T10:32:25.000Z","size":305,"stargazers_count":6,"open_issues_count":2,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-19T20:41:58.502Z","etag":null,"topics":["pattern-matching","react","state-management","ts","typescript","ui"],"latest_commit_sha":null,"homepage":"","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/BearStudio.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-21T11:26:54.000Z","updated_at":"2025-10-16T12:46:26.000Z","dependencies_parsed_at":"2025-05-21T12:55:06.581Z","dependency_job_id":"8e432d21-56bb-49ff-8ca4-def4518fe379","html_url":"https://github.com/BearStudio/ui-state","commit_stats":null,"previous_names":["bearstudio/ui-state"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/BearStudio/ui-state","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BearStudio%2Fui-state","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BearStudio%2Fui-state/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BearStudio%2Fui-state/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BearStudio%2Fui-state/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BearStudio","download_url":"https://codeload.github.com/BearStudio/ui-state/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BearStudio%2Fui-state/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28603402,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-20T12:01:53.233Z","status":"ssl_error","status_checked_at":"2026-01-20T12:01:46.545Z","response_time":117,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["pattern-matching","react","state-management","ts","typescript","ui"],"created_at":"2025-06-12T08:11:09.698Z","updated_at":"2026-01-20T13:00:56.248Z","avatar_url":"https://github.com/BearStudio.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @bearstudio/ui-state\n\nA lightweight utility to handle dynamic UI display states like `loading`, `error`, or any custom-defined state — based on your app logic.\n\n## ✨ Features\n\n- 🧠 Declarative and expressive API\n- 🔁 Dynamic state evaluation with conditions\n- ✅ Fully customizable states and payloads\n\n---\n\n## 📦 Installation\n\n```bash\npnpm install @bearstudio/ui-state\nnpm install @bearstudio/ui-state\nyarn add @bearstudio/ui-state\n```\n\n## 🚀 Basic Usage\n\n```tsx\nimport { getUiState } from \"@bearstudio/ui-state\";\n\nconst ui = getUiState((set) =\u003e {\n  if (bookQuery.status === \"pending\") return set(\"pending\");\n  if (bookQuery.status === \"error\") return set(\"error\");\n  return set(\"default\", { book: bookQuery.data });\n});\n```\n\nRendering in React\n\n```tsx\nui.match(\"pending\", () =\u003e \u003c\u003eLoading...\u003c/\u003e)\n  .match(\"error\", () =\u003e \u003c\u003eError\u003c/\u003e)\n  .match(\"default\", ({ book }) =\u003e \u003c\u003e{book.title}\u003c/\u003e)\n  .exhaustive();\n```\n\n## 🪄 Fully customizable and type-safe\n\n```tsx\nconst ui = getUiState((set) =\u003e {\n  if (booksToImport === null) return set(\"show-input\");\n  if (booksToImport.length === 0) return set(\"empty\");\n  return set(\"listing\", { booksToImport });\n});\n\nui.is(\"show-input\"); // valid\nui.is(\"default\"); // invalid\n```\n\n## 📖 APIs\n\n#### `is`\n\n```tsx\nui.is(\"pending\"); // Return true if state is `pending`, false otherwise\n```\n\n#### `when`\n\n```tsx\nui.when(\"pending\", () =\u003e \u003c\u003eLoading...\u003c/\u003e); // Render only when state is `pending`\n```\n\n#### `match` + `exhaustive`\n\n```tsx\nui\n  .match(\"pending\", () =\u003e \u003c\u003eLoading...\u003c/\u003e); // Render when state is `pending`\n  .match(\"error\", () =\u003e \u003c\u003eError...\u003c/\u003e); // Render when state is `error`\n  .match(\"default\", () =\u003e \u003c\u003eError...\u003c/\u003e); // Render when state is `default`\n  .exhaustive(); // Ensures all possible states are matched and rendered\n```\n\n#### `match` + `nonExhaustive`\n\n```tsx\nui\n  .match(\"pending\", () =\u003e \u003c\u003eLoading...\u003c/\u003e); // Render when state is `pending`\n  .match(\"default\", () =\u003e \u003c\u003eError...\u003c/\u003e); // Render when state is `default`\n  .nonExhaustive(); // Allows rendering without matching all possible states\n```\n\n## 📃 License MIT\n\n\u003e Made with ❤️ by BearStudio Team\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbearstudio%2Fui-state","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbearstudio%2Fui-state","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbearstudio%2Fui-state/lists"}