{"id":16809549,"url":"https://github.com/bemit/icon1","last_synced_at":"2025-04-05T09:20:25.168Z","repository":{"id":57117401,"uuid":"432495157","full_name":"bemit/icon1","owner":"bemit","description":"Open Source icon API and picker with pluggable icon providers.","archived":false,"fork":false,"pushed_at":"2022-06-09T09:48:02.000Z","size":1965,"stargazers_count":1,"open_issues_count":5,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-11T18:54:49.366Z","etag":null,"topics":["icon-api","icon-picker","icons","material-icons","material-ui","mui","simple-icons"],"latest_commit_sha":null,"homepage":"https://icon1.bemit.codes","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/bemit.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":"2021-11-27T15:20:37.000Z","updated_at":"2022-06-09T16:03:43.000Z","dependencies_parsed_at":"2022-08-23T04:40:35.769Z","dependency_job_id":null,"html_url":"https://github.com/bemit/icon1","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bemit%2Ficon1","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bemit%2Ficon1/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bemit%2Ficon1/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bemit%2Ficon1/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bemit","download_url":"https://codeload.github.com/bemit/icon1/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247312889,"owners_count":20918526,"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":["icon-api","icon-picker","icons","material-icons","material-ui","mui","simple-icons"],"created_at":"2024-10-13T10:13:12.978Z","updated_at":"2025-04-05T09:20:25.148Z","avatar_url":"https://github.com/bemit.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Icon1\n\n[![Github actions Build](https://github.com/bemit/icon1/actions/workflows/blank.yml/badge.svg)](https://github.com/bemit/icon1/actions)\n[![codecov](https://codecov.io/gh/bemit/icon1/branch/master/graph/badge.svg?token=BZMO06J5U3)](https://codecov.io/gh/bemit/icon1)\n![Typed](https://flat.badgen.net/badge/icon/Typed?icon=typescript\u0026label\u0026labelColor=blue\u0026color=555555)\n\nOpen-Source Icon API and Picker.\n\nAPI with pluggable icon providers, ready to host on e.g. Google Cloud Functions, see [DEPLOY.md](DEPLOY.md).\n\nPackages:\n\n- [![npm (scoped)](https://img.shields.io/npm/v/@icon1/core?style=flat-square)](https://www.npmjs.com/package/@icon1/core) `@icon1/core`: plain JS API connectors + typings\n- [![npm (scoped)](https://img.shields.io/npm/v/@icon1/react?style=flat-square)](https://www.npmjs.com/package/@icon1/react) `@icon1/react`: reusable API hooks, icon provider, and icon embed component\n- [![npm (scoped)](https://img.shields.io/npm/v/@icon1/mui?style=flat-square)](https://www.npmjs.com/package/@icon1/mui) `@icon1/mui`: [Material-UI](https://github.com/mui-org/material-ui) based icon picker\n\n## API\n\nReady and CDN-enabled: [icon1.bemit.codes](https://icon1.bemit.codes)\n\n\u003e ⚠️ **Currently** there are no usage restrictions, depending on the actual occurring costs this may change anytime.\n\u003e\n\u003e To be safe, host it on your own.\n\n### Endpoints\n\n- `/icons` returns all available provider\n    - result: `{provider: []}`\n- `/icons/{provider}` returns all available icons in that provider\n    - result: `{icons: []}`\n    - each icon in the list contains the same data as for `/icon`, except the `svg` code\n- `/icon/{provider}/{icon}` returns one specific icon as JSON\n    - query params:\n        - `variant`: optional variant, if supported by provider/icon\n        - `color`: optional color, use 6 digits hex (without `#`)\n    - minimum result:\n      ```typescript\n      interface Result {\n          icon: {\n              id: string\n              title: string\n              data: string\n          }\n      }\n      ```\n    - for plain SVG just add `.svg` at the end\n        - `/icon/{provider}/{icon}.svg` returns one specific icon as SVG\n\n#### Example Icon Data\n\n`/icon/material-ui/alarm_add`:\n\n- supports `variants`\n\n```json\n{\n    \"icon\": {\n        \"id\": \"alarm_add\",\n        \"title\": \"Alarm Add\",\n        \"data\": \"\u003csvg xmlns=\\\"http://www.w3.org/2000/svg\\\" viewBox=\\\"0 0 24 24\\\"\u003e\u003cpath d=\\\"M7.88 3.39 6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9a9 9 0 0 0 0-18zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7zm1-11h-2v3H8v2h3v3h2v-3h3v-2h-3V9z\\\"/\u003e\u003c/svg\u003e\",\n        \"variants\": [\n            \"outlined\",\n            \"round\",\n            \"sharp\",\n            \"two-tone\"\n        ]\n    }\n}\n```\n\n`/icon/simple-icons/3m`:\n\n- does not support `variants`\n- includes `source` of icon\n- includes `colorDefault` of brand\n\n```json\n{\n    \"icon\": {\n        \"id\": \"3m\",\n        \"title\": \"3M\",\n        \"data\": \"\u003csvg role=\\\"img\\\" viewBox=\\\"0 0 24 24\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\"\u003e\u003ctitle\u003e3M\u003c/title\u003e\u003cpath d=\\\"M18.903 5.954L17.17 13.03l-1.739-7.076h-5.099v2.613C9.72 6.28 7.56 5.706 5.558 5.674 3.12 5.641.563 6.701.469 9.936h3.373c0-.977.747-1.536 1.588-1.523 1.032-.008 1.508.434 1.533 1.124-.036.597-.387 1.014-1.525 1.014H4.303V12.9h1.03c.584 0 1.399.319 1.431 1.155.04.995-.652 1.435-1.501 1.443-1.517-.053-1.763-1.225-1.763-2.23H0c.015.677-.151 5.091 5.337 5.059 2.629.025 4.464-1.085 5.003-2.613v2.342h3.455v-7.632l1.867 7.634h3.018l1.875-7.626v7.634H24V5.954h-5.097zm-8.561 7.06c-.429-.893-1.034-1.284-1.376-1.407.714-.319 1.09-.751 1.376-1.614v3.021z\\\"/\u003e\u003c/svg\u003e\",\n        \"source\": \"https://www.3m.com/\",\n        \"colorDefault\": \"#FF0000\"\n    }\n}\n```\n\n### Build Icon Lists\n\nBuild an index of all icons in the providers, is used by `/icons/{provider}` to return all available provider icons.\n\n\u003e needs an already built api\n\n```shell\ncd packages/icon1-api\nnode build/cli build-icon-list\n```\n\n\u003e todo: currently hard coded in [`packages/icon1-api/src/icon1/iconListMaker.ts`](./packages/icon1-api/src/icon1/iconListMaker.ts) and is not dynamically using providers\n\n## `@icon1/core`\n\nBasic package with universal typings and a `fetch` based API connector.\n\n```typescript\nimport { Icon1Icon, Icon1IconDetails, Icon1ListBuilt } from '@icon1/core/Icon1Types'\nimport { Icon1Loader } from '@icon1/core/Icon1Loader'\n\nconst api = 'http://localhost:3030'\nIcon1Loader.loadIcon(api, 'simple-icons', '3m', undefined).then(r =\u003e console.log(r))\nIcon1Loader.loadIcons(api, 'simple-icons').then(r =\u003e console.log(r))\n```\n\n## `@icon1/react`\n\nBasic package for React with provider, hooks and special embed.\n\n```typescript\nimport { Icon1Embed } from '@icon1/react/Icon1Embed'\nimport { Icon1Provider, useIcon1 } from '@icon1/react/Icon1Provider'\nimport { IconEmbed } from '@icon1/react/IconEmbed'\nimport { useIcon1Loader } from '@icon1/react/useIcon1Loader'\nimport { withIcon } from '@icon1/react/withIcon'\nimport { Icon1Loader } from '@icon1/core/Icon1Loader'\n```\n\n## `@icon1/mui`\n\nMaterial-UI icon picker.\n\n```typescript\nimport { Icon1Picker } from '@icon1/mui/Icon1Picker'\n```\n\n## Versions\n\nThis project adheres to [semver](https://semver.org/), until `1.0.0` and beginning with `0.1.0`: all `0.x.0` releases are like MAJOR releases and all `0.0.x` like MINOR or PATCH, modules below `0.1.0` should be considered experimental.\n\n## Develop\n\n1. Clone/fork repository\n2. `npm i`\n3. `npm run bootstrap \u0026\u0026 npm run hoist`\n4. Now run either:\n    - `npm start` for cleaning builds, hoisting, launching demo app, compilation of packages and backend\n    - `npm test` for running tests\n    - `npm run serve` for launching demo app, compilation of packages and backend\n        - requires hoisting beforehand\n    - `npm run tdd` for running tests in watch mode\n    - `npm run build` for building the demo app and packages\n\n## License\n\nThis project is free software distributed under the [**MIT License**](LICENSE).\n\n© 2022 [bemit](https://bemit.codes), [Michael Becker](https://i-am-digital.eu)\n\n### License: Icons\n\nIcons are provided by awesome other projects, integrated by default:\n\n#### Simple Icons\n\nProvided by [simpleicons.org](https://simpleicons.org) under the [CC0 1.0 Universal license](https://github.com/simple-icons/simple-icons/blob/master/LICENSE.md).\n\nPlease read their [disclaimer regarding brand use](https://github.com/simple-icons/simple-icons/blob/master/DISCLAIMER.md), if we didn't update yet to the latest version, e.g. where your icon is removed, please open an [issue in this repository](https://github.com/bemit/icon1/issues/new) to request an update.\n\n#### Material-UI\n\nMaterial design icons are created by Google.\n\nWe have made these icons available for you to incorporate into your products under the [Apache License Version 2.0](https://github.com/marella/material-design-icons/blob/main/svg/LICENSE). Feel free to remix and re-share these icons and documentation in your products. We'd love attribution in your app's about screen, but it's not required.\n\n\u003e imported using npm module [@material-design-icons/svg](https://www.npmjs.com/package/@material-design-icons/svg)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbemit%2Ficon1","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbemit%2Ficon1","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbemit%2Ficon1/lists"}