@gitlab/ui 62.4.0 → 62.5.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 +7 -0
- package/dist/components/base/avatar/avatar.js +2 -2
- package/dist/components/base/avatar_labeled/avatar_labeled.js +20 -1
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/package.json +2 -2
- package/src/components/base/avatar/avatar.vue +2 -0
- package/src/components/base/avatar_labeled/avatar_labeled.scss +1 -0
- package/src/components/base/avatar_labeled/avatar_labeled.spec.js +18 -5
- package/src/components/base/avatar_labeled/avatar_labeled.stories.js +35 -0
- package/src/components/base/avatar_labeled/avatar_labeled.vue +22 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,10 @@
|
|
|
1
|
+
# [62.5.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v62.4.0...v62.5.0) (2023-04-25)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Features
|
|
5
|
+
|
|
6
|
+
* **GlAvatarLabeled:** link avatar to avatar label link ([35bf39d](https://gitlab.com/gitlab-org/gitlab-ui/commit/35bf39d3baec4f3d84b4fa2c0bc8148f37194a3c))
|
|
7
|
+
|
|
1
8
|
# [62.4.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v62.3.0...v62.4.0) (2023-04-24)
|
|
2
9
|
|
|
3
10
|
|
|
@@ -121,11 +121,11 @@ var script = {
|
|
|
121
121
|
const __vue_script__ = script;
|
|
122
122
|
|
|
123
123
|
/* template */
|
|
124
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.showImage)?_c('img',{class:['gl-avatar', { 'gl-avatar-circle': _vm.isCircle }, _vm.sizeClasses],attrs:{"src":_vm.src,"alt":_vm.alt},on:{"error":_vm.handleLoadError}}):_c('div',{class:[
|
|
124
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.showImage)?_c('img',_vm._g({class:['gl-avatar', { 'gl-avatar-circle': _vm.isCircle }, _vm.sizeClasses],attrs:{"src":_vm.src,"alt":_vm.alt},on:{"error":_vm.handleLoadError}},_vm.$listeners)):_c('div',_vm._g({class:[
|
|
125
125
|
'gl-avatar gl-avatar-identicon',
|
|
126
126
|
{ 'gl-avatar-circle': _vm.isCircle },
|
|
127
127
|
_vm.sizeClasses,
|
|
128
|
-
_vm.identiconBackgroundClass ]},[_vm._v("\n "+_vm._s(_vm.identiconText)+"\n")])};
|
|
128
|
+
_vm.identiconBackgroundClass ]},_vm.$listeners),[_vm._v("\n "+_vm._s(_vm.identiconText)+"\n")])};
|
|
129
129
|
var __vue_staticRenderFns__ = [];
|
|
130
130
|
|
|
131
131
|
/* style */
|
|
@@ -35,6 +35,25 @@ var script = {
|
|
|
35
35
|
},
|
|
36
36
|
hasSubLabelLink() {
|
|
37
37
|
return Boolean(this.subLabelLink);
|
|
38
|
+
},
|
|
39
|
+
avatarListeners() {
|
|
40
|
+
if (this.hasLabelLink) {
|
|
41
|
+
return {
|
|
42
|
+
...this.$listeners,
|
|
43
|
+
click: this.onAvatarClick
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
return this.$listeners;
|
|
47
|
+
},
|
|
48
|
+
avatarCssClasses() {
|
|
49
|
+
return {
|
|
50
|
+
'gl-cursor-pointer': this.hasLabelLink
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
methods: {
|
|
55
|
+
onAvatarClick() {
|
|
56
|
+
this.$refs.labelLink.$el.click();
|
|
38
57
|
}
|
|
39
58
|
}
|
|
40
59
|
};
|
|
@@ -43,7 +62,7 @@ var script = {
|
|
|
43
62
|
const __vue_script__ = script;
|
|
44
63
|
|
|
45
64
|
/* template */
|
|
46
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-avatar-labeled"},[_c('gl-avatar',_vm._g(_vm._b({attrs:{"alt":""}},'gl-avatar',_vm.$attrs,false),_vm
|
|
65
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-avatar-labeled"},[_c('gl-avatar',_vm._g(_vm._b({class:_vm.avatarCssClasses,attrs:{"alt":""}},'gl-avatar',_vm.$attrs,false),_vm.avatarListeners)),_vm._v(" "),_c('div',{staticClass:"gl-avatar-labeled-labels gl-text-left!"},[_c('div',{staticClass:"gl-display-flex gl-flex-wrap gl-align-items-center gl-text-left! gl-mx-n1 gl-my-n1"},[(_vm.hasLabelLink)?_c('gl-link',{ref:"labelLink",staticClass:"gl-avatar-link",attrs:{"href":_vm.labelLink}},[_c('span',{staticClass:"gl-avatar-labeled-label"},[_vm._v(_vm._s(_vm.label))])]):_c('span',{staticClass:"gl-avatar-labeled-label"},[_vm._v(_vm._s(_vm.label))]),_vm._v(" "),_vm._t("meta")],2),_vm._v(" "),(_vm.hasSubLabelLink)?_c('gl-link',{staticClass:"gl-avatar-link",attrs:{"href":_vm.subLabelLink}},[_c('span',{staticClass:"gl-avatar-labeled-sublabel"},[_vm._v(_vm._s(_vm.subLabel))])]):_c('span',{staticClass:"gl-avatar-labeled-sublabel"},[_vm._v(_vm._s(_vm.subLabel))]),_vm._v(" "),_vm._t("default")],2)],1)};
|
|
47
66
|
var __vue_staticRenderFns__ = [];
|
|
48
67
|
|
|
49
68
|
/* style */
|