@awes-io/ui 2.82.0 → 2.84.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.
- package/CHANGELOG.md +24 -0
- package/assets/css/components/button.css +2 -2
- package/assets/css/components/dropdown-button.css +4 -0
- package/assets/css/components/text-field.css +5 -1
- package/assets/css/components/user-menu.css +6 -2
- package/components/1_atoms/AwDropdownButton.vue +1 -5
- package/components/2_molecules/AwButton.vue +21 -1
- package/components/3_organisms/AwAddress.vue +7 -3
- package/components/3_organisms/AwAddressBlock.vue +8 -1
- package/components/4_pages/AwPageSingle.vue +22 -7
- package/components/4_pages/_AwPageHeader.vue +4 -4
- package/components/5_layouts/_AwUserMenu.vue +10 -2
- package/nuxt/awes.config.js +1 -1
- package/nuxt/templates/core.plugin.js +33 -0
- package/package.json +2 -2
- package/tailwind.config.js +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,30 @@
|
|
|
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.84.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.83.0...@awes-io/ui@2.84.0) (2023-11-23)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* **vue-mc:** injectable system added ([98a6cb6](https://github.com/awes-io/client/commit/98a6cb6542122e4404817d63fa198e160dcc99b1))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
# [2.83.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.82.0...@awes-io/ui@2.83.0) (2023-11-15)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Features
|
|
21
|
+
|
|
22
|
+
* address block sends formatted address ([fd5c456](https://github.com/awes-io/client/commit/fd5c45646187c2ce5167303c35acb70a1d1f6f17))
|
|
23
|
+
* change hove and focus color for inputs ([087787a](https://github.com/awes-io/client/commit/087787a665c170f9b79abba22bc4b0d6a56c8bc4))
|
|
24
|
+
* change style for dropdown btn ([31916a6](https://github.com/awes-io/client/commit/31916a61f049a4c7d3d8354e97419d27ce03a992))
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
6
30
|
# [2.82.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.81.0...@awes-io/ui@2.82.0) (2023-11-08)
|
|
7
31
|
|
|
8
32
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
.aw-text-field {
|
|
2
|
-
@apply border text-base;
|
|
2
|
+
@apply border border-mono-800 text-base;
|
|
3
3
|
position: relative;
|
|
4
4
|
transition: 200ms border-color;
|
|
5
5
|
background-color: var(--c-surface);
|
|
@@ -17,6 +17,10 @@
|
|
|
17
17
|
background-image: none;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
+
&:hover {
|
|
21
|
+
@apply border-mono-600;
|
|
22
|
+
}
|
|
23
|
+
|
|
20
24
|
&:focus-within {
|
|
21
25
|
@apply border-mono-400;
|
|
22
26
|
}
|
|
@@ -61,8 +61,8 @@
|
|
|
61
61
|
color: var(--c-on-surface);
|
|
62
62
|
border-bottom-width: 1px;
|
|
63
63
|
|
|
64
|
-
&-icon {
|
|
65
|
-
|
|
64
|
+
&-icon--mono {
|
|
65
|
+
color: var(--c-mono-400);
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
&-text {
|
|
@@ -126,6 +126,10 @@
|
|
|
126
126
|
background-color: var(--c-mono-900);
|
|
127
127
|
}
|
|
128
128
|
|
|
129
|
+
&--icon-mono svg {
|
|
130
|
+
color: var(--c-mono-400);
|
|
131
|
+
}
|
|
132
|
+
|
|
129
133
|
&-text {
|
|
130
134
|
text-overflow: ellipsis;
|
|
131
135
|
overflow: hidden;
|
|
@@ -42,11 +42,21 @@
|
|
|
42
42
|
:class="{
|
|
43
43
|
'hidden lg:block': mobileTextHidden,
|
|
44
44
|
'sr-only': (theme === 'icon' || theme === 'circle') && icon,
|
|
45
|
-
'ml-
|
|
45
|
+
'ml-2': icon && isContentAdded,
|
|
46
|
+
'mr-2': iconRight && isContentAdded
|
|
46
47
|
}"
|
|
47
48
|
>
|
|
48
49
|
<slot>{{ text }}</slot>
|
|
49
50
|
</span>
|
|
51
|
+
|
|
52
|
+
<slot name="icon-right" v-bind="{ iconRight, iconSize }">
|
|
53
|
+
<AwIcon
|
|
54
|
+
v-if="iconRight"
|
|
55
|
+
:name="iconRight"
|
|
56
|
+
class="flex-shrink-0"
|
|
57
|
+
:size="iconSize"
|
|
58
|
+
/>
|
|
59
|
+
</slot>
|
|
50
60
|
</span>
|
|
51
61
|
|
|
52
62
|
<span v-if="locked" class="aw-button__lock" v-tooltip="lockedTooltip">
|
|
@@ -108,6 +118,12 @@ export default {
|
|
|
108
118
|
default: ''
|
|
109
119
|
},
|
|
110
120
|
|
|
121
|
+
// Name of icon in button. Icon placed after text
|
|
122
|
+
iconRight: {
|
|
123
|
+
type: String,
|
|
124
|
+
default: ''
|
|
125
|
+
},
|
|
126
|
+
|
|
111
127
|
// Indicates if loader spinner is shown
|
|
112
128
|
loading: {
|
|
113
129
|
type: [Boolean, String],
|
|
@@ -165,6 +181,10 @@ export default {
|
|
|
165
181
|
)
|
|
166
182
|
},
|
|
167
183
|
|
|
184
|
+
isContentAdded() {
|
|
185
|
+
return this.text || this.$scopedSlots.default
|
|
186
|
+
},
|
|
187
|
+
|
|
168
188
|
// loadingText() {
|
|
169
189
|
// return (
|
|
170
190
|
// (isType('String', this.loading) && this.loading) ||
|
|
@@ -73,7 +73,7 @@ export default {
|
|
|
73
73
|
this.$refs.select.searchPhrase = ''
|
|
74
74
|
}
|
|
75
75
|
this._resetSearch()
|
|
76
|
-
this._formatAddressResponse(details).then((result) => {
|
|
76
|
+
this._formatAddressResponse(details, place).then((result) => {
|
|
77
77
|
this.$emit('input', result)
|
|
78
78
|
})
|
|
79
79
|
}
|
|
@@ -148,9 +148,13 @@ export default {
|
|
|
148
148
|
this.sessionToken = null
|
|
149
149
|
},
|
|
150
150
|
|
|
151
|
-
_formatAddressResponse(details) {
|
|
151
|
+
_formatAddressResponse(details, place) {
|
|
152
152
|
if (details && details.address_components) {
|
|
153
|
-
const response = {
|
|
153
|
+
const response = {
|
|
154
|
+
description: details.formatted_address || place.description,
|
|
155
|
+
main: pathOr('', 'structured_formatting.main_text', place),
|
|
156
|
+
secondary: pathOr('', 'structured_formatting.secondary_text', place)
|
|
157
|
+
}
|
|
154
158
|
|
|
155
159
|
details.address_components.forEach(
|
|
156
160
|
({ long_name, short_name, types }) => {
|
|
@@ -195,8 +195,11 @@ import { clone } from 'rambdax'
|
|
|
195
195
|
import { makePreventableEventMock } from '@AwUtils/events'
|
|
196
196
|
|
|
197
197
|
const BASE = {
|
|
198
|
+
description: null,
|
|
198
199
|
meta: {
|
|
199
|
-
google_country_name: null
|
|
200
|
+
google_country_name: null,
|
|
201
|
+
main: null,
|
|
202
|
+
secondary: null
|
|
200
203
|
},
|
|
201
204
|
country_iso: null,
|
|
202
205
|
region: null,
|
|
@@ -329,6 +332,10 @@ export default {
|
|
|
329
332
|
address.meta.county = obj.administrative_area_level_2
|
|
330
333
|
}
|
|
331
334
|
|
|
335
|
+
address.description = obj.description
|
|
336
|
+
address.meta.main = obj.main
|
|
337
|
+
address.meta.secondary = obj.secondary
|
|
338
|
+
|
|
332
339
|
event.data = address
|
|
333
340
|
|
|
334
341
|
this.$emit('data', event)
|
|
@@ -32,7 +32,22 @@
|
|
|
32
32
|
<slot name="buttons"></slot>
|
|
33
33
|
|
|
34
34
|
<AwButton
|
|
35
|
-
v-if="
|
|
35
|
+
v-if="
|
|
36
|
+
actionButton && isDesktop && isDesktopActionBeforeMenu
|
|
37
|
+
"
|
|
38
|
+
v-bind="actionButton"
|
|
39
|
+
size="md"
|
|
40
|
+
@click="$emit('action')"
|
|
41
|
+
/>
|
|
42
|
+
</template>
|
|
43
|
+
|
|
44
|
+
<template #after-menu>
|
|
45
|
+
<slot name="after-menu"></slot>
|
|
46
|
+
|
|
47
|
+
<AwButton
|
|
48
|
+
v-if="
|
|
49
|
+
actionButton && isDesktop && !isDesktopActionBeforeMenu
|
|
50
|
+
"
|
|
36
51
|
v-bind="actionButton"
|
|
37
52
|
size="md"
|
|
38
53
|
@click="$emit('action')"
|
|
@@ -111,7 +126,7 @@
|
|
|
111
126
|
</template>
|
|
112
127
|
|
|
113
128
|
<script>
|
|
114
|
-
import { isType } from 'rambdax'
|
|
129
|
+
import { isType, pathOr, omit } from 'rambdax'
|
|
115
130
|
import pageMixin from '@AwMixins/page'
|
|
116
131
|
|
|
117
132
|
const CONTAINER_TYPES = ['default', 'full']
|
|
@@ -182,12 +197,16 @@ export default {
|
|
|
182
197
|
return this.$scopedSlots.preview || this.$slots.preview
|
|
183
198
|
},
|
|
184
199
|
|
|
200
|
+
isDesktopActionBeforeMenu() {
|
|
201
|
+
return !!pathOr(false, 'before', this.action)
|
|
202
|
+
},
|
|
203
|
+
|
|
185
204
|
actionButton() {
|
|
186
205
|
if (!isType('Object', this.action)) {
|
|
187
206
|
return null
|
|
188
207
|
}
|
|
189
208
|
|
|
190
|
-
return this.action
|
|
209
|
+
return omit(['before'], this.action)
|
|
191
210
|
}
|
|
192
211
|
},
|
|
193
212
|
|
|
@@ -232,10 +251,6 @@ export default {
|
|
|
232
251
|
|
|
233
252
|
this.$options.$observer.observe(topScrollMark)
|
|
234
253
|
this.$options.$observer.observe(bottomScrollMark)
|
|
235
|
-
|
|
236
|
-
this.$once('hook:beforeDestroy', () => {
|
|
237
|
-
|
|
238
|
-
})
|
|
239
254
|
},
|
|
240
255
|
|
|
241
256
|
_disableScrollWatcher() {
|
|
@@ -13,11 +13,11 @@
|
|
|
13
13
|
</h1>
|
|
14
14
|
|
|
15
15
|
<div class="aw-page-header__buttons">
|
|
16
|
-
<slot
|
|
17
|
-
<!-- <EwSupportChat /> -->
|
|
18
|
-
</slot>
|
|
16
|
+
<slot />
|
|
19
17
|
|
|
20
|
-
<AwUserMenu v-if="!hideMenu" outline vertical caret />
|
|
18
|
+
<AwUserMenu v-if="!hideMenu" outline vertical caret mono-icons />
|
|
19
|
+
|
|
20
|
+
<slot name="after-menu" />
|
|
21
21
|
</div>
|
|
22
22
|
|
|
23
23
|
<slot name="progress">
|
|
@@ -54,6 +54,11 @@
|
|
|
54
54
|
<AwIconSystemMono
|
|
55
55
|
:size="24"
|
|
56
56
|
class="aw-user-menu__theme-icon"
|
|
57
|
+
:class="{
|
|
58
|
+
'aw-user-menu__theme-icon--mono': monoIcons,
|
|
59
|
+
'mr-2': vertical ,
|
|
60
|
+
'mr-4': !vertical
|
|
61
|
+
}"
|
|
57
62
|
name="light"
|
|
58
63
|
/>
|
|
59
64
|
|
|
@@ -78,6 +83,7 @@
|
|
|
78
83
|
v-bind="_pickButtonProps(item)"
|
|
79
84
|
:class="[
|
|
80
85
|
{
|
|
86
|
+
'aw-user-menu__nav-item--icon-mono': monoIcons,
|
|
81
87
|
'aw-user-menu__nav-item--active':
|
|
82
88
|
item === activeMenu
|
|
83
89
|
},
|
|
@@ -90,7 +96,7 @@
|
|
|
90
96
|
<AwIcon
|
|
91
97
|
v-if="item.icon"
|
|
92
98
|
:name="item.icon"
|
|
93
|
-
class="mr-2"
|
|
99
|
+
:class="{ 'mr-2': vertical , 'mr-4': !vertical }"
|
|
94
100
|
/>
|
|
95
101
|
|
|
96
102
|
<span
|
|
@@ -130,7 +136,9 @@ export default {
|
|
|
130
136
|
|
|
131
137
|
outline: Boolean,
|
|
132
138
|
|
|
133
|
-
caret: Boolean
|
|
139
|
+
caret: Boolean,
|
|
140
|
+
|
|
141
|
+
monoIcons: Boolean
|
|
134
142
|
},
|
|
135
143
|
|
|
136
144
|
inject: {
|
package/nuxt/awes.config.js
CHANGED
|
@@ -22,3 +22,36 @@ export default ({ app }, inject) => {
|
|
|
22
22
|
app.$awes = $awes
|
|
23
23
|
inject('awes', $awes)
|
|
24
24
|
}
|
|
25
|
+
|
|
26
|
+
// const wrapAuthHandler = (fn, context, redirect) => {
|
|
27
|
+
// return async (...args) => {
|
|
28
|
+
// try {
|
|
29
|
+
// return await fn.apply(context, args)
|
|
30
|
+
// } catch (e) {
|
|
31
|
+
// console.log(e)
|
|
32
|
+
|
|
33
|
+
// if (e.name === 'ExpiredAuthSessionError') {
|
|
34
|
+
// redirect('/login')
|
|
35
|
+
// } else {
|
|
36
|
+
// throw e
|
|
37
|
+
// }
|
|
38
|
+
// }
|
|
39
|
+
// }
|
|
40
|
+
// }
|
|
41
|
+
|
|
42
|
+
// export default ({ $axios, $dayjs, store, app, redirect }) => {
|
|
43
|
+
// // request overwrite to handle expired auth error
|
|
44
|
+
// const modelRequest = BaseModel.prototype.request
|
|
45
|
+
// const collectionRequest = BaseCollection.prototype.request
|
|
46
|
+
|
|
47
|
+
// BaseModel.prototype.request = wrapAuthHandler(
|
|
48
|
+
// modelRequest,
|
|
49
|
+
// BaseModel.prototype,
|
|
50
|
+
// redirect
|
|
51
|
+
// )
|
|
52
|
+
// BaseCollection.prototype.request = wrapAuthHandler(
|
|
53
|
+
// collectionRequest,
|
|
54
|
+
// BaseCollection.prototype,
|
|
55
|
+
// redirect
|
|
56
|
+
// )
|
|
57
|
+
// }
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@awes-io/ui",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.84.0",
|
|
4
4
|
"description": "User Interface (UI) components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ui",
|
|
@@ -113,5 +113,5 @@
|
|
|
113
113
|
"rollup-plugin-visualizer": "^2.6.0",
|
|
114
114
|
"rollup-plugin-vue": "^5.0.1"
|
|
115
115
|
},
|
|
116
|
-
"gitHead": "
|
|
116
|
+
"gitHead": "078158dae22db6592008e4fc37c34e08ccfeb618"
|
|
117
117
|
}
|