{"id":15099466,"url":"https://github.com/substrate-system/icons","last_synced_at":"2025-10-24T05:51:53.495Z","repository":{"id":247019983,"uuid":"824832214","full_name":"substrate-system/icons","owner":"substrate-system","description":"Web component icons","archived":false,"fork":false,"pushed_at":"2025-04-09T16:34:46.000Z","size":109,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-09T17:43:06.743Z","etag":null,"topics":["component","icons","web","webcomponents"],"latest_commit_sha":null,"homepage":"https://substrate-system.github.io/icons/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/substrate-system.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"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":"2024-07-06T04:31:05.000Z","updated_at":"2025-04-09T16:34:50.000Z","dependencies_parsed_at":"2024-11-24T22:18:43.269Z","dependency_job_id":"77c0be52-0387-4a16-a07c-5c12e5cfd60f","html_url":"https://github.com/substrate-system/icons","commit_stats":{"total_commits":29,"total_committers":2,"mean_commits":14.5,"dds":0.06896551724137934,"last_synced_commit":"9dc0339d87982edcbd76904c054f760658be343b"},"previous_names":["substrate-system/icons"],"tags_count":24,"template":false,"template_full_name":"substrate-system/template-web-component","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/substrate-system%2Ficons","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/substrate-system%2Ficons/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/substrate-system%2Ficons/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/substrate-system%2Ficons/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/substrate-system","download_url":"https://codeload.github.com/substrate-system/icons/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248974646,"owners_count":21192186,"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":["component","icons","web","webcomponents"],"created_at":"2024-09-25T17:21:25.649Z","updated_at":"2025-10-24T05:51:53.490Z","avatar_url":"https://github.com/substrate-system.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# icons\n[![tests](https://img.shields.io/github/actions/workflow/status/substrate-system/icons/nodejs.yml?style=flat-square)](https://github.com/substrate-system/icons/actions/workflows/nodejs.yml)\n[![types](https://img.shields.io/npm/types/@substrate-system/icons?style=flat-square)](README.md)\n[![module](https://img.shields.io/badge/module-ESM%2FCJS-blue?style=flat-square)](README.md)\n[![semantic versioning](https://img.shields.io/badge/semver-2.0.0-blue?logo=semver\u0026style=flat-square)](https://semver.org/)\n[![install size](https://flat.badgen.net/packagephobia/install/@substrate-system/icons?cache-control=no-cache)](https://packagephobia.com/result?p=@substrate-system/icons)\n[![GZip size](https://flat.badgen.net/bundlephobia/minzip/@substrate-system/icons)](https://bundlephobia.com/package/@substrate-system/icons)\n[![license](https://img.shields.io/badge/license-Big_Time-blue?style=flat-square)](LICENSE)\n\n\nIcons as web components.\n\n**See [a live demonstration](https://substrate-system.github.io/icons/)**.\n\n\u003cdetails\u003e\u003csummary\u003e\u003ch2\u003eContents\u003c/h2\u003e\u003c/summary\u003e\n\n\u003c!-- toc --\u003e\n\n- [Install](#install)\n- [Components](#components)\n- [Modules](#modules)\n  * [ESM](#esm)\n  * [Common JS](#common-js)\n- [Use](#use)\n  * [SSR](#ssr)\n  * [Define](#define)\n  * [JS](#js)\n  * [Attributes](#attributes)\n  * [HTML](#html)\n  * [Pre-built JS](#pre-built-js)\n- [See Also](#see-also)\n- [Credits](#credits)\n\n\u003c!-- tocstop --\u003e\n\n\u003c/details\u003e\n\n## Install\n\n```sh\nnpm i -S @substrate-system/icons\n```\n\n## Components\n\nVisible in the [src folder](./src/), the filename corresponds to the default\ncomponent name.\n\n[See the demo page](https://substrate-system.github.io/icons/) for a list of\nall components with names.\n\n* `@substrate-system/icons/eye-regular`\n* `@substrate-system/icons/eye-slash`\n* `@substrate-system/icons/edit-square`\n* `@substrate-system/icons/edit-pencil`\n* `@substrate-system/icons/save-cloud`\n* `@substrate-system/icons/log-out`\n* `@substrate-system/icons/new-tab`\n* `@substrate-system/icons/heart-outline`\n* `@substrate-system/icons/github-logo`\n\n\n## Modules\n\nThis exposes ESM and common JS via [package.json `exports` field](https://nodejs.org/api/packages.html#exports).\n\n### ESM\n```js\nimport '@substrate-system/icons/eye-regular'\n```\n\n### Common JS\n```js\nrequire('@substrate-system/icons/eye-regular')\n```\n\n## Use\nIn the interest of interoperability, **we do not define any components**, you\nwill need to call `customElements.define('component-name', ComponentClass)`\nyourself:\n\n```js\nimport { EditSquare } from '@substrate-system/icons'\n\ncustomElements.define('component-name', EditSquare)\n```\n\n### SSR\nServer-side render by importing from the path `/ssr`.\n\n```js\nimport { githubLogo } from '@substrate-system/icons/ssr'\n\n// this is a function that returns a string\nconst html = githubLogo()\n```\n\n### Define\n\nCall the helper function, `define`:\n```js\nimport { define } from '@substrate-system/icons'\n\n// this will load and register all components,\n// using the default component names\ndefine()\n```\n\nOr register components individually, with the default names:\n```js\nimport { define } from '@substrate-system/icons/edit-pencil'\n\n// this will register with the default component name, 'edit-pencil'\ndefine()\n```\n\nSee [the `isRegistered`](https://github.com/substrate-system/web-component#isregistered)\nhelper function in `@substrate/web-component` for help with name collisions.\n\n### JS\n```js\nimport '@substrate-system/icons/eye-regular'\n```\n\n### Attributes\n\nPass in a `title` attribute to change the `svg` title. If `title` is omitted,\nit will render with a default `title`.\n\n### HTML\n```html\n\u003cdiv\u003e\n    \u003ceye-regular title=\"See something\"\u003e\u003c/eye-regular\u003e\n\u003c/div\u003e\n```\n\n### Pre-built JS\nThis package exposes minified JS files too. Copy them to a location that is\naccessible to your web server, then link to them in HTML.\n\n#### Copy\n```sh\ncp ./node_modules/@substrate-system/icons/dist/eye-regular.min.js ./public\n```\n\n#### HTML\n```html\n\u003cscript type=\"module\" src=\"./eye-regular.min.js\"\u003e\u003c/script\u003e\n```\n\n## See Also\n\n* [Accessible SVG Icons](https://css-tricks.com/accessible-svg-icons/)\n* [Accessible Icon Buttons](https://www.sarasoueidan.com/blog/accessible-icon-buttons/)\n* [Inclusively Hidden](https://www.scottohara.me/blog/2017/04/14/inclusively-hidden.html)\n\n## Credits\n\nThese icons come from the free SVG files of [fontawesome](https://fontawesome.com/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsubstrate-system%2Ficons","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsubstrate-system%2Ficons","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsubstrate-system%2Ficons/lists"}