{"id":22488907,"url":"https://github.com/Mockline/mockline","last_synced_at":"2025-08-02T21:31:58.283Z","repository":{"id":212988602,"uuid":"730366219","full_name":"Mockline/mockline","owner":"Mockline","description":"Your go-to design library crafted to elevate your creative journey","archived":true,"fork":false,"pushed_at":"2025-06-01T08:33:45.000Z","size":15515,"stargazers_count":14,"open_issues_count":4,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-30T12:42:28.096Z","etag":null,"topics":["components","library","nuxt","typescript","ui","vue"],"latest_commit_sha":null,"homepage":"https://mockline.hrcd.fr","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/Mockline.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/funding.yml","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,"zenodo":null},"funding":{"github":["HugoRCD"]}},"created_at":"2023-12-11T19:09:23.000Z","updated_at":"2025-06-04T13:32:36.000Z","dependencies_parsed_at":"2023-12-20T11:21:04.613Z","dependency_job_id":"40c4ed64-cb64-4b1d-bae6-96daf80f0efd","html_url":"https://github.com/Mockline/mockline","commit_stats":{"total_commits":247,"total_committers":4,"mean_commits":61.75,"dds":"0.21862348178137647","last_synced_commit":"a548275ccb4177ee7807cd605268bdd1a3716fee"},"previous_names":["mockline/mockline"],"tags_count":23,"template":false,"template_full_name":null,"purl":"pkg:github/Mockline/mockline","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mockline%2Fmockline","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mockline%2Fmockline/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mockline%2Fmockline/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mockline%2Fmockline/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Mockline","download_url":"https://codeload.github.com/Mockline/mockline/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mockline%2Fmockline/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268456609,"owners_count":24253254,"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-08-02T02:00:12.353Z","response_time":74,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","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":["components","library","nuxt","typescript","ui","vue"],"created_at":"2024-12-06T17:18:54.625Z","updated_at":"2025-08-02T21:31:57.655Z","avatar_url":"https://github.com/Mockline.png","language":"TypeScript","funding_links":["https://github.com/sponsors/HugoRCD"],"categories":["TypeScript"],"sub_categories":[],"readme":"![Mockline Social Preview](assets/social-preview.jpg)\n\n\u003cp align=\"center\"\u003e\n  \u003ca aria-label=\"NPM version\" href=\"https://www.npmjs.com/package/mockline\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/npm/v/mockline.svg?style=for-the-badge\u0026labelColor=000000\u0026color=E0E0E0\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"License\" href=\"https://github.com/mockline/mockline/main/LICENSE\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/npm/l/mockline.svg?style=for-the-badge\u0026labelColor=000000\u0026color=212121\"\u003e\n    \u003c/a\u003e\n  \u003ca aria-label=\"Join the community on Discord\" href=\"https://discord.gg/BkgyMzvJ3p\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/badge/Join%20the%20community-F74804.svg?style=for-the-badge\u0026logo=Discord\u0026labelColor=000000\u0026logoWidth=20\u0026logoColor=white\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"Mockline logo\" href=\"https://mockline.dev/\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/MADE%20WITH%20Mockline-000000.svg?style=for-the-badge\u0026logo=Mockline\u0026labelColor=000000\u0026logoWidth=20\u0026logoColor=white\"\u003e\n  \u003c/a\u003e\n  \u003ca aria-label=\"Follow Hugo on Twitter\" href=\"https://twitter.com/HugoRCD__\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/twitter/follow/HugoRCD__.svg?style=for-the-badge\u0026labelColor=000000\u0026logo=twitter\u0026label=Follow%20Hugo\u0026logoWidth=20\u0026logoColor=white\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\nWelcome to Mockline, your go-to design library crafted to elevate your creative journey. Whether you're a seasoned designer or a budding developer, Mockline is designed to empower you with efficient, innovative, and collaborative tools, putting the joy back into the design process.\n\n## Getting Started\n\nVisit [mockline.dev](https://mockline.dev) to get started with Mockline.\n\n## Features\n\n- **Everything you need**: Mockline is a design system that provides everything you need to create stunning designs, from buttons to modals, toasts, tooltips, and more.\n  - Icons provided by [Nuxt Icon](https://github.com/nuxt-modules/icon), U can use any icon from [Lucide](https://lucide.dev/), [Heroicons](https://heroicons.com/), etc...\n  - TailwindCSS is directly integrated, so you can use all the power of TailwindCSS with zero configuration.\n  - Toasts are also provided by [Vue Sonner](https://github.com/xiaoluoboding/vue-sonner), so you can easily create beautiful toasts with ease.\n  - Themes are provided by [Color Mode](https://github.com/nuxt-modules/color-mode), so you can easily switch between light and dark modes or even create your own themes.\n  - Nuxt Content is also integrated and can be activated by setting `content: true` in the `mockline` module options.\n- **Fully customizable**: All components are customizable via props and slots.\n- **Dark mode**: Enjoy a seamless dark mode experience with no additional setup.\n- **Responsive**: Components are designed to be responsive across all devices.\n- **Easy to use**: Mockline is designed to be beginner-friendly, with a simple setup process.\n- **Community-driven**: Join the Mockline community on Discord to connect with other users and share your feedback.\n- **Open-source**: Mockline is open-source, and we welcome contributions from the community.\n\n## Quick Setup\n\nFor the moment Mockline is only available for Nuxt projects (Vue 3 support and react support will be added soon).\nTo get started, follow these steps:\n\nQuickly add Mockline to your Nuxt project using the following command:\n```bash\nnpx nuxi@latest module add mockline\n```\nIt will automatically install and set up the Mockline module in your `nuxt.config.ts` file.\n\nor\n\n1. Add `mockline` dependency to your project\n\n```bash\n# Using bun\nbun install -D mockline\n\n# Using pnpm\npnpm add -D mockline\n\n# Using yarn\nyarn add --dev mockline\n\n# Using npm\nnpm install --save-dev mockline\n```\n\n2. Add `mockline` to the `modules` section of `nuxt.config.ts`\n\n```js\nexport default defineNuxtConfig({\n  modules: [\n    'mockline'\n  ]\n})\n```\n\nThat's it! You can now use Mockline in your Nuxt app ✨\n## Community\n\nThe Mockline community can be found on Discord, to chat with other community members, you can join the [Mockline Discord](https://discord.gg/BkgyMzvJ3p).\n\n## Roadmap\n\n\n\u003cdetails\u003e\n  \u003csummary\u003eRoadmap\u003c/summary\u003e\n\n- Overlays\n  - [x] Toast\n  - [ ] Modal\n  - [ ] Tooltip\n  - [ ] Popover\n  - [ ] Slideover\n- Components\n  - [x] Button\n  - [x] Icon\n  - [ ] Input\n  - [ ] Checkbox\n  - [ ] Radio\n  - [ ] Switch\n  - [ ] Select\n  - [ ] Textarea\n  - [ ] Toggle\n  - [ ] Range\n  - [ ] Slider\n  - [ ] Progress\n  - [ ] Rating\n  - [ ] Avatar\n  - [ ] Badge\n  - [ ] Card\n  - [ ] Table\n  - [ ] Tabs\n  - [ ] Breadcrumbs\n  - [ ] Pagination\n  - [ ] Steps\n  - [ ] Tree\n  - [ ] Calendar\n  - [ ] Datepicker\n  - [ ] Timepicker\n- Layout\n  - [ ] Grid\n  - [ ] Flex\n  - [ ] Page\n  - [ ] Sidebar\n  - [ ] Drawer\n- Documentation\n  - [ ] NavigationTree\n  - [ ] Surround\n  - [ ] Toc\n- Utilities\n  - [ ] Typography\n- Themes\n  - [ ] ThemeToggle\n  - [ ] ThemeSwitch\n\n\u003c/details\u003e\n\n\u003c!-- automd:fetch url=\"gh:hugorcd/markdown/main/src/contributions.md\" --\u003e\n\n## Contributing\nTo start contributing, you can follow these steps:\n\n1. First raise an issue to discuss the changes you would like to make.\n2. Fork the repository.\n3. Create a branch using conventional commits and the issue number as the branch name. For example, `feat/123` or `fix/456`.\n4. Make changes following the local development steps.\n5. Commit your changes following the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) specification.\n6. If your changes affect the code, run tests using `bun run test`.\n7. Create a pull request following the [Pull Request Template](https://github.com/HugoRCD/markdown/blob/main/src/pull_request_template.md).\n   - To be merged, the pull request must pass the tests/workflow and have at least one approval.\n   - If your changes affect the documentation, make sure to update it.\n   - If your changes affect the code, make sure to update the tests.\n8. Wait for the maintainers to review your pull request.\n9. Once approved, the pull request will be merged in the next release !\n\n\u003c!-- /automd --\u003e\n\n\u003c!-- automd:fetch url=\"gh:hugorcd/markdown/main/src/local_development.md\" --\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eLocal development\u003c/summary\u003e\n\n- Clone this repository\n- Install latest LTS version of [Node.js](https://nodejs.org/en/)\n- Enable [Corepack](https://github.com/nodejs/corepack) using `corepack enable`\n- Install dependencies using `bun install`\n\n\u003c/details\u003e\n\n\u003c!-- /automd --\u003e\n\n\u003c!-- automd:contributors license=Apache author=HugoRCD github=\"mockline/mockline\" --\u003e\n\nPublished under the [APACHE](https://github.com/mockline/mockline/blob/main/LICENSE) license.\nMade by [@HugoRCD](https://github.com/HugoRCD) and [community](https://github.com/mockline/mockline/graphs/contributors) 💛\n\u003cbr\u003e\u003cbr\u003e\n\u003ca href=\"https://github.com/mockline/mockline/graphs/contributors\"\u003e\n\u003cimg src=\"https://contrib.rocks/image?repo=mockline/mockline\" /\u003e\n\u003c/a\u003e\n\n\u003c!-- /automd --\u003e\n\n\u003c!-- automd:with-automd lastUpdate --\u003e\n\n---\n\n_🤖 auto updated with [automd](https://automd.unjs.io) (last updated: Tue Oct 08 2024)_\n\n\u003c!-- /automd --\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FMockline%2Fmockline","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FMockline%2Fmockline","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FMockline%2Fmockline/lists"}