@nl-rvo/css-icon 1.6.0 → 1.7.0

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.
Files changed (11) hide show
  1. package/dist/icon.css +1 -0
  2. package/dist/icon.css.map +1 -0
  3. package/package.json +16 -17
  4. package/src/{index.scss → icon.scss} +1 -1
  5. package/CHANGELOG.md +0 -85
  6. package/README.md +0 -19
  7. package/design-tokens.json +0 -34
  8. package/dist/index.css +0 -99
  9. package/dist/index.min.css +0 -1
  10. package/dist/index.mjs +0 -1
  11. package/dist/index.mjs.d.ts +0 -2
package/dist/icon.css ADDED
@@ -0,0 +1 @@
1
+ @import"@utrecht/icon-css/dist/index.css";.rvo-icon{background-color:var(--utrecht-icon-color, currentColor);-webkit-mask-image:var(--rvo-icon-current);mask-image:var(--rvo-icon-current);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%;min-inline-size:var(--utrecht-icon-size)}.rvo-icon--bg{background-image:var(--rvo-icon-current)}.rvo-icon--wit{--utrecht-icon-color: var(--rvo-color-wit)}.rvo-icon--hemelblauw{--utrecht-icon-color: var(--rvo-color-hemelblauw)}.rvo-icon--donkerblauw{--utrecht-icon-color: var(--rvo-color-donkerblauw)}.rvo-icon--lintblauw{--utrecht-icon-color: var(--rvo-color-lintblauw)}.rvo-icon--zwart{--utrecht-icon-color: var(--rvo-color-zwart)}.rvo-icon--grijs-700{--utrecht-icon-color: var(--rvo-color-grijs-700)}.rvo-icon--xs{--utrecht-icon-size: var(--rvo-icon-xs-width)}.rvo-icon--sm{--utrecht-icon-size: var(--rvo-icon-sm-width)}.rvo-icon--md{--utrecht-icon-size: var(--rvo-icon-md-width)}.rvo-icon--lg{--utrecht-icon-size: var(--rvo-icon-lg-width)}.rvo-icon--xl{--utrecht-icon-size: var(--rvo-icon-xl-width)}.rvo-icon--2xl{--utrecht-icon-size: var(--rvo-icon-2xl-width)}.rvo-icon--3xl{--utrecht-icon-size: var(--rvo-icon-3xl-width)}.rvo-icon--4xl{--utrecht-icon-size: var(--rvo-icon-4xl-width)}/*# sourceMappingURL=icon.css.map */
package/dist/icon.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../src/icon.scss"],"names":[],"mappings":"AAIQ,0CAKR,UACE,yDACA,2CACA,mCACA,oCACA,4BACA,8BACA,sBACA,uBACA,eACA,yCAGF,cACE,yCAIA,eACE,2CADF,sBACE,kDADF,uBACE,mDADF,qBACE,iDADF,iBACE,6CADF,qBACE,iDAKF,cACE,8CADF,cACE,8CADF,cACE,8CADF,cACE,8CADF,cACE,8CADF,eACE,+CADF,eACE,+CADF,eACE","file":"icon.css"}
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.6.0",
2
+ "version": "1.7.0",
3
3
  "author": "Community for NL Design System",
4
4
  "license": "CC0-1.0",
5
5
  "name": "@nl-rvo/css-icon",
@@ -9,30 +9,29 @@
9
9
  "css",
10
10
  "icon"
11
11
  ],
12
+ "repository": {
13
+ "type": "git+ssh",
14
+ "url": "git@github.com:nl-design-system/rvo.git",
15
+ "directory": "components/icon/style"
16
+ },
12
17
  "files": [
13
- "src/index.scss",
14
- "dist/",
15
- "design-tokens.json",
16
- "*.md"
18
+ "src/",
19
+ "dist/"
17
20
  ],
18
- "main": "dist/index.css",
21
+ "exports": {
22
+ ".": "./dist/icon.css",
23
+ "./dist/*": "./dist/*"
24
+ },
19
25
  "publishConfig": {
20
26
  "access": "public",
21
27
  "provenance": true
22
28
  },
23
- "repository": {
24
- "type": "git+ssh",
25
- "url": "git@github.com:nl-design-system/rvo.git",
26
- "directory": "components/icon"
27
- },
28
- "devDependencies": {
29
- "@nl-rvo/build-utils-css": "0.1.0"
30
- },
31
29
  "dependencies": {
32
- "@utrecht/icon-css": "3.0.1"
30
+ "@utrecht/icon-css": "4.0.1"
33
31
  },
34
32
  "scripts": {
35
- "build": "build-css-package",
36
- "clean": "rimraf dist"
33
+ "build": "sass --pkg-importer=node --style=compressed ./src/:./dist/",
34
+ "watch": "sass --pkg-importer=node --style=compressed --watch ./src/:./dist/",
35
+ "clean": "rimraf ./dist/"
37
36
  }
38
37
  }
package/src/{index.scss → icon.scss} RENAMED
@@ -2,7 +2,7 @@
2
2
  * @license CC0-1.0
3
3
  * Copyright (c) 2021 Community for NL Design System
4
4
  */
5
- @use "~@utrecht/icon-css/dist/index.css" as *;
5
+ @import "@utrecht/icon-css/dist/index.css";
6
6
 
7
7
  $rvo-icon-kinds: (wit, hemelblauw, donkerblauw, lintblauw, zwart, grijs-700) !default;
8
8
  $rvo-icon-sizes: (xs, sm, md, lg, xl, 2xl, 3xl, 4xl) !default;
package/CHANGELOG.md DELETED
@@ -1,85 +0,0 @@
1
- # `@nl-rvo/css-icon`
2
-
3
- ## 1.6.0
4
-
5
- ### Minor Changes
6
-
7
- - 83a85f5: Moved unneccersary functions from Icon and cleaned up the code for this component.
8
-
9
- ### Patch Changes
10
-
11
- - 084a230: Ensure package is published with provenance
12
-
13
- ## 1.5.1
14
-
15
- ### Patch Changes
16
-
17
- - 93fdefc: Use CSS Logical properties, to support both `dir=ltr` and `dir=rtl`.
18
-
19
- ## 1.5.0
20
-
21
- ### Minor Changes
22
-
23
- - 8c0a7f8: Update related utrecht css packages.
24
-
25
- ## 1.4.0
26
-
27
- ### Minor Changes
28
-
29
- - fa36e07: Project structure updates
30
-
31
- - Moved all Storybook stories to the /stories directory.
32
- - Moved all documentation files to the /docs directory.
33
- - Removed React components from library-component-react and moved them into this package.
34
- - Update all .stories imports to the right react package "component-library-react"
35
- - Fix all Redundant / PascalCase lint warnings for .stories files.
36
-
37
- ## 1.3.1
38
-
39
- ### Patch Changes
40
-
41
- - 11eb258: Update imports to support storybook v10
42
-
43
- ## 1.3.0
44
-
45
- ### Minor Changes
46
-
47
- - dae7f09: design token and css name changes from logoblauw to lintblauw
48
-
49
- ## 1.2.3
50
-
51
- ### Patch Changes
52
-
53
- - 9fffd1e: Create a new component called called Checkbox Filter. Updated icon to support logoblauw color and form-checkbox-group to have a onChange parameter.
54
-
55
- ## 1.2.2
56
-
57
- ### Patch Changes
58
-
59
- - 6284f7a: Create a new component called called Checkbox Filter. Updated icon to support logoblauw color and form-checkbox-group to have a onChange parameter.
60
-
61
- ## 1.2.1
62
-
63
- ### Patch Changes
64
-
65
- - 8dd0fe7: Added min-width to icon class to enforce its size
66
-
67
- ## 1.2.0
68
-
69
- ### Minor Changes
70
-
71
- - 0cdf4eb: Remove utrecht-components-css reference and include utrecht css per component when needed
72
-
73
- ## 1.0.0
74
-
75
- ### Major Changes
76
-
77
- - daa0537: Create npm package for each component.
78
-
79
- ## Pre-releases
80
-
81
- \*@nl-rvo/component-library-css@1.0.0-alpha.290:
82
- Added `role="img"` and `aria-label` to component
83
-
84
- _@nl-rvo/component-library-css@1.0.0-alpha.3_:
85
- Added component
package/README.md DELETED
@@ -1,19 +0,0 @@
1
- # Icoon
2
-
3
- Een icoon is een grafisch symbool dat gebruikt wordt als visuele aanvulling bij een tekst, button of functionaliteit.
4
-
5
- ## Wanneer gebruik je een Icon
6
-
7
- Gebruik een icoon als aanvulling bij bijvoorbeeld een label, een button of link om de herkenbaarheid en scanbaarheid te vergroten.
8
-
9
- ## Anatomie van een Icon
10
-
11
- Het component bestaat uit:
12
-
13
- - Het symbool.
14
-
15
- ## Richtlijnen
16
-
17
- - Gebruik alleen de Rijkshuisstijl iconen die beschikbaar zijn in ROOS.
18
- - Verschillende gebruikers kunnen een icoon op verschillende manier interpreteren en moet daarom altijd voorzien worden van tekst.
19
- - Iconen zijn altijd decoratief en worden verborgen voor schermlezers.
package/design-tokens.json DELETED
@@ -1,34 +0,0 @@
1
- {
2
- "rvo": {
3
- "icon": {
4
- "sm": {
5
- "height": {
6
- "css": {
7
- "syntax": "<length>",
8
- "inherits": true
9
- }
10
- },
11
- "width": {
12
- "css": {
13
- "syntax": "<length>",
14
- "inherits": true
15
- }
16
- }
17
- },
18
- "md": {
19
- "height": {
20
- "css": {
21
- "syntax": "<length>",
22
- "inherits": true
23
- }
24
- },
25
- "width": {
26
- "css": {
27
- "syntax": "<length>",
28
- "inherits": true
29
- }
30
- }
31
- }
32
- }
33
- }
34
- }
package/dist/index.css DELETED
@@ -1,99 +0,0 @@
1
- /**
2
- * @license EUPL-1.2
3
- * Copyright (c) 2020-2024 Frameless B.V.
4
- * Copyright (c) 2021-2024 Gemeente Utrecht
5
- */
6
-
7
- /**
8
- * @license CC0-1.0
9
- * Copyright (c) 2021 Community for NL Design System
10
- */
11
-
12
- .utrecht-icon {
13
- block-size: var(--utrecht-icon-size);
14
- color: var(--utrecht-icon-color);
15
- display: inline-block;
16
- font-size: var(--utrecht-icon-size);
17
- inline-size: var(--utrecht-icon-size);
18
- inset-block-start: var(--utrecht-icon-inset-block-start, 0);
19
- position: relative;
20
- }
21
-
22
- .utrecht-icon svg {
23
- height: 100%;
24
- pointer-events: none;
25
- width: 100%;
26
- }
27
-
28
- .rvo-icon {
29
- background-color: var(--utrecht-icon-color, currentColor);
30
- -webkit-mask-image: var(--rvo-icon-current);
31
- mask-image: var(--rvo-icon-current);
32
- -webkit-mask-position: center center;
33
- mask-position: center center;
34
- -webkit-mask-repeat: no-repeat;
35
- mask-repeat: no-repeat;
36
- -webkit-mask-size: 100%;
37
- mask-size: 100%;
38
- min-inline-size: var(--utrecht-icon-size);
39
- }
40
-
41
- .rvo-icon--bg {
42
- background-image: var(--rvo-icon-current);
43
- }
44
-
45
- .rvo-icon--wit {
46
- --utrecht-icon-color: var(--rvo-color-wit);
47
- }
48
-
49
- .rvo-icon--hemelblauw {
50
- --utrecht-icon-color: var(--rvo-color-hemelblauw);
51
- }
52
-
53
- .rvo-icon--donkerblauw {
54
- --utrecht-icon-color: var(--rvo-color-donkerblauw);
55
- }
56
-
57
- .rvo-icon--lintblauw {
58
- --utrecht-icon-color: var(--rvo-color-lintblauw);
59
- }
60
-
61
- .rvo-icon--zwart {
62
- --utrecht-icon-color: var(--rvo-color-zwart);
63
- }
64
-
65
- .rvo-icon--grijs-700 {
66
- --utrecht-icon-color: var(--rvo-color-grijs-700);
67
- }
68
-
69
- .rvo-icon--xs {
70
- --utrecht-icon-size: var(--rvo-icon-xs-width);
71
- }
72
-
73
- .rvo-icon--sm {
74
- --utrecht-icon-size: var(--rvo-icon-sm-width);
75
- }
76
-
77
- .rvo-icon--md {
78
- --utrecht-icon-size: var(--rvo-icon-md-width);
79
- }
80
-
81
- .rvo-icon--lg {
82
- --utrecht-icon-size: var(--rvo-icon-lg-width);
83
- }
84
-
85
- .rvo-icon--xl {
86
- --utrecht-icon-size: var(--rvo-icon-xl-width);
87
- }
88
-
89
- .rvo-icon--2xl {
90
- --utrecht-icon-size: var(--rvo-icon-2xl-width);
91
- }
92
-
93
- .rvo-icon--3xl {
94
- --utrecht-icon-size: var(--rvo-icon-3xl-width);
95
- }
96
-
97
- .rvo-icon--4xl {
98
- --utrecht-icon-size: var(--rvo-icon-4xl-width);
99
- }
package/dist/index.min.css DELETED
@@ -1 +0,0 @@
1
- .utrecht-icon{block-size:var(--utrecht-icon-size);color:var(--utrecht-icon-color);display:inline-block;font-size:var(--utrecht-icon-size);inline-size:var(--utrecht-icon-size);inset-block-start:var(--utrecht-icon-inset-block-start,0);position:relative}.utrecht-icon svg{height:100%;pointer-events:none;width:100%}.rvo-icon{background-color:var(--utrecht-icon-color,currentColor);-webkit-mask-image:var(--rvo-icon-current);mask-image:var(--rvo-icon-current);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%;min-inline-size:var(--utrecht-icon-size)}.rvo-icon--bg{background-image:var(--rvo-icon-current)}.rvo-icon--wit{--utrecht-icon-color:var(--rvo-color-wit)}.rvo-icon--hemelblauw{--utrecht-icon-color:var(--rvo-color-hemelblauw)}.rvo-icon--donkerblauw{--utrecht-icon-color:var(--rvo-color-donkerblauw)}.rvo-icon--lintblauw{--utrecht-icon-color:var(--rvo-color-lintblauw)}.rvo-icon--zwart{--utrecht-icon-color:var(--rvo-color-zwart)}.rvo-icon--grijs-700{--utrecht-icon-color:var(--rvo-color-grijs-700)}.rvo-icon--xs{--utrecht-icon-size:var(--rvo-icon-xs-width)}.rvo-icon--sm{--utrecht-icon-size:var(--rvo-icon-sm-width)}.rvo-icon--md{--utrecht-icon-size:var(--rvo-icon-md-width)}.rvo-icon--lg{--utrecht-icon-size:var(--rvo-icon-lg-width)}.rvo-icon--xl{--utrecht-icon-size:var(--rvo-icon-xl-width)}.rvo-icon--2xl{--utrecht-icon-size:var(--rvo-icon-2xl-width)}.rvo-icon--3xl{--utrecht-icon-size:var(--rvo-icon-3xl-width)}.rvo-icon--4xl{--utrecht-icon-size:var(--rvo-icon-4xl-width)}
package/dist/index.mjs DELETED
@@ -1 +0,0 @@
1
- export default ".utrecht-icon{block-size:var(--utrecht-icon-size);color:var(--utrecht-icon-color);display:inline-block;font-size:var(--utrecht-icon-size);inline-size:var(--utrecht-icon-size);inset-block-start:var(--utrecht-icon-inset-block-start,0);position:relative}.utrecht-icon svg{height:100%;pointer-events:none;width:100%}.rvo-icon{background-color:var(--utrecht-icon-color,currentColor);-webkit-mask-image:var(--rvo-icon-current);mask-image:var(--rvo-icon-current);-webkit-mask-position:center center;mask-position:center center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100%;mask-size:100%;min-inline-size:var(--utrecht-icon-size)}.rvo-icon--bg{background-image:var(--rvo-icon-current)}.rvo-icon--wit{--utrecht-icon-color:var(--rvo-color-wit)}.rvo-icon--hemelblauw{--utrecht-icon-color:var(--rvo-color-hemelblauw)}.rvo-icon--donkerblauw{--utrecht-icon-color:var(--rvo-color-donkerblauw)}.rvo-icon--lintblauw{--utrecht-icon-color:var(--rvo-color-lintblauw)}.rvo-icon--zwart{--utrecht-icon-color:var(--rvo-color-zwart)}.rvo-icon--grijs-700{--utrecht-icon-color:var(--rvo-color-grijs-700)}.rvo-icon--xs{--utrecht-icon-size:var(--rvo-icon-xs-width)}.rvo-icon--sm{--utrecht-icon-size:var(--rvo-icon-sm-width)}.rvo-icon--md{--utrecht-icon-size:var(--rvo-icon-md-width)}.rvo-icon--lg{--utrecht-icon-size:var(--rvo-icon-lg-width)}.rvo-icon--xl{--utrecht-icon-size:var(--rvo-icon-xl-width)}.rvo-icon--2xl{--utrecht-icon-size:var(--rvo-icon-2xl-width)}.rvo-icon--3xl{--utrecht-icon-size:var(--rvo-icon-3xl-width)}.rvo-icon--4xl{--utrecht-icon-size:var(--rvo-icon-4xl-width)}";
package/dist/index.mjs.d.ts DELETED
@@ -1,2 +0,0 @@
1
- declare const css: string;
2
- export default css;