{"id":29636745,"url":"https://github.com/workleap/wl-design-systems-migrations","last_synced_at":"2025-07-21T17:34:21.722Z","repository":{"id":294526950,"uuid":"984784845","full_name":"workleap/wl-design-systems-migrations","owner":"workleap","description":"Codemods to assist design system migrations and analysis. Orbiter to Hopper, Igloo to Hopper, or Hopper usage analysis","archived":false,"fork":false,"pushed_at":"2025-06-30T17:20:39.000Z","size":4431,"stargazers_count":1,"open_issues_count":1,"forks_count":0,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-06-30T17:45:19.686Z","etag":null,"topics":["wl-frontend"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/workleap.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-16T13:58:29.000Z","updated_at":"2025-06-30T16:43:07.000Z","dependencies_parsed_at":"2025-05-20T21:58:06.985Z","dependency_job_id":"740a8f2f-d790-41ca-a778-776e16a60a34","html_url":"https://github.com/workleap/wl-design-systems-migrations","commit_stats":null,"previous_names":["workleap/orbiter-to-hopper-codemods","workleap/wl-design-systems-migrations"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/workleap/wl-design-systems-migrations","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workleap%2Fwl-design-systems-migrations","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workleap%2Fwl-design-systems-migrations/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workleap%2Fwl-design-systems-migrations/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workleap%2Fwl-design-systems-migrations/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/workleap","download_url":"https://codeload.github.com/workleap/wl-design-systems-migrations/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workleap%2Fwl-design-systems-migrations/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266342809,"owners_count":23914262,"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","status":"online","status_checked_at":"2025-07-21T11:47:31.412Z","response_time":64,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"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":["wl-frontend"],"created_at":"2025-07-21T17:34:19.683Z","updated_at":"2025-07-21T17:34:21.705Z","avatar_url":"https://github.com/workleap.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Design Systems Migrations Tools \u003c!-- omit in toc --\u003e\n\nThis tool automates the migration of components between design systems. Currently supports migration from [Orbiter](https://github.com/workleap/wl-orbiter) to [Hopper](https://github.com/workleap/wl-hopper), with extensible architecture for other design system migrations.\n\n**Key Features:**\n\n- ✅ **Automated component migrations** - Updates import statements and component names\n- ✅ **Property transformations** - Maps old properties to new equivalents\n- ✅ **Migration analysis** - Generates usage reports and migration guidance\n- ✅ **Extensible mappings** - Support for multiple design system migrations\n\n## Table of contents \u003c!-- omit in toc --\u003e\n\n- [Quick Start](#quick-start)\n  - [Using the CLI (Recommended)](#using-the-cli-recommended)\n  - [Orbiter to Hopper Migration Example](#orbiter-to-hopper-migration-example)\n- [Usage Examples](#usage-examples)\n  - [Migrate All Components](#migrate-all-components)\n  - [Migrate by Category](#migrate-by-category)\n  - [Migrate Specific Components](#migrate-specific-components)\n  - [Target Specific Path](#target-specific-path)\n- [Usage Analysis](#usage-analysis)\n- [Contributing](#contributing)\n\n## Quick Start\n\n### Using the CLI (Recommended)\n\nThe easiest way to run migrations is using our CLI tool:\n\n```bash\n# Run directly with pnpx (no installation required)\npnpx @workleap/migrations\n```\n\nThe CLI automatically:\n\n- Clones the latest migration repository\n- Runs the migrations with your specified options\n- Cleans up temporary files\n\nFor more CLI options:\n\n```bash\npnpx @workleap/migrations --help\n```\n\n### Orbiter to Hopper Migration Example\n\nBefore:\n\n```tsx\nimport { Div } from \"@workleap/orbiter-ui\";\n\nexport function App() {\n  return \u003cDiv width=\"100px\"/\u003e;\n}\n```\n\nAfter:\n\n```tsx\nimport { Div } from \"@hopper-ui/components\";\n\nexport function App() {\n  return \u003cDiv UNSAFE_width=\"100px\"/\u003e;\n}\n```\n\n## Usage Examples\n\nThe default mapping table is set for Orbiter to Hopper. If you want to run it for other mappings, you need to set it through the `mappings` parameter.  \n\n### Migrate All Components\n\n```bash\npnpx @workleap/migrations\n```\n\n### Migrate by Category\n\n```bash\n# Migrate layout components (Flex, Grid, Div, etc.)\npnpx @workleap/migrations -c layout\n\n# Migrate button components\npnpx @workleap/migrations -c buttons\n\n# Other categories: visual, menu, overlay, tags, disclosure\n```\n\n### Migrate Specific Components\n\n```bash\n# Single component\npnpx @workleap/migrations -c Div\n\n# Multiple components\npnpx @workleap/migrations -c Div,Text,Button\n```\n\n### Target Specific Path\n\nRun the command in the desire path or pass the target path with the `-t` argument.\n\n```bash\npnpx @workleap/migrations -t /app/users\n```\n\n## Usage Analysis\n\nGenerate usage reports to understand your migration scope:\n\n```bash\n# Basic analysis\npnpx @workleap/migrations analyze \n\n# Detailed analysis with file locations\npnpx @workleap/migrations analyze --deep true\n\n# Project-specific analysis\npnpx @workleap/migrations analyze --project frontend-team\n\n# Using hopper mappings for analysis\npnpx @workleap/migrations analyze --mappings hopper\n\n# Analyze unmapped components only\npnpx @workleap/migrations analyze --filter-unmapped components\n```\n\n**Key Parameters:**\n\n| Parameter | Description | Example |\n|-----------|-------------|---------|\n| `-c \u003ccomponents\u003e` | Specify components to migrate | `-c layout` or `-c Div,Text` |\n| `-t \u003cpath\u003e` | Target specific path | `-t /app/users` |\n| `--project \u003cname\u003e` | Track usage by project/team. It is pretty useful when you analysis multiple repos and want to aggregate analysis results. | `--project frontend-team` |\n| `--mappings \u003ctype\u003e` | Specify mapping table (`orbiter-to-hopper` (default) or `hopper`) | `--mappings hopper` |\n| `--deep true` | Include file locations | `--deep true` |\n| `--filter-unmapped \u003ctype\u003e` | Show only unmapped items | `--filter-unmapped props` |\n| `analyze` | Pass it as first argument to analyze. Otherwise, it runs migrations | `N/A` |\n\n**Sample Analysis Output:**\n\n```json\n{\n  \"overall\": {\n    \"usage\": {\n      \"components\": 15,\n      \"componentProps\": 45,\n      \"functions\": 3,\n      \"types\": 8\n    }\n  },\n  \"components\": {\n    \"Text\": {\n      \"usage\": {\n        \"total\": 25,\n        \"projects\": {\n          \"frontend-team\": 15,\n          \"mobile-app\": 10\n        }\n      },\n      \"props\": {\n        \"size\": {\n          \"usage\": 20,\n          \"values\": {\n            \"lg\": { \"usage\": { \"total\": 12 } },\n            \"md\": { \"usage\": { \"total\": 8 } }\n          }\n        }\n      }\n    },\n    \"Button\": {\n      \"usage\": {\n        \"total\": 18,\n        \"projects\": { \"frontend-team\": 18 }\n      }\n    }\n  },\n  \"functions\": {\n    \"useResponsive\": {\n      \"usage\": {\n        \"total\": 8,\n        \"projects\": {\n          \"frontend-team\": 5,\n          \"mobile-app\": 3\n        }\n      },\n      \"values\": {\n        \"useResponsive()\": {\n          \"usage\": { \"total\": 8 }\n        }\n      }\n    }\n  },\n  \"types\": {\n    \"ComponentProps\": {\n      \"usage\": {\n        \"total\": 12,\n        \"projects\": {\n          \"frontend-team\": 8,\n          \"mobile-app\": 4\n        }\n      }\n    }\n  }\n}\n```\n\n## Contributing\n\nTo add support for other design system migrations or contribute to existing ones, see [CONTRIBUTING.md](CONTRIBUTING.md) for detailed guidelines.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fworkleap%2Fwl-design-systems-migrations","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fworkleap%2Fwl-design-systems-migrations","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fworkleap%2Fwl-design-systems-migrations/lists"}