@gitlab/ui 74.9.1 → 74.9.2

package/CHANGELOG.md

@@ -1,3 +1,14 @@
+## [74.9.2](https://gitlab.com/gitlab-org/gitlab-ui/compare/v74.9.1...v74.9.2) (2024-02-20)
+
+
+### Bug Fixes
+
+* Align left margin for inactive state ([5e20544](https://gitlab.com/gitlab-org/gitlab-ui/commit/5e205440d96b613fdec9f324f70dfc8a0bb11692))
+* Decrease left margin for icon ([1b2e829](https://gitlab.com/gitlab-org/gitlab-ui/commit/1b2e829d1b810521b864ac23f878a88ca2fc6ff7))
+* Make icon darker again ([6350e75](https://gitlab.com/gitlab-org/gitlab-ui/commit/6350e7530835496fb3c68dba8e68b0251574a146))
+* Move icon sort position in table ([28f2599](https://gitlab.com/gitlab-org/gitlab-ui/commit/28f25991ec085bf3100d3b1bab380c50547995d2))
+* Simplify if statements and width ([21bc5b2](https://gitlab.com/gitlab-org/gitlab-ui/commit/21bc5b2d3bc4a9fcfc4bcfba512ca6a329f0c95f))
+
 ## [74.9.1](https://gitlab.com/gitlab-org/gitlab-ui/compare/v74.9.0...v74.9.1) (2024-02-20)
 
 

package/dist/components/base/table/table.js

@@ -1,4 +1,5 @@
 import { BTable } from 'bootstrap-vue/esm/index.js';
+import GlIcon from '../icon/icon';
 import { isDev, logWarning } from '../../../utils/utils';
 import { tableFullProps, tableFullSlots, glTableLiteWarning } from './constants';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
@@ -17,7 +18,8 @@ const {
 var script = {
   name: 'GlTable',
   components: {
-    BTable
+    BTable,
+    GlIcon
   },
   inheritAttrs: false,
   props: {
@@ -31,14 +33,33 @@ var script = {
       type: Boolean,
       default: false,
       required: false
+    },
+    sortBy: {
+      type: String,
+      required: false,
+      default: undefined
+    },
+    sortDesc: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
+  data() {
+    return {
+      localSortBy: this.sortBy,
+      localSortDesc: this.sortDesc
+    };
+  },
   computed: {
     stickyHeaderClass() {
       return this.stickyHeader ? 'gl-table--sticky-header' : null;
     },
     localTableClass() {
       return ['gl-table', this.tableClass, this.stickyHeaderClass];
+    },
+    headSlots() {
+      return ['head()', ...Object.keys(this.$scopedSlots).filter(slotName => slotName.startsWith('head('))];
     }
   },
   mounted() {
@@ -47,6 +68,23 @@ var script = {
     if (isDev() && !shouldUseFullTable(this)) {
       logWarning(glTableLiteWarning, this.$el);
     }
+  },
+  methods: {
+    isSortable(_ref2) {
+      let {
+        field
+      } = _ref2;
+      return field === null || field === void 0 ? void 0 : field.sortable;
+    },
+    getSortingIcon(_ref3) {
+      let {
+        field
+      } = _ref3;
+      if (this.localSortBy !== (field === null || field === void 0 ? void 0 : field.key)) {
+        return null;
+      }
+      return this.localSortDesc ? 'arrow-down' : 'arrow-up';
+    }
   }
 };
 
@@ -54,7 +92,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('b-table',_vm._g(_vm._b({attrs:{"table-class":_vm.localTableClass,"fields":_vm.fields},scopedSlots:_vm._u([_vm._l((Object.keys(_vm.$scopedSlots)),function(slot){return {key:slot,fn:function(scope){return [_vm._t(slot,null,null,scope)]}}})],null,true)},'b-table',_vm.$attrs,false),_vm.$listeners))};
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-table',_vm._g(_vm._b({attrs:{"table-class":_vm.localTableClass,"fields":_vm.fields,"sort-by":_vm.localSortBy,"sort-desc":_vm.localSortDesc},on:{"update:sortBy":function($event){_vm.localSortBy=$event;},"update:sort-by":function($event){_vm.localSortBy=$event;},"update:sortDesc":function($event){_vm.localSortDesc=$event;},"update:sort-desc":function($event){_vm.localSortDesc=$event;}},scopedSlots:_vm._u([_vm._l((Object.keys(_vm.$scopedSlots)),function(slotName){return {key:slotName,fn:function(scope){return [_vm._t(slotName,null,null,scope)]}}}),_vm._l((_vm.headSlots),function(headSlotName){return {key:headSlotName,fn:function(scope){return [_c('div',{key:headSlotName,staticClass:"gl-display-flex gl-align-items-center"},[_vm._t(headSlotName,function(){return [_vm._v(_vm._s(scope.label))]},null,scope),(_vm.isSortable(scope))?[(_vm.getSortingIcon(scope))?_c('gl-icon',{staticClass:"gl-ml-3 gl-min-w-5 gl-text-gray-900",attrs:{"name":_vm.getSortingIcon(scope)}}):_c('div',{staticClass:"gl-display-inline-block gl-w-5 gl-h-5 gl-ml-3"})]:_vm._e()],2)]}}})],null,true)},'b-table',_vm.$attrs,false),_vm.$listeners))};
 var __vue_staticRenderFns__ = [];
 
   /* style */