@awes-io/ui 2.64.0 → 2.65.1

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 (15) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/components/1_atoms/AwIcon/AwIcon.vue +9 -2
  3. package/components/2_molecules/AwTabNav.vue +47 -10
  4. package/directives/tooltip.js +2 -2
  5. package/package.json +2 -2
  6. package/dist/css/aw-icons.css +0 -168
  7. package/dist/css/ui.css +0 -1
  8. package/dist/fonts/aw-icons.svg +0 -159
  9. package/dist/fonts/aw-icons.ttf +0 -0
  10. package/dist/fonts/aw-icons.woff +0 -0
  11. package/dist/fonts/aw-icons.woff2 +0 -0
  12. package/dist/js/ui.esm.js +0 -20
  13. package/dist/js/ui.min.js +0 -20
  14. package/dist/js/ui.ssr.js +0 -24996
  15. package/nuxt/icons.css +0 -168
package/CHANGELOG.md CHANGED
@@ -3,6 +3,33 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [2.65.1](https://github.com/awes-io/client/compare/@awes-io/ui@2.65.0...@awes-io/ui@2.65.1) (2023-07-06)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **aw-tab-nav:** else key fixed ([fac9f72](https://github.com/awes-io/client/commit/fac9f7214606540f95fa8aa5e57782b7ad837a10))
12
+
13
+
14
+
15
+
16
+
17
+ # [2.65.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.64.0...@awes-io/ui@2.65.0) (2023-07-06)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * tooltip shown on pointer events ([a1827a1](https://github.com/awes-io/client/commit/a1827a142e5b823ba526bce0e90ccf7a5a36dc20))
23
+
24
+
25
+ ### Features
26
+
27
+ * **aw-tab-nav:** icons added ([eb1c876](https://github.com/awes-io/client/commit/eb1c87634e47f7ca15593fd82fb5d685ffa4e9b6))
28
+
29
+
30
+
31
+
32
+
6
33
  # [2.64.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.63.6...@awes-io/ui@2.64.0) (2023-06-27)
7
34
 
8
35
 
package/components/1_atoms/AwIcon/AwIcon.vue CHANGED
@@ -12,6 +12,11 @@ export default {
12
12
  required: true
13
13
  },
14
14
 
15
+ color: {
16
+ type: String,
17
+ default: ''
18
+ },
19
+
15
20
  viewBox: {
16
21
  type: String,
17
22
  default: null
@@ -23,7 +28,7 @@ export default {
23
28
  }
24
29
  },
25
30
 
26
- render(h, { props: { name, size, viewBox }, data }) {
31
+ render(h, { props: { name, color, size, viewBox }, data }) {
27
32
  const attrs = data.attrs || {}
28
33
 
29
34
  return name
@@ -38,7 +43,9 @@ export default {
38
43
  !size && isNil(attrs.width) && isNil(attrs.height)
39
44
  }
40
45
  ],
41
- style: [data.style, data.staticStyle],
46
+ style: [data.style, data.staticStyle].concat(
47
+ color ? { fill: `var(--c-${color})` } : []
48
+ ),
42
49
  attrs: {
43
50
  'aria-hidden': true,
44
51
  width: size || null,
package/components/2_molecules/AwTabNav.vue CHANGED
@@ -15,31 +15,59 @@
15
15
  :href="isDisabled ? null : route.fullPath"
16
16
  :class="[
17
17
  _cssClasses.toggler,
18
- { [_cssClasses.togglerActive]: isActive },
19
- { [_cssClasses.togglerDisabled]: isDisabled }
18
+ {
19
+ [_cssClasses.togglerActive]: isActive,
20
+ [_cssClasses.togglerDisabled]: isDisabled,
21
+ [_cssClasses.togglerNoText]: item.hideText
22
+ }
20
23
  ]"
21
24
  @click.prevent="navigate(route)"
22
25
  >
23
26
  <span tabindex="-1">
24
- {{ text }}
25
- <AwBadge v-if="item.badge" v-bind="item.badge" />
27
+ <AwIcon
28
+ v-if="item.icon"
29
+ v-bind="_toIconProps(item.icon)"
30
+ :class="{ 'mr-1': !item.hideText }"
31
+ />
32
+ <span v-if="item.hideText" class="sr-only">
33
+ {{ text }}
34
+ </span>
35
+ <template v-else>{{ text }}</template>
36
+ <AwBadge
37
+ v-if="item.badge"
38
+ v-bind="_toBadgeProps(item.badge)"
39
+ />
26
40
  </span>
27
41
  </a>
28
42
  <button
29
43
  v-else
30
- :key="key"
44
+ :key="'btn-' + key"
31
45
  :class="[
32
46
  _cssClasses.toggler,
33
- { [_cssClasses.togglerActive]: isActive },
34
- { [_cssClasses.togglerDisabled]: isDisabled }
47
+ {
48
+ [_cssClasses.togglerActive]: isActive,
49
+ [_cssClasses.togglerDisabled]: isDisabled,
50
+ [_cssClasses.togglerNoText]: item.hideText
51
+ }
35
52
  ]"
36
53
  :disabled="isDisabled ? '' : null"
37
54
  type="button"
38
55
  @click.prevent="update(i)"
39
56
  >
40
57
  <span tabindex="-1">
41
- {{ text }}
42
- <AwBadge v-if="item.badge" v-bind="item.badge" />
58
+ <AwIcon
59
+ v-if="item.icon"
60
+ v-bind="_toIconProps(item.icon)"
61
+ :class="{ 'mr-1': !item.hideText }"
62
+ />
63
+ <span v-if="item.hideText" class="sr-only">
64
+ {{ text }}
65
+ </span>
66
+ <template v-else>{{ text }}</template>
67
+ <AwBadge
68
+ v-if="item.badge"
69
+ v-bind="_toBadgeProps(item.badge)"
70
+ />
43
71
  </span>
44
72
  </button>
45
73
  </slot>
@@ -115,7 +143,8 @@ export default {
115
143
  'wrapper',
116
144
  'toggler',
117
145
  'toggler_active',
118
- 'toggler_disabled'
146
+ 'toggler_disabled',
147
+ 'toggler_no_text'
119
148
  ])
120
149
  }
121
150
  },
@@ -233,6 +262,14 @@ export default {
233
262
  }
234
263
 
235
264
  return equals(currentParams, route.query)
265
+ },
266
+
267
+ _toBadgeProps(props) {
268
+ return isType('Object', props) ? props : { text: props }
269
+ },
270
+
271
+ _toIconProps(props) {
272
+ return isType('Object', props) ? props : { name: props }
236
273
  }
237
274
  }
238
275
  }
package/directives/tooltip.js CHANGED
@@ -52,11 +52,11 @@ function hideTooltip() {
52
52
 
53
53
  const EVENTS = [
54
54
  {
55
- names: ['mouseenter', 'focus'],
55
+ names: ['pointerenter', 'focus'],
56
56
  handler: showTooltip
57
57
  },
58
58
  {
59
- names: ['mouseleave', 'blur'],
59
+ names: ['pointerleave', 'blur'],
60
60
  handler: hideTooltip
61
61
  }
62
62
  ]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@awes-io/ui",
3
- "version": "2.64.0",
3
+ "version": "2.65.1",
4
4
  "description": "User Interface (UI) components",
5
5
  "keywords": [
6
6
  "ui",
@@ -122,5 +122,5 @@
122
122
  "vue-template-compiler": "^2.6.10",
123
123
  "webfonts-generator": "^0.4.0"
124
124
  },
125
- "gitHead": "9bee9f41561747fce924fc78db5aae56665acdf7"
125
+ "gitHead": "731b4fa90b1988fd90818a041a3a30ba09509057"
126
126
  }
package/dist/css/aw-icons.css DELETED
@@ -1,168 +0,0 @@
1
- @font-face {
2
- font-family: "aw-icons";
3
- src: url("/fonts/aw-icons.woff2?b289fd926b2ed5447880ea85815122b1") format("woff2"),
4
- url("/fonts/aw-icons.woff?b289fd926b2ed5447880ea85815122b1") format("woff");
5
- }
6
-
7
- .aw-icon {
8
- display: inline-block;
9
- line-height: 1;
10
- overflow: hidden;
11
- vertical-align: middle;
12
- text-align: center;
13
- }
14
-
15
- .aw-icon:before {
16
- font-family: aw-icons !important;
17
- font-style: normal;
18
- font-weight: normal !important;
19
- vertical-align: top;
20
- }
21
-
22
- .aw-icon-arrow-d:before {
23
- content: "\f101";
24
- }
25
- .aw-icon-arrow-l:before {
26
- content: "\f102";
27
- }
28
- .aw-icon-arrow-r:before {
29
- content: "\f103";
30
- }
31
- .aw-icon-arrow-u:before {
32
- content: "\f104";
33
- }
34
- .aw-icon-bold:before {
35
- content: "\f105";
36
- }
37
- .aw-icon-briefcase:before {
38
- content: "\f106";
39
- }
40
- .aw-icon-burger:before {
41
- content: "\f107";
42
- }
43
- .aw-icon-check-circle:before {
44
- content: "\f108";
45
- }
46
- .aw-icon-check-solid:before {
47
- content: "\f109";
48
- }
49
- .aw-icon-check:before {
50
- content: "\f10a";
51
- }
52
- .aw-icon-chevron-d:before {
53
- content: "\f10b";
54
- }
55
- .aw-icon-chevron-l:before {
56
- content: "\f10c";
57
- }
58
- .aw-icon-chevron-r:before {
59
- content: "\f10d";
60
- }
61
- .aw-icon-chevron-u:before {
62
- content: "\f10e";
63
- }
64
- .aw-icon-circle:before {
65
- content: "\f10f";
66
- }
67
- .aw-icon-close-circle:before {
68
- content: "\f110";
69
- }
70
- .aw-icon-close-solid:before {
71
- content: "\f111";
72
- }
73
- .aw-icon-close:before {
74
- content: "\f112";
75
- }
76
- .aw-icon-copy:before {
77
- content: "\f113";
78
- }
79
- .aw-icon-drag:before {
80
- content: "\f114";
81
- }
82
- .aw-icon-external:before {
83
- content: "\f115";
84
- }
85
- .aw-icon-eye-no:before {
86
- content: "\f116";
87
- }
88
- .aw-icon-eye:before {
89
- content: "\f117";
90
- }
91
- .aw-icon-font-size:before {
92
- content: "\f118";
93
- }
94
- .aw-icon-graph:before {
95
- content: "\f119";
96
- }
97
- .aw-icon-intelligence:before {
98
- content: "\f11a";
99
- }
100
- .aw-icon-italic:before {
101
- content: "\f11b";
102
- }
103
- .aw-icon-loader:before {
104
- content: "\f11c";
105
- }
106
- .aw-icon-location:before {
107
- content: "\f11d";
108
- }
109
- .aw-icon-minus:before {
110
- content: "\f11e";
111
- }
112
- .aw-icon-more-v:before {
113
- content: "\f11f";
114
- }
115
- .aw-icon-more:before {
116
- content: "\f120";
117
- }
118
- .aw-icon-plus-solid:before {
119
- content: "\f121";
120
- }
121
- .aw-icon-plus:before {
122
- content: "\f122";
123
- }
124
- .aw-icon-quote:before {
125
- content: "\f123";
126
- }
127
- .aw-icon-schedule:before {
128
- content: "\f124";
129
- }
130
- .aw-icon-search:before {
131
- content: "\f125";
132
- }
133
- .aw-icon-settings:before {
134
- content: "\f126";
135
- }
136
- .aw-icon-speaker:before {
137
- content: "\f127";
138
- }
139
- .aw-icon-speed:before {
140
- content: "\f128";
141
- }
142
- .aw-icon-storage:before {
143
- content: "\f129";
144
- }
145
- .aw-icon-triangle-d:before {
146
- content: "\f12a";
147
- }
148
- .aw-icon-triangle-l:before {
149
- content: "\f12b";
150
- }
151
- .aw-icon-triangle-r:before {
152
- content: "\f12c";
153
- }
154
- .aw-icon-triangle-solid-r:before {
155
- content: "\f12d";
156
- }
157
- .aw-icon-triangle-u:before {
158
- content: "\f12e";
159
- }
160
- .aw-icon-upload:before {
161
- content: "\f12f";
162
- }
163
- .aw-icon-user-solid:before {
164
- content: "\f130";
165
- }
166
- .aw-icon-user:before {
167
- content: "\f131";
168
- }