@openremote/or-icon 1.8.0-snapshot.20250725074716 → 1.8.0-snapshot.20250725120001
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +61 -61
- package/dist/umd/index.bundle.js +48 -48
- package/dist/umd/index.bundle.js.map +1 -1
- package/lib/index.js +198 -49
- package/lib/or-icon-set.js +10 -1
- package/mdi-font-copy.js +17 -17
- package/mdi-iconset-generator.js +35 -35
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,61 +1,61 @@
|
|
|
1
|
-
# @openremote/or-icon \<or-icon\>
|
|
2
|
-
[![NPM Version][npm-image]][npm-url]
|
|
3
|
-
[![Linux Build][travis-image]][travis-url]
|
|
4
|
-
[![Test Coverage][coveralls-image]][coveralls-url]
|
|
5
|
-
|
|
6
|
-
Web Component for displaying an icon from a loaded iconset.
|
|
7
|
-
|
|
8
|
-
## Install
|
|
9
|
-
```bash
|
|
10
|
-
npm i @openremote/or-icon
|
|
11
|
-
yarn add @openremote/or-icon
|
|
12
|
-
```
|
|
13
|
-
|
|
14
|
-
## Usage
|
|
15
|
-
For a full list of properties, methods and options refer to the TypeDoc generated [documentation]().
|
|
16
|
-
|
|
17
|
-
Icons are defined in iconsets, there are two iconsets provided by default and new ones can be created as required (see
|
|
18
|
-
[demo-core](../../demo/demo-core)), The `mdi` iconset is quite large and it is possible to prevent loading of this
|
|
19
|
-
when initialising the OpenRemote `Manager` via the `ManagerConfig`:
|
|
20
|
-
|
|
21
|
-
* `mdi` - [Material Design Icons](https://materialdesignicons.com/)
|
|
22
|
-
* `or` - OpenRemote icons (see [here](./or-iconset.ts))
|
|
23
|
-
|
|
24
|
-
The default iconset is `mdi` but this can be changed by setting `OrIcon.DEFAULT_ICONSET`, to load an icon use the
|
|
25
|
-
following HTML:
|
|
26
|
-
|
|
27
|
-
```$html
|
|
28
|
-
<or-icon icon="mdi:access-point" />
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
If using the default iconset then the iconset prefix can be omitted:
|
|
32
|
-
```$html
|
|
33
|
-
<or-icon icon="access-point" />
|
|
34
|
-
```
|
|
35
|
-
|
|
36
|
-
Styling is done through CSS, the following CSS variables can be used:
|
|
37
|
-
|
|
38
|
-
```$css
|
|
39
|
-
--or-icon-fill (default: currentcolor)
|
|
40
|
-
--or-icon-stroke (default: none)
|
|
41
|
-
--or-icon-height (default: 24px)
|
|
42
|
-
--or-icon-width (default: 24px)
|
|
43
|
-
--or-icon-pointer-events (default: none)
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
When an iconset is added then any `or-icon` components in the DOM will be notified and refresh as required.
|
|
47
|
-
|
|
48
|
-
## Supported Browsers
|
|
49
|
-
The last 2 versions of all modern browsers are supported, including Chrome, Safari, Opera, Firefox, Edge. In addition,
|
|
50
|
-
Internet Explorer 11 is also supported.
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
## License
|
|
54
|
-
[GNU AGPL](https://www.gnu.org/licenses/agpl-3.0.en.html)
|
|
55
|
-
|
|
56
|
-
[npm-image]: https://img.shields.io/npm/v/live-xxx.svg
|
|
57
|
-
[npm-url]: https://npmjs.org/package/@openremote/or-icon
|
|
58
|
-
[travis-image]: https://img.shields.io/travis/live-js/live-xxx/master.svg
|
|
59
|
-
[travis-url]: https://travis-ci.org/live-js/live-xxx
|
|
60
|
-
[coveralls-image]: https://img.shields.io/coveralls/live-js/live-xxx/master.svg
|
|
61
|
-
[coveralls-url]: https://coveralls.io/r/live-js/live-xxx?branch=master
|
|
1
|
+
# @openremote/or-icon \<or-icon\>
|
|
2
|
+
[![NPM Version][npm-image]][npm-url]
|
|
3
|
+
[![Linux Build][travis-image]][travis-url]
|
|
4
|
+
[![Test Coverage][coveralls-image]][coveralls-url]
|
|
5
|
+
|
|
6
|
+
Web Component for displaying an icon from a loaded iconset.
|
|
7
|
+
|
|
8
|
+
## Install
|
|
9
|
+
```bash
|
|
10
|
+
npm i @openremote/or-icon
|
|
11
|
+
yarn add @openremote/or-icon
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Usage
|
|
15
|
+
For a full list of properties, methods and options refer to the TypeDoc generated [documentation]().
|
|
16
|
+
|
|
17
|
+
Icons are defined in iconsets, there are two iconsets provided by default and new ones can be created as required (see
|
|
18
|
+
[demo-core](../../demo/demo-core)), The `mdi` iconset is quite large and it is possible to prevent loading of this
|
|
19
|
+
when initialising the OpenRemote `Manager` via the `ManagerConfig`:
|
|
20
|
+
|
|
21
|
+
* `mdi` - [Material Design Icons](https://materialdesignicons.com/)
|
|
22
|
+
* `or` - OpenRemote icons (see [here](./or-iconset.ts))
|
|
23
|
+
|
|
24
|
+
The default iconset is `mdi` but this can be changed by setting `OrIcon.DEFAULT_ICONSET`, to load an icon use the
|
|
25
|
+
following HTML:
|
|
26
|
+
|
|
27
|
+
```$html
|
|
28
|
+
<or-icon icon="mdi:access-point" />
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
If using the default iconset then the iconset prefix can be omitted:
|
|
32
|
+
```$html
|
|
33
|
+
<or-icon icon="access-point" />
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
Styling is done through CSS, the following CSS variables can be used:
|
|
37
|
+
|
|
38
|
+
```$css
|
|
39
|
+
--or-icon-fill (default: currentcolor)
|
|
40
|
+
--or-icon-stroke (default: none)
|
|
41
|
+
--or-icon-height (default: 24px)
|
|
42
|
+
--or-icon-width (default: 24px)
|
|
43
|
+
--or-icon-pointer-events (default: none)
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
When an iconset is added then any `or-icon` components in the DOM will be notified and refresh as required.
|
|
47
|
+
|
|
48
|
+
## Supported Browsers
|
|
49
|
+
The last 2 versions of all modern browsers are supported, including Chrome, Safari, Opera, Firefox, Edge. In addition,
|
|
50
|
+
Internet Explorer 11 is also supported.
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
## License
|
|
54
|
+
[GNU AGPL](https://www.gnu.org/licenses/agpl-3.0.en.html)
|
|
55
|
+
|
|
56
|
+
[npm-image]: https://img.shields.io/npm/v/live-xxx.svg
|
|
57
|
+
[npm-url]: https://npmjs.org/package/@openremote/or-icon
|
|
58
|
+
[travis-image]: https://img.shields.io/travis/live-js/live-xxx/master.svg
|
|
59
|
+
[travis-url]: https://travis-ci.org/live-js/live-xxx
|
|
60
|
+
[coveralls-image]: https://img.shields.io/coveralls/live-js/live-xxx/master.svg
|
|
61
|
+
[coveralls-url]: https://coveralls.io/r/live-js/live-xxx?branch=master
|