{"id":13452625,"url":"https://github.com/ui-router/core","last_synced_at":"2025-05-15T18:07:25.553Z","repository":{"id":38361487,"uuid":"70363375","full_name":"ui-router/core","owner":"ui-router","description":"UI-Router Core: Framework agnostic, State-based routing for JavaScript Single Page Apps","archived":false,"fork":false,"pushed_at":"2024-07-15T11:35:30.000Z","size":8789,"stargazers_count":124,"open_issues_count":4,"forks_count":60,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-05-15T00:55:31.965Z","etag":null,"topics":["framework-agnostic","javascript","router","state-machine","state-tree","transitions","typescript","ui-router"],"latest_commit_sha":null,"homepage":null,"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/ui-router.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","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,"publiccode":null,"codemeta":null}},"created_at":"2016-10-08T23:39:08.000Z","updated_at":"2025-05-10T06:11:34.000Z","dependencies_parsed_at":"2024-10-28T18:50:03.856Z","dependency_job_id":null,"html_url":"https://github.com/ui-router/core","commit_stats":null,"previous_names":[],"tags_count":53,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ui-router%2Fcore","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ui-router%2Fcore/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ui-router%2Fcore/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ui-router%2Fcore/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ui-router","download_url":"https://codeload.github.com/ui-router/core/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254394721,"owners_count":22063984,"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":["framework-agnostic","javascript","router","state-machine","state-tree","transitions","typescript","ui-router"],"created_at":"2024-07-31T07:01:29.558Z","updated_at":"2025-05-15T18:07:25.496Z","avatar_url":"https://github.com/ui-router.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"# UI-Router Core \u0026nbsp;[![Build Status](https://github.com/ui-router/core/workflows/CI:%20UIRouter%20Core/badge.svg)](https://github.com/ui-router/core/actions?query=workflow%3A%22CI:%20UIRouter%20Core%22)\n\nUI-Router core provides client-side [Single Page Application](https://en.wikipedia.org/wiki/Single-page_application)\nrouting for JavaScript.\nThis core is framework agnostic.\nIt is used to build\n[UI-Router for Angular 1](//ui-router.github.io/ng1),\n[UI-Router for Angular 2](//ui-router.github.io/ng2), and\n[UI-Router React](//ui-router.github.io/react).\n\n## SPA Routing\n\nRouting frameworks for SPAs update the browser's URL as the user navigates through the app. Conversely, this allows\nchanges to the browser's URL to drive navigation through the app, thus allowing the user to create a bookmark to a\nlocation deep within the SPA.\n\nUI-Router applications are modeled as a hierarchical tree of states. UI-Router provides a\n[_state machine_](https://en.wikipedia.org/wiki/Finite-state_machine) to manage the transitions between those\napplication states in a transaction-like manner.\n\n## Features\n\nUI-Router Core provides the following features:\n\n- State-machine based routing\n  - Hierarchical states\n  - Enter/Exit hooks\n- Name based hierarchical state addressing\n  - Absolute, e.g., `admin.users`\n  - Relative, e.g., `.users`\n- Flexible Views\n  - Nested Views\n  - Multiple Named Views\n- Flexible URLs and parameters\n  - Path, Query, and non-URL parameters\n  - Typed parameters\n    - Built in: `int`, `string`, `date`, `json`\n    - Custom: define your own encoding/decoding\n  - Optional or required parameters\n  - Default parameter values (optionally squashed from URL)\n- Transaction-like state transitions\n  - Transition Lifecycle Hooks\n  - First class async support\n\n## Get Started\n\nGet started using one of the existing UI-Router projects:\n\n- [UI-Router for Angular 1](https://ui-router.github.io/ng1)\n- [UI-Router for Angular 2](https://ui-router.github.io/ng2)\n- [UI-Router for React](https://ui-router.github.io/react)\n\n## Build your own\n\nUI-Router core can be used implement a router for any web-based component framework.\nThere are four basic things to build for a specific component framework:\n\n### UIView\n\nA UIView is a component which acts as a viewport for another component, defined by a state.\nWhen the state is activated, the UIView should render the state's component.\n\n### UISref (optional, but useful)\n\nA `UISref` is a link (absolute, or relative) which activates a specific state and/or parameters.\nWhen the `UISref` is clicked, it should initiate a transition to the linked state.\n\n### UISrefActive (optional)\n\nWhen combined with a `UISref`, a `UISrefActive` toggles a CSS class on/off when its `UISref` is active/inactive.\n\n### Integrate with your framework's bootstrap mechanism (optional)\n\nImplement framework specific bootstrap requirements, if any.\nFor example, UI-Router for Angular 1 and Angular 2 integrates with the ng1/ng2 Dependency Injection lifecycles.\nOn the other hand, UI-Router for React uses a simple JavaScript based bootstrap, i.e., `new UIRouterReact().start();`.\n\n### Minimal Example\n\nThis example doesn't have UIView, UISref, or anything like that.\nIt bootstrap the router and naively manipulates the DOM when states are activated.\n\nhttps://stackblitz.com/edit/ui-router-plain-javascript?file=index.js\n\nNote: do not model your own router off this example, it is meant to show only the bare minimum.\n\n## Getting help\n\n[Create an issue](https://github.com/ui-router/core/issues) or contact us on [Gitter](https://gitter.im/angular-ui/ui-router).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fui-router%2Fcore","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fui-router%2Fcore","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fui-router%2Fcore/lists"}