agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2024-12-22 01:38:56 +00:00
Code Issues Releases Activity

chore: update readme files and license years

Browse Source
This commit is contained in:
Vjacheslav Trushkin 2023-05-31 22:04:11 +03:00
parent e77a0c5ed1
commit f03056cc8c
32 changed files with 181 additions and 229 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
README.md
View File

@ -54,8 +54,8 @@ Main packages:
- [Iconify types](./packages/types/) - TypeScript types. - [Iconify types](./packages/types/) - TypeScript types.
- [Iconify utils](./packages/utils/) - common files used by various Iconify projects (including tools, API, etc...). - [Iconify utils](./packages/utils/) - common files used by various Iconify projects (including tools, API, etc...).
- [Iconify core](./packages/core/) - common files used by various icon components. - [Iconify core](./packages/core/) - common files used by icon components and plugins.
- [API redundancy](./packages/api-redundancy/) - library for managing redundancies for loading data from API: handling timeouts, rotating hosts. - [API redundancy](./packages/api-redundancy/) - library for managing redundancies for loading data from API: handling timeouts, rotating hosts. It provides fallback for loading icons if main API host is unreachable.
### Web component ### Web component
@ -186,10 +186,12 @@ See [CONTRIBUTING.md](./CONTRIBUTING.md).
## Documentation ## Documentation
Documentation for all packages is available on [Iconify documentation website](https://docs.iconify.design/icon-components/): Documentation for all packages is available on [Iconify documentation website](https://iconify.design/docs/):
- [SVG framework documentation](https://docs.iconify.design/icon-components/svg-framework/index.html). - [Types documentation](https://iconify.design/docs/types/).
- [Components documentation](https://docs.iconify.design/icon-components/components/index.html). - [Utilities documentation](https://iconify.design/docs/libraries/utils/).
- [Icon components documentation](https://iconify.design/docs/icon-components/).
- [Tailwind CSS plugin documentation](https://iconify.design/docs/usage/css/tailwind/).
## Licence ## Licence
@ -200,6 +202,6 @@ Iconify is licensed under MIT license.
Some packages of this monorepo in previous versions were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity. Some packages of this monorepo in previous versions were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity.
This licence does not apply to icons. Icons are released under different licences, see each icon set for details. This licence does not apply to icons. Icons are released under different licences, see each icon set for details.
Icons available by default are all licensed under some kind of open-source or free licence. Icons available by default are all licensed under various open-source licences.
© 2020 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2020-PRESENT Vjacheslav Trushkin

2
components/ember/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

30
components/ember/readme.md
View File

@ -11,13 +11,13 @@ Iconify icon component is nothing like that. Component does not include any icon
That means: That means:
- One syntax for over 100,000 icons from 100+ icon sets. - One syntax for over 150,000 icons from 100+ icon sets.
- Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG. - Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG.
- Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API. - Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API.
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For extended documentation visit [Iconify for Ember documentation](https://docs.iconify.design/icon-components/ember/). For extended documentation visit [Iconify for Ember documentation](https://iconify.design/docs/icon-components/ember/).
## Installation ## Installation
@ -41,19 +41,13 @@ Install `@iconify/ember` then use `IconifyIcon` component in template with icon
<IconifyIcon @icon='mdi-light:home' /> <IconifyIcon @icon='mdi-light:home' />
``` ```
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 100,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? This icon component is designed to be used with Iconify API, loading icon data on demand instead of bundling it.
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages.
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [Iconify for Ember offline use documentation](https://docs.iconify.design/icon-components/ember/offline.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/).
## Icon Names ## Icon Names
@ -68,7 +62,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [Iconify for Ember icon names documentation](https://docs.iconify.design/icon-components/ember/icon-name.html) for more detailed explanation. See [Iconify for Ember icon names documentation](https://iconify.design/docs/icon-components/ember/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -88,9 +82,9 @@ export default class IconDemoComponent extends Component {
} }
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
### Inline ### Vertical alignment
Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons. Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons.
@ -252,7 +246,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/icon-components/ember/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/icon-components/ember/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -317,12 +311,12 @@ What is the purpose of `onLoad`? To let you know when Icon component renders an
## Full documentation ## Full documentation
For extended documentation visit [Iconify for Ember documentation](https://docs.iconify.design/icon-components/ember/). For extended documentation visit [Iconify for Ember documentation](https://iconify.design/docs/icon-components/ember/).
## License ## License
Ember component is released with MIT license. Ember component is released with MIT license.
© 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2021-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses.

2
components/react/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2019 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2019-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

32
components/react/readme.md
View File

@ -11,13 +11,13 @@ Iconify icon component is nothing like that. Component does not include any icon
That means: That means:
- One syntax for over 100,000 icons from 100+ icon sets. - One syntax for over 150,000 icons from 100+ icon sets.
- Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG. - Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG.
- Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API. - Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API.
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For extended documentation visit [Iconify for React documentation](https://docs.iconify.design/icon-components/react/). For extended documentation visit [Iconify for React documentation](https://iconify.design/docs/icon-components/react/).
## Installation ## Installation
@ -47,19 +47,13 @@ Then use `Icon` component with icon name or data as "icon" parameter:
<Icon icon="mdi-light:home" /> <Icon icon="mdi-light:home" />
``` ```
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 100,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? This icon component is designed to be used with Iconify API, loading icon data on demand instead of bundling it.
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages.
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [Iconify for React offline use documentation](https://docs.iconify.design/icon-components/react/offline.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/).
## Icon Names ## Icon Names
@ -74,7 +68,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [Iconify for React icon names documentation](https://docs.iconify.design/icon-components/react/icon-name.html) for more detailed explanation. See [Iconify for React icon names documentation](https://iconify.design/docs/icon-components/react/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -89,7 +83,7 @@ function renderHomeIcon() {
} }
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
### Next.js notice ### Next.js notice
@ -109,9 +103,9 @@ import home from '@iconify/icons-mdi-light/home';
All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`. All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`.
For more details, see [icon packages documentation](https://docs.iconify.design/sources/npm/). For more details, see [icon packages documentation](https://iconify.design/docs/icons/).
## Inline icon ## Vertical alignment
Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons. Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons.
@ -301,7 +295,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/icon-components/react/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/icon-components/react/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -366,12 +360,12 @@ What is the purpose of `onLoad`? To let you know when Icon component renders an
## Full documentation ## Full documentation
For extended documentation visit [Iconify for React documentation](https://docs.iconify.design/icon-components/react/). For extended documentation visit [Iconify for React documentation](https://iconify.design/docs/icon-components/react/).
## License ## License
React component is released with MIT license. React component is released with MIT license.
© 2019 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2019-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses.

37
components/svelte/README.md
View File

@ -11,13 +11,13 @@ Iconify icon component is nothing like that. Component does not include any icon
That means: That means:
- One syntax for over 100,000 icons from 100+ icon sets. - One syntax for over 150,000 icons from 100+ icon sets.
- Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG. - Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG.
- Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API. - Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API.
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For extended documentation visit [Iconify for Svelte documentation](https://docs.iconify.design/icon-components/svelte/). For extended documentation visit [Iconify for Svelte documentation](https://iconify.design/docs/icon-components/svelte/).
## Installation ## Installation
@ -47,19 +47,22 @@ Then use component with icon data as "icon" parameter:
<Icon icon="mdi-light:home" /> <Icon icon="mdi-light:home" />
``` ```
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 100,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? This icon component is designed to be used with Iconify API, loading icon data on demand instead of bundling it.
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages. ## Web component
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [Iconify for Svelte offline use documentation](https://docs.iconify.design/icon-components/svelte/offline.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/). If you are experiencing issues with SSR hydration, there is an alternative solution available: [Iconify Icon web component](https://iconify.design/docs/iconify-icon/).
Web component is preferred to this component if:
- Your page is performing slowly. Web component separates icon rendering in shadow DOM, improving performance.
- You are experiencing CSS conflicts.
## Icon Names ## Icon Names
@ -74,7 +77,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [Iconify for Svelte icon names documentation](https://docs.iconify.design/icon-components/svelte/icon-name.html) for more detailed explanation. See [Iconify for Svelte icon names documentation](https://iconify.design/docs/icon-components/svelte/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -89,7 +92,7 @@ function renderHomeIcon() {
} }
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
### ES / CommonJS packages ### ES / CommonJS packages
@ -109,9 +112,9 @@ import home from '@iconify/icons-mdi-light/home';
All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`. All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`.
For more details, see [icon packages documentation](https://docs.iconify.design/sources/npm/). For more details, see [icon packages documentation](https://iconify.design/docs/icons/).
## Inline icon ## Vertical alignment
Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons. Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons.
@ -291,7 +294,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/icon-components/svelte/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/icon-components/svelte/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -401,12 +404,12 @@ Instead of using `<Icon />`, you must use `<svelte:component />` to make sure co
## Full documentation ## Full documentation
For extended documentation visit [Iconify for Svelte documentation](https://docs.iconify.design/icon-components/svelte/). For extended documentation visit [Iconify for Svelte documentation](https://iconify.design/docs/icon-components/svelte/).
## License ## License
The Svelte component is released with MIT license. The Svelte component is released with MIT license.
© 2020 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2020-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses.

2
components/svelte/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2020 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2020-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

70
components/svg-framework/README.md
View File

@ -3,7 +3,7 @@
Iconify is the most versatile icon framework. Iconify is the most versatile icon framework.
- Unified icon framework that can be used with any icon library. - Unified icon framework that can be used with any icon library.
- Out of the box includes 100+ icon sets with more than 100,000 icons. - Out of the box includes 100+ icon sets with more than 150,000 icons.
- Embed icons in HTML with SVG framework or components for front-end frameworks. - Embed icons in HTML with SVG framework or components for front-end frameworks.
- Embed icons in designs with plug-ins for Figma, Sketch and Adobe XD. - Embed icons in designs with plug-ins for Figma, Sketch and Adobe XD.
- Add icon search to your applications with Iconify Icon Finder. - Add icon search to your applications with Iconify Icon Finder.
@ -53,20 +53,27 @@ or this:
&nbsp;&nbsp;&nbsp; ![Screenshot](https://iconify.design/assets/images/inline-sample.png) &nbsp;&nbsp;&nbsp; ![Screenshot](https://iconify.design/assets/images/inline-sample.png)
That is it. Change `data-icon` value to the name of the icon you want to use. There are over 100,000 premade icons to choose from, including FontAwesome, Material Design Icons, Tabler Icons, Box Icons, Unicons, Bootstrap Icons and even several emoji sets. That is it. Change `data-icon` value to the name of the icon you want to use. There are over 150,000 premade icons to choose from, including FontAwesome, Material Design Icons, Tabler Icons, Box Icons, Unicons, Bootstrap Icons and even several emoji sets.
Do you want to make your own icon sets? Everything you need is [available on GitHub](https://github.com/iconify): tools for creating custom icon sets, Iconify API application and documentation to help you. Do you want to make your own icon sets? Everything you need is [available on GitHub](https://github.com/iconify): tools for creating custom icon sets, Iconify API application and documentation to help you.
## Web component
SVG framework was designed a while ago, when browsers had poor support for web components.
However, this is no longer an issue. All modern browsers support web components.
A newer replacement for SVG framework is available: [Iconify Icon web component](https://iconify.design/docs/iconify-icon/). Consider switching to it.
## Full documentation ## Full documentation
Below is a shortened version of documentation. Below is a shortened version of documentation.
Full documentation is available on Iconify website: Full documentation is available on [Iconify website](https://iconify.design/docs/):
- [SVG framework documentation](https://docs.iconify.design/icon-components/svg-framework/). - [SVG framework documentation](https://iconify.design/docs/icon-components/svg-framework/).
- [Iconify API documentation](https://docs.iconify.design/api/). - [Iconify API documentation](https://iconify.design/docs/api/).
- [Creating icon bundles](https://docs.iconify.design/icon-components/bundles/). - [Iconify Tools documentation](https://iconify.design/docs/libraries/tools/).
- [Iconify Tools documentation](https://docs.iconify.design/tools/tools2/).
## How does it work? ## How does it work?
@ -80,7 +87,17 @@ Iconify SVG framework finds those placeholders and uses the following logic to p
This is done in a fraction of a second. Iconify SVG framework watches DOM for changes, so whenever you add new placeholders, it immediately replaces them with `SVG`, making it easy to use with dynamic content, such as AJAX forms. This is done in a fraction of a second. Iconify SVG framework watches DOM for changes, so whenever you add new placeholders, it immediately replaces them with `SVG`, making it easy to use with dynamic content, such as AJAX forms.
### Inline mode ## Offline usage
SVG framework is designed to be used with Iconify API, loading icon data on demand instead of bundling it.
If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
## Attributes
There are optional attributes to customise icon appearance.
### Vertical alignment
Code examples above use different class names: the first example uses "iconify", the second example uses "iconify-inline". Code examples above use different class names: the first example uses "iconify", the second example uses "iconify-inline".
@ -139,38 +156,9 @@ Relying on a third party service is often not an option. Many companies and deve
Iconify API and icon sets are all [available on GitHub](https://github.com/iconify), making it easy to host API on your own server. Iconify API and icon sets are all [available on GitHub](https://github.com/iconify), making it easy to host API on your own server.
For more details see [Iconify API documentation](https://docs.iconify.design/api/). For more details see [Iconify API documentation](https://iconify.design/docs/api/).
You can also create custom Iconify API to serve your own icons. For more details see [hosting custom icons in Iconify documentation](https://docs.iconify.design/api/hosting.html). You can also create custom Iconify API to serve your own icons. For more details see [hosting custom icons in Iconify documentation](https://iconify.design/docs/api/hosting.html).
### Using Iconify offline
While the default method of retrieving icons is to retrieve them from API, there are other options. Iconify SVG framework is designed to be as flexible as possible.
Easiest option to serve icons without API is by creating icon bundles.
Icon bundles are small scripts that you can load after Iconify SVG framework or bundle it together in one file.
For more details see [icon bundles in Iconify documentation](https://docs.iconify.design/icon-components/bundles/).
Another option is to import icons and bundle them with Iconify, similar to React and Vue components. Example:
```js
// Installation: npm install --save-dev @iconify/iconify
import Iconify from '@iconify/iconify/offline';
// Installation: npm install --save-dev @iconify/icons-dashicons
import adminUsers from '@iconify/icons-dashicons/admin-users';
// Unlike React and Vue components, in SVG framework each icon added with addIcon() name must have a
// prefix and a name. In this example prefix is "dashicons" and name is "admin-users".
Iconify.addIcon('dashicons:admin-users', adminUsers);
```
```html
<span class="iconify" data-icon="dashicons:admin-users"></span>
```
See [Iconify for React](https://docs.iconify.design/icon-components/react/) documentation for more details.
## Color ## Color
@ -280,7 +268,7 @@ Samples:
## Available icons ## Available icons
There are over 100,000 icons to choose from. There are over 150,000 icons to choose from.
General collections (monotone icons): General collections (monotone icons):
@ -325,4 +313,4 @@ Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.
This license does not apply to icons. Icons are released under different licenses, see each icon set for details. This license does not apply to icons. Icons are released under different licenses, see each icon set for details.
Icons available by default are all licensed under some kind of open-source or free license. Icons available by default are all licensed under some kind of open-source or free license.
© 2019 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2019-PRESENT Vjacheslav Trushkin

2
components/svg-framework/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2019 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2019-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

40
components/vue/README.md
View File

@ -11,13 +11,13 @@ Iconify icon component is nothing like that. Component does not include any icon
That means: That means:
- One syntax for over 100,000 icons from 100+ icon sets. - One syntax for over 150,000 icons from 100+ icon sets.
- Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG. - Renders SVG. Many components simply render icon fonts, which look ugly. Iconify renders pixel perfect SVG.
- Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API. - Loads icons on demand. No need to bundle icons, component will automatically load icon data for icons that you use from Iconify API.
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For extended documentation visit [Iconify for Vue documentation](https://docs.iconify.design/icon-components/vue/). For extended documentation visit [Iconify for Vue documentation](https://iconify.design/docs/icon-components/vue/).
## Installation ## Installation
@ -39,7 +39,7 @@ This component is not backwards compatible with Vue 2.
If you are using Vue 2, you need to install `@iconify/vue2` component. It is almost identical to this component, but for Vue 2. If you are using Vue 2, you need to install `@iconify/vue2` component. It is almost identical to this component, but for Vue 2.
See [Iconify for Vue 2 documentation](https://docs.iconify.design/icon-components/vue2/). See [Iconify for Vue 2 documentation](https://iconify.design/docs/icon-components/vue2/).
## Usage with API ## Usage with API
@ -55,19 +55,23 @@ Then use `Icon` component in template with icon name or data as "icon" parameter
<Icon icon="mdi-light:home" /> <Icon icon="mdi-light:home" />
``` ```
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 100,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? This icon component is designed to be used with Iconify API, loading icon data on demand instead of bundling it.
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages. ## Web component
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [Iconify for Vue offline use documentation](https://docs.iconify.design/icon-components/vue/offline.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/). If you are experiencing issues with SSR hydration, there is an alternative solution available: [Iconify Icon web component](https://iconify.design/docs/iconify-icon/).
Web component is preferred to this component if:
- Your page is performing slowly. Web component separates icon rendering in shadow DOM, improving performance.
- You are experiencing CSS conflicts.
- It works better with Nuxt and Vitepress.
## Icon Names ## Icon Names
@ -82,7 +86,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [Iconify for Vue icon names documentation](https://docs.iconify.design/icon-components/vue/icon-name.html) for more detailed explanation. See [Iconify for Vue icon names documentation](https://iconify.design/docs/icon-components/vue/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -113,7 +117,7 @@ export default {
</script> </script>
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
### ES / CommonJS packages ### ES / CommonJS packages
@ -133,9 +137,9 @@ import home from '@iconify/icons-mdi-light/home';
All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`. All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`.
For more details, see [icon packages documentation](https://docs.iconify.design/sources/npm/). For more details, see [icon packages documentation](https://iconify.design/docs/icons/).
### Inline ### Vertical alignment
Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons. Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons.
@ -315,7 +319,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/icon-components/vue/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/icon-components/vue/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -393,12 +397,12 @@ What is the purpose of `onLoad`? To let you know when Icon component renders an
## Full documentation ## Full documentation
For extended documentation visit [Iconify for Vue documentation](https://docs.iconify.design/icon-components/vue/). For extended documentation visit [Iconify for Vue documentation](https://iconify.design/docs/icon-components/vue/).
## License ## License
Vue component is released with MIT license. Vue component is released with MIT license.
© 2020 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2020-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses.

2
components/vue/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2020 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2020-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

36
components/vue2/README.md
View File

@ -17,7 +17,7 @@ That means:
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For extended documentation visit [Iconify for Vue 2 documentation](https://docs.iconify.design/icon-components/vue2/). For extended documentation visit [Iconify for Vue 2 documentation](https://iconify.design/docs/icon-components/vue2/).
## Installation ## Installation
@ -39,7 +39,7 @@ This component will not work with Vue 3.
If you are using Vue 3, you need to install `@iconify/vue` component. It is almost identical to this component, but for Vue 3. If you are using Vue 3, you need to install `@iconify/vue` component. It is almost identical to this component, but for Vue 3.
See [Iconify for Vue 3 documentation](https://docs.iconify.design/icon-components/vue/). See [Iconify for Vue 3 documentation](https://iconify.design/docs/icon-components/vue/).
## Usage with API ## Usage with API
@ -57,17 +57,21 @@ Then use `Icon` component in template with icon name or data as "icon" parameter
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 100,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 100,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? This icon component is designed to be used with Iconify API, loading icon data on demand instead of bundling it.
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages. ## Web component
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [Iconify for Vue offline use documentation](https://docs.iconify.design/icon-components/vue2/offline.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/). If you are experiencing issues with SSR hydration, there is an alternative solution available: [Iconify Icon web component](https://iconify.design/docs/iconify-icon/).
Web component is preferred to this component if:
- Your page is performing slowly. Web component separates icon rendering in shadow DOM, improving performance.
- You are experiencing CSS conflicts.
- You are using Nuxt. Due to Vue 2 internals, this component has some issue when using it with Nuxt. Web component has no such issues. This has been solved in Vue 3, though web component is preferred for Nuxt / Vitepress too.
## Icon Names ## Icon Names
@ -82,7 +86,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [Iconify for Vue icon names documentation](https://docs.iconify.design/icon-components/vue2/icon-name.html) for more detailed explanation. See [Iconify for Vue icon names documentation](https://iconify.design/docs/icon-components/vue2/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -113,7 +117,7 @@ export default {
</script> </script>
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
### ES / CommonJS packages ### ES / CommonJS packages
@ -133,9 +137,9 @@ import home from '@iconify/icons-mdi-light/home';
All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`. All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`.
For more details, see [icon packages documentation](https://docs.iconify.design/sources/npm/). For more details, see [icon packages documentation](https://iconify.design/docs/icons/).
### Inline ### Vertical alignment
Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons. Icons have 2 modes: inline and block. Difference between modes is `vertical-align` that is added to inline icons.
@ -317,7 +321,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/icon-components/vue2/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/icon-components/vue2/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -395,12 +399,12 @@ What is the purpose of `onLoad`? To let you know when Icon component renders an
## Full documentation ## Full documentation
For extended documentation visit [Iconify for Vue documentation](https://docs.iconify.design/icon-components/vue2/). For extended documentation visit [Iconify for Vue documentation](https://iconify.design/docs/icon-components/vue2/).
## License ## License
Vue component is released with MIT license. Vue component is released with MIT license.
© 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2021-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of collections and their licenses.

2
components/vue2/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

37
iconify-icon/icon/README.md
View File

@ -66,7 +66,7 @@ Main advantage of web component over other implementations is shadow DOM. Using
Below is a shortened version of documentation. Below is a shortened version of documentation.
Full documentation is [available on Iconify documentation website](https://docs.iconify.design/iconify-icon/). Full documentation is [available on Iconify documentation website](https://iconify.design/docs/iconify-icon/).
## How does it work? ## How does it work?
@ -130,38 +130,15 @@ Relying on a third party service is often not an option. Many companies and deve
Iconify API and icon sets are all [available on GitHub](https://github.com/iconify), making it easy to host API on your own server. Iconify API and icon sets are all [available on GitHub](https://github.com/iconify), making it easy to host API on your own server.
For more details see [Iconify API documentation](https://docs.iconify.design/api/). For more details see [Iconify API documentation](https://iconify.design/docs/api/).
You can also create custom Iconify API to serve your own icons. For more details see [hosting custom icons in Iconify documentation](https://docs.iconify.design/api/hosting.html). You can also create custom Iconify API to serve your own icons. For more details see [hosting custom icons in Iconify documentation](https://iconify.design/docs/api/hosting.html).
### Using Iconify offline ## Offline usage
While the default method of retrieving icons is to retrieve them from API, there are other options. Iconify Icon web component is designed to be as flexible as possible. Iconify Icon web component is designed to be used with Iconify API, loading icon data on demand instead of bundling it..
Easiest option to serve icons without API is by creating icon bundles. If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
Icon bundles are small scripts that you can load after Iconify Icon web component or bundle it together in one file.
For more details see [icon bundles in Iconify documentation](https://docs.iconify.design/icon-components/bundles/).
Another option is to import icons and bundle them with Iconify, similar to React and Vue components. Example:
```js
// Installation: npm install --save-dev iconify-icon
import 'iconify-icon';
// Installation: npm install --save-dev @iconify/icons-dashicons
import adminUsers from '@iconify/icons-dashicons/admin-users';
// Unlike React and Vue components, in SVG framework each icon added with addIcon() name must have a
// prefix and a name. In this example prefix is "dashicons" and name is "admin-users".
addIcon('dashicons:admin-users', adminUsers);
```
```html
<iconify-icon icon="dashicons:admin-users"></iconify-icon>
```
See [icon packages documentation](https://docs.iconify.design/icons/icons.html) for more details.
## Color ## Color
@ -323,4 +300,4 @@ This package is licensed under MIT license.
This license does not apply to icons. Icons are released under different licenses, see each icon set for details. This license does not apply to icons. Icons are released under different licenses, see each icon set for details.
Icons available by default are all licensed under some kind of open-source or free license. Icons available by default are all licensed under some kind of open-source or free license.
© 2022 Vjacheslav Trushkin / Iconify OÜ © 2022-PRESENT Vjacheslav Trushkin

2
iconify-icon/icon/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2022-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

2
iconify-icon/react/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2022-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

26
iconify-icon/react/readme.md
View File

@ -4,7 +4,7 @@ Iconify Icon web component is a wrapper for `iconify-icon` package, which provid
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For documentation visit [Iconify Icon web component documentation](https://docs.iconify.design/iconify-icon/). For documentation visit [Iconify Icon web component documentation](https://iconify.design/docs/iconify-icon/).
## Installation ## Installation
@ -36,17 +36,11 @@ Then use `Icon` component with icon name or data as "icon" parameter:
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? Iconify Icon web component is designed to be used with Iconify API, loading icon data on demand instead of bundling it..
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages.
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [offline use documentation](https://docs.iconify.design/iconify-icon/without-api.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/).
## Icon Names ## Icon Names
@ -61,7 +55,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [icon names documentation](https://docs.iconify.design/iconify-icon/icon-name.html) for more detailed explanation. See [icon names documentation](https://iconify.design/docs/iconify-icon/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -76,7 +70,7 @@ function renderHomeIcon() {
} }
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
### Next.js notice ### Next.js notice
@ -96,7 +90,7 @@ import home from '@iconify/icons-mdi-light/home';
All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`. All icons are available as ES modules for modern bundler and as CommonJS modules for outdated bundlers. ES modules use format `@iconify-icons/{prefix}`, CommonJS modules use `@iconify/icons-{prefix}`.
For more details, see [icon packages documentation](https://docs.iconify.design/sources/npm/). For more details, see [icon packages documentation](https://iconify.design/docs/icons/).
## Icon component properties ## Icon component properties
@ -228,7 +222,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/iconify-icon/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/iconify-icon/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -272,12 +266,12 @@ Examples of 90 degrees rotation:
## Full documentation ## Full documentation
For extended documentation visit [Iconify Icon web component documentation](https://docs.iconify.design/iconify-icon/). For extended documentation visit [Iconify Icon web component documentation](https://iconify.design/docs/iconify-icon/).
## License ## License
React component is released with MIT license. React component is released with MIT license.
© 2022 Vjacheslav Trushkin / Iconify OÜ © 2022-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of icon sets and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of icon sets and their licenses.

24
iconify-icon/solid/README.md
View File

@ -4,7 +4,7 @@ Iconify Icon web component is a wrapper for `iconify-icon` package, which provid
For more information about Iconify project visit [https://iconify.design/](https://iconify.design/). For more information about Iconify project visit [https://iconify.design/](https://iconify.design/).
For documentation visit [Iconify Icon web component documentation](https://docs.iconify.design/iconify-icon/). For documentation visit [Iconify Icon web component documentation](https://iconify.design/docs/iconify-icon/).
## Installation ## Installation
@ -36,17 +36,11 @@ Then use `Icon` component with icon name or data as "icon" parameter:
Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets. Component will automatically retrieve data for "mdi-light:home" from Iconify API and render it. There are over 150,000 icons available on Iconify API from various free and open source icon sets, including all the most popular icon sets.
## Offline Usage ## Offline usage
Retrieving icon data from Iconify API requires visitor to be online. What if you want to use component offline or on local network? Iconify Icon web component is designed to be used with Iconify API, loading icon data on demand instead of bundling it..
If you want to use icon component without relying on public Iconify API, there are several options: If you want to use icons without Iconify API, [there are many other options available](https://iconify.design/docs/usage/).
1. You can import icon data from Iconify Icons packages.
2. You can create custom icon bundles (more efficient, but requires more coding).
3. You can host your own Iconify API instead of relying on third party service.
See [offline use documentation](https://docs.iconify.design/iconify-icon/without-api.html) or [Iconify API documentation](https://docs.iconify.design/sources/api/).
## Icon Names ## Icon Names
@ -61,7 +55,7 @@ It has 3 parts, separated by ":":
- prefix is name of icon set. - prefix is name of icon set.
- name is name of icon. - name is name of icon.
See [icon names documentation](https://docs.iconify.design/iconify-icon/icon-name.html) for more detailed explanation. See [icon names documentation](https://iconify.design/docs/iconify-icon/icon-name.html) for more detailed explanation.
## Using icon data ## Using icon data
@ -76,7 +70,7 @@ function renderHomeIcon() {
} }
``` ```
See [icon packages documentation](https://docs.iconify.design/sources/npm/) for more details. See [icon packages documentation](https://iconify.design/docs/icons/) for more details.
## Icon component properties ## Icon component properties
@ -208,7 +202,7 @@ Rotating 16x24 icon by 90 degrees results in:
- CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it. - CSS transformation keeps 16x24 bounding box, which might cause the icon to overlap text around it.
- Icon transformation changes bounding box to 24x16, rotating content inside an icon. - Icon transformation changes bounding box to 24x16, rotating content inside an icon.
See [icon transformations documentation](https://docs.iconify.design/iconify-icon/transform.html) for more details. See [icon transformations documentation](https://iconify.design/docs/iconify-icon/transform.html) for more details.
#### Flipping an icon #### Flipping an icon
@ -252,12 +246,12 @@ Examples of 90 degrees rotation:
## Full documentation ## Full documentation
For extended documentation visit [Iconify Icon web component documentation](https://docs.iconify.design/iconify-icon/). For extended documentation visit [Iconify Icon web component documentation](https://iconify.design/docs/iconify-icon/).
## License ## License
SolidJS component is released with MIT license. SolidJS component is released with MIT license.
© 2022 Vjacheslav Trushkin / Iconify OÜ © 2022-PRESENT Vjacheslav Trushkin
See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of icon sets and their licenses. See [Iconify icon sets page](https://icon-sets.iconify.design/) for list of icon sets and their licenses.

2
iconify-icon/solid/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2022-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

2
license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

8
packages/api-redundancy/README.md
View File

@ -2,15 +2,13 @@
This package provides redundancy management for scripts that use API. It detects API connection timeouts and re-sends queries to backup API host(s). This package provides redundancy management for scripts that use API. It detects API connection timeouts and re-sends queries to backup API host(s).
It was designed to be used with Iconify version 2. It was designed to be used with Iconify icon components and plugins. It ensures that icon data is automatically retrieved from backup API in case main API server is unreachable, improving API uptime.
## Usage ## Usage
TODO
Due to time constraints, documentation is not available. Due to time constraints, documentation is not available.
See `@iconify/iconify` version 2 and `@iconify/icon-finder` source code for usage examples. See `lib/api/` in `core` package in sibling directory of this repository for usage.
## License ## License
@ -20,4 +18,4 @@ This package is licensed under MIT license.
Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity. Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity.
© 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2021-PRESENT Vjacheslav Trushkin

2
packages/api-redundancy/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

4
packages/core/README.md
View File

@ -18,7 +18,7 @@ Documentation is currently not available because there is no demand for it.
If anyone would like to create custom Iconify implementation and needs documentation for Iconify Core, please create an issue on Iconify repository on GitHub. If anyone would like to create custom Iconify implementation and needs documentation for Iconify Core, please create an issue on Iconify repository on GitHub.
You can browse [icon components documentation](https://docs.iconify.design/icon-components/), which explains how most functions exported by core package work. Components mostly just re-export functions from this package. You can browse [icon components documentation](https://iconify.design/docs/icon-components/), which explains how most functions exported by core package work. Components mostly just re-export functions from this package.
## License ## License
@ -28,4 +28,4 @@ This package is licensed under MIT license.
Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity. Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity.
© 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2021-PRESENT Vjacheslav Trushkin

2
packages/core/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

2
packages/types/README.md
View File

@ -456,4 +456,4 @@ This package is licensed under MIT license.
Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity. Previous versions of this package were dual-licensed under Apache 2.0 and GPL 2.0 licence, which was messy and confusing. This was later changed to MIT for simplicity.
© 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2021-PRESENT Vjacheslav Trushkin

2
packages/types/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

2
packages/types/package.json
View File

@ -11,7 +11,7 @@
"test": "tsc --noEmit --strict --typeRoots '[]' types.d.ts" "test": "tsc --noEmit --strict --typeRoots '[]' types.d.ts"
}, },
"bugs": "https://github.com/iconify/iconify/issues", "bugs": "https://github.com/iconify/iconify/issues",
"homepage": "https://github.com/iconify/iconify", "homepage": "https://iconify.design/docs/types/",
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://github.com/iconify/iconify.git", "url": "https://github.com/iconify/iconify.git",

2
packages/utils/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2021-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal

2
packages/utils/package.json
View File

@ -6,7 +6,7 @@
"version": "2.1.5", "version": "2.1.5",
"license": "MIT", "license": "MIT",
"bugs": "https://github.com/iconify/iconify/issues", "bugs": "https://github.com/iconify/iconify/issues",
"homepage": "https://iconify.design/", "homepage": "https://iconify.design/docs/libraries/utils/",
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://github.com/iconify/iconify.git", "url": "https://github.com/iconify/iconify.git",

4
packages/utils/readme.md
View File

@ -14,10 +14,10 @@ npm install @iconify/utils --save
## Documentation ## Documentation
Documentation is available at [Iconify documentation website](https://docs.iconify.design/tools/utils/). Documentation is available at [Iconify documentation website](https://iconify.design/docs/libraries/utils/).
## License ## License
The library is released with MIT license. The library is released with MIT license.
© 2021 - 2022 Vjacheslav Trushkin / Iconify OÜ © 2021-PRESENT Vjacheslav Trushkin

10
plugins/tailwind/README.md
View File

@ -1,6 +1,6 @@
# Iconify for Tailwind CSS # Iconify for Tailwind CSS
This plugin creates CSS for over 100k open source icons. This plugin creates CSS for over 150k open source icons.
[Browse icons at Iconify](https://icon-sets.iconify.design/) to see all icons. [Browse icons at Iconify](https://icon-sets.iconify.design/) to see all icons.
@ -27,7 +27,7 @@ In Iconify all icon names use the following format: `{prefix}:{name}`. Due to li
### Color, size, alignment ### Color, size, alignment
Monoton icons can change color! See [Iconify documentation](https://docs.iconify.design/icon-components/css.html#mask) for longer explanation. Monoton icons can change color! See [Iconify documentation](https://iconify.design/docs/usage/css/#monotone) for longer explanation.
To change icon size or color, change font size or text color, like you would with any text. To change icon size or color, change font size or text color, like you would with any text.
@ -43,13 +43,13 @@ To align icon below baseline, add negative vertical alignment, like this (you ca
Plugin does not include icon sets. You need to install icon sets separately. Plugin does not include icon sets. You need to install icon sets separately.
To install all 100k+ icons, install `@iconify/json` as a dev dependency. To install all 150k+ icons, install `@iconify/json` as a dev dependency.
If you do not want to install big package, install `@iconify-json/` packages for icon sets that you use. If you do not want to install big package, install `@iconify-json/` packages for icon sets that you use.
See [Iconify icon sets](https://icon-sets.iconify.design/) for list of available icon sets and icons. See [Iconify icon sets](https://icon-sets.iconify.design/) for list of available icon sets and icons.
See [Iconify documentation](https://docs.iconify.design/icons/json.html) for list of packages. See [Iconify documentation](https://iconify.design/docs/icons/json.html) for list of packages.
## Tailwind config ## Tailwind config
@ -119,4 +119,4 @@ This package is licensed under MIT license.
This license does not apply to icons. Icons are released under different licenses, see each icon set for details. This license does not apply to icons. Icons are released under different licenses, see each icon set for details.
Icons available by default are all licensed under some kind of open-source or free license. Icons available by default are all licensed under some kind of open-source or free license.
© 2023 Vjacheslav Trushkin / Iconify OÜ © 2023-PRESENT Vjacheslav Trushkin

2
plugins/tailwind/license.txt
View File

@ -1,6 +1,6 @@
MIT License MIT License
Copyright (c) 2023 Vjacheslav Trushkin / Iconify OÜ Copyright (c) 2023-PRESENT Vjacheslav Trushkin
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal