{"id":28481515,"url":"https://github.com/insightsoftwareconsortium/xstate-lit","last_synced_at":"2025-08-07T17:43:30.883Z","repository":{"id":65421872,"uuid":"586665076","full_name":"InsightSoftwareConsortium/xstate-lit","owner":"InsightSoftwareConsortium","description":"XState Web Component Reactive Selector Controller","archived":false,"fork":false,"pushed_at":"2024-01-03T02:10:23.000Z","size":100,"stargazers_count":4,"open_issues_count":0,"forks_count":2,"subscribers_count":13,"default_branch":"main","last_synced_at":"2025-07-09T12:53:27.683Z","etag":null,"topics":["lit-element","xstate"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/InsightSoftwareConsortium.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2023-01-08T22:49:15.000Z","updated_at":"2023-11-08T07:38:00.000Z","dependencies_parsed_at":"2024-01-03T03:34:12.812Z","dependency_job_id":null,"html_url":"https://github.com/InsightSoftwareConsortium/xstate-lit","commit_stats":{"total_commits":25,"total_committers":3,"mean_commits":8.333333333333334,"dds":0.12,"last_synced_commit":"532c8d09f4e569e2a3ec345afddbb82a9d760e40"},"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"purl":"pkg:github/InsightSoftwareConsortium/xstate-lit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/InsightSoftwareConsortium%2Fxstate-lit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/InsightSoftwareConsortium%2Fxstate-lit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/InsightSoftwareConsortium%2Fxstate-lit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/InsightSoftwareConsortium%2Fxstate-lit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/InsightSoftwareConsortium","download_url":"https://codeload.github.com/InsightSoftwareConsortium/xstate-lit/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/InsightSoftwareConsortium%2Fxstate-lit/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265561001,"owners_count":23788292,"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":["lit-element","xstate"],"created_at":"2025-06-07T20:07:36.807Z","updated_at":"2025-07-17T02:43:27.022Z","avatar_url":"https://github.com/InsightSoftwareConsortium.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# xstate-lit\n\nConnect XState machines with Lit Element components. Similar to `@xstate/react`'s useSelector hook.\n\nBased on @ChrisShank's PR https://github.com/statelyai/xstate/pull/2581\n\n## Setup\n\n`npm install --save xstate-lit`\n\n## Example\n\n```ts\nexport class MyElement extends LitElement {\n  count = new SelectorController(this, actor, (state) =\u003e state.context.count);\n  render() {\n    return html` \u003cdiv\u003ecount is ${this.count.value}\u003c/div\u003e `;\n  }\n}\n```\n\nTo run example install node_modules at top level as well as in example directory:\n\n```\npnpm install\ncd example\npnpm install\npnpm run dev\n```\n\n## SelecterController\n\nThis Lit ReactiveController:\n\n1. Subscribes to all updates of an XState actor or service.\n1. Runs the user provided state selector function when the state changes or the actor receives an event.\n1. Triggers the Lit component to update if the compare function returns false. The default compare function uses `===` to check equality of the old and new selected values.\n\n## SelectState\n\nA wrapper for SelecterController that pulls the XState actor or service from a `@lit/context`. This avoids needed to pass a shared actor down the component tree.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finsightsoftwareconsortium%2Fxstate-lit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Finsightsoftwareconsortium%2Fxstate-lit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Finsightsoftwareconsortium%2Fxstate-lit/lists"}