@gitlab/ui 62.4.0 → 62.5.1

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [62.5.1](https://gitlab.com/gitlab-org/gitlab-ui/compare/v62.5.0...v62.5.1) (2023-04-28)
+
+
+### Bug Fixes
+
+* **utils:** Change color util to use relative luminance ([6245128](https://gitlab.com/gitlab-org/gitlab-ui/commit/6245128c7256e3d8db164b92e9580c79d47e9183))
+
+# [62.5.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v62.4.0...v62.5.0) (2023-04-25)
+
+
+### Features
+
+* **GlAvatarLabeled:** link avatar to avatar label link ([35bf39d](https://gitlab.com/gitlab-org/gitlab-ui/commit/35bf39d3baec4f3d84b4fa2c0bc8148f37194a3c))
+
 # [62.4.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v62.3.0...v62.4.0) (2023-04-24)
 
 

package/README.md

@@ -121,25 +121,6 @@ should conform with the design system specs, and they should look correct in the
 the GitLab product. Please see [Debugging GitLab UI issues with GitLab product CSS](doc/debugging-gitlab-ui-with-gitlab-css.md)
 for information on how to debug issues with GitLab product CSS in GitLab UI.
 
-#### Running visual regression tests locally
-
-Visual difference tests form part of the test suite. Rendered output can vary
-from host to host (e.g., due to available fonts and how each platform renders
-them), so these can fail when run locally. The easiest way to work around this
-is to run a percent-based diff, and to increase the failure threshold with the
-`FAILURE_THRESHOLD_TYPE` and `FAILURE_THRESHOLD` environment variables:
-
-```sh
-# Sets a 2% threshold
-FAILURE_THRESHOLD_TYPE='percent' FAILURE_THRESHOLD=.02 yarn test:visual
-```
-
-`FAILURE_THRESHOLD_TYPE` defaults to `'pixel'` and `FAILURE_THRESHOLD` defaults to `1`. In the CI
-environment, we consider a 1 pixel difference as a false negative that should not fail the test.
-
-Under the hood, those variables are passed to
-[`jest-image-snapshot`](https://github.com/americanexpress/jest-image-snapshot)'s config
-
 ### End to end tests
 
 Components’ end to end tests live in the `cypress/e2e` folder. See our

package/dist/components/base/avatar/avatar.js

@@ -121,11 +121,11 @@ var script = {
 const __vue_script__ = script;
 
 /* template */
-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:[
+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:[
     'gl-avatar gl-avatar-identicon',
     { 'gl-avatar-circle': _vm.isCircle },
     _vm.sizeClasses,
-    _vm.identiconBackgroundClass ]},[_vm._v("\n  "+_vm._s(_vm.identiconText)+"\n")])};
+    _vm.identiconBackgroundClass ]},_vm.$listeners),[_vm._v("\n  "+_vm._s(_vm.identiconText)+"\n")])};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/dist/components/base/avatar_labeled/avatar_labeled.js

@@ -35,6 +35,25 @@ var script = {
     },
     hasSubLabelLink() {
       return Boolean(this.subLabelLink);
+    },
+    avatarListeners() {
+      if (this.hasLabelLink) {
+        return {
+          ...this.$listeners,
+          click: this.onAvatarClick
+        };
+      }
+      return this.$listeners;
+    },
+    avatarCssClasses() {
+      return {
+        'gl-cursor-pointer': this.hasLabelLink
+      };
+    }
+  },
+  methods: {
+    onAvatarClick() {
+      this.$refs.labelLink.$el.click();
     }
   }
 };
@@ -43,7 +62,7 @@ var script = {
 const __vue_script__ = script;
 
 /* template */
-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.$listeners)),_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',{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)};
+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)};
 var __vue_staticRenderFns__ = [];
 
   /* style */