@tls-ds/colibri-icons v0.2.3

Colibri Icon Library

This Vite repository serves as our internal icon library.

Getting Started

• Clone the Repository:

git clone https://github.com/your-username/vite-icon-library.git

• Install Dependencies:

npm install

• Start Development Server:

npm run dev

How to Use

import { ColIcon } from '@tls-ds/colibri';
window.customElements.define('col-icon', ColIcon);

function MyComponent() {
  return <col-icon name="message" color="#000" size="20px"></col-icon>;
}

The Icon component will automatically load the corresponding SVG file from the src/icons directory.

Adding a New Icon

• Create the SVG File:
  • From the shared Figma Design System, grab the monochromatic icon and export as SVG.
  • From Downloads (or the location you downloaded the SVG) update to ensure a descriptive name (e.g., my-icon.svg).
    • Make sure the name is not duplicate of an existing icon.
  • Finally place the svg file in our src/icons directory.
• How to publish
  • If you're developing locally: npm run build will generate the icon so you can import it locally
  • If you want it to be available from the '@colibri/icons' package, submit your PR adding the icon, once approved it will be merged and automatically deployed.

Contributing

We welcome contributions to this icon library. Please feel free to submit pull requests with new icons or improvements.

License

This project is licensed under the MIT License.