@gitlab/ui 96.3.0 → 97.1.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 (101) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/dist/components/base/alert/alert.js +1 -1
  3. package/dist/components/base/avatar/avatar.js +4 -4
  4. package/dist/components/base/datepicker/datepicker.js +1 -1
  5. package/dist/components/base/drawer/drawer.js +1 -1
  6. package/dist/components/base/form/form_input/form_input.js +3 -3
  7. package/dist/components/base/form/form_select/form_select.js +3 -3
  8. package/dist/components/base/progress_bar/progress_bar.js +47 -5
  9. package/dist/components/base/toast/toast.js +1 -1
  10. package/dist/components/base/toggle/toggle.js +1 -1
  11. package/dist/components/base/token/token.js +1 -1
  12. package/dist/components/base/token_selector/token_selector.js +17 -7
  13. package/dist/index.css +2 -2
  14. package/dist/index.css.map +1 -1
  15. package/dist/tailwind.css +1 -1
  16. package/dist/tailwind.css.map +1 -1
  17. package/dist/tokens/build/js/tokens.dark.js +2 -1
  18. package/dist/tokens/build/js/tokens.js +2 -1
  19. package/dist/tokens/css/tokens.css +1 -0
  20. package/dist/tokens/css/tokens.dark.css +1 -0
  21. package/dist/tokens/js/tokens.dark.js +1 -0
  22. package/dist/tokens/js/tokens.js +1 -0
  23. package/dist/tokens/json/tokens.dark.json +35 -0
  24. package/dist/tokens/json/tokens.json +35 -0
  25. package/dist/tokens/scss/_tokens.dark.scss +1 -0
  26. package/dist/tokens/scss/_tokens.scss +1 -0
  27. package/dist/tokens/scss/_tokens_custom_properties.scss +1 -0
  28. package/dist/utils/number_utils.js +9 -1
  29. package/dist/vendor/bootstrap-vue/src/constants/components.js +1 -3
  30. package/dist/vendor/bootstrap-vue/src/index.js +0 -2
  31. package/package.json +7 -7
  32. package/src/components/base/alert/alert.vue +1 -1
  33. package/src/components/base/avatar/avatar.vue +4 -4
  34. package/src/components/base/datepicker/datepicker.vue +1 -1
  35. package/src/components/base/drawer/drawer.vue +1 -1
  36. package/src/components/base/form/form_input/form_input.scss +1 -2
  37. package/src/components/base/form/form_input/form_input.vue +3 -3
  38. package/src/components/base/form/form_select/form_select.vue +3 -3
  39. package/src/components/base/modal/modal.scss +1 -2
  40. package/src/components/base/progress_bar/progress_bar.md +25 -0
  41. package/src/components/base/progress_bar/progress_bar.scss +11 -0
  42. package/src/components/base/progress_bar/progress_bar.vue +54 -5
  43. package/src/components/base/toast/toast.js +1 -1
  44. package/src/components/base/toggle/toggle.scss +28 -7
  45. package/src/components/base/toggle/toggle.vue +1 -0
  46. package/src/components/base/token/token.vue +1 -1
  47. package/src/components/base/token_selector/token_selector.scss +8 -3
  48. package/src/components/base/token_selector/token_selector.vue +17 -9
  49. package/src/tokens/build/css/tokens.css +1 -0
  50. package/src/tokens/build/css/tokens.dark.css +1 -0
  51. package/src/tokens/build/js/tokens.dark.js +1 -0
  52. package/src/tokens/build/js/tokens.js +1 -0
  53. package/src/tokens/build/json/tokens.dark.json +35 -0
  54. package/src/tokens/build/json/tokens.json +35 -0
  55. package/src/tokens/build/scss/_tokens.dark.scss +1 -0
  56. package/src/tokens/build/scss/_tokens.scss +1 -0
  57. package/src/tokens/build/scss/_tokens_custom_properties.scss +1 -0
  58. package/src/tokens/contextual/token-selector.tokens.json +20 -0
  59. package/src/utils/number_utils.js +7 -0
  60. package/src/vendor/bootstrap-vue/package.json +3 -42
  61. package/src/vendor/bootstrap-vue/src/components/badge/README.md +2 -2
  62. package/src/vendor/bootstrap-vue/src/components/breadcrumb/README.md +2 -2
  63. package/src/vendor/bootstrap-vue/src/components/button/README.md +7 -9
  64. package/src/vendor/bootstrap-vue/src/components/button-group/README.md +0 -5
  65. package/src/vendor/bootstrap-vue/src/components/collapse/README.md +2 -2
  66. package/src/vendor/bootstrap-vue/src/components/dropdown/README.md +5 -5
  67. package/src/vendor/bootstrap-vue/src/components/form/README.md +21 -26
  68. package/src/vendor/bootstrap-vue/src/components/form-checkbox/README.md +6 -6
  69. package/src/vendor/bootstrap-vue/src/components/form-group/README.md +6 -4
  70. package/src/vendor/bootstrap-vue/src/components/form-input/README.md +4 -4
  71. package/src/vendor/bootstrap-vue/src/components/form-radio/README.md +1 -1
  72. package/src/vendor/bootstrap-vue/src/components/index.d.ts +0 -1
  73. package/src/vendor/bootstrap-vue/src/components/input-group/README.md +4 -9
  74. package/src/vendor/bootstrap-vue/src/components/layout/README.md +3 -3
  75. package/src/vendor/bootstrap-vue/src/components/link/README.md +1 -1
  76. package/src/vendor/bootstrap-vue/src/components/modal/README.md +2 -2
  77. package/src/vendor/bootstrap-vue/src/components/nav/README.md +13 -14
  78. package/src/vendor/bootstrap-vue/src/components/navbar/README.md +5 -6
  79. package/src/vendor/bootstrap-vue/src/components/popover/README.md +4 -4
  80. package/src/vendor/bootstrap-vue/src/components/table/README.md +5 -5
  81. package/src/vendor/bootstrap-vue/src/components/tabs/README.md +2 -2
  82. package/src/vendor/bootstrap-vue/src/components/toast/README.md +5 -5
  83. package/src/vendor/bootstrap-vue/src/components/tooltip/README.md +4 -4
  84. package/src/vendor/bootstrap-vue/src/constants/components.js +0 -2
  85. package/src/vendor/bootstrap-vue/src/directives/toggle/README.md +5 -6
  86. package/src/vendor/bootstrap-vue/src/directives/tooltip/README.md +2 -2
  87. package/src/vendor/bootstrap-vue/src/index.js +0 -4
  88. package/dist/vendor/bootstrap-vue/src/components/progress/index.js +0 -2
  89. package/dist/vendor/bootstrap-vue/src/components/progress/progress-bar.js +0 -128
  90. package/dist/vendor/bootstrap-vue/src/components/progress/progress.js +0 -56
  91. package/src/vendor/bootstrap-vue/nuxt/index.js +0 -164
  92. package/src/vendor/bootstrap-vue/nuxt/plugin.template.js +0 -29
  93. package/src/vendor/bootstrap-vue/src/components/progress/MODIFICATIONS.md +0 -23
  94. package/src/vendor/bootstrap-vue/src/components/progress/README.md +0 -363
  95. package/src/vendor/bootstrap-vue/src/components/progress/index.d.ts +0 -10
  96. package/src/vendor/bootstrap-vue/src/components/progress/index.js +0 -4
  97. package/src/vendor/bootstrap-vue/src/components/progress/package.json +0 -109
  98. package/src/vendor/bootstrap-vue/src/components/progress/progress-bar.js +0 -133
  99. package/src/vendor/bootstrap-vue/src/components/progress/progress-bar.spec.js +0 -270
  100. package/src/vendor/bootstrap-vue/src/components/progress/progress.js +0 -57
  101. package/src/vendor/bootstrap-vue/src/components/progress/progress.spec.js +0 -71
@@ -1,270 +0,0 @@
1
- import { mount } from '@vue/test-utils'
2
- import { BProgressBar } from './progress-bar'
3
-
4
- describe('progress-bar', () => {
5
- it('has correct base class and structure', async () => {
6
- const wrapper = mount(BProgressBar)
7
-
8
- expect(wrapper.element.tagName).toBe('DIV')
9
- expect(wrapper.classes()).toContain('progress-bar')
10
- expect(wrapper.attributes('role')).toBe('progressbar')
11
- expect(wrapper.attributes('aria-valuemin')).toBe('0')
12
- expect(wrapper.attributes('aria-valuemax')).toBe('100')
13
- expect(wrapper.attributes('aria-valuenow')).toBe('0')
14
- expect(wrapper.attributes('style')).toContain('width: 0%;')
15
-
16
- expect(wrapper.classes()).not.toContain('progress-bar-striped')
17
- expect(wrapper.classes()).not.toContain('progress-bar-animated')
18
-
19
- // Should not have a label
20
- expect(wrapper.text()).toBe('')
21
-
22
- wrapper.destroy()
23
- })
24
-
25
- it('has class bg-primary when variant=primary', async () => {
26
- const wrapper = mount(BProgressBar, {
27
- propsData: {
28
- variant: 'primary'
29
- }
30
- })
31
-
32
- expect(wrapper.classes()).toContain('bg-primary')
33
- expect(wrapper.classes()).toContain('progress-bar')
34
-
35
- wrapper.destroy()
36
- })
37
-
38
- it('has class bg-info when parent variant=info', async () => {
39
- const wrapper = mount(BProgressBar, {
40
- provide: {
41
- getBvProgress: () => ({
42
- variant: 'info'
43
- })
44
- }
45
- })
46
-
47
- expect(wrapper.classes()).toContain('bg-info')
48
- expect(wrapper.classes()).toContain('progress-bar')
49
-
50
- wrapper.destroy()
51
- })
52
-
53
- it('has class bg-primary when prop variant=primary and parent variant=info', async () => {
54
- const wrapper = mount(BProgressBar, {
55
- provide: {
56
- getBvProgress: () => ({
57
- variant: 'info'
58
- })
59
- },
60
- propsData: {
61
- variant: 'primary'
62
- }
63
- })
64
-
65
- expect(wrapper.classes()).toContain('bg-primary')
66
- expect(wrapper.classes()).toContain('progress-bar')
67
-
68
- wrapper.destroy()
69
- })
70
- it('has class progress-bar-striped when prop striped set', async () => {
71
- const wrapper = mount(BProgressBar, {
72
- propsData: {
73
- striped: true
74
- }
75
- })
76
-
77
- expect(wrapper.classes()).toContain('progress-bar-striped')
78
- expect(wrapper.classes()).toContain('progress-bar')
79
-
80
- wrapper.destroy()
81
- })
82
-
83
- it('has class progress-bar-striped when parent prop striped set', async () => {
84
- const wrapper = mount(BProgressBar, {
85
- provide: {
86
- getBvProgress: () => ({
87
- striped: true
88
- })
89
- }
90
- })
91
-
92
- expect(wrapper.classes()).toContain('progress-bar-striped')
93
- expect(wrapper.classes()).toContain('progress-bar')
94
-
95
- wrapper.destroy()
96
- })
97
-
98
- it('has class progress-bar-animated and progress-bar-striped when prop animated set', async () => {
99
- const wrapper = mount(BProgressBar, {
100
- propsData: {
101
- animated: true
102
- }
103
- })
104
-
105
- expect(wrapper.classes()).toContain('progress-bar-animated')
106
- expect(wrapper.classes()).toContain('progress-bar-striped')
107
- expect(wrapper.classes()).toContain('progress-bar')
108
-
109
- wrapper.destroy()
110
- })
111
-
112
- it('has class progress-bar-animated and progress-bar-striped when parent prop animated set', async () => {
113
- const wrapper = mount(BProgressBar, {
114
- provide: {
115
- getBvProgress: () => ({
116
- animated: true
117
- })
118
- }
119
- })
120
-
121
- expect(wrapper.classes()).toContain('progress-bar-animated')
122
- expect(wrapper.classes()).toContain('progress-bar-striped')
123
- expect(wrapper.classes()).toContain('progress-bar')
124
-
125
- wrapper.destroy()
126
- })
127
-
128
- it('has style width set when value set', async () => {
129
- const wrapper = mount(BProgressBar, {
130
- propsData: {
131
- value: 50
132
- }
133
- })
134
-
135
- expect(wrapper.attributes('style')).toContain('width: 50%;')
136
- expect(wrapper.attributes('aria-valuenow')).toBe('50')
137
- expect(wrapper.attributes('aria-valuemin')).toBe('0')
138
- expect(wrapper.attributes('aria-valuemax')).toBe('100')
139
-
140
- wrapper.destroy()
141
- })
142
-
143
- it('has max set', async () => {
144
- const wrapper = mount(BProgressBar, {
145
- propsData: {
146
- value: 25,
147
- max: 50
148
- }
149
- })
150
-
151
- expect(wrapper.attributes('style')).toContain('width: 50%;')
152
- expect(wrapper.attributes('aria-valuenow')).toBe('25')
153
- expect(wrapper.attributes('aria-valuemin')).toBe('0')
154
- expect(wrapper.attributes('aria-valuemax')).toBe('50')
155
-
156
- wrapper.destroy()
157
- })
158
-
159
- it('has max set when parent max set', async () => {
160
- const wrapper = mount(BProgressBar, {
161
- provide: {
162
- getBvProgress: () => ({
163
- max: 50
164
- })
165
- },
166
- propsData: {
167
- value: 25
168
- }
169
- })
170
-
171
- expect(wrapper.attributes('style')).toContain('width: 50%;')
172
- expect(wrapper.attributes('aria-valuenow')).toBe('25')
173
- expect(wrapper.attributes('aria-valuemin')).toBe('0')
174
- expect(wrapper.attributes('aria-valuemax')).toBe('50')
175
-
176
- wrapper.destroy()
177
- })
178
-
179
- it('has label when prop label set', async () => {
180
- const wrapper = mount(BProgressBar, {
181
- propsData: {
182
- label: 'foobar'
183
- }
184
- })
185
-
186
- expect(wrapper.text()).toBe('foobar')
187
-
188
- wrapper.destroy()
189
- })
190
-
191
- it('has label when prop labelHtml set', async () => {
192
- const wrapper = mount(BProgressBar, {
193
- propsData: {
194
- labelHtml: 'foobar'
195
- }
196
- })
197
-
198
- expect(wrapper.text()).toBe('foobar')
199
-
200
- wrapper.destroy()
201
- })
202
-
203
- it('has label from default slot', async () => {
204
- const wrapper = mount(BProgressBar, {
205
- slots: {
206
- default: 'foobar'
207
- }
208
- })
209
-
210
- expect(wrapper.text()).toBe('foobar')
211
-
212
- wrapper.destroy()
213
- })
214
-
215
- it('has label when show-value set', async () => {
216
- const wrapper = mount(BProgressBar, {
217
- propsData: {
218
- value: 50,
219
- showValue: true
220
- }
221
- })
222
-
223
- expect(wrapper.text()).toBe('50')
224
-
225
- wrapper.destroy()
226
- })
227
-
228
- it('has label with precision when show-value and precision set', async () => {
229
- const wrapper = mount(BProgressBar, {
230
- propsData: {
231
- value: 50,
232
- showValue: true,
233
- precision: 2
234
- }
235
- })
236
-
237
- expect(wrapper.text()).toBe('50.00')
238
-
239
- wrapper.destroy()
240
- })
241
-
242
- it('has label when show-progress set', async () => {
243
- const wrapper = mount(BProgressBar, {
244
- propsData: {
245
- value: 25,
246
- showProgress: true,
247
- max: 50
248
- }
249
- })
250
-
251
- expect(wrapper.text()).toBe('50')
252
-
253
- wrapper.destroy()
254
- })
255
-
256
- it('has label when show-progress and precision set', async () => {
257
- const wrapper = mount(BProgressBar, {
258
- propsData: {
259
- value: 25,
260
- showProgress: true,
261
- max: 50,
262
- precision: 2
263
- }
264
- })
265
-
266
- expect(wrapper.text()).toBe('50.00')
267
-
268
- wrapper.destroy()
269
- })
270
- })
@@ -1,57 +0,0 @@
1
- import { extend } from '../../vue'
2
- import { NAME_PROGRESS } from '../../constants/components'
3
- import { PROP_TYPE_BOOLEAN, PROP_TYPE_NUMBER_STRING, PROP_TYPE_STRING } from '../../constants/props'
4
- import { omit, sortKeys } from '../../utils/object'
5
- import { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props'
6
- import { normalizeSlotMixin } from '../../mixins/normalize-slot'
7
- import { BProgressBar, props as BProgressBarProps } from './progress-bar'
8
-
9
- // --- Props ---
10
-
11
- const progressBarProps = omit(BProgressBarProps, ['label', 'labelHtml'])
12
-
13
- export const props = makePropsConfigurable(
14
- sortKeys({
15
- ...progressBarProps,
16
- animated: makeProp(PROP_TYPE_BOOLEAN, false),
17
- height: makeProp(PROP_TYPE_STRING),
18
- max: makeProp(PROP_TYPE_NUMBER_STRING, 100),
19
- precision: makeProp(PROP_TYPE_NUMBER_STRING, 0),
20
- showProgress: makeProp(PROP_TYPE_BOOLEAN, false),
21
- showValue: makeProp(PROP_TYPE_BOOLEAN, false),
22
- striped: makeProp(PROP_TYPE_BOOLEAN, false)
23
- }),
24
- NAME_PROGRESS
25
- )
26
-
27
- // --- Main component ---
28
-
29
- // @vue/component
30
- export const BProgress = /*#__PURE__*/ extend({
31
- name: NAME_PROGRESS,
32
- mixins: [normalizeSlotMixin],
33
- provide() {
34
- return { getBvProgress: () => this }
35
- },
36
- props,
37
- computed: {
38
- progressHeight() {
39
- return { height: this.height || null }
40
- }
41
- },
42
- render(h) {
43
- let $childNodes = this.normalizeSlot()
44
- if (!$childNodes) {
45
- $childNodes = h(BProgressBar, { props: pluckProps(progressBarProps, this.$props) })
46
- }
47
-
48
- return h(
49
- 'div',
50
- {
51
- staticClass: 'progress',
52
- style: this.progressHeight
53
- },
54
- [$childNodes]
55
- )
56
- }
57
- })
@@ -1,71 +0,0 @@
1
- import { mount } from '@vue/test-utils'
2
- import { BProgress } from './progress'
3
-
4
- describe('progress', () => {
5
- it('has expected default structure', async () => {
6
- const wrapper = mount(BProgress)
7
-
8
- expect(wrapper.vm).toBeDefined()
9
- expect(wrapper.element.tagName).toBe('DIV')
10
- expect(wrapper.classes()).toContain('progress')
11
- expect(wrapper.text()).toEqual('')
12
- expect(wrapper.findAll('.progress-bar').length).toBe(1)
13
- const $bar = wrapper.find('.progress-bar')
14
- expect($bar.element.tagName).toBe('DIV')
15
- expect($bar.attributes('role')).toBe('progressbar')
16
- expect($bar.attributes('aria-valuemin')).toBe('0')
17
- expect($bar.attributes('aria-valuemax')).toBe('100')
18
- expect($bar.attributes('aria-valuenow')).toBe('0')
19
- expect($bar.attributes('style')).toBe('width: 0%;')
20
-
21
- wrapper.destroy()
22
- })
23
-
24
- it('renders content from default slot', async () => {
25
- const wrapper = mount(BProgress, {
26
- slots: {
27
- default: '<b>foobar</b>'
28
- }
29
- })
30
-
31
- expect(wrapper.vm).toBeDefined()
32
- expect(wrapper.element.tagName).toBe('DIV')
33
- expect(wrapper.classes()).toContain('progress')
34
- expect(wrapper.text()).toEqual('foobar')
35
- expect(wrapper.findAll('.progress-bar').length).toBe(0)
36
- })
37
-
38
- it('has progress-bar child with expected parameters', async () => {
39
- const wrapper = mount(BProgress, {
40
- propsData: {
41
- value: 25,
42
- max: 50,
43
- variant: 'success',
44
- striped: true,
45
- animated: true,
46
- showValue: true
47
- }
48
- })
49
-
50
- expect(wrapper.vm).toBeDefined()
51
- expect(wrapper.element.tagName).toBe('DIV')
52
- expect(wrapper.classes()).toContain('progress')
53
- expect(wrapper.findAll('.progress-bar').length).toBe(1)
54
-
55
- const $bar = wrapper.find('.progress-bar')
56
- expect($bar.element.tagName).toBe('DIV')
57
- expect($bar.attributes('role')).toBe('progressbar')
58
- expect($bar.attributes('aria-valuemin')).toBe('0')
59
- expect($bar.attributes('aria-valuemax')).toBe('50')
60
- expect($bar.attributes('aria-valuenow')).toBe('25')
61
- expect($bar.attributes('style')).toBe('width: 50%;')
62
- expect($bar.classes()).toContain('bg-success')
63
- expect($bar.classes()).toContain('progress-bar')
64
- expect($bar.classes()).toContain('progress-bar-striped')
65
- expect($bar.classes()).toContain('progress-bar-animated')
66
- expect($bar.classes().length).toBe(4)
67
- expect($bar.text()).toEqual('25')
68
-
69
- wrapper.destroy()
70
- })
71
- })