@zeedhi/zd-avatar-vue 1.4.0 → 1.6.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 (4) hide show
  1. package/README.md +121 -121
  2. package/dist/avatar-vue.esm.js +52 -102
  3. package/dist/avatar-vue.umd.js +52 -102
  4. package/package.json +2 -2
package/README.md CHANGED
@@ -1,121 +1,121 @@
1
- # ZdAvatar
2
-
3
- Componente de Avatar construído com o Zeedhi Next
4
-
5
- ### Instalação
6
-
7
- O ZdAvatar é composto pelos pacotes `@zeedhi/zd-avatar-common` e `@zeedhi/zd-avatar-vue`.
8
- Utilize o comando abaixo para instalar ambos automaticamente:
9
-
10
- ```sh
11
- npm install @zeedhi/zd-avatar
12
- ```
13
-
14
- Ou instale os pacotes separadamente:
15
-
16
- ```sh
17
- npm install @zeedhi/zd-avatar-vue @zeedhi/zd-avatar-common
18
- ```
19
-
20
- ### Registro do Componente
21
-
22
- Para registrá-lo, adicione o seguinte código ao inicializar a aplicação (por exemplo no arquivo `zeedhi.ts`)
23
-
24
- ```ts
25
- import Vue from 'vue';
26
- import { ZdAvatar } from '@zeedhi/zd-avatar';
27
- // import { ZdAvatar } from '@zeedhi/zd-avatar-vue'; caso tenha instalado os pacotes separadamente
28
-
29
- Vue.component('ZdAvatar', ZdAvatar);
30
- ```
31
-
32
- ### Uso Básico
33
-
34
- Para utilizá-lo em um Metadata, basta definir a propriedade `component` como `"ZdAvatar"`. Para definir o conteúdo do Avatar, defina a propriedade `avatarSlot` com um array de componentes:
35
-
36
- ```json
37
- {
38
- "name": "card",
39
- "component": "ZdCard",
40
- "cssClass": "zd-display-flex zd-justify-space-around zd-align-center",
41
- "children": [
42
- {
43
- "name": "avatar-1",
44
- "component": "ZdAvatar",
45
- "color": "orange",
46
- "size": 36,
47
- "avatarSlot": [
48
- {
49
- "name": "icon-slot",
50
- "component": "ZdIcon",
51
- "color": "white",
52
- "iconName": "mdi-pencil"
53
- }
54
- ]
55
- },
56
- {
57
- "name": "avatar-2",
58
- "component": "ZdAvatar",
59
- "color": "primary",
60
- "avatarSlot": [
61
- {
62
- "name": "text-slot",
63
- "component": "ZdText",
64
- "cssClass": "white--text",
65
- "text": "ZD"
66
- }
67
- ]
68
- },
69
- {
70
- "name": "avatar-3",
71
- "component": "ZdAvatar",
72
- "size": 62,
73
- "avatarSlot": [
74
- {
75
- "name": "img-slot",
76
- "component": "ZdImage",
77
- "height": "100px",
78
- "src": "https://picsum.photos/id/1005/200/200.jpg"
79
- }
80
- ]
81
- }
82
- ]
83
- }
84
- ```
85
-
86
- <p align="center">
87
- <img src="./img/basic-usage.png" alt="Basic Usage"/>
88
- </p>
89
-
90
-
91
- ### Propriedades
92
-
93
- | **Nome** | **Tipo** | **Padrão** | **Descrição** |
94
- |------------|-------------------------------|------------|---------------------------------------------------------------------------------------------------------------------|
95
- | avatarSlot | IComponentRender\[\] | \[\] | Componentes que serão renderizados dentro do Avatar |
96
- | color | string | "primary" | Aplica a cor especificada ao componente\. Pode ser a cor por extenso no padrão do material design ou em hexadecimal |
97
- | rounded | boolean \| string | false | Aplica uma borda arredondada no Avatar |
98
- | size | number \| string | 48 | Largura e altura do Avatar |
99
- | tile | boolean | false | Remove o border\-radius do componente |
100
- | height | number \| string \| undefined | undefined | Altura do componente |
101
- | maxHeight | number \| string \| undefined | undefined | Altura máxima do componente |
102
- | maxWidth | number \| string \| undefined | undefined | Largura máxima do componente |
103
- | minHeight | number \| string \| undefined | undefined | Altura mínima do componente |
104
- | minWidth | number \| string \| undefined | undefined | Largura mínima do componente |
105
- | width | number \| string \| undefined | undefined | Largura do componente |
106
-
107
-
108
-
109
- #### Eventos
110
-
111
- O Avatar aceita apenas um evento, que é o de click:
112
-
113
- ```json
114
- {
115
- "name": "click-avatar",
116
- "component": "ZdAvatar",
117
- "events": {
118
- "click": "{{Controller.clickEvent}}"
119
- }
120
- }
121
- ```
1
+ # ZdAvatar
2
+
3
+ Componente de Avatar construído com o Zeedhi Next
4
+
5
+ ### Instalação
6
+
7
+ O ZdAvatar é composto pelos pacotes `@zeedhi/zd-avatar-common` e `@zeedhi/zd-avatar-vue`.
8
+ Utilize o comando abaixo para instalar ambos automaticamente:
9
+
10
+ ```sh
11
+ npm install @zeedhi/zd-avatar
12
+ ```
13
+
14
+ Ou instale os pacotes separadamente:
15
+
16
+ ```sh
17
+ npm install @zeedhi/zd-avatar-vue @zeedhi/zd-avatar-common
18
+ ```
19
+
20
+ ### Registro do Componente
21
+
22
+ Para registrá-lo, adicione o seguinte código ao inicializar a aplicação (por exemplo no arquivo `zeedhi.ts`)
23
+
24
+ ```ts
25
+ import Vue from 'vue';
26
+ import { ZdAvatar } from '@zeedhi/zd-avatar';
27
+ // import { ZdAvatar } from '@zeedhi/zd-avatar-vue'; caso tenha instalado os pacotes separadamente
28
+
29
+ Vue.component('ZdAvatar', ZdAvatar);
30
+ ```
31
+
32
+ ### Uso Básico
33
+
34
+ Para utilizá-lo em um Metadata, basta definir a propriedade `component` como `"ZdAvatar"`. Para definir o conteúdo do Avatar, defina a propriedade `avatarSlot` com um array de componentes:
35
+
36
+ ```json
37
+ {
38
+ "name": "card",
39
+ "component": "ZdCard",
40
+ "cssClass": "zd-display-flex zd-justify-space-around zd-align-center",
41
+ "children": [
42
+ {
43
+ "name": "avatar-1",
44
+ "component": "ZdAvatar",
45
+ "color": "orange",
46
+ "size": 36,
47
+ "avatarSlot": [
48
+ {
49
+ "name": "icon-slot",
50
+ "component": "ZdIcon",
51
+ "color": "white",
52
+ "iconName": "mdi-pencil"
53
+ }
54
+ ]
55
+ },
56
+ {
57
+ "name": "avatar-2",
58
+ "component": "ZdAvatar",
59
+ "color": "primary",
60
+ "avatarSlot": [
61
+ {
62
+ "name": "text-slot",
63
+ "component": "ZdText",
64
+ "cssClass": "white--text",
65
+ "text": "ZD"
66
+ }
67
+ ]
68
+ },
69
+ {
70
+ "name": "avatar-3",
71
+ "component": "ZdAvatar",
72
+ "size": 62,
73
+ "avatarSlot": [
74
+ {
75
+ "name": "img-slot",
76
+ "component": "ZdImage",
77
+ "height": "100px",
78
+ "src": "https://picsum.photos/id/1005/200/200.jpg"
79
+ }
80
+ ]
81
+ }
82
+ ]
83
+ }
84
+ ```
85
+
86
+ <p align="center">
87
+ <img src="./img/basic-usage.png" alt="Basic Usage"/>
88
+ </p>
89
+
90
+
91
+ ### Propriedades
92
+
93
+ | **Nome** | **Tipo** | **Padrão** | **Descrição** |
94
+ |------------|-------------------------------|------------|---------------------------------------------------------------------------------------------------------------------|
95
+ | avatarSlot | IComponentRender\[\] | \[\] | Componentes que serão renderizados dentro do Avatar |
96
+ | color | string | "primary" | Aplica a cor especificada ao componente\. Pode ser a cor por extenso no padrão do material design ou em hexadecimal |
97
+ | rounded | boolean \| string | false | Aplica uma borda arredondada no Avatar |
98
+ | size | number \| string | 48 | Largura e altura do Avatar |
99
+ | tile | boolean | false | Remove o border\-radius do componente |
100
+ | height | number \| string \| undefined | undefined | Altura do componente |
101
+ | maxHeight | number \| string \| undefined | undefined | Altura máxima do componente |
102
+ | maxWidth | number \| string \| undefined | undefined | Largura máxima do componente |
103
+ | minHeight | number \| string \| undefined | undefined | Altura mínima do componente |
104
+ | minWidth | number \| string \| undefined | undefined | Largura mínima do componente |
105
+ | width | number \| string \| undefined | undefined | Largura do componente |
106
+
107
+
108
+
109
+ #### Eventos
110
+
111
+ O Avatar aceita apenas um evento, que é o de click:
112
+
113
+ ```json
114
+ {
115
+ "name": "click-avatar",
116
+ "component": "ZdAvatar",
117
+ "events": {
118
+ "click": "{{Controller.clickEvent}}"
119
+ }
120
+ }
121
+ ```
package/dist/avatar-vue.esm.js CHANGED
@@ -29,7 +29,7 @@ function __metadata(metadataKey, metadataValue) {
29
29
  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
30
30
  }
31
31
 
32
- let ZdAvatar$2 = class ZdAvatar extends ZdComponentRender {
32
+ let ZdAvatar = class ZdAvatar extends ZdComponentRender {
33
33
  constructor() {
34
34
  super(...arguments);
35
35
  this.instanceType = Avatar;
@@ -38,51 +38,51 @@ let ZdAvatar$2 = class ZdAvatar extends ZdComponentRender {
38
38
  __decorate([
39
39
  PropWatch({ type: [String, Number], default: 48 }),
40
40
  __metadata("design:type", Object)
41
- ], ZdAvatar$2.prototype, "size", void 0);
41
+ ], ZdAvatar.prototype, "size", void 0);
42
42
  __decorate([
43
43
  PropWatch({ type: [String, Boolean], default: false }),
44
44
  __metadata("design:type", Boolean)
45
- ], ZdAvatar$2.prototype, "tile", void 0);
45
+ ], ZdAvatar.prototype, "tile", void 0);
46
46
  __decorate([
47
47
  Prop({ type: [String, Array], default: () => ([]) }),
48
48
  __metadata("design:type", Array)
49
- ], ZdAvatar$2.prototype, "avatarSlot", void 0);
49
+ ], ZdAvatar.prototype, "avatarSlot", void 0);
50
50
  __decorate([
51
51
  PropWatch({ type: [String], default: '' }),
52
52
  __metadata("design:type", String)
53
- ], ZdAvatar$2.prototype, "color", void 0);
53
+ ], ZdAvatar.prototype, "color", void 0);
54
54
  __decorate([
55
55
  PropWatch({ type: [String, Boolean], default: false }),
56
56
  __metadata("design:type", Boolean)
57
- ], ZdAvatar$2.prototype, "rounded", void 0);
57
+ ], ZdAvatar.prototype, "rounded", void 0);
58
58
  __decorate([
59
59
  PropWatch({ type: [String, Number] }),
60
60
  __metadata("design:type", Object)
61
- ], ZdAvatar$2.prototype, "height", void 0);
61
+ ], ZdAvatar.prototype, "height", void 0);
62
62
  __decorate([
63
63
  PropWatch({ type: [String, Number] }),
64
64
  __metadata("design:type", Object)
65
- ], ZdAvatar$2.prototype, "minHeight", void 0);
65
+ ], ZdAvatar.prototype, "minHeight", void 0);
66
66
  __decorate([
67
67
  PropWatch({ type: [String, Number] }),
68
68
  __metadata("design:type", Object)
69
- ], ZdAvatar$2.prototype, "maxHeight", void 0);
69
+ ], ZdAvatar.prototype, "maxHeight", void 0);
70
70
  __decorate([
71
71
  PropWatch({ type: [String, Number] }),
72
72
  __metadata("design:type", Object)
73
- ], ZdAvatar$2.prototype, "width", void 0);
73
+ ], ZdAvatar.prototype, "width", void 0);
74
74
  __decorate([
75
75
  PropWatch({ type: [String, Number] }),
76
76
  __metadata("design:type", Object)
77
- ], ZdAvatar$2.prototype, "minWidth", void 0);
77
+ ], ZdAvatar.prototype, "minWidth", void 0);
78
78
  __decorate([
79
79
  PropWatch({ type: [String, Number] }),
80
80
  __metadata("design:type", Object)
81
- ], ZdAvatar$2.prototype, "maxWidth", void 0);
82
- ZdAvatar$2 = __decorate([
81
+ ], ZdAvatar.prototype, "maxWidth", void 0);
82
+ ZdAvatar = __decorate([
83
83
  Component
84
- ], ZdAvatar$2);
85
- var script = ZdAvatar$2;
84
+ ], ZdAvatar);
85
+ var script = ZdAvatar;
86
86
 
87
87
  function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
88
88
  if (typeof shadowMode !== 'boolean') {
@@ -222,38 +222,43 @@ var __vue_render__ = function () {
222
222
  var _c = _vm._self._c || _h;
223
223
  return _c(
224
224
  "v-avatar",
225
- _vm._g(
226
- {
227
- directives: [
228
- {
229
- name: "show",
230
- rawName: "v-show",
231
- value: _vm.instance.isVisible,
232
- expression: "instance.isVisible",
233
- },
234
- ],
235
- class: [
236
- _vm.instance.cssClass,
237
- "zd-avatar",
238
- { "zd-avatar--link": !!_vm.instance.events.click },
239
- ],
240
- style: _vm.instance.cssStyle,
241
- attrs: {
242
- size: _vm.instance.size,
243
- tile: _vm.instance.tile,
244
- color: _vm.instance.color,
245
- rounded: _vm.instance.rounded,
246
- height: _vm.instance.height,
247
- minHeight: _vm.instance.minHeight,
248
- maxHeight: _vm.instance.maxHeight,
249
- width: _vm.instance.width,
250
- minWidth: _vm.instance.minWidth,
251
- maxWidth: _vm.instance.maxWidth,
225
+ {
226
+ directives: [
227
+ {
228
+ name: "show",
229
+ rawName: "v-show",
230
+ value: _vm.instance.isVisible,
231
+ expression: "instance.isVisible",
252
232
  },
253
- on: { click: _vm.click },
233
+ ],
234
+ class: [
235
+ _vm.instance.cssClass,
236
+ "zd-avatar",
237
+ { "zd-avatar--link": !!_vm.instance.events.click },
238
+ ],
239
+ style: _vm.instance.cssStyle,
240
+ attrs: {
241
+ size: _vm.instance.size,
242
+ tile: _vm.instance.tile,
243
+ color: _vm.instance.color,
244
+ rounded: _vm.instance.rounded,
245
+ height: _vm.instance.height,
246
+ minHeight: _vm.instance.minHeight,
247
+ maxHeight: _vm.instance.maxHeight,
248
+ width: _vm.instance.width,
249
+ minWidth: _vm.instance.minWidth,
250
+ maxWidth: _vm.instance.maxWidth,
254
251
  },
255
- Object.assign({}, _vm.$attrs["dropdown-activator"])
256
- ),
252
+ on: {
253
+ click: _vm.click,
254
+ mouseenter: function ($event) {
255
+ return _vm.mouseenter($event)
256
+ },
257
+ mouseleave: function ($event) {
258
+ return _vm.mouseleave($event)
259
+ },
260
+ },
261
+ },
257
262
  _vm._l(_vm.instance.avatarSlot, function (comp, index) {
258
263
  return _c(
259
264
  comp.component,
@@ -274,7 +279,7 @@ __vue_render__._withStripped = true;
274
279
  /* style */
275
280
  const __vue_inject_styles__ = function (inject) {
276
281
  if (!inject) return
277
- inject("data-v-0161a88a_0", { source: ".zd-avatar--link {\n cursor: pointer;\n}", map: undefined, media: undefined });
282
+ inject("data-v-253deda5_0", { source: ".zd-avatar--link {\n cursor: pointer;\n}", map: undefined, media: undefined });
278
283
 
279
284
  };
280
285
  /* scoped */
@@ -302,62 +307,7 @@ __vue_render__._withStripped = true;
302
307
  undefined
303
308
  );
304
309
 
305
- let ZdAvatar = class ZdAvatar extends ZdComponentRender {
306
- constructor() {
307
- super(...arguments);
308
- this.instanceType = Avatar;
309
- }
310
- };
311
- __decorate([
312
- PropWatch({ type: [String, Number], default: 48 }),
313
- __metadata("design:type", Object)
314
- ], ZdAvatar.prototype, "size", void 0);
315
- __decorate([
316
- PropWatch({ type: [String, Boolean], default: false }),
317
- __metadata("design:type", Boolean)
318
- ], ZdAvatar.prototype, "tile", void 0);
319
- __decorate([
320
- Prop({ type: [String, Array], default: () => ([]) }),
321
- __metadata("design:type", Array)
322
- ], ZdAvatar.prototype, "avatarSlot", void 0);
323
- __decorate([
324
- PropWatch({ type: [String], default: '' }),
325
- __metadata("design:type", String)
326
- ], ZdAvatar.prototype, "color", void 0);
327
- __decorate([
328
- PropWatch({ type: [String, Boolean], default: false }),
329
- __metadata("design:type", Boolean)
330
- ], ZdAvatar.prototype, "rounded", void 0);
331
- __decorate([
332
- PropWatch({ type: [String, Number] }),
333
- __metadata("design:type", Object)
334
- ], ZdAvatar.prototype, "height", void 0);
335
- __decorate([
336
- PropWatch({ type: [String, Number] }),
337
- __metadata("design:type", Object)
338
- ], ZdAvatar.prototype, "minHeight", void 0);
339
- __decorate([
340
- PropWatch({ type: [String, Number] }),
341
- __metadata("design:type", Object)
342
- ], ZdAvatar.prototype, "maxHeight", void 0);
343
- __decorate([
344
- PropWatch({ type: [String, Number] }),
345
- __metadata("design:type", Object)
346
- ], ZdAvatar.prototype, "width", void 0);
347
- __decorate([
348
- PropWatch({ type: [String, Number] }),
349
- __metadata("design:type", Object)
350
- ], ZdAvatar.prototype, "minWidth", void 0);
351
- __decorate([
352
- PropWatch({ type: [String, Number] }),
353
- __metadata("design:type", Object)
354
- ], ZdAvatar.prototype, "maxWidth", void 0);
355
- ZdAvatar = __decorate([
356
- Component
357
- ], ZdAvatar);
358
- var ZdAvatar$1 = ZdAvatar;
359
-
360
310
  const packageContent = require('../package.json');
361
311
  VersionService.addPackageVersion(packageContent.name, packageContent.version);
362
312
 
363
- export { __vue_component__ as ZdAvatar, ZdAvatar$1 as ZdAvatarClass };
313
+ export { __vue_component__ as ZdAvatar, script as ZdAvatarClass };
package/dist/avatar-vue.umd.js CHANGED
@@ -30,7 +30,7 @@
30
30
  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
31
31
  }
32
32
 
33
- let ZdAvatar$2 = class ZdAvatar extends vuetify.ZdComponentRender {
33
+ let ZdAvatar = class ZdAvatar extends vuetify.ZdComponentRender {
34
34
  constructor() {
35
35
  super(...arguments);
36
36
  this.instanceType = zdAvatarCommon.Avatar;
@@ -39,51 +39,51 @@
39
39
  __decorate([
40
40
  vuetify.PropWatch({ type: [String, Number], default: 48 }),
41
41
  __metadata("design:type", Object)
42
- ], ZdAvatar$2.prototype, "size", void 0);
42
+ ], ZdAvatar.prototype, "size", void 0);
43
43
  __decorate([
44
44
  vuetify.PropWatch({ type: [String, Boolean], default: false }),
45
45
  __metadata("design:type", Boolean)
46
- ], ZdAvatar$2.prototype, "tile", void 0);
46
+ ], ZdAvatar.prototype, "tile", void 0);
47
47
  __decorate([
48
48
  vuePropertyDecorator.Prop({ type: [String, Array], default: () => ([]) }),
49
49
  __metadata("design:type", Array)
50
- ], ZdAvatar$2.prototype, "avatarSlot", void 0);
50
+ ], ZdAvatar.prototype, "avatarSlot", void 0);
51
51
  __decorate([
52
52
  vuetify.PropWatch({ type: [String], default: '' }),
53
53
  __metadata("design:type", String)
54
- ], ZdAvatar$2.prototype, "color", void 0);
54
+ ], ZdAvatar.prototype, "color", void 0);
55
55
  __decorate([
56
56
  vuetify.PropWatch({ type: [String, Boolean], default: false }),
57
57
  __metadata("design:type", Boolean)
58
- ], ZdAvatar$2.prototype, "rounded", void 0);
58
+ ], ZdAvatar.prototype, "rounded", void 0);
59
59
  __decorate([
60
60
  vuetify.PropWatch({ type: [String, Number] }),
61
61
  __metadata("design:type", Object)
62
- ], ZdAvatar$2.prototype, "height", void 0);
62
+ ], ZdAvatar.prototype, "height", void 0);
63
63
  __decorate([
64
64
  vuetify.PropWatch({ type: [String, Number] }),
65
65
  __metadata("design:type", Object)
66
- ], ZdAvatar$2.prototype, "minHeight", void 0);
66
+ ], ZdAvatar.prototype, "minHeight", void 0);
67
67
  __decorate([
68
68
  vuetify.PropWatch({ type: [String, Number] }),
69
69
  __metadata("design:type", Object)
70
- ], ZdAvatar$2.prototype, "maxHeight", void 0);
70
+ ], ZdAvatar.prototype, "maxHeight", void 0);
71
71
  __decorate([
72
72
  vuetify.PropWatch({ type: [String, Number] }),
73
73
  __metadata("design:type", Object)
74
- ], ZdAvatar$2.prototype, "width", void 0);
74
+ ], ZdAvatar.prototype, "width", void 0);
75
75
  __decorate([
76
76
  vuetify.PropWatch({ type: [String, Number] }),
77
77
  __metadata("design:type", Object)
78
- ], ZdAvatar$2.prototype, "minWidth", void 0);
78
+ ], ZdAvatar.prototype, "minWidth", void 0);
79
79
  __decorate([
80
80
  vuetify.PropWatch({ type: [String, Number] }),
81
81
  __metadata("design:type", Object)
82
- ], ZdAvatar$2.prototype, "maxWidth", void 0);
83
- ZdAvatar$2 = __decorate([
82
+ ], ZdAvatar.prototype, "maxWidth", void 0);
83
+ ZdAvatar = __decorate([
84
84
  vuePropertyDecorator.Component
85
- ], ZdAvatar$2);
86
- var script = ZdAvatar$2;
85
+ ], ZdAvatar);
86
+ var script = ZdAvatar;
87
87
 
88
88
  function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
89
89
  if (typeof shadowMode !== 'boolean') {
@@ -223,38 +223,43 @@
223
223
  var _c = _vm._self._c || _h;
224
224
  return _c(
225
225
  "v-avatar",
226
- _vm._g(
227
- {
228
- directives: [
229
- {
230
- name: "show",
231
- rawName: "v-show",
232
- value: _vm.instance.isVisible,
233
- expression: "instance.isVisible",
234
- },
235
- ],
236
- class: [
237
- _vm.instance.cssClass,
238
- "zd-avatar",
239
- { "zd-avatar--link": !!_vm.instance.events.click },
240
- ],
241
- style: _vm.instance.cssStyle,
242
- attrs: {
243
- size: _vm.instance.size,
244
- tile: _vm.instance.tile,
245
- color: _vm.instance.color,
246
- rounded: _vm.instance.rounded,
247
- height: _vm.instance.height,
248
- minHeight: _vm.instance.minHeight,
249
- maxHeight: _vm.instance.maxHeight,
250
- width: _vm.instance.width,
251
- minWidth: _vm.instance.minWidth,
252
- maxWidth: _vm.instance.maxWidth,
226
+ {
227
+ directives: [
228
+ {
229
+ name: "show",
230
+ rawName: "v-show",
231
+ value: _vm.instance.isVisible,
232
+ expression: "instance.isVisible",
253
233
  },
254
- on: { click: _vm.click },
234
+ ],
235
+ class: [
236
+ _vm.instance.cssClass,
237
+ "zd-avatar",
238
+ { "zd-avatar--link": !!_vm.instance.events.click },
239
+ ],
240
+ style: _vm.instance.cssStyle,
241
+ attrs: {
242
+ size: _vm.instance.size,
243
+ tile: _vm.instance.tile,
244
+ color: _vm.instance.color,
245
+ rounded: _vm.instance.rounded,
246
+ height: _vm.instance.height,
247
+ minHeight: _vm.instance.minHeight,
248
+ maxHeight: _vm.instance.maxHeight,
249
+ width: _vm.instance.width,
250
+ minWidth: _vm.instance.minWidth,
251
+ maxWidth: _vm.instance.maxWidth,
255
252
  },
256
- Object.assign({}, _vm.$attrs["dropdown-activator"])
257
- ),
253
+ on: {
254
+ click: _vm.click,
255
+ mouseenter: function ($event) {
256
+ return _vm.mouseenter($event)
257
+ },
258
+ mouseleave: function ($event) {
259
+ return _vm.mouseleave($event)
260
+ },
261
+ },
262
+ },
258
263
  _vm._l(_vm.instance.avatarSlot, function (comp, index) {
259
264
  return _c(
260
265
  comp.component,
@@ -275,7 +280,7 @@
275
280
  /* style */
276
281
  const __vue_inject_styles__ = function (inject) {
277
282
  if (!inject) return
278
- inject("data-v-0161a88a_0", { source: ".zd-avatar--link {\n cursor: pointer;\n}", map: undefined, media: undefined });
283
+ inject("data-v-253deda5_0", { source: ".zd-avatar--link {\n cursor: pointer;\n}", map: undefined, media: undefined });
279
284
 
280
285
  };
281
286
  /* scoped */
@@ -303,66 +308,11 @@
303
308
  undefined
304
309
  );
305
310
 
306
- let ZdAvatar = class ZdAvatar extends vuetify.ZdComponentRender {
307
- constructor() {
308
- super(...arguments);
309
- this.instanceType = zdAvatarCommon.Avatar;
310
- }
311
- };
312
- __decorate([
313
- vuetify.PropWatch({ type: [String, Number], default: 48 }),
314
- __metadata("design:type", Object)
315
- ], ZdAvatar.prototype, "size", void 0);
316
- __decorate([
317
- vuetify.PropWatch({ type: [String, Boolean], default: false }),
318
- __metadata("design:type", Boolean)
319
- ], ZdAvatar.prototype, "tile", void 0);
320
- __decorate([
321
- vuePropertyDecorator.Prop({ type: [String, Array], default: () => ([]) }),
322
- __metadata("design:type", Array)
323
- ], ZdAvatar.prototype, "avatarSlot", void 0);
324
- __decorate([
325
- vuetify.PropWatch({ type: [String], default: '' }),
326
- __metadata("design:type", String)
327
- ], ZdAvatar.prototype, "color", void 0);
328
- __decorate([
329
- vuetify.PropWatch({ type: [String, Boolean], default: false }),
330
- __metadata("design:type", Boolean)
331
- ], ZdAvatar.prototype, "rounded", void 0);
332
- __decorate([
333
- vuetify.PropWatch({ type: [String, Number] }),
334
- __metadata("design:type", Object)
335
- ], ZdAvatar.prototype, "height", void 0);
336
- __decorate([
337
- vuetify.PropWatch({ type: [String, Number] }),
338
- __metadata("design:type", Object)
339
- ], ZdAvatar.prototype, "minHeight", void 0);
340
- __decorate([
341
- vuetify.PropWatch({ type: [String, Number] }),
342
- __metadata("design:type", Object)
343
- ], ZdAvatar.prototype, "maxHeight", void 0);
344
- __decorate([
345
- vuetify.PropWatch({ type: [String, Number] }),
346
- __metadata("design:type", Object)
347
- ], ZdAvatar.prototype, "width", void 0);
348
- __decorate([
349
- vuetify.PropWatch({ type: [String, Number] }),
350
- __metadata("design:type", Object)
351
- ], ZdAvatar.prototype, "minWidth", void 0);
352
- __decorate([
353
- vuetify.PropWatch({ type: [String, Number] }),
354
- __metadata("design:type", Object)
355
- ], ZdAvatar.prototype, "maxWidth", void 0);
356
- ZdAvatar = __decorate([
357
- vuePropertyDecorator.Component
358
- ], ZdAvatar);
359
- var ZdAvatar$1 = ZdAvatar;
360
-
361
311
  const packageContent = require('../package.json');
362
312
  core.VersionService.addPackageVersion(packageContent.name, packageContent.version);
363
313
 
364
314
  exports.ZdAvatar = __vue_component__;
365
- exports.ZdAvatarClass = ZdAvatar$1;
315
+ exports.ZdAvatarClass = script;
366
316
 
367
317
  Object.defineProperty(exports, '__esModule', { value: true });
368
318
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zeedhi/zd-avatar-vue",
3
- "version": "1.4.0",
3
+ "version": "1.6.0",
4
4
  "description": "Implementation of Avatar component using Zeedhi library",
5
5
  "main": "dist/avatar-vue.umd.js",
6
6
  "module": "dist/avatar-vue.esm.js",
@@ -21,5 +21,5 @@
21
21
  "vue-class-component": "^7.2.6",
22
22
  "vue-property-decorator": "^9.1.2"
23
23
  },
24
- "gitHead": "68cfe639d64ecace051b380dbd8f0145533e07cd"
24
+ "gitHead": "80ce416743cc3ae43be740f30b824cdd7cd19aa1"
25
25
  }