@gitlab/ui 77.2.0 → 77.4.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 (38) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/components/base/new_dropdowns/base_dropdown/base_dropdown.js +10 -3
  3. package/dist/components/base/sorting/sorting.js +1 -4
  4. package/dist/index.css +2 -2
  5. package/dist/index.css.map +1 -1
  6. package/dist/tokens/common_story_options.js +28 -68
  7. package/dist/tokens/css/tokens.css +1 -1
  8. package/dist/tokens/css/tokens.dark.css +1 -1
  9. package/dist/tokens/js/tokens.dark.js +1 -1
  10. package/dist/tokens/js/tokens.js +1 -1
  11. package/dist/tokens/scss/_tokens.dark.scss +1 -1
  12. package/dist/tokens/scss/_tokens.scss +1 -1
  13. package/dist/tokens/tokens_story.js +83 -0
  14. package/dist/utility_classes.css +1 -1
  15. package/dist/utility_classes.css.map +1 -1
  16. package/package.json +1 -1
  17. package/src/components/base/button/button.stories.js +0 -30
  18. package/src/components/base/button_group/button_group.md +22 -0
  19. package/src/components/base/button_group/button_group.stories.js +92 -12
  20. package/src/components/base/new_dropdowns/base_dropdown/base_dropdown.spec.js +1 -1
  21. package/src/components/base/new_dropdowns/base_dropdown/base_dropdown.vue +8 -1
  22. package/src/components/base/new_dropdowns/disclosure/disclosure_dropdown.md +13 -9
  23. package/src/components/base/new_dropdowns/disclosure/disclosure_dropdown.scss +0 -32
  24. package/src/components/base/new_dropdowns/dropdown.scss +58 -2
  25. package/src/components/base/new_dropdowns/listbox/listbox.md +19 -15
  26. package/src/components/base/sorting/sorting.vue +1 -9
  27. package/src/scss/utilities.scss +12 -0
  28. package/src/scss/utility-mixins/flex.scss +6 -0
  29. package/src/tokens/color.dark.tokens.stories.js +8 -38
  30. package/src/tokens/color.data_viz.dark.tokens.stories.js +7 -27
  31. package/src/tokens/color.data_viz.tokens.stories.js +7 -27
  32. package/src/tokens/color.theme.dark.tokens.stories.js +8 -32
  33. package/src/tokens/color.theme.tokens.stories.js +8 -32
  34. package/src/tokens/color.tokens.stories.js +8 -38
  35. package/src/tokens/color.transparency.tokens.stories.js +5 -14
  36. package/src/tokens/common_story_options.js +21 -67
  37. package/src/tokens/text.tokens.stories.js +4 -7
  38. package/src/tokens/tokens_story.vue +73 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,18 @@
1
+ # [77.4.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v77.3.0...v77.4.0) (2024-02-28)
2
+
3
+
4
+ ### Features
5
+
6
+ * **css:** add two utils ([c1d2b05](https://gitlab.com/gitlab-org/gitlab-ui/commit/c1d2b05a5a829d43da01d735ab601e8a48b7d21e))
7
+ * **css:** remove edits to position.scss ([306f0b4](https://gitlab.com/gitlab-org/gitlab-ui/commit/306f0b43c08e813b2bc618c1517183b4fa5a5413))
8
+
9
+ # [77.3.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v77.2.0...v77.3.0) (2024-02-28)
10
+
11
+
12
+ ### Features
13
+
14
+ * **GlCollapsibleListbox:** Render correctly in button group ([aa7b93a](https://gitlab.com/gitlab-org/gitlab-ui/commit/aa7b93abfa807f01b1353723a5f3af3d808a9506))
15
+
1
16
  # [77.2.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v77.1.0...v77.2.0) (2024-02-27)
2
17
 
3
18
 
@@ -145,9 +145,15 @@ var script = {
145
145
  };
146
146
  },
147
147
  computed: {
148
- isIconOnly() {
148
+ hasNoVisibleToggleText() {
149
149
  var _this$toggleText;
150
- return Boolean(this.icon && (!((_this$toggleText = this.toggleText) !== null && _this$toggleText !== void 0 && _this$toggleText.length) || this.textSrOnly));
150
+ return !((_this$toggleText = this.toggleText) !== null && _this$toggleText !== void 0 && _this$toggleText.length) || this.textSrOnly;
151
+ },
152
+ isIconOnly() {
153
+ return Boolean(this.icon && this.hasNoVisibleToggleText);
154
+ },
155
+ isCaretOnly() {
156
+ return !this.noCaret && !this.icon && this.hasNoVisibleToggleText;
151
157
  },
152
158
  ariaAttributes() {
153
159
  return {
@@ -161,7 +167,8 @@ var script = {
161
167
  return [this.toggleClass, {
162
168
  'gl-new-dropdown-toggle': true,
163
169
  'gl-new-dropdown-icon-only btn-icon': this.isIconOnly,
164
- 'gl-new-dropdown-toggle-no-caret': this.noCaret
170
+ 'gl-new-dropdown-toggle-no-caret': this.noCaret,
171
+ 'gl-new-dropdown-caret-only': this.isCaretOnly
165
172
  }];
166
173
  },
167
174
  toggleButtonTextClasses() {
@@ -101,9 +101,6 @@ var script = {
101
101
  sortDirectionText() {
102
102
  if (this.sortDirectionToolTip) return this.sortDirectionToolTip;
103
103
  return this.isAscending ? translate('GlSorting.sortAscending', 'Sort direction: ascending') : translate('GlSorting.sortDescending', 'Sort direction: descending');
104
- },
105
- listboxToggleClass() {
106
- return [this.dropdownToggleClass, 'gl-rounded-top-right-none!', 'gl-rounded-bottom-right-none!', 'gl-focus-z-index-1'];
107
104
  }
108
105
  },
109
106
  methods: {
@@ -139,7 +136,7 @@ var script = {
139
136
  const __vue_script__ = script;
140
137
 
141
138
  /* template */
142
- var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-button-group',{staticClass:"gl-sorting"},[_c('gl-collapsible-listbox',{class:_vm.dropdownClass,attrs:{"toggle-text":_vm.text,"items":_vm.sortOptions,"selected":_vm.sortBy,"toggle-class":_vm.listboxToggleClass,"placement":"right","block":_vm.block},on:{"select":_vm.onSortByChanged}}),_vm._v(" "),_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],class:['sorting-direction-button', _vm.sortDirectionToggleClass],attrs:{"title":_vm.sortDirectionText,"icon":_vm.localSortDirection,"aria-label":_vm.sortDirectionText},on:{"click":_vm.toggleSortDirection}})],1)};
139
+ var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-button-group',{staticClass:"gl-sorting"},[_c('gl-collapsible-listbox',{class:_vm.dropdownClass,attrs:{"toggle-text":_vm.text,"items":_vm.sortOptions,"selected":_vm.sortBy,"toggle-class":_vm.dropdownToggleClass,"placement":"right","block":_vm.block},on:{"select":_vm.onSortByChanged}}),_vm._v(" "),_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip"}],class:['sorting-direction-button', _vm.sortDirectionToggleClass],attrs:{"title":_vm.sortDirectionText,"icon":_vm.localSortDirection,"aria-label":_vm.sortDirectionText},on:{"click":_vm.toggleSortDirection}})],1)};
143
140
  var __vue_staticRenderFns__ = [];
144
141
 
145
142
  /* style */