{"_id":"@blissds/iconsets","_rev":"1-3d22a87874a3de95e1ab750b4b65f52c","name":"@blissds/iconsets","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@blissds/iconsets","version":"0.0.1","description":"Iconsets for the Bliss Design System","keywords":["bliss","design system","icon","icons","iconset"],"license":"MIT","type":"module","main":"index.js","publishConfig":{},"scripts":{"build:optimize":"svgo -q --config=./svgo.yml -i ./src/icons/original -o ./src/icons/optimized --pretty --indent=2","build:rename":"node ./src/commands.js rename","build:list":"node ./src/commands.js list","build:entry":"node ./src/commands.js entry","build":"run-s build:* && yarn clean:optimized","clean:optimized":"rm -rf src/icons/optimized","clean:entry":"rm ./bliss-iconset.js","clean":"run-s clean:*","test":"NODE_OPTIONS=--experimental-vm-modules jest"},"dependencies":{},"devDependencies":{"cheerio":"^1.0.0-rc.5","husky":"^4.3.7","jest":"^26.6.3","npm-run-all":"^4.1.5","svgo":"^1.3.2","yargs":"^16.2.0"},"husky":{"hooks":{"pre-commit":"run-s test clean build"}},"gitHead":"7a5c1553b9957287f5abf9e5a9f0cc2d29c99e58","_id":"@blissds/iconsets@0.0.1","_nodeVersion":"14.15.1","_npmVersion":"6.14.8","dist":{"integrity":"sha512-kb5U6shFdyTpwnZtIFaIrCYJBl57lOKV88OvMacs+iMqowIuWLQSWqJ8d9v/I+qP9mqBYiLoDlo7o70XAHzxPA==","shasum":"ef2b01bf4cc4d9a71cb6e34c7a38c5250de4fe67","tarball":"https://registry.npmjs.org/@blissds/iconsets/-/iconsets-0.0.1.tgz","fileCount":5,"unpackedSize":59904,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf/XExCRA9TVsSAnZWagAA0zkP/jo4pAGqB+A0bVji6Hie\nm1J2AT2KD6ZwFbzCLukzREa7/X6OIp+7gcZdM6GmrvVZYKp4+CzGvhuBvr9S\nMGZj7/s1epVKwpRGlE8Sd+bsF4xdWrPnnHMBxhLIiHCQkidl6P4uIkKb2NpN\nqTNoeVouqps794SIkgZWJMOKDjTWqDba4dV2R+o7qXCw1Isw5wQ1/b4QJgy/\nSybEmLPmJ8D7GGV7vVj8py0vaSYgJIz7RjtMWgT5Soq/QrXF05vmoVfHBxmD\n273UG07J0sQracj+9hU8R/dn4X+UQTzCP2PgM59TvKTuDQkuC3YiNy/wSNlb\nPz3BCVO29YdJL4j6wHGDVCle1KwVP+cP9HfL7gPmu8UxUFDdXiFPewniH2bl\nlPAK0egC+zEq2q+wOqaufQkGTzZHlQ2cLB6FZJG7XXGIHNHOusLd7tBnXaeK\ndCTjQbEVFIAWzSF+ChYN2vakH/7P9wO+xjI2GPW9LmJ2FdCAkf3Bvmn/JiR6\ngA83uKM4TUzqPx1uA22qkaXSzTaSYbm0/k92pDcgZa7B/O388KVAZQ6NfB8T\nM6/TMb2GTuEUEfpwfKJz+NA82jjYpY779KHBFQT24VGmeOuM8Tj9kt0LJ8pa\nkXM38S/PtilnuvYatTlVwJSmb+4fzVvDWLdMtNDzESTsPGEcwd2YGwii1B1Y\nUohH\r\n=Pd4P\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDONg01ZWVw6FDJjeehpax5tXkx2d5Ce/PsArXSQXc9wAIhAIOY4lPHyp6Ra4ZaVwuWo/b9JgmwLQFltpXDThR1deOR"}]},"_npmUser":{"name":"bryter_bliss","email":"vonkoss@bryter.io"},"directories":{},"maintainers":[{"name":"bryter_bliss","email":"vonkoss@bryter.io"},{"name":"coolcut","email":"jan@fruechtl.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/iconsets_0.0.1_1610445104577_0.9343054952275167"},"_hasShrinkwrap":false}},"time":{"created":"2021-01-12T09:51:44.322Z","0.0.1":"2021-01-12T09:51:44.737Z","modified":"2022-04-04T19:35:11.439Z"},"maintainers":[{"name":"bryter_bliss","email":"vonkoss@bryter.io"},{"name":"coolcut","email":"jan@fruechtl.me"}],"description":"Iconsets for the Bliss Design System","keywords":["bliss","design system","icon","icons","iconset"],"license":"MIT","readme":"# Bliss Iconsets\n\nThe home of all Bliss icons\n\n⚠️ This is **NOT** a component, this the definitive collection of icons designed for Bryter, and as such should be the source of truth regarding the latest icons available for use according to Figma designs. There is an [icon component](https://gitlab.com/ryter/bliss/components/icon) that has been created to consume these icons individually.\n\n## Table of Contents\n  - [Icons](#ℹ%EF%B8%8F-icons)  \n  - [Usage](#-usage)  \n  - [Contributing](#-contributing)  \n    - [Adding a new icon](#-adding-a-new-icon)  \n  - [Troubleshooting](#-troubleshooting)\n\n## ℹ️ Icons \n\nThis repository exists as a single source of truth for Bliss icons, from a design and a development perspective.\n\nAs it stands, this repository makes a single sprite available for consuming applications, which attaches itself to the application's DOM on initialization. More on that in the [Usage](#-usage) section.\n\nThough it is in its initial stages, the proposal is for the concept of iconsets to be explored so that different applications can consume only the icons they need.\n\nAt the moment, there is only one iconset which encompasses all available icons, so further breakdowns are up for discussion in a future version.\n\n## 🚧 Usage \n\nIn order to get the icons sprite, you _might_ need to set your `yarn` or `npm` config to use your personal access token:\n\nnpm:\n```\nnpm config set @ryter:registry https://gitlab.com/api/v4/projects/18620577/packages/npm/\nnpm config set '//gitlab.com/api/v4/projects/18620577/packages/npm/:_authToken' \"<your_token>\"\n```\n\nnpm:\n```\nyarn config set '//gitlab.example.com/api/v4/projects/18620577/packages/npm/:_authToken' \"<your_token>\"\nyarn config set '//gitlab.example.com/api/v4/packages/npm/:_authToken' \"<your_token>\"\n```\n\nThen, install the package in the root of your client-facing application:\n```\nyarn add @ryter/bliss-iconsets\n\n//or\n\nnpm install @ryter/bliss-iconsets\n```\n\nAnd within you application's client-facing entry file, you can request the sprite like this:\n```\nimport '@ryter/bliss-iconsets/bliss-icons.js';\n```\n\nSo when your app launches, the sprite will attach itself.\n\n### But what's really happening?\nThis repository holds the original Bliss icons. It is regularly kept up to date as new icons are added or removed, through the `build` command in the root `package.json`.\n\nThis command will clean up the folder structure, optimize the existing icons, and convert them into a JS file that contains the final sprite. This file _also_ attaches the sprite to the DOM when requested.\n\nAs previously mentioned, the current iconset is composed of **all** available icons, meaning they will all be attached as `<symbol>`s within an `<svg>`.\n\nThis means that they will be available to any part of the application code that interacts with that application's DOM, but we **strongly recommend consuming them through the [`bliss-icon` Component](https://gitlab.com/ryter/bliss/components/icon/readme.md)**\n\n## 🛠 Contributing \n\nAs this a proof of concept, the best way to contribute is to implement and play. We're aiming to find out how to best serve consistent iconography, and want to be as performant as possible about it.\n### ➕ Adding a new Icon \n\nIf you would like to add a new icon, run the following:\n```\ngit clone git@gitlab.com:ryter/bliss/iconsets.git\ncd iconsets/\nyarn\n```\nThen you can add the new icon file to `src/icons/original`. When you commit (via the command line!), `husky` will run a pre-commit hook to optimize, rename and rebuild the sprite and icon name list.\n\nYou'll need to update the version of the package in the `package.json`, and we recommend the following:\n- If you are **updating** an icon, this qualifies as a patch version (`v.1.0.0 => v1.0.1`)\n- If you are **adding** an icon, this qualifies as a minor version (`v1.0.0 => v1.1.0`)\n\n⚠️ If you are **removing** an icon, please speak with us, as this will qualify as a major version and involves a breaking change.\n\nFinally, open an MR with a screenshot of the new icon, or a before and after of a changed icon, with some information about the reasoning behind this change.\n\n## 🤔 Troubleshooting \n\nWe'll fill this section out as we go, but please get in touch with [#unit_bliss](slack://bryterworkspace.slack.com/archives/CLBTUEQ5P) 🙏✨\n","readmeFilename":"README.md"}