{"id":13417780,"url":"https://github.com/seanmcp/phosphor-astro","last_synced_at":"2025-04-10T13:33:16.060Z","repository":{"id":63986846,"uuid":"572325571","full_name":"SeanMcP/phosphor-astro","owner":"SeanMcP","description":"👩‍🚀 Phosphor icons as Astro components","archived":false,"fork":false,"pushed_at":"2024-07-20T10:58:52.000Z","size":333,"stargazers_count":15,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-24T12:12:43.533Z","etag":null,"topics":["astro","astrojs","icons","phosphor","phosphor-icons","phosphoricons"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/SeanMcP.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"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":"2022-11-30T02:51:51.000Z","updated_at":"2025-03-09T22:14:29.000Z","dependencies_parsed_at":"2024-10-13T01:40:50.155Z","dependency_job_id":"3b287afa-fe76-457e-98f4-7786d8ea9da2","html_url":"https://github.com/SeanMcP/phosphor-astro","commit_stats":{"total_commits":4,"total_committers":1,"mean_commits":4.0,"dds":0.0,"last_synced_commit":"86151b48f51795ed412cef01a938c6ed4840a1a6"},"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SeanMcP%2Fphosphor-astro","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SeanMcP%2Fphosphor-astro/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SeanMcP%2Fphosphor-astro/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SeanMcP%2Fphosphor-astro/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SeanMcP","download_url":"https://codeload.github.com/SeanMcP/phosphor-astro/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248225716,"owners_count":21068078,"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":["astro","astrojs","icons","phosphor","phosphor-icons","phosphoricons"],"created_at":"2024-07-30T22:00:52.545Z","updated_at":"2025-04-10T13:33:16.030Z","avatar_url":"https://github.com/SeanMcP.png","language":"JavaScript","funding_links":[],"categories":["What Do I Use..."],"sub_categories":["If I want to add icons?"],"readme":"# phosphor-astro\n\n[![npm](https://img.shields.io/npm/v/phosphor-astro.svg)](https://npmjs.com/package/phosphor-astro) [![npm](https://img.shields.io/npm/dt/phosphor-astro.svg)](https://npmjs.com/package/phosphor-astro)\n\n👩‍🚀 Phosphor icons as Astro components\n\n## Installation\n\nAdd `phosphor-astro` to your project:\n\n```sh\nnpm install phosphor-astro\n# or\nyarn add phosphor-astro\n```\n\n## Use\n\nImport the icons from `phoshor-astro` and add it to your code:\n\n```jsx\n---\nimport RocketLaunch from 'phosphor-astro/RocketLaunch.astro':\nimport ArrowRight from 'phosphor-astro/ArrowRightBold.astro':\nimport Sparkle from 'phosphor-astro/SparkleDuotone.astro':\n---\n\n\u003cp\u003e\n  \u003cRocketLaunch /\u003e\n  \u003cArrowRight /\u003e\n  \u003cSparkle /\u003e\n\u003c/p\u003e\n```\n\n## Astro components\n\nThe components exported from `phosphor-astro` are the raw `svg` elements from Phosphor with `{...Astro.props}` added to the root element. This should enable you to customize the element as you see fit.\n\n```jsx\n// Book.astro\n\u003csvg {...Astro.props} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 256 256\"\u003e\n  \u003crect width=\"256\" height=\"256\" fill=\"none\" /\u003e\n  \u003cpath\n    d=\"M48,216a23.9,23.9,0,0,1,24-24H208V32H72A23.9,23.9,0,0,0,48,56Z\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    stroke-width=\"16\"\n  /\u003e\n  \u003cpolyline\n    points=\"48 216 48 224 192 224\"\n    fill=\"none\"\n    stroke=\"#000\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    stroke-width=\"16\"\n  /\u003e\n\u003c/svg\u003e\n```\n\nAny prop that you pass to the component will be added to the top-level `svg` element:\n\n```jsx\n// Heart.astro\n\u003cHeart class=\"a few classes\" data-favorite=\"true\" id=\"id\" /\u003e\n```\n\n## License\n\n[MIT](/LIBRARY_LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fseanmcp%2Fphosphor-astro","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fseanmcp%2Fphosphor-astro","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fseanmcp%2Fphosphor-astro/lists"}