@gitlab/ui 32.36.0 → 32.40.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 +28 -0
- package/dist/components/base/carousel/carousel.documentation.js +1 -4
- package/dist/components/base/dropdown/dropdown.js +3 -3
- package/dist/components/base/filtered_search/filtered_search.js +1 -1
- package/dist/components/base/filtered_search/filtered_search_token_segment.js +10 -2
- package/dist/components/base/form/form_input_group/form_input_group.js +6 -1
- package/dist/components/base/markdown/markdown.documentation.js +2 -6
- package/dist/components/base/popover/popover.js +1 -1
- package/dist/components/base/search_box_by_click/search_box_by_click.js +1 -1
- package/dist/components/base/table/constants.js +5 -0
- package/dist/components/base/table/table.js +19 -1
- package/dist/components/charts/bar/bar.js +1 -1
- package/dist/components/charts/sparkline/sparkline.js +1 -1
- package/dist/components/charts/stacked_column/stacked_column.js +1 -1
- package/dist/utility_classes.css +1 -1
- package/dist/utility_classes.css.map +1 -1
- package/dist/utils/constants.js +2 -2
- package/dist/utils/utils.js +12 -2
- package/documentation/documented_stories.js +2 -0
- package/package.json +3 -3
- package/scss_to_js/scss_variables.js +2 -0
- package/scss_to_js/scss_variables.json +11 -1
- package/src/components/base/carousel/carousel.documentation.js +0 -2
- package/src/components/base/carousel/carousel.md +0 -2
- package/src/components/base/carousel/carousel.stories.js +24 -11
- package/src/components/base/dropdown/dropdown.spec.js +6 -9
- package/src/components/base/dropdown/dropdown.stories.js +3 -3
- package/src/components/base/dropdown/dropdown.vue +3 -3
- package/src/components/base/filtered_search/filtered_search.vue +1 -0
- package/src/components/base/filtered_search/filtered_search_token_segment.spec.js +17 -1
- package/src/components/base/filtered_search/filtered_search_token_segment.vue +9 -1
- package/src/components/base/form/form_input_group/form_input_group.spec.js +18 -1
- package/src/components/base/form/form_input_group/form_input_group.vue +6 -1
- package/src/components/base/markdown/markdown.documentation.js +0 -3
- package/src/components/base/markdown/markdown.md +0 -2
- package/src/components/base/markdown/markdown.stories.js +25 -24
- package/src/components/base/popover/popover.spec.js +9 -0
- package/src/components/base/popover/popover.stories.js +37 -12
- package/src/components/base/popover/popover.vue +1 -2
- package/src/components/base/search_box_by_click/search_box_by_click.vue +1 -0
- package/src/components/base/table/constants.js +49 -0
- package/src/components/base/table/table.spec.js +49 -0
- package/src/components/base/table/table.vue +16 -0
- package/src/components/charts/bar/bar.spec.js +0 -15
- package/src/components/charts/bar/bar.vue +3 -2
- package/src/components/charts/sparkline/sparkline.spec.js +21 -27
- package/src/components/charts/sparkline/sparkline.vue +24 -12
- package/src/components/charts/stacked_column/stacked_column.spec.js +11 -1
- package/src/components/charts/stacked_column/stacked_column.vue +5 -8
- package/src/scss/utilities.scss +8 -0
- package/src/scss/utility-mixins/color.scss +4 -0
- package/src/scss/variables.scss +4 -1
- package/src/utils/constants.js +1 -1
- package/src/utils/utils.js +11 -1
- package/dist/components/base/carousel/examples/carousel.basic.example.js +0 -38
- package/dist/components/base/carousel/examples/index.js +0 -13
- package/dist/components/base/markdown/examples/index.js +0 -13
- package/dist/components/base/markdown/examples/markdown.basic.example.js +0 -38
- package/src/components/base/carousel/examples/carousel.basic.example.vue +0 -26
- package/src/components/base/carousel/examples/index.js +0 -15
- package/src/components/base/markdown/examples/index.js +0 -15
- package/src/components/base/markdown/examples/markdown.basic.example.vue +0 -15
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,31 @@
|
|
|
1
|
+
# [32.40.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v32.39.0...v32.40.0) (2021-11-22)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Features
|
|
5
|
+
|
|
6
|
+
* **GlFormInputGroup:** Add `inputClass` prop to `GlFormInputGroup` ([cdc7c70](https://gitlab.com/gitlab-org/gitlab-ui/commit/cdc7c70f81b462237deda76f2a3709119b52489f))
|
|
7
|
+
|
|
8
|
+
# [32.39.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v32.38.0...v32.39.0) (2021-11-19)
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
### Features
|
|
12
|
+
|
|
13
|
+
* **GlFilteredSearch:** Fix typing Colon ([1541d19](https://gitlab.com/gitlab-org/gitlab-ui/commit/1541d191db4acc5aa07385acbd19b2ad5d657a17))
|
|
14
|
+
|
|
15
|
+
# [32.38.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v32.37.0...v32.38.0) (2021-11-17)
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
### Features
|
|
19
|
+
|
|
20
|
+
* **GlFilteredSearchTokenSegment:** Colon support ([abf3856](https://gitlab.com/gitlab-org/gitlab-ui/commit/abf3856396080e6699ddfbcd526991dcea2dc5f3))
|
|
21
|
+
|
|
22
|
+
# [32.37.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v32.36.0...v32.37.0) (2021-11-10)
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
### Features
|
|
26
|
+
|
|
27
|
+
* Add util class for text-secondary ([6d5ee52](https://gitlab.com/gitlab-org/gitlab-ui/commit/6d5ee52f28487b6e8d06eb11c2e4cb2796891efa))
|
|
28
|
+
|
|
1
29
|
# [32.36.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v32.35.0...v32.36.0) (2021-11-09)
|
|
2
30
|
|
|
3
31
|
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var description = "## Carousel\n\nThe carousel is a slideshow for cycling through a series of content, built with CSS 3D\ntransforms. It works with a series of images, text, or custom markup. It also includes support\nfor previous/next controls and indicators.\n";
|
|
1
|
+
var description = "The carousel is a slideshow for cycling through a series of content, built with CSS 3D\ntransforms. It works with a series of images, text, or custom markup. It also includes support\nfor previous/next controls and indicators.\n";
|
|
4
2
|
|
|
5
3
|
var carousel_documentation = {
|
|
6
4
|
description,
|
|
7
|
-
examples,
|
|
8
5
|
bootstrapComponent: 'b-carousel'
|
|
9
6
|
};
|
|
10
7
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { BDropdown } from 'bootstrap-vue/esm/index.js';
|
|
2
2
|
import { selectAll, isVisible } from 'bootstrap-vue/esm/utils/dom';
|
|
3
|
-
import { buttonCategoryOptions,
|
|
3
|
+
import { buttonCategoryOptions, dropdownVariantOptions, buttonSizeOptions } from '../../../utils/constants';
|
|
4
4
|
import { ButtonMixin } from '../../mixins/button_mixin';
|
|
5
5
|
import GlButton from '../button/button';
|
|
6
6
|
import GlIcon from '../icon/icon';
|
|
@@ -99,8 +99,8 @@ var script = {
|
|
|
99
99
|
variant: {
|
|
100
100
|
type: String,
|
|
101
101
|
required: false,
|
|
102
|
-
default:
|
|
103
|
-
validator: value => Object.keys(
|
|
102
|
+
default: dropdownVariantOptions.default,
|
|
103
|
+
validator: value => Object.keys(dropdownVariantOptions).includes(value)
|
|
104
104
|
},
|
|
105
105
|
size: {
|
|
106
106
|
type: String,
|
|
@@ -266,7 +266,7 @@ var script = {
|
|
|
266
266
|
const __vue_script__ = script;
|
|
267
267
|
|
|
268
268
|
/* template */
|
|
269
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-search-box-by-click',_vm._b({attrs:{"value":_vm.tokens,"history-items":_vm.historyItems,"clearable":_vm.hasValue},on:{"submit":_vm.submit,"input":_vm.applyNewValue,"history-item-selected":function($event){return _vm.$emit('history-item-selected', $event)},"clear":function($event){return _vm.$emit('clear')},"clear-history":function($event){return _vm.$emit('clear-history')}},scopedSlots:_vm._u([{key:"history-item",fn:function(slotScope){return [_vm._t("history-item",null,null,slotScope)]}},{key:"input",fn:function(){return [_c('div',{staticClass:"gl-filtered-search-scrollable"},[_vm._l((_vm.tokens),function(token,idx){return [_c(_vm.getTokenComponent(token.type),{key:((token.type) + "-" + idx),ref:"tokens",refInFor:true,tag:"component",staticClass:"gl-filtered-search-item",class:{
|
|
269
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-search-box-by-click',_vm._b({attrs:{"value":_vm.tokens,"history-items":_vm.historyItems,"clearable":_vm.hasValue,"data-testid":"filtered-search-input"},on:{"submit":_vm.submit,"input":_vm.applyNewValue,"history-item-selected":function($event){return _vm.$emit('history-item-selected', $event)},"clear":function($event){return _vm.$emit('clear')},"clear-history":function($event){return _vm.$emit('clear-history')}},scopedSlots:_vm._u([{key:"history-item",fn:function(slotScope){return [_vm._t("history-item",null,null,slotScope)]}},{key:"input",fn:function(){return [_c('div',{staticClass:"gl-filtered-search-scrollable"},[_vm._l((_vm.tokens),function(token,idx){return [_c(_vm.getTokenComponent(token.type),{key:((token.type) + "-" + idx),ref:"tokens",refInFor:true,tag:"component",staticClass:"gl-filtered-search-item",class:{
|
|
270
270
|
'gl-filtered-search-last-item': _vm.isLastToken(idx),
|
|
271
271
|
},attrs:{"config":_vm.getTokenEntry(token.type),"active":_vm.activeTokenIdx === idx,"available-tokens":_vm.currentAvailableTokens,"current-value":_vm.tokens,"index":idx,"placeholder":_vm.termPlaceholder,"show-friendly-text":_vm.showFriendlyText},on:{"activate":function($event){return _vm.activate(idx)},"deactivate":function($event){return _vm.deactivate(token)},"destroy":function($event){return _vm.destroyToken(idx)},"replace":function($event){return _vm.replaceToken(idx, $event)},"complete":_vm.completeToken,"submit":_vm.submit,"split":function($event){return _vm.createTokens(idx, $event)}},model:{value:(token.value),callback:function ($$v) {_vm.$set(token, "value", $$v);},expression:"token.value"}})]})],2),_vm._v(" "),_c('portal-target',{key:_vm.activeTokenIdx,ref:"menu",style:(_vm.suggestionsStyle),attrs:{"name":_vm.portalName,"slim":""}})]},proxy:true}],null,true)},'gl-search-box-by-click',_vm.$attrs,false))};
|
|
272
272
|
var __vue_staticRenderFns__ = [];
|
|
@@ -216,13 +216,22 @@ var script = {
|
|
|
216
216
|
|
|
217
217
|
const handlers = {
|
|
218
218
|
Enter: () => {
|
|
219
|
+
e.preventDefault();
|
|
220
|
+
|
|
219
221
|
if (suggestedValue != null) {
|
|
220
222
|
this.applySuggestion(suggestedValue);
|
|
221
223
|
} else {
|
|
222
224
|
this.$emit('submit');
|
|
223
225
|
}
|
|
224
226
|
},
|
|
227
|
+
':': () => {
|
|
228
|
+
if (suggestedValue != null) {
|
|
229
|
+
e.preventDefault();
|
|
230
|
+
this.applySuggestion(suggestedValue);
|
|
231
|
+
}
|
|
232
|
+
},
|
|
225
233
|
Escape: () => {
|
|
234
|
+
e.preventDefault();
|
|
226
235
|
this.$emit('complete');
|
|
227
236
|
}
|
|
228
237
|
};
|
|
@@ -238,7 +247,6 @@ var script = {
|
|
|
238
247
|
}
|
|
239
248
|
|
|
240
249
|
if (Object.keys(handlers).includes(key)) {
|
|
241
|
-
e.preventDefault();
|
|
242
250
|
handlers[key]();
|
|
243
251
|
return;
|
|
244
252
|
}
|
|
@@ -265,7 +273,7 @@ var script = {
|
|
|
265
273
|
const __vue_script__ = script;
|
|
266
274
|
|
|
267
275
|
/* template */
|
|
268
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-filtered-search-token-segment",class:{ 'gl-filtered-search-token-segment-active': _vm.active },on:{"mousedown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"left",37,$event.key,["Left","ArrowLeft"])){ return null; }if('button' in $event && $event.button !== 0){ return null; }return _vm.emitIfInactive($event)}}},[(_vm.active)?[_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.inputValue),expression:"inputValue"}],ref:"input",staticClass:"gl-filtered-search-token-segment-input",attrs:{"aria-label":_vm.label},domProps:{"value":(_vm.inputValue)},on:{"keydown":_vm.handleInputKeydown,"blur":_vm.handleBlur,"input":function($event){if($event.target.composing){ return; }_vm.inputValue=$event.target.value;}}}),_vm._v(" "),_c('portal',{key:("operator-" + _vm._uid),attrs:{"to":_vm.portalName}},[(_vm.hasOptionsOrSuggestions)?_c('gl-filtered-search-suggestion-list',{key:("operator-" + _vm._uid),ref:"suggestions",attrs:{"initial-value":_vm.defaultSuggestedValue},on:{"suggestion":_vm.applySuggestion}},[(_vm.options)?_vm._l((_vm.options),function(option,idx){return _c('gl-filtered-search-suggestion',{key:((option.value) + "-" + idx),attrs:{"value":option.value,"icon-name":option.icon}},[_vm._t("option",[_vm._v("\n "+_vm._s(option[_vm.optionTextField])+"\n ")],null,{ option: option })],2)}):_vm._t("suggestions")],2):_vm._e()],1)]:_vm._t("view",[_vm._v(_vm._s(_vm.inputValue))],null,{ inputValue: _vm.inputValue })],2)};
|
|
276
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-filtered-search-token-segment",class:{ 'gl-filtered-search-token-segment-active': _vm.active },attrs:{"data-testid":"filtered-search-token-segment"},on:{"mousedown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"left",37,$event.key,["Left","ArrowLeft"])){ return null; }if('button' in $event && $event.button !== 0){ return null; }return _vm.emitIfInactive($event)}}},[(_vm.active)?[_c('input',{directives:[{name:"model",rawName:"v-model",value:(_vm.inputValue),expression:"inputValue"}],ref:"input",staticClass:"gl-filtered-search-token-segment-input",attrs:{"aria-label":_vm.label},domProps:{"value":(_vm.inputValue)},on:{"keydown":_vm.handleInputKeydown,"blur":_vm.handleBlur,"input":function($event){if($event.target.composing){ return; }_vm.inputValue=$event.target.value;}}}),_vm._v(" "),_c('portal',{key:("operator-" + _vm._uid),attrs:{"to":_vm.portalName}},[(_vm.hasOptionsOrSuggestions)?_c('gl-filtered-search-suggestion-list',{key:("operator-" + _vm._uid),ref:"suggestions",attrs:{"initial-value":_vm.defaultSuggestedValue},on:{"suggestion":_vm.applySuggestion}},[(_vm.options)?_vm._l((_vm.options),function(option,idx){return _c('gl-filtered-search-suggestion',{key:((option.value) + "-" + idx),attrs:{"value":option.value,"icon-name":option.icon}},[_vm._t("option",[_vm._v("\n "+_vm._s(option[_vm.optionTextField])+"\n ")],null,{ option: option })],2)}):_vm._t("suggestions")],2):_vm._e()],1)]:_vm._t("view",[_vm._v(_vm._s(_vm.inputValue))],null,{ inputValue: _vm.inputValue })],2)};
|
|
269
277
|
var __vue_staticRenderFns__ = [];
|
|
270
278
|
|
|
271
279
|
/* style */
|
|
@@ -34,6 +34,11 @@ var script = {
|
|
|
34
34
|
type: String,
|
|
35
35
|
required: false,
|
|
36
36
|
default: undefined
|
|
37
|
+
},
|
|
38
|
+
inputClass: {
|
|
39
|
+
type: [String, Array, Object],
|
|
40
|
+
required: false,
|
|
41
|
+
default: ''
|
|
37
42
|
}
|
|
38
43
|
},
|
|
39
44
|
|
|
@@ -66,7 +71,7 @@ var script = {
|
|
|
66
71
|
const __vue_script__ = script;
|
|
67
72
|
|
|
68
73
|
/* template */
|
|
69
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('b-input-group',[(_vm.activeOption || _vm.$scopedSlots.prepend)?_c('b-input-group-prepend',[_vm._t("prepend"),_vm._v(" "),(_vm.activeOption)?_c('gl-dropdown',{attrs:{"text":_vm.activeOption}},_vm._l((_vm.predefinedOptions),function(option){return _c('gl-dropdown-item',{key:option.value,attrs:{"is-check-item":"","is-checked":_vm.activeOption === option.name},on:{"click":function($event){return _vm.updateValue(option)}}},[_vm._v("\n "+_vm._s(option.name)+"\n ")])}),1):_vm._e()],2):_vm._e(),_vm._v(" "),_vm._t("default",[_c('b-form-input',_vm._g(_vm._b({ref:"input",
|
|
74
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('b-input-group',[(_vm.activeOption || _vm.$scopedSlots.prepend)?_c('b-input-group-prepend',[_vm._t("prepend"),_vm._v(" "),(_vm.activeOption)?_c('gl-dropdown',{attrs:{"text":_vm.activeOption}},_vm._l((_vm.predefinedOptions),function(option){return _c('gl-dropdown-item',{key:option.value,attrs:{"is-check-item":"","is-checked":_vm.activeOption === option.name},on:{"click":function($event){return _vm.updateValue(option)}}},[_vm._v("\n "+_vm._s(option.name)+"\n ")])}),1):_vm._e()],2):_vm._e(),_vm._v(" "),_vm._t("default",[_c('b-form-input',_vm._g(_vm._b({ref:"input",class:['gl-form-input', _vm.inputClass],attrs:{"aria-label":_vm.label},on:{"click":_vm.handleClick},model:{value:(_vm.localValue),callback:function ($$v) {_vm.localValue=$$v;},expression:"localValue"}},'b-form-input',_vm.$attrs,false),_vm.$listeners))]),_vm._v(" "),(_vm.$scopedSlots.append)?_c('b-input-group-append',[_vm._t("append")],2):_vm._e()],2)],1)};
|
|
70
75
|
var __vue_staticRenderFns__ = [];
|
|
71
76
|
|
|
72
77
|
/* style */
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var markdown = "# GlMarkdown\n\nThe `GlMarkdown` component styles markdown-generated HTML following the Pajamas Documentation Markdown\n[styling specifications](https://www.figma.com/file/qEddyqCrI7kPSBjGmwkZzQ/Pajamas-UI-Kit---Beta?node-id=542%3A2).\n\n## Usage\n\nYou can use the `GlMarkdown` component in two ways.\n\n### Vue component\n\n```html\n<script>\nimport { GlMarkdown } from '@gitlab/ui';\n\nexport default {\n components: {\n GlMarkdown,\n }\n}\n</script>\n<template>\n <gl-markdown>\n <!-- All the content inside gl-markdown will inherit the documentation markdown styles -->\n </gl-markdown>\n</template>\n```\n\n### `gl-markdown` class selector\n\nFollow the [GitLab UI CSS guidelines](https://gitlab.com/gitlab-org/gitlab-ui/-/blob/main/doc/css.md)\nto include GitLab UI CSS in your application. Afterwards, you can apply the `gl-markdown` class\nselector to the root element that contains the markdown-generated HTML.\n\n```html\n<body class=\"gl-markdown\">\n <!-- All the content inside body.gl-markdown will inherit the documentation markdown styles -->\n</body>\n```\n\n### Compact markdown\n\nSet the `compact` property to true in `GlMarkdown` to apply the compact markdown styles.\n\n```html\n<gl-markdown compact></gl-compact>\n```\n\nYou can also append the `gl-compact-markdown` class selector after `gl-markdown` in markdown-generated\nHTML.\n\n```html\n<body class=\"gl-markdown gl-compact-markdown\">\n</body>\n```\n\n<!--\n## Browser compatibility\n\nIf the component requires any polyfill or fallback on certain browsers, describe those requirements\nhere.\n-->\n\n<!--\n## Edge cases\n\nIf the component has some known limitations, describe them here.\n-->\n\n<!--\n## Deprecation warning\n\nIf and when this component introduced API changes that would require deprecating old APIs, describe\nthe changes here, and provide a migration paths to the new API.\n-->\n";
|
|
1
|
+
var markdown = "The `GlMarkdown` component styles markdown-generated HTML following the Pajamas Documentation Markdown\n[styling specifications](https://www.figma.com/file/qEddyqCrI7kPSBjGmwkZzQ/Pajamas-UI-Kit---Beta?node-id=542%3A2).\n\n## Usage\n\nYou can use the `GlMarkdown` component in two ways.\n\n### Vue component\n\n```html\n<script>\nimport { GlMarkdown } from '@gitlab/ui';\n\nexport default {\n components: {\n GlMarkdown,\n }\n}\n</script>\n<template>\n <gl-markdown>\n <!-- All the content inside gl-markdown will inherit the documentation markdown styles -->\n </gl-markdown>\n</template>\n```\n\n### `gl-markdown` class selector\n\nFollow the [GitLab UI CSS guidelines](https://gitlab.com/gitlab-org/gitlab-ui/-/blob/main/doc/css.md)\nto include GitLab UI CSS in your application. Afterwards, you can apply the `gl-markdown` class\nselector to the root element that contains the markdown-generated HTML.\n\n```html\n<body class=\"gl-markdown\">\n <!-- All the content inside body.gl-markdown will inherit the documentation markdown styles -->\n</body>\n```\n\n### Compact markdown\n\nSet the `compact` property to true in `GlMarkdown` to apply the compact markdown styles.\n\n```html\n<gl-markdown compact></gl-compact>\n```\n\nYou can also append the `gl-compact-markdown` class selector after `gl-markdown` in markdown-generated\nHTML.\n\n```html\n<body class=\"gl-markdown gl-compact-markdown\">\n</body>\n```\n\n<!--\n## Browser compatibility\n\nIf the component requires any polyfill or fallback on certain browsers, describe those requirements\nhere.\n-->\n\n<!--\n## Edge cases\n\nIf the component has some known limitations, describe them here.\n-->\n\n<!--\n## Deprecation warning\n\nIf and when this component introduced API changes that would require deprecating old APIs, describe\nthe changes here, and provide a migration paths to the new API.\n-->\n";
|
|
4
2
|
|
|
5
3
|
var description = /*#__PURE__*/Object.freeze({
|
|
6
4
|
__proto__: null,
|
|
@@ -8,9 +6,7 @@ var description = /*#__PURE__*/Object.freeze({
|
|
|
8
6
|
});
|
|
9
7
|
|
|
10
8
|
var markdown_documentation = {
|
|
11
|
-
description
|
|
12
|
-
examples,
|
|
13
|
-
propsInfo: {}
|
|
9
|
+
description
|
|
14
10
|
};
|
|
15
11
|
|
|
16
12
|
export default markdown_documentation;
|
|
@@ -34,7 +34,7 @@ var script = {
|
|
|
34
34
|
const __vue_script__ = script;
|
|
35
35
|
|
|
36
36
|
/* template */
|
|
37
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-popover',_vm._g(_vm._b({ref:_vm.$options.popoverRefName,attrs:{"custom-class":_vm.customClass,"triggers":_vm.triggers}
|
|
37
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-popover',_vm._g(_vm._b({ref:_vm.$options.popoverRefName,attrs:{"custom-class":_vm.customClass,"triggers":_vm.triggers},scopedSlots:_vm._u([(_vm.$scopedSlots.title)?{key:"title",fn:function(){return [_vm._t("title")]},proxy:true}:null],null,true)},'b-popover',_vm.$attrs,false),_vm.$listeners),[_vm._v(" "),_vm._t("default")],2)};
|
|
38
38
|
var __vue_staticRenderFns__ = [];
|
|
39
39
|
|
|
40
40
|
/* style */
|
|
@@ -158,7 +158,7 @@ var script = {
|
|
|
158
158
|
const __vue_script__ = script;
|
|
159
159
|
|
|
160
160
|
/* template */
|
|
161
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-form-input-group',{staticClass:"gl-search-box-by-click",scopedSlots:_vm._u([(_vm.historyItems)?{key:"prepend",fn:function(){return [_c('gl-dropdown',{ref:"historyDropdown",staticClass:"gl-search-box-by-click-history",attrs:{"menu-class":"gl-search-box-by-click-menu","category":"secondary","disabled":_vm.disabled},scopedSlots:_vm._u([{key:"button-content",fn:function(){return [_c('gl-icon',{staticClass:"gl-search-box-by-click-history-icon",attrs:{"name":"history"}}),_vm._v(" "),_c('gl-icon',{staticClass:"gl-search-box-by-click-history-icon-chevron",attrs:{"name":"chevron-down"}}),_vm._v(" "),_c('span',{staticClass:"gl-sr-only"},[_vm._v("Toggle history")])]},proxy:true}],null,false,2220989388)},[_vm._v(" "),_c('gl-dropdown-text',{staticClass:"gl-search-box-by-click-history-header"},[_vm._v("\n "+_vm._s(_vm.recentSearchesHeader)+"\n "),_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip.hover",value:({ container: _vm.tooltipContainer }),expression:"{ container: tooltipContainer }",modifiers:{"hover":true}}],ref:"closeHistory",staticClass:"gl-search-box-by-click-close-history-button",attrs:{"title":_vm.closeButtonTitle,"aria-label":_vm.closeButtonTitle,"category":"tertiary","name":"close","icon":"close"},on:{"click":_vm.closeHistoryDropdown}})],1),_vm._v(" "),_c('gl-dropdown-divider'),_vm._v(" "),(_vm.historyItems.length)?[_vm._l((_vm.historyItems),function(item,idx){return _c('gl-dropdown-item',{key:idx,staticClass:"gl-search-box-by-click-history-item",on:{"click":function($event){return _vm.selectHistoryItem(item)}}},[_vm._t("history-item",[_vm._v(_vm._s(item))],{"historyItem":item})],2)}),_vm._v(" "),_c('gl-dropdown-divider'),_vm._v(" "),_c('gl-dropdown-item',{ref:"clearHistory",on:{"click":function($event){return _vm.$emit('clear-history')}}},[_vm._v(_vm._s(_vm.clearRecentSearchesText))])]:_c('gl-dropdown-text',{staticClass:"gl-search-box-by-click-history-no-searches"},[_vm._v(_vm._s(_vm.noRecentSearchesText))])],2)]},proxy:true}:null,{key:"append",fn:function(){return [_c('gl-button',{ref:"searchButton",staticClass:"gl-search-box-by-click-search-button",attrs:{"icon":"search","disabled":_vm.disabled,"aria-label":"Search"},on:{"click":function($event){return _vm.search(_vm.currentValue)}}})]},proxy:true}],null,true)},[_vm._v(" "),_vm._t("input",[_c('gl-form-input',_vm._b({ref:"input",staticClass:"gl-search-box-by-click-input",attrs:{"disabled":_vm.disabled},on:{"focus":function($event){_vm.isFocused = true;},"blur":function($event){_vm.isFocused = false;},"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.search(_vm.currentValue)}},model:{value:(_vm.currentValue),callback:function ($$v) {_vm.currentValue=$$v;},expression:"currentValue"}},'gl-form-input',_vm.inputAttributes,false))]),_vm._v(" "),(_vm.clearable && _vm.hasValue && !_vm.disabled)?_c('gl-clear-icon-button',{staticClass:"gl-search-box-by-click-icon-button gl-search-box-by-click-clear-button gl-clear-icon-button",attrs:{"title":_vm.clearButtonTitle,"tooltip-container":_vm.tooltipContainer},on:{"click":_vm.clearInput}}):_vm._e()],2)};
|
|
161
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('gl-form-input-group',{staticClass:"gl-search-box-by-click",scopedSlots:_vm._u([(_vm.historyItems)?{key:"prepend",fn:function(){return [_c('gl-dropdown',{ref:"historyDropdown",staticClass:"gl-search-box-by-click-history",attrs:{"menu-class":"gl-search-box-by-click-menu","category":"secondary","disabled":_vm.disabled},scopedSlots:_vm._u([{key:"button-content",fn:function(){return [_c('gl-icon',{staticClass:"gl-search-box-by-click-history-icon",attrs:{"name":"history"}}),_vm._v(" "),_c('gl-icon',{staticClass:"gl-search-box-by-click-history-icon-chevron",attrs:{"name":"chevron-down"}}),_vm._v(" "),_c('span',{staticClass:"gl-sr-only"},[_vm._v("Toggle history")])]},proxy:true}],null,false,2220989388)},[_vm._v(" "),_c('gl-dropdown-text',{staticClass:"gl-search-box-by-click-history-header"},[_vm._v("\n "+_vm._s(_vm.recentSearchesHeader)+"\n "),_c('gl-button',{directives:[{name:"gl-tooltip",rawName:"v-gl-tooltip.hover",value:({ container: _vm.tooltipContainer }),expression:"{ container: tooltipContainer }",modifiers:{"hover":true}}],ref:"closeHistory",staticClass:"gl-search-box-by-click-close-history-button",attrs:{"title":_vm.closeButtonTitle,"aria-label":_vm.closeButtonTitle,"category":"tertiary","name":"close","icon":"close"},on:{"click":_vm.closeHistoryDropdown}})],1),_vm._v(" "),_c('gl-dropdown-divider'),_vm._v(" "),(_vm.historyItems.length)?[_vm._l((_vm.historyItems),function(item,idx){return _c('gl-dropdown-item',{key:idx,staticClass:"gl-search-box-by-click-history-item",on:{"click":function($event){return _vm.selectHistoryItem(item)}}},[_vm._t("history-item",[_vm._v(_vm._s(item))],{"historyItem":item})],2)}),_vm._v(" "),_c('gl-dropdown-divider'),_vm._v(" "),_c('gl-dropdown-item',{ref:"clearHistory",on:{"click":function($event){return _vm.$emit('clear-history')}}},[_vm._v(_vm._s(_vm.clearRecentSearchesText))])]:_c('gl-dropdown-text',{staticClass:"gl-search-box-by-click-history-no-searches"},[_vm._v(_vm._s(_vm.noRecentSearchesText))])],2)]},proxy:true}:null,{key:"append",fn:function(){return [_c('gl-button',{ref:"searchButton",staticClass:"gl-search-box-by-click-search-button",attrs:{"icon":"search","disabled":_vm.disabled,"aria-label":"Search"},on:{"click":function($event){return _vm.search(_vm.currentValue)}}})]},proxy:true}],null,true)},[_vm._v(" "),_vm._t("input",[_c('gl-form-input',_vm._b({ref:"input",staticClass:"gl-search-box-by-click-input",attrs:{"disabled":_vm.disabled},on:{"focus":function($event){_vm.isFocused = true;},"blur":function($event){_vm.isFocused = false;},"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.search(_vm.currentValue)}},model:{value:(_vm.currentValue),callback:function ($$v) {_vm.currentValue=$$v;},expression:"currentValue"}},'gl-form-input',_vm.inputAttributes,false))]),_vm._v(" "),(_vm.clearable && _vm.hasValue && !_vm.disabled)?_c('gl-clear-icon-button',{staticClass:"gl-search-box-by-click-icon-button gl-search-box-by-click-clear-button gl-clear-icon-button",attrs:{"title":_vm.clearButtonTitle,"tooltip-container":_vm.tooltipContainer,"data-testid":"filtered-search-clear-button"},on:{"click":_vm.clearInput}}):_vm._e()],2)};
|
|
162
162
|
var __vue_staticRenderFns__ = [];
|
|
163
163
|
|
|
164
164
|
/* style */
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
const tableFullSlots = ['bottom-row', 'empty', 'emptyfiltered', 'table-busy', 'thead-top', 'top-row'];
|
|
2
|
+
const tableFullProps = ['api-url', 'busy', 'current-page', 'empty-filtered-html', 'empty-filtered-text', 'empty-html', 'empty-text', 'filter', 'filter-debounce', 'filter-function', 'filter-ignored-fields', 'filter-included-fields', 'label-sort-asc', 'label-sort-clear', 'label-sort-desc', 'no-footer-sorting', 'no-local-sorting', 'no-provider-filtering', 'no-provider-paging', 'no-provider-sorting', 'no-select-on-click', 'no-sort-reset', 'per-page', 'select-mode', 'selectable', 'selected-variant', 'show-empty', 'sort-by', 'sort-compare', 'sort-compare-locale', 'sort-compare-options', 'sort-desc', 'sort-direction', 'sort-icon-left', 'sort-null-last'];
|
|
3
|
+
const glTableLiteWarning = 'This GlTable could be a GlTableLite component, please consider using GlTableLite instead of GlTable to reduce the page bundlesize more about this here: https://gitlab-org.gitlab.io/gitlab-ui/?path=/docs/base-table-table-lite--default';
|
|
4
|
+
|
|
5
|
+
export { glTableLiteWarning, tableFullProps, tableFullSlots };
|
|
@@ -1,11 +1,29 @@
|
|
|
1
1
|
import { BTable } from 'bootstrap-vue/esm/index.js';
|
|
2
|
+
import { isDev, logWarning } from '../../../utils/utils';
|
|
3
|
+
import { tableFullProps, tableFullSlots, glTableLiteWarning } from './constants';
|
|
2
4
|
import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
|
|
3
5
|
|
|
6
|
+
const shouldUseFullTable = ({
|
|
7
|
+
$attrs,
|
|
8
|
+
$scopedSlots
|
|
9
|
+
}) => {
|
|
10
|
+
return tableFullProps.some(prop => $attrs[prop] !== undefined) || tableFullSlots.some(slot => $scopedSlots[slot] !== undefined);
|
|
11
|
+
};
|
|
12
|
+
|
|
4
13
|
var script = {
|
|
5
14
|
components: {
|
|
6
15
|
BTable
|
|
7
16
|
},
|
|
8
|
-
inheritAttrs: false
|
|
17
|
+
inheritAttrs: false,
|
|
18
|
+
|
|
19
|
+
mounted() {
|
|
20
|
+
// logWarning will call isDev before logging any message
|
|
21
|
+
// this additional call to isDev is being made to exit the condition early when run in production
|
|
22
|
+
if (isDev() && !shouldUseFullTable(this)) {
|
|
23
|
+
logWarning(glTableLiteWarning);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
9
27
|
};
|
|
10
28
|
|
|
11
29
|
/* script */
|
|
@@ -237,7 +237,7 @@ var script = {
|
|
|
237
237
|
const __vue_script__ = script;
|
|
238
238
|
|
|
239
239
|
/* template */
|
|
240
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"position-relative"},[_c('chart',_vm._g(_vm._b({attrs:{"options":_vm.options},on:{"created":_vm.onCreated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{attrs:{"show":_vm.showTooltip,"chart":_vm.chart,"top":_vm.tooltipPosition.top,"left":_vm.tooltipPosition.left}
|
|
240
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"position-relative"},[_c('chart',_vm._g(_vm._b({attrs:{"options":_vm.options},on:{"created":_vm.onCreated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{attrs:{"show":_vm.showTooltip,"chart":_vm.chart,"top":_vm.tooltipPosition.top,"left":_vm.tooltipPosition.left},scopedSlots:_vm._u([{key:"title",fn:function(){return [_c('div',[_vm._v(_vm._s(_vm.tooltipTitle)+" ("+_vm._s(_vm.yAxisTitle)+")")])]},proxy:true}],null,false,1644826356)},[_vm._v(" "),_c('tooltip-default-format',{attrs:{"tooltip-content":_vm.tooltipContent}})],1):_vm._e()],1)};
|
|
241
241
|
var __vue_staticRenderFns__ = [];
|
|
242
242
|
|
|
243
243
|
/* style */
|
|
@@ -192,7 +192,7 @@ var script = {
|
|
|
192
192
|
const __vue_script__ = script;
|
|
193
193
|
|
|
194
194
|
/* template */
|
|
195
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{directives:[{name:"resize-observer",rawName:"v-resize-observer",value:(_vm.handleResize),expression:"handleResize"}],staticClass:"
|
|
195
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{directives:[{name:"resize-observer",rawName:"v-resize-observer",value:(_vm.handleResize),expression:"handleResize"}],staticClass:"gl-display-flex gl-align-items-center",on:{"mouseleave":_vm.hideTooltip}},[_vm._t("default"),_vm._v(" "),_c('div',{staticClass:"gl-flex-grow-1 gl-relative"},[_c('chart',{attrs:{"height":_vm.height,"options":_vm.options},on:{"created":_vm.onChartCreated}}),_vm._v(" "),(_vm.chartInstance)?_c('chart-tooltip',{style:({ pointerEvents: 'none' }),attrs:{"show":_vm.tooltip.show,"chart":_vm.chartInstance,"top":_vm.tooltip.position.top,"left":_vm.tooltip.position.left,"placement":"top"},scopedSlots:_vm._u([{key:"title",fn:function(){return [_c('div',{staticClass:"gl-white-space-nowrap",attrs:{"data-testid":"tooltip-title"}},[_vm._v("\n "+_vm._s(_vm.tooltip.title)+"\n ")])]},proxy:true},{key:"default",fn:function(){return [_c('div',{staticClass:"gl-display-flex",attrs:{"data-testid":"tooltip-content"}},[(_vm.tooltipLabel)?_c('span',{staticClass:"gl-pr-6 gl-mr-auto"},[_vm._v(_vm._s(_vm.tooltipLabel))]):_vm._e(),_vm._v(" "),_c('strong',[_vm._v(_vm._s(_vm.tooltip.content))])])]},proxy:true}],null,false,2830367259)}):_vm._e()],1),_vm._v(" "),(_vm.showLastYValue)?_c('span',{staticClass:"gl-display-inline-flex gl-justify-content-center gl-ml-5",attrs:{"data-testid":"last-y-value"}},[_vm._v("\n "+_vm._s(_vm.lastYValue)+"\n ")]):_vm._e()],2)};
|
|
196
196
|
var __vue_staticRenderFns__ = [];
|
|
197
197
|
|
|
198
198
|
/* style */
|
|
@@ -322,7 +322,7 @@ var script = {
|
|
|
322
322
|
const __vue_script__ = script;
|
|
323
323
|
|
|
324
324
|
/* template */
|
|
325
|
-
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"position-relative"},[_c('chart',_vm._g(_vm._b({attrs:{"options":_vm.options},on:{"created":_vm.onCreated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{attrs:{"show":_vm.showTooltip,"chart":_vm.chart,"top":_vm.tooltipPosition.top,"left":_vm.tooltipPosition.left}
|
|
325
|
+
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"position-relative"},[_c('chart',_vm._g(_vm._b({attrs:{"options":_vm.options},on:{"created":_vm.onCreated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{attrs:{"show":_vm.showTooltip,"chart":_vm.chart,"top":_vm.tooltipPosition.top,"left":_vm.tooltipPosition.left},scopedSlots:_vm._u([{key:"title",fn:function(){return [_vm._t("tooltip-title",[_vm._v(_vm._s(_vm.tooltipTitle)+" ("+_vm._s(_vm.xAxisTitle)+")")])]},proxy:true}],null,true)},[_vm._v(" "),_vm._t("tooltip-content",[_c('tooltip-default-format',{attrs:{"tooltip-content":_vm.tooltipContent}})])],2):_vm._e(),_vm._v(" "),(_vm.compiledOptions)?_c('chart-legend',{style:(_vm.legendStyle),attrs:{"chart":_vm.chart,"series-info":_vm.seriesInfo,"text-style":_vm.compiledOptions.textStyle,"min-text":_vm.legendMinText,"max-text":_vm.legendMaxText,"average-text":_vm.legendAverageText,"current-text":_vm.legendCurrentText,"layout":_vm.legendLayout}}):_vm._e()],1)};
|
|
326
326
|
var __vue_staticRenderFns__ = [];
|
|
327
327
|
|
|
328
328
|
/* style */
|