{"id":21361367,"url":"https://github.com/edricchan03/material-storybook","last_synced_at":"2025-07-13T02:32:15.666Z","repository":{"id":37891467,"uuid":"304904995","full_name":"EdricChan03/material-storybook","owner":"EdricChan03","description":"Storybook for Angular Material. (Based on https://github.com/amcdnl/material-storybook)","archived":false,"fork":false,"pushed_at":"2023-06-15T06:05:38.000Z","size":27232,"stargazers_count":13,"open_issues_count":6,"forks_count":2,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-05-28T18:53:09.944Z","etag":null,"topics":["angular","angular-material","storybook"],"latest_commit_sha":null,"homepage":"https://edricchan03.github.io/material-storybook","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/EdricChan03.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}},"created_at":"2020-10-17T15:11:35.000Z","updated_at":"2023-12-13T08:12:43.000Z","dependencies_parsed_at":"2023-02-14T12:16:59.057Z","dependency_job_id":null,"html_url":"https://github.com/EdricChan03/material-storybook","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdricChan03%2Fmaterial-storybook","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdricChan03%2Fmaterial-storybook/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdricChan03%2Fmaterial-storybook/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EdricChan03%2Fmaterial-storybook/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EdricChan03","download_url":"https://codeload.github.com/EdricChan03/material-storybook/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225850229,"owners_count":17534067,"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":["angular","angular-material","storybook"],"created_at":"2024-11-22T06:09:34.635Z","updated_at":"2024-11-22T06:09:35.193Z","avatar_url":"https://github.com/EdricChan03.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Material Storybook\n\nA [Storybook](https://storybook.js.org) for Angular Material.\n\nBased on [amcdnl/material-storybook](https://github.com/amcdnl/material-storybook)\nbut reworked to the ground up (as Storybook for Angular now requires an existing\nAngular project to be present) with Storybook v6 and Angular v10.\n\nView the Storybook [here](https://edricchan03.github.io/material-storybook).\n\n---\n\n## Available Components\n\nName | Has [Stories](https://storybook.js.org/docs/angular/get-started/whats-a-story)? | Has Docs Examples Stories?\n---|:---:|:---:\n[Autocomplete][mat-autocomplete] | :white_check_mark: | ~ (Form-related examples not included)\n[Badge][mat-badge] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Bottom Sheet][mat-bottom-sheet] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Button][mat-button] | :white_check_mark: | :white_check_mark:\n[Button Toggle][mat-button-toggle] | :white_check_mark: | :white_check_mark:\n[Card][mat-card] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Checkbox][mat-checkbox] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Chips][mat-chips] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Datepicker][mat-datepicker] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Dialog][mat-dialog] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Divider][mat-divider] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Expansion Panel][mat-expansion-panel] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Form Field][mat-form-field] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Grid List][mat-grid-list] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Icon][mat-icon] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Input][mat-input] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[List][mat-list] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Menu][mat-menu] | :white_check_mark: | :white_check_mark:\n[Paginator][mat-paginator] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Progress Bar][mat-progress-bar] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Progress Spinner][mat-progress-spinner] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Radio Button][mat-radio-button] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Ripples][mat-ripple] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Select][mat-select] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Sidenav][mat-sidenav] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Slide Toggle][mat-slide-toggle] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Slider][mat-slider] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Snack Bar][mat-snack-bar] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Sort Header][mat-sort-header] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Stepper][mat-stepper] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Table][mat-table] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Tabs][mat-tabs] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Toolbar][mat-toolbar] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n[Tooltip][mat-tooltip] | :negative_squared_cross_mark: | :negative_squared_cross_mark:\n\n---\n\n## Dev setup\n\nClone the project locally using the typical `git clone` command.\n\n### Run locally\n\n1. Run `npm install` in the project's root to install the project's dependencies.\n2. Run `npm run start-storybook` to generate the documentation (which currently\ndoesn't work) and to locally serve the Storybook.\n3. Fire up your browser to `localhost:6006` if the Storybook CLI did not auto-open\nthe locally-served Storybook.\n\n### Deploying the project\n\n1. Run `npm run build-storybook` to build the Storybook.\n2. The contents of the built Storybook can then be found in the generated `storybook-static` directory.\n\n## Contributing\n\nThis project follows Angular's [commit guidelines](https://github.com/angular/angular/blob/master/CONTRIBUTING.md).\n\n---\n\n## License\n\nThis project is licensed with the [MIT license](./LICENSE).\n\n\u003c!-- Links --\u003e\n\n[mat-autocomplete]: https://material.angular.io/components/autocomplete\n[mat-badge]: https://material.angular.io/components/badge\n[mat-bottom-sheet]: https://material.angular.io/components/bottom-sheet\n[mat-button]: https://material.angular.io/components/button\n[mat-button-toggle]: https://material.angular.io/components/button-toggle\n[mat-card]: https://material.angular.io/components/card\n[mat-checkbox]: https://material.angular.io/components/checkbox\n[mat-chips]: https://material.angular.io/components/chips\n[mat-datepicker]: https://material.angular.io/components/datepicker\n[mat-dialog]: https://material.angular.io/components/dialog\n[mat-divider]: https://material.angular.io/components/divider\n[mat-expansion-panel]: https://material.angular.io/components/expansion-panel\n[mat-form-field]: https://material.angular.io/components/form-field\n[mat-grid-list]: https://material.angular.io/components/grid-list\n[mat-icon]: https://material.angular.io/components/icon\n[mat-input]: https://material.angular.io/components/input\n[mat-list]: https://material.angular.io/components/list\n[mat-menu]: https://material.angular.io/components/menu\n[mat-paginator]: https://material.angular.io/components/paginator\n[mat-progress-bar]: https://material.angular.io/components/progress-bar\n[mat-progress-spinner]: https://material.angular.io/components/progress-spinner\n[mat-radio-button]: https://material.angular.io/components/radio\n[mat-ripple]: https://material.angular.io/components/ripple\n[mat-select]: https://material.angular.io/components/select\n[mat-sidenav]: https://material.angular.io/components/sidenav\n[mat-slide-toggle]: https://material.angular.io/components/slide-toggle\n[mat-slider]: https://material.angular.io/components/slider\n[mat-snack-bar]: https://material.angular.io/components/snack-bar\n[mat-sort-header]: https://material.angular.io/components/sort\n[mat-stepper]: https://material.angular.io/components/stepper\n[mat-table]: https://material.angular.io/components/table\n[mat-tabs]: https://material.angular.io/components/tabs\n[mat-toolbar]: https://material.angular.io/components/toolbar\n[mat-tooltip]: https://material.angular.io/components/tooltip\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fedricchan03%2Fmaterial-storybook","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fedricchan03%2Fmaterial-storybook","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fedricchan03%2Fmaterial-storybook/lists"}