@gitlab/ui 72.11.0 → 72.12.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 (225) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/tokens/css/tokens.css +1 -1
  3. package/dist/tokens/css/tokens.dark.css +1 -1
  4. package/dist/tokens/js/tokens.dark.js +1 -1
  5. package/dist/tokens/js/tokens.js +1 -1
  6. package/dist/tokens/scss/_tokens.dark.scss +1 -1
  7. package/dist/tokens/scss/_tokens.scss +1 -1
  8. package/package.json +1 -1
  9. package/src/directives/safe_html/safe_html.js +5 -0
  10. package/src/directives/safe_html/safe_html.spec.js +17 -0
  11. package/src/internal/color_contrast/color_contrast.md +8 -0
  12. package/src/internal/color_contrast/color_contrast.spec.js +34 -0
  13. package/src/internal/color_contrast/color_contrast.stories.js +41 -0
  14. package/src/internal/color_contrast/color_contrast.vue +52 -0
  15. package/src/tokens/color.dark.tokens.stories.js +36 -22
  16. package/src/tokens/color.data_viz.dark.tokens.stories.js +13 -30
  17. package/src/tokens/color.data_viz.tokens.stories.js +13 -30
  18. package/src/tokens/color.theme.dark.tokens.stories.js +15 -30
  19. package/src/tokens/color.theme.tokens.stories.js +15 -30
  20. package/src/tokens/color.tokens.stories.js +36 -22
  21. package/src/tokens/color.transparency.tokens.stories.js +9 -12
  22. package/src/tokens/common_story_options.js +22 -80
  23. package/src/utils/constants.js +25 -0
  24. package/src/utils/utils.js +21 -1
  25. package/dist/charts.js +0 -14
  26. package/dist/components/base/accordion/accordion.js +0 -73
  27. package/dist/components/base/accordion/accordion_item.js +0 -133
  28. package/dist/components/base/alert/alert.js +0 -222
  29. package/dist/components/base/avatar/avatar.js +0 -160
  30. package/dist/components/base/avatar_labeled/avatar_labeled.js +0 -107
  31. package/dist/components/base/avatar_link/avatar_link.js +0 -47
  32. package/dist/components/base/avatars_inline/avatars_inline.js +0 -119
  33. package/dist/components/base/badge/badge.js +0 -105
  34. package/dist/components/base/banner/banner.js +0 -139
  35. package/dist/components/base/breadcrumb/breadcrumb.js +0 -122
  36. package/dist/components/base/breadcrumb/breadcrumb_item.js +0 -73
  37. package/dist/components/base/broadcast_message/broadcast_message.js +0 -112
  38. package/dist/components/base/broadcast_message/constants.js +0 -5
  39. package/dist/components/base/button/button.js +0 -151
  40. package/dist/components/base/button_group/button_group.js +0 -47
  41. package/dist/components/base/card/card.js +0 -71
  42. package/dist/components/base/carousel/carousel.js +0 -48
  43. package/dist/components/base/carousel/carousel_slide.js +0 -47
  44. package/dist/components/base/collapse/collapse.js +0 -59
  45. package/dist/components/base/datepicker/datepicker.js +0 -386
  46. package/dist/components/base/daterange_picker/daterange_picker.js +0 -288
  47. package/dist/components/base/drawer/drawer.js +0 -127
  48. package/dist/components/base/dropdown/dropdown.js +0 -261
  49. package/dist/components/base/dropdown/dropdown_divider.js +0 -48
  50. package/dist/components/base/dropdown/dropdown_form.js +0 -48
  51. package/dist/components/base/dropdown/dropdown_item.js +0 -131
  52. package/dist/components/base/dropdown/dropdown_section_header.js +0 -48
  53. package/dist/components/base/dropdown/dropdown_text.js +0 -48
  54. package/dist/components/base/filtered_search/common_story_options.js +0 -14
  55. package/dist/components/base/filtered_search/filtered_search.js +0 -388
  56. package/dist/components/base/filtered_search/filtered_search_suggestion.js +0 -89
  57. package/dist/components/base/filtered_search/filtered_search_suggestion_list.js +0 -138
  58. package/dist/components/base/filtered_search/filtered_search_term.js +0 -203
  59. package/dist/components/base/filtered_search/filtered_search_token.js +0 -384
  60. package/dist/components/base/filtered_search/filtered_search_token_segment.js +0 -420
  61. package/dist/components/base/filtered_search/filtered_search_utils.js +0 -242
  62. package/dist/components/base/form/form.js +0 -49
  63. package/dist/components/base/form/form_checkbox/form_checkbox.js +0 -78
  64. package/dist/components/base/form/form_checkbox/form_checkbox_group.js +0 -60
  65. package/dist/components/base/form/form_checkbox_tree/checkbox_tree_node.js +0 -79
  66. package/dist/components/base/form/form_checkbox_tree/form_checkbox_tree.js +0 -138
  67. package/dist/components/base/form/form_checkbox_tree/models/constants.js +0 -12
  68. package/dist/components/base/form/form_checkbox_tree/models/node.js +0 -51
  69. package/dist/components/base/form/form_checkbox_tree/models/tree.js +0 -199
  70. package/dist/components/base/form/form_combobox/constants.js +0 -55
  71. package/dist/components/base/form/form_combobox/form_combobox.js +0 -230
  72. package/dist/components/base/form/form_date/form_date.js +0 -143
  73. package/dist/components/base/form/form_fields/form_field_validator.js +0 -93
  74. package/dist/components/base/form/form_fields/form_fields.js +0 -214
  75. package/dist/components/base/form/form_fields/mappers.js +0 -13
  76. package/dist/components/base/form/form_fields/validators.js +0 -48
  77. package/dist/components/base/form/form_group/form_group.js +0 -97
  78. package/dist/components/base/form/form_input/form_input.js +0 -121
  79. package/dist/components/base/form/form_input_group/form_input_group.js +0 -108
  80. package/dist/components/base/form/form_input_group/form_input_group_mixin.js +0 -41
  81. package/dist/components/base/form/form_radio/form_radio.js +0 -65
  82. package/dist/components/base/form/form_radio_group/form_radio_group.js +0 -78
  83. package/dist/components/base/form/form_select/constants.js +0 -12
  84. package/dist/components/base/form/form_select/form_select.js +0 -82
  85. package/dist/components/base/form/form_text/form_text.js +0 -38
  86. package/dist/components/base/form/form_textarea/form_textarea.js +0 -112
  87. package/dist/components/base/form/input_group_text/input_group_text.js +0 -48
  88. package/dist/components/base/icon/icon.js +0 -111
  89. package/dist/components/base/infinite_scroll/infinite_scroll.js +0 -197
  90. package/dist/components/base/keyset_pagination/keyset_pagination.js +0 -151
  91. package/dist/components/base/label/label.js +0 -163
  92. package/dist/components/base/link/link.js +0 -50
  93. package/dist/components/base/loading_icon/loading_icon.js +0 -111
  94. package/dist/components/base/markdown/markdown.js +0 -52
  95. package/dist/components/base/modal/modal.js +0 -204
  96. package/dist/components/base/nav/nav.js +0 -48
  97. package/dist/components/base/nav/nav_item.js +0 -48
  98. package/dist/components/base/nav/nav_item_dropdown.js +0 -62
  99. package/dist/components/base/navbar/navbar.js +0 -48
  100. package/dist/components/base/new_dropdowns/base_dropdown/base_dropdown.js +0 -453
  101. package/dist/components/base/new_dropdowns/base_dropdown/constants.js +0 -4
  102. package/dist/components/base/new_dropdowns/constants.js +0 -21
  103. package/dist/components/base/new_dropdowns/disclosure/constants.js +0 -8
  104. package/dist/components/base/new_dropdowns/disclosure/disclosure_dropdown.js +0 -370
  105. package/dist/components/base/new_dropdowns/disclosure/disclosure_dropdown_group.js +0 -110
  106. package/dist/components/base/new_dropdowns/disclosure/disclosure_dropdown_item.js +0 -143
  107. package/dist/components/base/new_dropdowns/disclosure/mock_data.js +0 -147
  108. package/dist/components/base/new_dropdowns/disclosure/utils.js +0 -39
  109. package/dist/components/base/new_dropdowns/listbox/listbox.js +0 -767
  110. package/dist/components/base/new_dropdowns/listbox/listbox_group.js +0 -58
  111. package/dist/components/base/new_dropdowns/listbox/listbox_item.js +0 -91
  112. package/dist/components/base/new_dropdowns/listbox/listbox_search_input.js +0 -93
  113. package/dist/components/base/new_dropdowns/listbox/mock_data.js +0 -118
  114. package/dist/components/base/new_dropdowns/listbox/utils.js +0 -34
  115. package/dist/components/base/paginated_list/paginated_list.js +0 -180
  116. package/dist/components/base/pagination/pagination.js +0 -399
  117. package/dist/components/base/path/data.js +0 -34
  118. package/dist/components/base/path/path.js +0 -189
  119. package/dist/components/base/popover/popover.js +0 -110
  120. package/dist/components/base/progress_bar/progress_bar.js +0 -48
  121. package/dist/components/base/search_box_by_click/search_box_by_click.js +0 -235
  122. package/dist/components/base/search_box_by_type/search_box_by_type.js +0 -167
  123. package/dist/components/base/segmented_control/segmented_control.js +0 -109
  124. package/dist/components/base/skeleton_loader/skeleton_loader.js +0 -224
  125. package/dist/components/base/sorting/sorting.js +0 -171
  126. package/dist/components/base/sorting/sorting_item.js +0 -109
  127. package/dist/components/base/table/constants.js +0 -5
  128. package/dist/components/base/table/table.js +0 -89
  129. package/dist/components/base/table_lite/table_lite.js +0 -72
  130. package/dist/components/base/tabs/constants.js +0 -3
  131. package/dist/components/base/tabs/tab/tab.js +0 -83
  132. package/dist/components/base/tabs/tabs/scrollable_tabs.js +0 -143
  133. package/dist/components/base/tabs/tabs/tabs.js +0 -224
  134. package/dist/components/base/toast/toast.js +0 -82
  135. package/dist/components/base/toggle/toggle.js +0 -180
  136. package/dist/components/base/token/token.js +0 -85
  137. package/dist/components/base/token_selector/helpers.js +0 -5
  138. package/dist/components/base/token_selector/token_container.js +0 -165
  139. package/dist/components/base/token_selector/token_selector.js +0 -403
  140. package/dist/components/base/token_selector/token_selector_dropdown.js +0 -199
  141. package/dist/components/base/tooltip/tooltip.js +0 -55
  142. package/dist/components/charts/area/area.js +0 -311
  143. package/dist/components/charts/bar/bar.js +0 -253
  144. package/dist/components/charts/chart/chart.js +0 -215
  145. package/dist/components/charts/column/column.js +0 -226
  146. package/dist/components/charts/discrete_scatter/discrete_scatter.js +0 -203
  147. package/dist/components/charts/gauge/gauge.js +0 -208
  148. package/dist/components/charts/heatmap/heatmap.js +0 -295
  149. package/dist/components/charts/heatmap/index.js +0 -2
  150. package/dist/components/charts/legend/legend.js +0 -228
  151. package/dist/components/charts/line/line.js +0 -308
  152. package/dist/components/charts/series_label/series_label.js +0 -100
  153. package/dist/components/charts/single_stat/single_stat.js +0 -152
  154. package/dist/components/charts/sparkline/sparkline.js +0 -261
  155. package/dist/components/charts/stacked_column/stacked_column.js +0 -335
  156. package/dist/components/charts/tooltip/tooltip.js +0 -251
  157. package/dist/components/experimental/duo/chat/components/duo_chat_conversation/duo_chat_conversation.js +0 -83
  158. package/dist/components/experimental/duo/chat/components/duo_chat_loader/duo_chat_loader.js +0 -100
  159. package/dist/components/experimental/duo/chat/components/duo_chat_message/copy_code_element.js +0 -35
  160. package/dist/components/experimental/duo/chat/components/duo_chat_message/duo_chat_message.js +0 -115
  161. package/dist/components/experimental/duo/chat/components/duo_chat_message_sources/duo_chat_message_sources.js +0 -104
  162. package/dist/components/experimental/duo/chat/components/duo_chat_predefined_prompts/duo_chat_predefined_prompts.js +0 -64
  163. package/dist/components/experimental/duo/chat/constants.js +0 -23
  164. package/dist/components/experimental/duo/chat/duo_chat.js +0 -359
  165. package/dist/components/experimental/duo/chat/mock_data.js +0 -83
  166. package/dist/components/experimental/duo/user_feedback/user_feedback.js +0 -94
  167. package/dist/components/experimental/duo/user_feedback/user_feedback_modal.js +0 -124
  168. package/dist/components/experimental/experiment_badge/constants.js +0 -4
  169. package/dist/components/experimental/experiment_badge/experiment_badge.js +0 -107
  170. package/dist/components/mixins/button_mixin.js +0 -11
  171. package/dist/components/mixins/safe_link_mixin.js +0 -30
  172. package/dist/components/mixins/tooltip_mixin.js +0 -21
  173. package/dist/components/regions/dashboard_skeleton/dashboard_skeleton.js +0 -53
  174. package/dist/components/regions/empty_state/empty_state.js +0 -154
  175. package/dist/components/shared_components/charts/tooltip_default_format.js +0 -53
  176. package/dist/components/shared_components/clear_icon_button/clear_icon_button.js +0 -64
  177. package/dist/components/shared_components/close_button/close_button.js +0 -54
  178. package/dist/components/utilities/animated_number/animated_number.js +0 -131
  179. package/dist/components/utilities/friendly_wrap/friendly_wrap.js +0 -75
  180. package/dist/components/utilities/intersection_observer/intersection_observer.js +0 -88
  181. package/dist/components/utilities/intersperse/intersperse.js +0 -86
  182. package/dist/components/utilities/sprintf/sprintf.js +0 -172
  183. package/dist/components/utilities/truncate/constants.js +0 -7
  184. package/dist/components/utilities/truncate/truncate.js +0 -111
  185. package/dist/components/utilities/truncate_text/constants.js +0 -7
  186. package/dist/components/utilities/truncate_text/truncate_text.js +0 -146
  187. package/dist/config.js +0 -86
  188. package/dist/directives/collapse_toggle.js +0 -1
  189. package/dist/directives/hover_load/hover_load.js +0 -45
  190. package/dist/directives/modal.js +0 -1
  191. package/dist/directives/outside/get_event_like_time_stamp.js +0 -33
  192. package/dist/directives/outside/outside.js +0 -106
  193. package/dist/directives/resize_observer/resize_observer.js +0 -51
  194. package/dist/directives/safe_html/constants.js +0 -6
  195. package/dist/directives/safe_html/safe_html.js +0 -35
  196. package/dist/directives/safe_link/mock_data.js +0 -10
  197. package/dist/directives/safe_link/safe_link.js +0 -65
  198. package/dist/directives/tooltip.js +0 -1
  199. package/dist/index.css +0 -7
  200. package/dist/index.css.map +0 -1
  201. package/dist/index.js +0 -105
  202. package/dist/tokens/common_story_options.js +0 -109
  203. package/dist/utils/breakpoints.js +0 -20
  204. package/dist/utils/charts/config.js +0 -556
  205. package/dist/utils/charts/constants.js +0 -63
  206. package/dist/utils/charts/mock_data.js +0 -211
  207. package/dist/utils/charts/story_config.js +0 -42
  208. package/dist/utils/charts/theme.js +0 -192
  209. package/dist/utils/charts/utils.js +0 -54
  210. package/dist/utils/constants.js +0 -270
  211. package/dist/utils/data_utils.js +0 -21
  212. package/dist/utils/datetime_utility.js +0 -61
  213. package/dist/utils/i18n.js +0 -15
  214. package/dist/utils/is_slot_empty.js +0 -38
  215. package/dist/utils/number_utils.js +0 -124
  216. package/dist/utils/stories_constants.js +0 -29
  217. package/dist/utils/stories_utils.js +0 -13
  218. package/dist/utils/story_decorators/container.js +0 -16
  219. package/dist/utils/string_utils.js +0 -69
  220. package/dist/utils/svgs/svg_paths.js +0 -7
  221. package/dist/utils/test_utils.js +0 -33
  222. package/dist/utils/use_fake_date.js +0 -29
  223. package/dist/utils/use_mock_intersection_observer.js +0 -108
  224. package/dist/utils/utils.js +0 -177
  225. package/dist/utils.js +0 -5
@@ -1,110 +0,0 @@
1
- import { BPopover } from 'bootstrap-vue/esm/index.js';
2
- import tooltipMixin from '../../mixins/tooltip_mixin';
3
- import CloseButton from '../../shared_components/close_button/close_button';
4
- import { popoverPlacements } from '../../../utils/constants';
5
- import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
6
-
7
- //
8
- const popoverRefName = 'bPopover';
9
- var script = {
10
- name: 'GlPopover',
11
- components: {
12
- BPopover,
13
- CloseButton
14
- },
15
- mixins: [tooltipMixin(popoverRefName)],
16
- inheritAttrs: false,
17
- props: {
18
- cssClasses: {
19
- type: Array,
20
- required: false,
21
- default: () => []
22
- },
23
- /**
24
- * Space-separated triggers for the popover.
25
- *
26
- * @values click, hover, focus, manual
27
- */
28
- triggers: {
29
- type: String,
30
- required: false,
31
- default: 'hover focus'
32
- },
33
- title: {
34
- type: String,
35
- required: false,
36
- default: ''
37
- },
38
- showCloseButton: {
39
- type: Boolean,
40
- required: false,
41
- default: false
42
- },
43
- placement: {
44
- type: String,
45
- required: false,
46
- default: popoverPlacements.top
47
- },
48
- boundaryPadding: {
49
- type: [Number, String],
50
- required: false,
51
- default: 5
52
- }
53
- },
54
- computed: {
55
- customClass() {
56
- return ['gl-popover', ...this.cssClasses].join(' ');
57
- },
58
- shouldShowTitle() {
59
- return this.$scopedSlots.title || this.title || this.showCloseButton;
60
- }
61
- },
62
- methods: {
63
- close(e) {
64
- this.$refs[popoverRefName].doClose();
65
- /**
66
- * Emitted when the close button is clicked (requires showCloseButton to be `true`).
67
- */
68
- this.$emit('close-button-clicked', e);
69
- }
70
- },
71
- popoverRefName
72
- };
73
-
74
- /* script */
75
- const __vue_script__ = script;
76
-
77
- /* template */
78
- 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,"title":_vm.title,"placement":_vm.placement,"boundary-padding":_vm.boundaryPadding},scopedSlots:_vm._u([(_vm.shouldShowTitle)?{key:"title",fn:function(){return [_vm._t("title",function(){return [_vm._v("\n "+_vm._s(_vm.title)+"\n ")]}),_vm._v(" "),(_vm.showCloseButton)?_c('close-button',{staticClass:"gl-float-right gl-mt-n2 gl-mr-n3",attrs:{"data-testid":"close-button"},on:{"click":_vm.close}}):_vm._e()]},proxy:true}:null],null,true)},'b-popover',_vm.$attrs,false),_vm.$listeners),[_vm._v(" "),_vm._t("default")],2)};
79
- var __vue_staticRenderFns__ = [];
80
-
81
- /* style */
82
- const __vue_inject_styles__ = undefined;
83
- /* scoped */
84
- const __vue_scope_id__ = undefined;
85
- /* module identifier */
86
- const __vue_module_identifier__ = undefined;
87
- /* functional template */
88
- const __vue_is_functional_template__ = false;
89
- /* style inject */
90
-
91
- /* style inject SSR */
92
-
93
- /* style inject shadow dom */
94
-
95
-
96
-
97
- const __vue_component__ = __vue_normalize__(
98
- { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
99
- __vue_inject_styles__,
100
- __vue_script__,
101
- __vue_scope_id__,
102
- __vue_is_functional_template__,
103
- __vue_module_identifier__,
104
- false,
105
- undefined,
106
- undefined,
107
- undefined
108
- );
109
-
110
- export default __vue_component__;
@@ -1,48 +0,0 @@
1
- import { BProgress } from 'bootstrap-vue/esm/index.js';
2
- import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
3
-
4
- var script = {
5
- name: 'GlProgressBar',
6
- components: {
7
- BProgress
8
- },
9
- inheritAttrs: false
10
- };
11
-
12
- /* script */
13
- const __vue_script__ = script;
14
-
15
- /* template */
16
- var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-progress',_vm._b({},'b-progress',_vm.$attrs,false))};
17
- var __vue_staticRenderFns__ = [];
18
-
19
- /* style */
20
- const __vue_inject_styles__ = undefined;
21
- /* scoped */
22
- const __vue_scope_id__ = undefined;
23
- /* module identifier */
24
- const __vue_module_identifier__ = undefined;
25
- /* functional template */
26
- const __vue_is_functional_template__ = false;
27
- /* style inject */
28
-
29
- /* style inject SSR */
30
-
31
- /* style inject shadow dom */
32
-
33
-
34
-
35
- const __vue_component__ = __vue_normalize__(
36
- { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
37
- __vue_inject_styles__,
38
- __vue_script__,
39
- __vue_scope_id__,
40
- __vue_is_functional_template__,
41
- __vue_module_identifier__,
42
- false,
43
- undefined,
44
- undefined,
45
- undefined
46
- );
47
-
48
- export default __vue_component__;
@@ -1,235 +0,0 @@
1
- import { GlTooltipDirective } from '../../../directives/tooltip';
2
- import GlClearIconButton from '../../shared_components/clear_icon_button/clear_icon_button';
3
- import GlButton from '../button/button';
4
- import GlDropdown from '../dropdown/dropdown';
5
- import GlDropdownDivider from '../dropdown/dropdown_divider';
6
- import GlDropdownItem from '../dropdown/dropdown_item';
7
- import GlDropdownText from '../dropdown/dropdown_text';
8
- import GlFormInput from '../form/form_input/form_input';
9
- import GlFormInputGroup from '../form/form_input_group/form_input_group';
10
- import GlIcon from '../icon/icon';
11
- import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
12
-
13
- var script = {
14
- name: 'GlSearchboxByClick',
15
- components: {
16
- GlClearIconButton,
17
- GlIcon,
18
- GlButton,
19
- GlFormInput,
20
- GlDropdown,
21
- GlDropdownText,
22
- GlDropdownItem,
23
- GlDropdownDivider,
24
- GlFormInputGroup
25
- },
26
- directives: {
27
- GlTooltip: GlTooltipDirective
28
- },
29
- props: {
30
- /**
31
- * If provided, used as value of search input
32
- */
33
- value: {
34
- required: false,
35
- default: '',
36
- // SearchBoxByClick could serve as a container for complex fields (see GlFilteredSearch)
37
- // so we should not force any specific type for value here
38
- validator: () => true
39
- },
40
- /**
41
- * If provided, used as history items for this component
42
- */
43
- historyItems: {
44
- type: Array,
45
- required: false,
46
- default: null
47
- },
48
- /**
49
- * If provided, used as a placeholder for this component
50
- */
51
- placeholder: {
52
- type: String,
53
- required: false,
54
- default: 'Search'
55
- },
56
- clearable: {
57
- type: Boolean,
58
- required: false,
59
- default: true
60
- },
61
- /**
62
- * If provided and true, disables the input and controls
63
- */
64
- disabled: {
65
- type: Boolean,
66
- required: false,
67
- default: false
68
- },
69
- /**
70
- * i18n for recent searches title within history dropdown
71
- */
72
- recentSearchesHeader: {
73
- type: String,
74
- required: false,
75
- default: 'Recent searches'
76
- },
77
- /**
78
- * i18n for clear button title
79
- */
80
- clearButtonTitle: {
81
- type: String,
82
- required: false,
83
- default: 'Clear'
84
- },
85
- /**
86
- * i18n for close button title within history dropdown
87
- */
88
- closeButtonTitle: {
89
- type: String,
90
- required: false,
91
- default: 'Close'
92
- },
93
- /**
94
- * i18n for recent searches clear text
95
- */
96
- clearRecentSearchesText: {
97
- type: String,
98
- required: false,
99
- default: 'Clear recent searches'
100
- },
101
- noRecentSearchesText: {
102
- type: String,
103
- required: false,
104
- default: "You don't have any recent searches"
105
- },
106
- /**
107
- * Container for tooltip. Valid values: DOM node, selector string or `false` for default
108
- */
109
- tooltipContainer: {
110
- required: false,
111
- default: false,
112
- validator: value => value === false || typeof value === 'string' || value instanceof HTMLElement
113
- },
114
- /**
115
- * HTML attributes to add to the search button
116
- */
117
- searchButtonAttributes: {
118
- type: Object,
119
- required: false,
120
- default: () => ({})
121
- }
122
- },
123
- data() {
124
- return {
125
- currentValue: null,
126
- isFocused: false
127
- };
128
- },
129
- computed: {
130
- inputAttributes() {
131
- const attributes = {
132
- type: 'search',
133
- placeholder: this.placeholder,
134
- ...this.$attrs
135
- };
136
- if (!attributes['aria-label']) {
137
- attributes['aria-label'] = attributes.placeholder;
138
- }
139
- return attributes;
140
- },
141
- hasValue() {
142
- return Boolean(this.currentValue);
143
- }
144
- },
145
- watch: {
146
- value: {
147
- handler(newValue) {
148
- this.currentValue = newValue;
149
- },
150
- immediate: true
151
- },
152
- currentValue(newValue) {
153
- if (newValue === this.value) return;
154
- this.$emit('input', newValue);
155
- }
156
- },
157
- methods: {
158
- closeHistoryDropdown() {
159
- this.$refs.historyDropdown.hide();
160
- },
161
- search(value) {
162
- /**
163
- * Emitted when search is submitted
164
- * @property {*} value Search value
165
- */
166
- this.$emit('submit', value);
167
- },
168
- selectHistoryItem(item) {
169
- this.currentValue = item;
170
-
171
- /**
172
- * Emitted when item from history is selected
173
- * @property {*} item History item
174
- */
175
- this.$emit('history-item-selected', item);
176
- setTimeout(() => {
177
- document.activeElement.blur();
178
- });
179
- },
180
- clearInput() {
181
- this.currentValue = '';
182
- /**
183
- * Emitted when search is cleared
184
- */
185
- this.$emit('clear');
186
- if (this.$refs.input) {
187
- this.$refs.input.$el.focus();
188
- }
189
- },
190
- emitClearHistory() {
191
- /**
192
- * Emitted when clear history button is clicked
193
- */
194
- this.$emit('clear-history');
195
- }
196
- }
197
- };
198
-
199
- /* script */
200
- const __vue_script__ = script;
201
-
202
- /* template */
203
- 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",function(){return [_vm._v(_vm._s(item))]},{"historyItem":item})],2)}),_vm._v(" "),_c('gl-dropdown-divider'),_vm._v(" "),_c('gl-dropdown-item',{ref:"clearHistory",on:{"click":_vm.emitClearHistory}},[_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',_vm._b({ref:"searchButton",staticClass:"gl-search-box-by-click-search-button",attrs:{"icon":"search","disabled":_vm.disabled,"aria-label":"Search","data-testid":"search-button"},on:{"click":function($event){return _vm.search(_vm.currentValue)}}},'gl-button',_vm.searchButtonAttributes,false))]},proxy:true}],null,true)},[_vm._v(" "),_vm._t("input",function(){return [_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;}},nativeOn:{"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)};
204
- var __vue_staticRenderFns__ = [];
205
-
206
- /* style */
207
- const __vue_inject_styles__ = undefined;
208
- /* scoped */
209
- const __vue_scope_id__ = undefined;
210
- /* module identifier */
211
- const __vue_module_identifier__ = undefined;
212
- /* functional template */
213
- const __vue_is_functional_template__ = false;
214
- /* style inject */
215
-
216
- /* style inject SSR */
217
-
218
- /* style inject shadow dom */
219
-
220
-
221
-
222
- const __vue_component__ = __vue_normalize__(
223
- { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
224
- __vue_inject_styles__,
225
- __vue_script__,
226
- __vue_scope_id__,
227
- __vue_is_functional_template__,
228
- __vue_module_identifier__,
229
- false,
230
- undefined,
231
- undefined,
232
- undefined
233
- );
234
-
235
- export default __vue_component__;
@@ -1,167 +0,0 @@
1
- import GlClearIconButton from '../../shared_components/clear_icon_button/clear_icon_button';
2
- import GlFormInput from '../form/form_input/form_input';
3
- import GlIcon from '../icon/icon';
4
- import GlLoadingIcon from '../loading_icon/loading_icon';
5
- import { translate } from '../../../utils/i18n';
6
- import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
7
-
8
- var script = {
9
- name: 'GlSearchboxByType',
10
- components: {
11
- GlClearIconButton,
12
- GlIcon,
13
- GlFormInput,
14
- GlLoadingIcon
15
- },
16
- inheritAttrs: false,
17
- model: {
18
- prop: 'value',
19
- event: 'input'
20
- },
21
- props: {
22
- /**
23
- * If provided, used as value of search input
24
- */
25
- value: {
26
- type: String,
27
- required: false,
28
- default: ''
29
- },
30
- borderless: {
31
- type: Boolean,
32
- required: false,
33
- default: false
34
- },
35
- clearButtonTitle: {
36
- type: String,
37
- required: false,
38
- default: () => translate('GlSearchBoxByType.clearButtonTitle', 'Clear')
39
- },
40
- /**
41
- * If provided and true, disables the input and controls
42
- */
43
- disabled: {
44
- type: Boolean,
45
- required: false,
46
- default: false
47
- },
48
- /**
49
- * Puts search box into loading state, rendering spinner
50
- */
51
- isLoading: {
52
- type: Boolean,
53
- required: false,
54
- default: false
55
- },
56
- /**
57
- * Container for tooltip. Valid values: DOM node, selector string or `false` for default
58
- */
59
- tooltipContainer: {
60
- required: false,
61
- default: false,
62
- validator: value => value === false || typeof value === 'string' || value instanceof HTMLElement
63
- }
64
- },
65
- computed: {
66
- inputAttributes() {
67
- const attributes = {
68
- type: 'search',
69
- placeholder: translate('GlSearchBoxByType.input.placeholder', 'Search'),
70
- ...this.$attrs
71
- };
72
- if (!attributes['aria-label']) {
73
- attributes['aria-label'] = attributes.placeholder;
74
- }
75
- return attributes;
76
- },
77
- hasValue() {
78
- return Boolean(this.value.length);
79
- },
80
- inputListeners() {
81
- return {
82
- ...this.$listeners,
83
- input: this.onInput,
84
- focusin: this.onFocusin,
85
- focusout: this.onFocusout
86
- };
87
- },
88
- showClearButton() {
89
- return this.hasValue && !this.disabled;
90
- }
91
- },
92
- methods: {
93
- isInputOrClearButton(element) {
94
- var _this$$refs$input, _this$$refs$clearButt;
95
- return element === ((_this$$refs$input = this.$refs.input) === null || _this$$refs$input === void 0 ? void 0 : _this$$refs$input.$el) || element === ((_this$$refs$clearButt = this.$refs.clearButton) === null || _this$$refs$clearButt === void 0 ? void 0 : _this$$refs$clearButt.$el);
96
- },
97
- clearInput() {
98
- this.onInput('');
99
- this.focusInput();
100
- },
101
- focusInput() {
102
- this.$refs.input.$el.focus();
103
- },
104
- onInput(value) {
105
- this.$emit('input', value);
106
- },
107
- onFocusout(event) {
108
- const {
109
- relatedTarget
110
- } = event;
111
- if (this.isInputOrClearButton(relatedTarget)) {
112
- return;
113
- }
114
- this.$emit('focusout', event);
115
- },
116
- onFocusin(event) {
117
- const {
118
- relatedTarget
119
- } = event;
120
- if (this.isInputOrClearButton(relatedTarget)) {
121
- return;
122
- }
123
- this.$emit('focusin', event);
124
- }
125
- }
126
- };
127
-
128
- /* script */
129
- const __vue_script__ = script;
130
-
131
- /* template */
132
- var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-search-box-by-type"},[_c('gl-icon',{staticClass:"gl-search-box-by-type-search-icon",attrs:{"name":"search"}}),_vm._v(" "),_c('gl-form-input',_vm._g(_vm._b({ref:"input",class:{
133
- 'gl-search-box-by-type-input': !_vm.borderless,
134
- 'gl-search-box-by-type-input-borderless': _vm.borderless,
135
- },attrs:{"value":_vm.value,"disabled":_vm.disabled}},'gl-form-input',_vm.inputAttributes,false),_vm.inputListeners)),_vm._v(" "),(_vm.isLoading || _vm.showClearButton)?_c('div',{staticClass:"gl-search-box-by-type-right-icons"},[(_vm.isLoading)?_c('gl-loading-icon',{staticClass:"gl-search-box-by-type-loading-icon"}):_vm._e(),_vm._v(" "),(_vm.showClearButton)?_c('gl-clear-icon-button',{ref:"clearButton",staticClass:"gl-search-box-by-type-clear gl-clear-icon-button",attrs:{"title":_vm.clearButtonTitle,"tooltip-container":_vm.tooltipContainer},on:{"click":function($event){$event.stopPropagation();return _vm.clearInput.apply(null, arguments)},"focusin":_vm.onFocusin,"focusout":_vm.onFocusout}}):_vm._e()],1):_vm._e()],1)};
136
- var __vue_staticRenderFns__ = [];
137
-
138
- /* style */
139
- const __vue_inject_styles__ = undefined;
140
- /* scoped */
141
- const __vue_scope_id__ = undefined;
142
- /* module identifier */
143
- const __vue_module_identifier__ = undefined;
144
- /* functional template */
145
- const __vue_is_functional_template__ = false;
146
- /* style inject */
147
-
148
- /* style inject SSR */
149
-
150
- /* style inject shadow dom */
151
-
152
-
153
-
154
- const __vue_component__ = __vue_normalize__(
155
- { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
156
- __vue_inject_styles__,
157
- __vue_script__,
158
- __vue_scope_id__,
159
- __vue_is_functional_template__,
160
- __vue_module_identifier__,
161
- false,
162
- undefined,
163
- undefined,
164
- undefined
165
- );
166
-
167
- export default __vue_component__;
@@ -1,109 +0,0 @@
1
- import { BFormRadioGroup } from 'bootstrap-vue/esm/index.js';
2
- import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
3
-
4
- const genericErrorMessage = 'Segmented button should always have valid option selected';
5
- var script = {
6
- name: 'GlSegmentedControl',
7
- components: {
8
- BFormRadioGroup
9
- },
10
- inheritAttrs: false,
11
- model: {
12
- prop: 'checked',
13
- event: 'input'
14
- },
15
- props: {
16
- checked: {
17
- required: true,
18
- validator: () => true
19
- },
20
- options: {
21
- type: Array,
22
- required: true
23
- }
24
- },
25
- computed: {
26
- enabledOptions() {
27
- return this.options.filter(option => !option.disabled);
28
- }
29
- },
30
- watch: {
31
- checked: {
32
- handler(newValue, oldValue) {
33
- this.checkValue(newValue, oldValue);
34
- }
35
- },
36
- options: {
37
- handler() {
38
- this.checkValue(this.checked);
39
- }
40
- }
41
- },
42
- created() {
43
- this.checkValue(this.checked);
44
- },
45
- methods: {
46
- checkValue(newValue) {
47
- let oldValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
48
- if (!this.isValidValue(newValue)) {
49
- // eslint-disable-next-line no-console
50
- console.warn(genericErrorMessage);
51
- if (this.enabledOptions.length) {
52
- const suggestion = oldValue && this.isValidValue(oldValue) ? oldValue : this.enabledOptions[0].value;
53
- /**
54
- * Emitted when the selection changes
55
- * @event input
56
- * @argument checked The selected option
57
- */
58
- this.$emit('input', suggestion);
59
- }
60
- }
61
- },
62
- isValidValue(val) {
63
- return this.enabledOptions.some(_ref => {
64
- let {
65
- value
66
- } = _ref;
67
- return value === val;
68
- });
69
- }
70
- }
71
- };
72
-
73
- /* script */
74
- const __vue_script__ = script;
75
-
76
- /* template */
77
- var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('b-form-radio-group',_vm._g(_vm._b({staticClass:"gl-segmented-control",attrs:{"buttons":"","button-variant":"gl-segmented-button gl-button"}},'b-form-radio-group',Object.assign({}, _vm.$attrs, {options: _vm.options, checked: _vm.checked}),false),_vm.$listeners))};
78
- var __vue_staticRenderFns__ = [];
79
-
80
- /* style */
81
- const __vue_inject_styles__ = undefined;
82
- /* scoped */
83
- const __vue_scope_id__ = undefined;
84
- /* module identifier */
85
- const __vue_module_identifier__ = undefined;
86
- /* functional template */
87
- const __vue_is_functional_template__ = false;
88
- /* style inject */
89
-
90
- /* style inject SSR */
91
-
92
- /* style inject shadow dom */
93
-
94
-
95
-
96
- const __vue_component__ = __vue_normalize__(
97
- { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
98
- __vue_inject_styles__,
99
- __vue_script__,
100
- __vue_scope_id__,
101
- __vue_is_functional_template__,
102
- __vue_module_identifier__,
103
- false,
104
- undefined,
105
- undefined,
106
- undefined
107
- );
108
-
109
- export default __vue_component__;